diff --git a/examples/components/pageviewer.html b/examples/components/pageviewer.html index 1dd107952..267f8cc29 100644 --- a/examples/components/pageviewer.html +++ b/examples/components/pageviewer.html @@ -31,13 +31,13 @@ limitations under the License. - - + +
- + 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 b8caf439a..7be73dade 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 1119fd630..e6493263d 100644 --- a/examples/components/simpleviewer.html +++ b/examples/components/simpleviewer.html @@ -37,8 +37,8 @@ limitations under the License. - - + + @@ -46,6 +46,6 @@ limitations under the License.
- + 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 99584f032..88044e733 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 2be6c8b3c..3636dbe77 100644 --- a/examples/components/singlepageviewer.html +++ b/examples/components/singlepageviewer.html @@ -37,8 +37,8 @@ limitations under the License. - - + + @@ -46,6 +46,6 @@ limitations under the License.
- + diff --git a/examples/components/singlepageviewer.js b/examples/components/singlepageviewer.mjs similarity index 86% rename from examples/components/singlepageviewer.js rename to examples/components/singlepageviewer.mjs index 13076dad1..cf2520701 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,7 +21,7 @@ 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. // @@ -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,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 47af71b0d..87f757bd6 100644 --- a/examples/image_decoders/jpeg_viewer.html +++ b/examples/image_decoders/jpeg_viewer.html @@ -29,12 +29,12 @@ limitations under the License. } - + - + diff --git a/examples/image_decoders/jpeg_viewer.js b/examples/image_decoders/jpeg_viewer.js deleted file mode 100644 index e5f3394cd..000000000 --- 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 000000000..9aba66cc1 --- /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 7a3a71d9b..6a74298f8 100644 --- a/examples/learning/helloworld.html +++ b/examples/learning/helloworld.html @@ -10,9 +10,9 @@ - + -
diff --git a/examples/learning/helloworld64.html b/examples/learning/helloworld64.html index 3abf5b538..ed98e189f 100644 --- a/examples/learning/helloworld64.html +++ b/examples/learning/helloworld64.html @@ -10,9 +10,9 @@ - + -
diff --git a/examples/learning/prevnext.html b/examples/learning/prevnext.html index c1cb0240f..40c1488c8 100644 --- a/examples/learning/prevnext.html +++ b/examples/learning/prevnext.html @@ -19,9 +19,9 @@ - + - diff --git a/examples/mobile-viewer/viewer.html b/examples/mobile-viewer/viewer.html index db8c5034c..ecec3690c 100644 --- a/examples/mobile-viewer/viewer.html +++ b/examples/mobile-viewer/viewer.html @@ -24,8 +24,8 @@ limitations under the License. - - + + @@ -71,6 +71,6 @@ limitations under the License. - + 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 dc4371715..584dce1b6 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 94% rename from examples/node/getinfo.js rename to examples/node/getinfo.mjs index 4723b4273..9847ebe52 100644 --- a/examples/node/getinfo.js +++ b/examples/node/getinfo.mjs @@ -1,14 +1,12 @@ /* Any copyright is dedicated to the Public Domain. * http://creativecommons.org/publicdomain/zero/1.0/ */ -/* eslint-disable import/no-commonjs */ - // // Basic node example that prints document metadata and text content. // // 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 = @@ -16,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 f62e4358b..3dfd9b089 100644 --- a/examples/node/pdf2png/pdf2png.js +++ b/examples/node/pdf2png/pdf2png.mjs @@ -12,15 +12,14 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -/* eslint-disable import/no-commonjs */ -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"); @@ -28,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 @@ -46,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/"; @@ -67,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, @@ -75,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 2717dcb07..2acbd553e 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 e7242f4af..f5184924d 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)