pdfvuer - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

package.json

 {
   "name": "pdfvuer",
   "description": "A PDF viewer for Vue using Mozilla's PDF.js",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "author": "Gaurav Koley <[e-mail]>",
@@ -6,0 +6,0 @@ "license": "MIT",

README.md

@@ -11,3 +11,3 @@ # Pdfvuer
 ## Example - basic
-```
+```vue
 <template>
@@ -27,3 +27,115 @@ <pdf src="./static/relativity.pdf" :page=1></pdf>
 
+## Example - Advanced
 
+```vue
+<template>
+  <div id="pdfvuer">
+    <div id="buttons" class="ui grey three item inverted bottom fixed menu transition hidden">
+      <a class="item" @click="page > 1 ? page-- : 1">
+        <i class="left chevron icon"></i>
+        Back
+      </a>
+      <a class="ui active item">
+        {{page}} / {{ numPages ? numPages : '∞' }}
+      </a>
+      <a class="item" @click="page < numPages ? page++ : 1">
+        Forward
+        <i class="right chevron icon"></i>
+      </a>
+    </div>
+    <pdf :src="pdfdata" v-for="i in numPages" :key="i" :id="i" :page="i"
+      :scale="scale" style="width:100%;margin:20px auto;"></pdf>
+  </div>
+</template>
+
+<script>
+import pdfvuer from 'pdfvuer'
+
+export default {
+  components: {
+    pdf: pdfvuer
+  },
+  data () {
+    return {
+      page: 1,
+      numPages: 0,
+      pdfdata: undefined,
+      errors: [],
+      scale: 'page-width'
+    }
+  },
+  mounted () {
+    this.getPdf()
+  },
+  watch: {
+    show: function (s) {
+      if(s) {
+        this.getPdf();
+      }
+    },
+    page: function (p) {
+      if( window.pageYOffset <= this.findPos(document.getElementById(p)) || ( document.getElementById(p+1) && window.pageYOffset >= this.findPos(document.getElementById(p+1)) )) {
+        // window.scrollTo(0,this.findPos(document.getElementById(p)));
+        document.getElementById(p).scrollIntoView();
+      }
+    }
+  },
+  methods: {
+    getPdf () {
+      var self = this;
+      self.pdfdata = pdfvuer.createLoadingTask('./static/relativity.pdf');
+      self.pdfdata.then(pdf => {
+        self.numPages = pdf.numPages;
+        window.onscroll = function() { 
+          changePage() 
+          stickyNav()  
+        }
+
+        // Get the offset position of the navbar
+        var sticky = $('#buttons')[0].offsetTop
+
+        // Add the sticky class to the self.$refs.nav when you reach its scroll position. Remove "sticky" when you leave the scroll position
+        function stickyNav() {
+          if (window.pageYOffset >= sticky) {
+            $('#buttons')[0].classList.remove("hidden")
+          } else {
+            $('#buttons')[0].classList.add("hidden")
+          }
+        }
+
+        function changePage () {
+          var i = 1, count = Number(pdf.numPages);
+          do {
+            if(window.pageYOffset >= self.findPos(document.getElementById(i)) && 
+                window.pageYOffset <= self.findPos(document.getElementById(i+1))) {
+              self.page = i
+            }
+            i++
+          } while ( i < count)
+          if (window.pageYOffset >= self.findPos(document.getElementById(i))) {
+            self.page = i
+          }
+        }
+      });
+    },
+    findPos(obj) {
+      return obj.offsetTop;
+    }
+  }
+}
+</script>
+
+<style lang="css" scoped>
+  #buttons {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+  }
+  /* Page content */
+  .content {
+    padding: 16px;
+  }
+</style>
+
+```
+
 ## API
@@ -58,2 +170,5 @@
 ## Public Demo
+
+Advanced Example - [https://blog.koley.in/pdfvuer](https://blog.koley.in/pdfvuer)
+
 [Used in production by Gratiato](https://goodwill.zense.co.in/resources/1)
@@ -60,0 +175,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

20216

increased by24.83%

Number of package files

8

increased by14.29%

Number of lines in readme file

177

increased by185.48%

No dependency changes