Added component example for single page viewer

mozilla · Oct 3, 2017 · b24cdc0 · b24cdc0
1 parent ef02d3d
commit b24cdc0
Show file tree

Hide file tree

Showing 2 changed files with 119 additions and 0 deletions.
diff --git a/examples/components/singlepageviewer.html b/examples/components/singlepageviewer.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<!--
+Copyright 2014 Mozilla Foundation
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+<html dir="ltr" mozdisallowselectionprint moznomarginboxes>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+  <meta name="google" content="notranslate">
+  <title>PDF.js Single Page Viewer using built components</title>
+
+  <style>
+    body {
+      background-color: #808080;
+      margin: 0;
+      padding: 0;
+    }
+    #viewerContainer {
+      overflow: auto;
+      position: absolute;
+      width: 100%;
+      height: 100%;
+    }
+  </style>
+
+  <link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css">
+
+  <script src="../../node_modules/pdfjs-dist/build/pdf.js"></script>
+  <script src="../../node_modules/pdfjs-dist/web/pdf_single_page_viewer.js"></script>
+</head>
+
+<body tabindex="1">
+  <div id="viewerContainer">
+    <div id="viewer" class="pdfViewer"></div>
+  </div>
+
+  <script src="singlepageviewer.js"></script>
+</body>
+</html>
diff --git a/examples/components/singlepageviewer.js b/examples/components/singlepageviewer.js
@@ -0,0 +1,68 @@
+/* Copyright 2014 Mozilla Foundation
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+'use strict';
+
+if (!PDFJS.PDFSinglePageViewer || !PDFJS.getDocument) {
+  alert('Please build the pdfjs-dist library using\n' +
+        '  `gulp dist-install`');
+}
+
+// The workerSrc property shall be specified.
+//
+PDFJS.workerSrc = '../../node_modules/pdfjs-dist/build/pdf.worker.js';
+
+// Some PDFs need external cmaps.
+//
+// PDFJS.cMapUrl = '../../node_modules/pdfjs-dist/cmaps/';
+// PDFJS.cMapPacked = true;
+
+var DEFAULT_URL = '../../web/compressed.tracemonkey-pldi-09.pdf';
+var SEARCH_FOR = ''; // try 'Mozilla';
+
+var container = document.getElementById('viewerContainer');
+
+// (Optionally) enable hyperlinks within PDF files.
+var pdfLinkService = new PDFJS.PDFLinkService();
+
+var pdfSinglePageViewer = new PDFJS.PDFSinglePageViewer({
+  container: container,
+  linkService: pdfLinkService,
+});
+pdfLinkService.setViewer(pdfSinglePageViewer);
+
+// (Optionally) enable find controller.
+var pdfFindController = new PDFJS.PDFFindController({
+  pdfSinglePageViewer: pdfSinglePageViewer
+});
+pdfSinglePageViewer.setFindController(pdfFindController);
+
+container.addEventListener('pagesinit', function () {
+    // We can use pdfSinglePageViewer now, e.g. let's change default scale.
+  pdfSinglePageViewer.currentScaleValue = 'page-width';
+
+  if (SEARCH_FOR) { // We can try search for things
+    pdfFindController.executeCommand('find', {query: SEARCH_FOR});
+  }
+});
+
+// Loading document.
+PDFJS.getDocument(DEFAULT_URL).then(function (pdfDocument) {
+  // Document loaded, specifying document for the viewer and
+  // the (optional) linkService.
+  pdfSinglePageViewer.setDocument(pdfDocument);
+
+  pdfLinkService.setDocument(pdfDocument, null);
+});