diff --git a/examples/components/pageviewer.html b/examples/components/pageviewer.html index 1dd107952ca3b7..267f8cc2915121 100644 --- a/examples/components/pageviewer.html +++ b/examples/components/pageviewer.html @@ -31,13 +31,13 @@ - - + +
- + diff --git a/examples/components/pageviewer.js b/examples/components/pageviewer.mjs similarity index 69% rename from examples/components/pageviewer.js rename to examples/components/pageviewer.mjs index b8caf439a52efe..7be73dade6b57e 100644 --- a/examples/components/pageviewer.js +++ b/examples/components/pageviewer.mjs @@ -13,8 +13,6 @@ * limitations under the License. */ -"use strict"; - if (!pdfjsLib.getDocument || !pdfjsViewer.PDFPageView) { // eslint-disable-next-line no-alert alert("Please build the pdfjs-dist library using\n `gulp dist-install`"); @@ -23,7 +21,7 @@ if (!pdfjsLib.getDocument || !pdfjsViewer.PDFPageView) { // The workerSrc property shall be specified. // pdfjsLib.GlobalWorkerOptions.workerSrc = - "../../node_modules/pdfjs-dist/build/pdf.worker.js"; + "../../node_modules/pdfjs-dist/build/pdf.worker.mjs"; // Some PDFs need external cmaps. // @@ -47,20 +45,19 @@ const loadingTask = pdfjsLib.getDocument({ cMapPacked: CMAP_PACKED, enableXfa: ENABLE_XFA, }); -(async function () { - const pdfDocument = await loadingTask.promise; - // Document loaded, retrieving the page. - const pdfPage = await pdfDocument.getPage(PAGE_TO_VIEW); - // Creating the page view with default parameters. - const pdfPageView = new pdfjsViewer.PDFPageView({ - container, - id: PAGE_TO_VIEW, - scale: SCALE, - defaultViewport: pdfPage.getViewport({ scale: SCALE }), - eventBus, - }); - // Associate the actual page with the view, and draw it. - pdfPageView.setPdfPage(pdfPage); - return pdfPageView.draw(); -})(); +const pdfDocument = await loadingTask.promise; +// Document loaded, retrieving the page. +const pdfPage = await pdfDocument.getPage(PAGE_TO_VIEW); + +// Creating the page view with default parameters. +const pdfPageView = new pdfjsViewer.PDFPageView({ + container, + id: PAGE_TO_VIEW, + scale: SCALE, + defaultViewport: pdfPage.getViewport({ scale: SCALE }), + eventBus, +}); +// Associate the actual page with the view, and draw it. +pdfPageView.setPdfPage(pdfPage); +pdfPageView.draw(); diff --git a/examples/components/simpleviewer.html b/examples/components/simpleviewer.html index 1119fd63046adf..e6493263dc8e3e 100644 --- a/examples/components/simpleviewer.html +++ b/examples/components/simpleviewer.html @@ -37,8 +37,8 @@ - - + + @@ -46,6 +46,6 @@
- + diff --git a/examples/components/simpleviewer.js b/examples/components/simpleviewer.mjs similarity index 85% rename from examples/components/simpleviewer.js rename to examples/components/simpleviewer.mjs index 99584f032abfd7..88044e73311760 100644 --- a/examples/components/simpleviewer.js +++ b/examples/components/simpleviewer.mjs @@ -13,8 +13,6 @@ * limitations under the License. */ -"use strict"; - if (!pdfjsLib.getDocument || !pdfjsViewer.PDFViewer) { // eslint-disable-next-line no-alert alert("Please build the pdfjs-dist library using\n `gulp dist-install`"); @@ -23,7 +21,7 @@ if (!pdfjsLib.getDocument || !pdfjsViewer.PDFViewer) { // The workerSrc property shall be specified. // pdfjsLib.GlobalWorkerOptions.workerSrc = - "../../node_modules/pdfjs-dist/build/pdf.worker.js"; + "../../node_modules/pdfjs-dist/build/pdf.worker.mjs"; // Some PDFs need external cmaps. // @@ -37,7 +35,10 @@ const DEFAULT_URL = "../../web/compressed.tracemonkey-pldi-09.pdf"; const ENABLE_XFA = true; const SEARCH_FOR = ""; // try "Mozilla"; -const SANDBOX_BUNDLE_SRC = "../../node_modules/pdfjs-dist/build/pdf.sandbox.js"; +const SANDBOX_BUNDLE_SRC = new URL( + "../../node_modules/pdfjs-dist/build/pdf.sandbox.mjs", + window.location +); const container = document.getElementById("viewerContainer"); @@ -87,11 +88,10 @@ const loadingTask = pdfjsLib.getDocument({ cMapPacked: CMAP_PACKED, enableXfa: ENABLE_XFA, }); -(async function () { - const pdfDocument = await loadingTask.promise; - // Document loaded, specifying document for the viewer and - // the (optional) linkService. - pdfViewer.setDocument(pdfDocument); - - pdfLinkService.setDocument(pdfDocument, null); -})(); + +const pdfDocument = await loadingTask.promise; +// Document loaded, specifying document for the viewer and +// the (optional) linkService. +pdfViewer.setDocument(pdfDocument); + +pdfLinkService.setDocument(pdfDocument, null); diff --git a/examples/components/singlepageviewer.html b/examples/components/singlepageviewer.html index 2be6c8b3cf004e..3636dbe77f96e7 100644 --- a/examples/components/singlepageviewer.html +++ b/examples/components/singlepageviewer.html @@ -37,8 +37,8 @@ - - + + @@ -46,6 +46,6 @@
- + diff --git a/examples/components/singlepageviewer.js b/examples/components/singlepageviewer.mjs similarity index 83% rename from examples/components/singlepageviewer.js rename to examples/components/singlepageviewer.mjs index 13076dad127649..35dd75290ed21f 100644 --- a/examples/components/singlepageviewer.js +++ b/examples/components/singlepageviewer.mjs @@ -13,8 +13,6 @@ * limitations under the License. */ -"use strict"; - if (!pdfjsLib.getDocument || !pdfjsViewer.PDFSinglePageViewer) { // eslint-disable-next-line no-alert alert("Please build the pdfjs-dist library using\n `gulp dist-install`"); @@ -23,21 +21,24 @@ if (!pdfjsLib.getDocument || !pdfjsViewer.PDFSinglePageViewer) { // The workerSrc property shall be specified. // pdfjsLib.GlobalWorkerOptions.workerSrc = - "../../node_modules/pdfjs-dist/build/pdf.worker.js"; + "../../node_modules/pdfjs-dist/build/pdf.worker.mjs"; // Some PDFs need external cmaps. // const CMAP_URL = "../../node_modules/pdfjs-dist/cmaps/"; const CMAP_PACKED = true; -const DEFAULT_URL = "../../web/compressed.tracemonkey-pldi-09.pdf"; +const DEFAULT_URL = "../../test/pdfs/160F-2019.pdf"; // "../../web/compressed.tracemonkey-pldi-09.pdf"; // To test the AcroForm and/or scripting functionality, try e.g. this file: // "../../test/pdfs/160F-2019.pdf" const ENABLE_XFA = true; const SEARCH_FOR = ""; // try "Mozilla"; -const SANDBOX_BUNDLE_SRC = "../../node_modules/pdfjs-dist/build/pdf.sandbox.js"; +const SANDBOX_BUNDLE_SRC = new URL( + "../../node_modules/pdfjs-dist/build/pdf.sandbox.mjs", + window.location +); const container = document.getElementById("viewerContainer"); @@ -87,10 +88,10 @@ const loadingTask = pdfjsLib.getDocument({ cMapPacked: CMAP_PACKED, enableXfa: ENABLE_XFA, }); -loadingTask.promise.then(function (pdfDocument) { - // Document loaded, specifying document for the viewer and - // the (optional) linkService. - pdfSinglePageViewer.setDocument(pdfDocument); - pdfLinkService.setDocument(pdfDocument, null); -}); +const pdfDocument = await loadingTask.promise; +// Document loaded, specifying document for the viewer and +// the (optional) linkService. +pdfSinglePageViewer.setDocument(pdfDocument); + +pdfLinkService.setDocument(pdfDocument, null); diff --git a/examples/image_decoders/jpeg_viewer.html b/examples/image_decoders/jpeg_viewer.html index 47af71b0de5091..87f757bd6f20c0 100644 --- a/examples/image_decoders/jpeg_viewer.html +++ b/examples/image_decoders/jpeg_viewer.html @@ -29,12 +29,12 @@ } - + - + diff --git a/examples/image_decoders/jpeg_viewer.js b/examples/image_decoders/jpeg_viewer.js deleted file mode 100644 index e5f3394cd659f0..00000000000000 --- a/examples/image_decoders/jpeg_viewer.js +++ /dev/null @@ -1,63 +0,0 @@ -/* Copyright 2018 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 (!pdfjsImageDecoders.JpegImage) { - // eslint-disable-next-line no-alert - alert("Please build the pdfjs-dist library using `gulp dist-install`"); -} - -const JPEG_IMAGE = "fish.jpg"; - -const jpegCanvas = document.getElementById("jpegCanvas"); -const jpegCtx = jpegCanvas.getContext("2d"); - -(async function () { - // Load the image data, and convert it to a Uint8Array. - // - const response = await fetch(JPEG_IMAGE); - if (!response.ok) { - throw new Error(response.statusText); - } - const typedArrayImage = new Uint8Array(await response.arrayBuffer()); - - // Parse the image data using `JpegImage`. - // - const jpegImage = new pdfjsImageDecoders.JpegImage(); - jpegImage.parse(typedArrayImage); - - const width = jpegImage.width, - height = jpegImage.height; - const jpegData = jpegImage.getData({ - width, - height, - forceRGB: true, - }); - - // Render the JPEG image on a . - // - const imageData = jpegCtx.createImageData(width, height); - const imageBytes = imageData.data; - for (let j = 0, k = 0, jj = width * height * 4; j < jj; ) { - imageBytes[j++] = jpegData[k++]; - imageBytes[j++] = jpegData[k++]; - imageBytes[j++] = jpegData[k++]; - imageBytes[j++] = 255; - } - jpegCanvas.width = width; - jpegCanvas.height = height; - jpegCtx.putImageData(imageData, 0, 0); -})(); diff --git a/examples/image_decoders/jpeg_viewer.mjs b/examples/image_decoders/jpeg_viewer.mjs new file mode 100644 index 00000000000000..9aba66cc113bfb --- /dev/null +++ b/examples/image_decoders/jpeg_viewer.mjs @@ -0,0 +1,59 @@ +/* Copyright 2018 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. + */ + +if (!pdfjsImageDecoders.JpegImage) { + // eslint-disable-next-line no-alert + alert("Please build the pdfjs-dist library using `gulp dist-install`"); +} + +const JPEG_IMAGE = "fish.jpg"; + +const jpegCanvas = document.getElementById("jpegCanvas"); +const jpegCtx = jpegCanvas.getContext("2d"); + +// Load the image data, and convert it to a Uint8Array. +// +const response = await fetch(JPEG_IMAGE); +if (!response.ok) { + throw new Error(response.statusText); +} +const typedArrayImage = new Uint8Array(await response.arrayBuffer()); + +// Parse the image data using `JpegImage`. +// +const jpegImage = new pdfjsImageDecoders.JpegImage(); +jpegImage.parse(typedArrayImage); + +const width = jpegImage.width, + height = jpegImage.height; +const jpegData = jpegImage.getData({ + width, + height, + forceRGB: true, +}); + +// Render the JPEG image on a . +// +const imageData = jpegCtx.createImageData(width, height); +const imageBytes = imageData.data; +for (let j = 0, k = 0, jj = width * height * 4; j < jj; ) { + imageBytes[j++] = jpegData[k++]; + imageBytes[j++] = jpegData[k++]; + imageBytes[j++] = jpegData[k++]; + imageBytes[j++] = 255; +} +jpegCanvas.width = width; +jpegCanvas.height = height; +jpegCtx.putImageData(imageData, 0, 0); diff --git a/examples/learning/helloworld.html b/examples/learning/helloworld.html index 7a3a71d9bcd964..6a74298f802e56 100644 --- a/examples/learning/helloworld.html +++ b/examples/learning/helloworld.html @@ -10,9 +10,9 @@

'Hello, world!' example

- + -
diff --git a/examples/learning/helloworld64.html b/examples/learning/helloworld64.html index 3abf5b538c7ab3..ed98e189f4898c 100644 --- a/examples/learning/helloworld64.html +++ b/examples/learning/helloworld64.html @@ -10,9 +10,9 @@

'Hello, world!' example

- + -
diff --git a/examples/learning/prevnext.html b/examples/learning/prevnext.html index c1cb0240f98a4a..40c1488c8b99d2 100644 --- a/examples/learning/prevnext.html +++ b/examples/learning/prevnext.html @@ -19,9 +19,9 @@

'Previous/Next' example

- + - diff --git a/examples/mobile-viewer/viewer.html b/examples/mobile-viewer/viewer.html index db8c5034c9da1a..ecec3690c135ae 100644 --- a/examples/mobile-viewer/viewer.html +++ b/examples/mobile-viewer/viewer.html @@ -24,8 +24,8 @@ - - + + @@ -71,6 +71,6 @@

- + diff --git a/examples/mobile-viewer/viewer.js b/examples/mobile-viewer/viewer.mjs similarity index 99% rename from examples/mobile-viewer/viewer.js rename to examples/mobile-viewer/viewer.mjs index 022320f5a41bcf..5a03620120a8d0 100644 --- a/examples/mobile-viewer/viewer.js +++ b/examples/mobile-viewer/viewer.mjs @@ -13,8 +13,6 @@ * limitations under the License. */ -"use strict"; - if (!pdfjsLib.getDocument || !pdfjsViewer.PDFViewer) { // eslint-disable-next-line no-alert alert("Please build the pdfjs-dist library using\n `gulp dist-install`"); @@ -27,7 +25,7 @@ const CMAP_URL = "../../node_modules/pdfjs-dist/cmaps/"; const CMAP_PACKED = true; pdfjsLib.GlobalWorkerOptions.workerSrc = - "../../node_modules/pdfjs-dist/build/pdf.worker.js"; + "../../node_modules/pdfjs-dist/build/pdf.worker.mjs"; const DEFAULT_URL = "../../web/compressed.tracemonkey-pldi-09.pdf"; const DEFAULT_SCALE_DELTA = 1.1; diff --git a/examples/node/getinfo.js b/examples/node/getinfo.mjs similarity index 95% rename from examples/node/getinfo.js rename to examples/node/getinfo.mjs index bf3c980fff6dbd..9847ebe526db9d 100644 --- a/examples/node/getinfo.js +++ b/examples/node/getinfo.mjs @@ -6,7 +6,7 @@ // // Run `gulp dist-install` to generate 'pdfjs-dist' npm package files. -const pdfjsLib = require("pdfjs-dist/legacy/build/pdf.js"); +import { getDocument } from "pdfjs-dist/legacy/build/pdf.mjs"; // Loading file from file system into typed array const pdfPath = @@ -14,7 +14,7 @@ const pdfPath = // Will be using promises to load document, pages and misc data instead of // callback. -const loadingTask = pdfjsLib.getDocument(pdfPath); +const loadingTask = getDocument(pdfPath); loadingTask.promise .then(function (doc) { const numPages = doc.numPages; diff --git a/examples/node/pdf2png/pdf2png.js b/examples/node/pdf2png/pdf2png.mjs similarity index 56% rename from examples/node/pdf2png/pdf2png.js rename to examples/node/pdf2png/pdf2png.mjs index f0d0608ed29a39..3dfd9b089aa405 100644 --- a/examples/node/pdf2png/pdf2png.js +++ b/examples/node/pdf2png/pdf2png.mjs @@ -13,13 +13,13 @@ * limitations under the License. */ -const Canvas = require("canvas"); -const assert = require("assert").strict; -const fs = require("fs"); +import { strict as assert } from "assert"; +import Canvas from "canvas"; +import fs from "fs"; +import { getDocument } from "pdfjs-dist/legacy/build/pdf.mjs"; -function NodeCanvasFactory() {} -NodeCanvasFactory.prototype = { - create: function NodeCanvasFactory_create(width, height) { +class NodeCanvasFactory { + create(width, height) { assert(width > 0 && height > 0, "Invalid canvas size"); const canvas = Canvas.createCanvas(width, height); const context = canvas.getContext("2d"); @@ -27,16 +27,16 @@ NodeCanvasFactory.prototype = { canvas, context, }; - }, + } - reset: function NodeCanvasFactory_reset(canvasAndContext, width, height) { + reset(canvasAndContext, width, height) { assert(canvasAndContext.canvas, "Canvas is not specified"); assert(width > 0 && height > 0, "Invalid canvas size"); canvasAndContext.canvas.width = width; canvasAndContext.canvas.height = height; - }, + } - destroy: function NodeCanvasFactory_destroy(canvasAndContext) { + destroy(canvasAndContext) { assert(canvasAndContext.canvas, "Canvas is not specified"); // Zeroing the width and height cause Firefox to release graphics @@ -45,10 +45,8 @@ NodeCanvasFactory.prototype = { canvasAndContext.canvas.height = 0; canvasAndContext.canvas = null; canvasAndContext.context = null; - }, -}; - -const pdfjsLib = require("pdfjs-dist/legacy/build/pdf.js"); + } +} // Some PDFs need external cmaps. const CMAP_URL = "../../../node_modules/pdfjs-dist/cmaps/"; @@ -66,7 +64,7 @@ const pdfPath = const data = new Uint8Array(fs.readFileSync(pdfPath)); // Load the PDF file. -const loadingTask = pdfjsLib.getDocument({ +const loadingTask = getDocument({ data, cMapUrl: CMAP_URL, cMapPacked: CMAP_PACKED, @@ -74,39 +72,35 @@ const loadingTask = pdfjsLib.getDocument({ canvasFactory, }); -(async function () { - try { - const pdfDocument = await loadingTask.promise; - console.log("# PDF document loaded."); - // Get the first page. - const page = await pdfDocument.getPage(1); - // Render the page on a Node canvas with 100% scale. - const viewport = page.getViewport({ scale: 1.0 }); - const canvasAndContext = canvasFactory.create( - viewport.width, - viewport.height - ); - const renderContext = { - canvasContext: canvasAndContext.context, - viewport, - }; +try { + const pdfDocument = await loadingTask.promise; + console.log("# PDF document loaded."); + // Get the first page. + const page = await pdfDocument.getPage(1); + // Render the page on a Node canvas with 100% scale. + const viewport = page.getViewport({ scale: 1.0 }); + const canvasAndContext = canvasFactory.create( + viewport.width, + viewport.height + ); + const renderContext = { + canvasContext: canvasAndContext.context, + viewport, + }; - const renderTask = page.render(renderContext); - await renderTask.promise; - // Convert the canvas to an image buffer. - const image = canvasAndContext.canvas.toBuffer(); - fs.writeFile("output.png", image, function (error) { - if (error) { - console.error("Error: " + error); - } else { - console.log( - "Finished converting first page of PDF file to a PNG image." - ); - } - }); - // Release page resources. - page.cleanup(); - } catch (reason) { - console.log(reason); - } -})(); + const renderTask = page.render(renderContext); + await renderTask.promise; + // Convert the canvas to an image buffer. + const image = canvasAndContext.canvas.toBuffer(); + fs.writeFile("output.png", image, function (error) { + if (error) { + console.error("Error: " + error); + } else { + console.log("Finished converting first page of PDF file to a PNG image."); + } + }); + // Release page resources. + page.cleanup(); +} catch (reason) { + console.log(reason); +} diff --git a/examples/text-only/index.html b/examples/text-only/index.html index 2717dcb0773a8b..2acbd553ea9124 100644 --- a/examples/text-only/index.html +++ b/examples/text-only/index.html @@ -3,8 +3,8 @@ Text-only PDF.js example - - + +

Text-only PDF.js example

diff --git a/examples/text-only/pdf2svg.js b/examples/text-only/pdf2svg.mjs similarity index 97% rename from examples/text-only/pdf2svg.js rename to examples/text-only/pdf2svg.mjs index e7242f4af4cec0..f5184924d67bd0 100644 --- a/examples/text-only/pdf2svg.js +++ b/examples/text-only/pdf2svg.mjs @@ -19,7 +19,7 @@ const PAGE_SCALE = 1.5; const SVG_NS = "http://www.w3.org/2000/svg"; pdfjsLib.GlobalWorkerOptions.workerSrc = - "../../node_modules/pdfjs-dist/build/pdf.worker.js"; + "../../node_modules/pdfjs-dist/build/pdf.worker.mjs"; function buildSVG(viewport, textContent) { // Building SVG with size of the viewport (for simplicity)