|
|
@@ -0,0 +1,133 @@
|
|
|
+//
|
|
|
+// If absolute URL from the remote server is provided, configure the CORS
|
|
|
+// header on that server.
|
|
|
+//
|
|
|
+//var url = 'static/lib/pdf.js/web/compressed.tracemonkey-pldi-09.pdf';
|
|
|
+var url = "static/js/prevnext/Purchase1.pdf";
|
|
|
+// var url = 'file://C:/Users/sunyj-pc/Downloads/Purchase.pdf';
|
|
|
+//
|
|
|
+// Disable workers to avoid yet another cross-origin issue (workers need
|
|
|
+// the URL of the script to be loaded, and dynamically loading a cross-origin
|
|
|
+// script does not work).
|
|
|
+//
|
|
|
+// PDFJS.disableWorker = true;
|
|
|
+
|
|
|
+//
|
|
|
+// In cases when the pdf.worker.js is located at the different folder than the
|
|
|
+// pdf.js's one, or the pdf.js is executed via eval(), the workerSrc property
|
|
|
+// shall be specified.
|
|
|
+//
|
|
|
+// PDFJS.workerSrc = '../../build/pdf.worker.js';
|
|
|
+
|
|
|
+var pdfDoc = null, pageNum = 1, pageRendering = false, pageNumPending = null, scale = 1, canvas = document
|
|
|
+ .getElementById('the-canvas'), ctx = canvas.getContext('2d');
|
|
|
+var winHeight,winWidth;
|
|
|
+
|
|
|
+/**
|
|
|
+ * Get page info from document, resize canvas accordingly, and render page.
|
|
|
+ *
|
|
|
+ * @param num
|
|
|
+ * Page number.
|
|
|
+ */
|
|
|
+function renderPage(num) {
|
|
|
+ pageRendering = true;
|
|
|
+ // Using promise to fetch the page
|
|
|
+ pdfDoc.getPage(num).then(function(page) {
|
|
|
+ var viewport = page.getViewport(scale);
|
|
|
+ getWindowWidth();
|
|
|
+ var viewportWidth = viewport.width;
|
|
|
+ scale = scale * 0.8/ (viewportWidth / winWidth);
|
|
|
+ viewport = page.getViewport(scale);
|
|
|
+ console.log(winWidth);
|
|
|
+ console.log(viewport.width);
|
|
|
+ console.log(viewportWidth / winWidth);
|
|
|
+ canvas.height = viewport.height;
|
|
|
+ canvas.width = viewport.width;
|
|
|
+
|
|
|
+ // Render PDF page into canvas context
|
|
|
+ var renderContext = {
|
|
|
+ canvasContext : ctx,
|
|
|
+ viewport : viewport
|
|
|
+ };
|
|
|
+ var renderTask = page.render(renderContext);
|
|
|
+
|
|
|
+ // Wait for rendering to finish
|
|
|
+ renderTask.promise.then(function() {
|
|
|
+ pageRendering = false;
|
|
|
+ if (pageNumPending !== null) {
|
|
|
+ // New page rendering is pending
|
|
|
+ renderPage(pageNumPending);
|
|
|
+ pageNumPending = null;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ // Update page counters
|
|
|
+ document.getElementById('page_num').textContent = pageNum;
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * If another page rendering in progress, waits until the rendering is finised.
|
|
|
+ * Otherwise, executes rendering immediately.
|
|
|
+ */
|
|
|
+function queueRenderPage(num) {
|
|
|
+ if (pageRendering) {
|
|
|
+ pageNumPending = num;
|
|
|
+ } else {
|
|
|
+ renderPage(num);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * Displays previous page.
|
|
|
+ */
|
|
|
+function onPrevPage() {
|
|
|
+ if (pageNum <= 1) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ pageNum--;
|
|
|
+ queueRenderPage(pageNum);
|
|
|
+}
|
|
|
+document.getElementById('prev').addEventListener('click', onPrevPage);
|
|
|
+
|
|
|
+/**
|
|
|
+ * Displays next page.
|
|
|
+ */
|
|
|
+function onNextPage() {
|
|
|
+ if (pageNum >= pdfDoc.numPages) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ pageNum++;
|
|
|
+ queueRenderPage(pageNum);
|
|
|
+}
|
|
|
+document.getElementById('next').addEventListener('click', onNextPage);
|
|
|
+
|
|
|
+/**
|
|
|
+ * Asynchronously downloads PDF.
|
|
|
+ */
|
|
|
+PDFJS.getDocument(url).then(function(pdfDoc_) {
|
|
|
+ pdfDoc = pdfDoc_;
|
|
|
+ document.getElementById('page_count').textContent = pdfDoc.numPages;
|
|
|
+
|
|
|
+ // Initial/first page rendering
|
|
|
+ renderPage(pageNum);
|
|
|
+});
|
|
|
+
|
|
|
+function getWindowWidth() {
|
|
|
+ // 获取窗口宽度
|
|
|
+ if (window.innerWidth)
|
|
|
+ winWidth = window.innerWidth;
|
|
|
+ else if ((document.body) && (document.body.clientWidth))
|
|
|
+ winWidth = document.body.clientWidth;
|
|
|
+ // 获取窗口高度
|
|
|
+ if (window.innerHeight)
|
|
|
+ winHeight = window.innerHeight;
|
|
|
+ else if ((document.body) && (document.body.clientHeight))
|
|
|
+ winHeight = document.body.clientHeight;
|
|
|
+ // 通过深入 Document 内部对 body 进行检测，获取窗口大小
|
|
|
+ if (document.documentElement && document.documentElement.clientHeight
|
|
|
+ && document.documentElement.clientWidth) {
|
|
|
+ winHeight = document.documentElement.clientHeight;
|
|
|
+ winWidth = document.documentElement.clientWidth;
|
|
|
+ }
|
|
|
+}
|
sunyj