Beanz/pdf.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #20447 from calixteman/lint_html

Browse Source 
Lint and format the HTML in using Prettier
This commit is contained in:
Tim van der Meij 2025-11-18 21:11:52 +01:00 committed by GitHub
commit 8f0c62990e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
23 changed files with 1306 additions and 948 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
.prettierrc
View File

@ -9,10 +9,17 @@
"overrides": [ "overrides": [
{ {
files: ["tsconfig.json"], "files": ["tsconfig.json", ".prettierrc"],
options: { "options": {
parser: "json", "parser": "json"
}, }
}, },
{
"files": ["**/*.html"],
"options": {
"parser": "html",
"printWidth": 160
}
}
] ]
} }

18
examples/components/pageviewer.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2014 Mozilla Foundation Copyright 2014 Mozilla Foundation
@ -15,10 +15,10 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
--> -->
<html dir="ltr" mozdisallowselectionprint> <html dir="ltr" mozdisallowselectionprint>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta name="google" content="notranslate"> <meta name="google" content="notranslate" />
<title>PDF.js page viewer using built components</title> <title>PDF.js page viewer using built components</title>
<style> <style>
@ -29,15 +29,15 @@ limitations under the License.
} }
</style> </style>
<link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css"> <link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css" />
<script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>
<script src="../../node_modules/pdfjs-dist/web/pdf_viewer.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/web/pdf_viewer.mjs" type="module"></script>
</head> </head>
<body tabindex="1"> <body tabindex="1">
<div id="pageContainer" class="pdfViewer singlePageView"></div> <div id="pageContainer" class="pdfViewer singlePageView"></div>
<script src="pageviewer.mjs" type="module"></script> <script src="pageviewer.mjs" type="module"></script>
</body> </body>
</html> </html>

18
examples/components/simpleviewer.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2014 Mozilla Foundation Copyright 2014 Mozilla Foundation
@ -15,10 +15,10 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
--> -->
<html dir="ltr" mozdisallowselectionprint> <html dir="ltr" mozdisallowselectionprint>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta name="google" content="notranslate"> <meta name="google" content="notranslate" />
<title>PDF.js viewer using built components</title> <title>PDF.js viewer using built components</title>
<style> <style>
@ -35,17 +35,17 @@ limitations under the License.
} }
</style> </style>
<link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css"> <link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css" />
<script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>
<script src="../../node_modules/pdfjs-dist/web/pdf_viewer.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/web/pdf_viewer.mjs" type="module"></script>
</head> </head>
<body tabindex="1"> <body tabindex="1">
<div id="viewerContainer"> <div id="viewerContainer">
<div id="viewer" class="pdfViewer"></div> <div id="viewer" class="pdfViewer"></div>
</div> </div>
<script src="simpleviewer.mjs" type="module"></script> <script src="simpleviewer.mjs" type="module"></script>
</body> </body>
</html> </html>

18
examples/components/singlepageviewer.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2014 Mozilla Foundation Copyright 2014 Mozilla Foundation
@ -15,10 +15,10 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
--> -->
<html dir="ltr" mozdisallowselectionprint> <html dir="ltr" mozdisallowselectionprint>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta name="google" content="notranslate"> <meta name="google" content="notranslate" />
<title>PDF.js Single Page Viewer using built components</title> <title>PDF.js Single Page Viewer using built components</title>
<style> <style>
@ -35,17 +35,17 @@ limitations under the License.
} }
</style> </style>
<link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css"> <link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css" />
<script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>
<script src="../../node_modules/pdfjs-dist/web/pdf_viewer.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/web/pdf_viewer.mjs" type="module"></script>
</head> </head>
<body tabindex="1"> <body tabindex="1">
<div id="viewerContainer"> <div id="viewerContainer">
<div id="viewer" class="pdfViewer"></div> <div id="viewer" class="pdfViewer"></div>
</div> </div>
<script src="singlepageviewer.mjs" type="module"></script> <script src="singlepageviewer.mjs" type="module"></script>
</body> </body>
</html> </html>

16
examples/image_decoders/jpeg_viewer.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2018 Mozilla Foundation Copyright 2018 Mozilla Foundation
@ -15,10 +15,10 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
--> -->
<html dir="ltr" mozdisallowselectionprint> <html dir="ltr" mozdisallowselectionprint>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta name="google" content="notranslate"> <meta name="google" content="notranslate" />
<title>PDF.js standalone JpegImage parser</title> <title>PDF.js standalone JpegImage parser</title>
<style> <style>
@ -30,11 +30,11 @@ limitations under the License.
</style> </style>
<script src="../../node_modules/pdfjs-dist/image_decoders/pdf.image_decoders.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/image_decoders/pdf.image_decoders.mjs" type="module"></script>
</head> </head>
<body tabindex="1"> <body tabindex="1">
<canvas id="jpegCanvas" width="0" height="0"></canvas> <canvas id="jpegCanvas" width="0" height="0"></canvas>
<script src="jpeg_viewer.mjs" type="module"></script> <script src="jpeg_viewer.mjs" type="module"></script>
</body> </body>
</html> </html>

45
examples/learning/helloworld.html
View File

@ -1,29 +1,27 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<title>'Hello, world!' example</title> <title>'Hello, world!' example</title>
</head> </head>
<body> <body>
<h1>'Hello, world!' example</h1>
<h1>'Hello, world!' example</h1> <canvas id="the-canvas" style="border: 1px solid black; direction: ltr"></canvas>
<canvas id="the-canvas" style="border: 1px solid black; direction: ltr;"></canvas> <script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>
<script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script> <script id="script" type="module">
<script id="script" type="module">
// //
// If absolute URL from the remote server is provided, configure the CORS // If absolute URL from the remote server is provided, configure the CORS
// header on that server. // header on that server.
// //
const url = './helloworld.pdf'; const url = "./helloworld.pdf";
// //
// The workerSrc property shall be specified. // The workerSrc property shall be specified.
// //
pdfjsLib.GlobalWorkerOptions.workerSrc = pdfjsLib.GlobalWorkerOptions.workerSrc = "../../node_modules/pdfjs-dist/build/pdf.worker.mjs";
'../../node_modules/pdfjs-dist/build/pdf.worker.mjs';
// //
// Asynchronous download PDF // Asynchronous download PDF
@ -50,9 +48,7 @@
canvas.style.width = Math.floor(viewport.width) + "px"; canvas.style.width = Math.floor(viewport.width) + "px";
canvas.style.height = Math.floor(viewport.height) + "px"; canvas.style.height = Math.floor(viewport.height) + "px";
const transform = outputScale !== 1 const transform = outputScale !== 1 ? [outputScale, 0, 0, outputScale, 0, 0] : null;
? [outputScale, 0, 0, outputScale, 0, 0]
: null;
// //
// Render PDF page into canvas context // Render PDF page into canvas context
@ -63,14 +59,13 @@
viewport, viewport,
}; };
page.render(renderContext); page.render(renderContext);
</script> </script>
<hr> <hr />
<h2>JavaScript code:</h2> <h2>JavaScript code:</h2>
<pre id="code"></pre> <pre id="code"></pre>
<script> <script>
document.getElementById('code').textContent = document.getElementById("code").textContent = document.getElementById("script").text;
document.getElementById('script').text; </script>
</script> </body>
</body>
</html> </html>

78
examples/learning/helloworld64.html
View File

@ -1,65 +1,62 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<title>'Hello, world!' base64 example</title> <title>'Hello, world!' base64 example</title>
</head> </head>
<body> <body>
<h1>'Hello, world!' example</h1>
<h1>'Hello, world!' example</h1> <canvas id="the-canvas" style="border: 1px solid black; direction: ltr"></canvas>
<canvas id="the-canvas" style="border: 1px solid black; direction: ltr;"></canvas> <script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>
<script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script> <script id="script" type="module">
<script id="script" type="module">
// atob() is used to convert base64 encoded PDF to binary-like data. // atob() is used to convert base64 encoded PDF to binary-like data.
// (See also https://developer.mozilla.org/en-US/docs/Web/API/WindowBase64/ // (See also https://developer.mozilla.org/en-US/docs/Web/API/WindowBase64/
// Base64_encoding_and_decoding.) // Base64_encoding_and_decoding.)
var pdfData = atob( var pdfData = atob(
'JVBERi0xLjcKCjEgMCBvYmogICUgZW50cnkgcG9pbnQKPDwKICAvVHlwZSAvQ2F0YWxvZwog' + "JVBERi0xLjcKCjEgMCBvYmogICUgZW50cnkgcG9pbnQKPDwKICAvVHlwZSAvQ2F0YWxvZwog" +
'IC9QYWdlcyAyIDAgUgo+PgplbmRvYmoKCjIgMCBvYmoKPDwKICAvVHlwZSAvUGFnZXMKICAv' + "IC9QYWdlcyAyIDAgUgo+PgplbmRvYmoKCjIgMCBvYmoKPDwKICAvVHlwZSAvUGFnZXMKICAv" +
'TWVkaWFCb3ggWyAwIDAgMjAwIDIwMCBdCiAgL0NvdW50IDEKICAvS2lkcyBbIDMgMCBSIF0K' + "TWVkaWFCb3ggWyAwIDAgMjAwIDIwMCBdCiAgL0NvdW50IDEKICAvS2lkcyBbIDMgMCBSIF0K" +
'Pj4KZW5kb2JqCgozIDAgb2JqCjw8CiAgL1R5cGUgL1BhZ2UKICAvUGFyZW50IDIgMCBSCiAg' + "Pj4KZW5kb2JqCgozIDAgb2JqCjw8CiAgL1R5cGUgL1BhZ2UKICAvUGFyZW50IDIgMCBSCiAg" +
'L1Jlc291cmNlcyA8PAogICAgL0ZvbnQgPDwKICAgICAgL0YxIDQgMCBSIAogICAgPj4KICA+' + "L1Jlc291cmNlcyA8PAogICAgL0ZvbnQgPDwKICAgICAgL0YxIDQgMCBSIAogICAgPj4KICA+" +
'PgogIC9Db250ZW50cyA1IDAgUgo+PgplbmRvYmoKCjQgMCBvYmoKPDwKICAvVHlwZSAvRm9u' + "PgogIC9Db250ZW50cyA1IDAgUgo+PgplbmRvYmoKCjQgMCBvYmoKPDwKICAvVHlwZSAvRm9u" +
'dAogIC9TdWJ0eXBlIC9UeXBlMQogIC9CYXNlRm9udCAvVGltZXMtUm9tYW4KPj4KZW5kb2Jq' + "dAogIC9TdWJ0eXBlIC9UeXBlMQogIC9CYXNlRm9udCAvVGltZXMtUm9tYW4KPj4KZW5kb2Jq" +
'Cgo1IDAgb2JqICAlIHBhZ2UgY29udGVudAo8PAogIC9MZW5ndGggNDQKPj4Kc3RyZWFtCkJU' + "Cgo1IDAgb2JqICAlIHBhZ2UgY29udGVudAo8PAogIC9MZW5ndGggNDQKPj4Kc3RyZWFtCkJU" +
'CjcwIDUwIFRECi9GMSAxMiBUZgooSGVsbG8sIHdvcmxkISkgVGoKRVQKZW5kc3RyZWFtCmVu' + "CjcwIDUwIFRECi9GMSAxMiBUZgooSGVsbG8sIHdvcmxkISkgVGoKRVQKZW5kc3RyZWFtCmVu" +
'ZG9iagoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDEwIDAwMDAwIG4g' + "ZG9iagoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDEwIDAwMDAwIG4g" +
'CjAwMDAwMDAwNzkgMDAwMDAgbiAKMDAwMDAwMDE3MyAwMDAwMCBuIAowMDAwMDAwMzAxIDAw' + "CjAwMDAwMDAwNzkgMDAwMDAgbiAKMDAwMDAwMDE3MyAwMDAwMCBuIAowMDAwMDAwMzAxIDAw" +
'MDAwIG4gCjAwMDAwMDAzODAgMDAwMDAgbiAKdHJhaWxlcgo8PAogIC9TaXplIDYKICAvUm9v' + "MDAwIG4gCjAwMDAwMDAzODAgMDAwMDAgbiAKdHJhaWxlcgo8PAogIC9TaXplIDYKICAvUm9v" +
'dCAxIDAgUgo+PgpzdGFydHhyZWYKNDkyCiUlRU9G'); "dCAxIDAgUgo+PgpzdGFydHhyZWYKNDkyCiUlRU9G"
);
// //
// The workerSrc property shall be specified. // The workerSrc property shall be specified.
// //
pdfjsLib.GlobalWorkerOptions.workerSrc = pdfjsLib.GlobalWorkerOptions.workerSrc = "../../node_modules/pdfjs-dist/build/pdf.worker.mjs";
'../../node_modules/pdfjs-dist/build/pdf.worker.mjs';
// Opening PDF by passing its binary data as a string. It is still preferable // Opening PDF by passing its binary data as a string. It is still preferable
// to use Uint8Array, but string or array-like structure will work too. // to use Uint8Array, but string or array-like structure will work too.
var loadingTask = pdfjsLib.getDocument({ data: pdfData, }); var loadingTask = pdfjsLib.getDocument({ data: pdfData });
var pdf = await loadingTask.promise; var pdf = await loadingTask.promise;
// Fetch the first page. // Fetch the first page.
var page = await pdf.getPage(1); var page = await pdf.getPage(1);
var scale = 1.5; var scale = 1.5;
var viewport = page.getViewport({ scale: scale, }); var viewport = page.getViewport({ scale: scale });
// Support HiDPI-screens. // Support HiDPI-screens.
var outputScale = window.devicePixelRatio || 1; var outputScale = window.devicePixelRatio || 1;
// Prepare canvas using PDF page dimensions. // Prepare canvas using PDF page dimensions.
var canvas = document.getElementById('the-canvas'); var canvas = document.getElementById("the-canvas");
var context = canvas.getContext('2d'); var context = canvas.getContext("2d");
canvas.width = Math.floor(viewport.width * outputScale); canvas.width = Math.floor(viewport.width * outputScale);
canvas.height = Math.floor(viewport.height * outputScale); canvas.height = Math.floor(viewport.height * outputScale);
canvas.style.width = Math.floor(viewport.width) + "px"; canvas.style.width = Math.floor(viewport.width) + "px";
canvas.style.height = Math.floor(viewport.height) + "px"; canvas.style.height = Math.floor(viewport.height) + "px";
var transform = outputScale !== 1 var transform = outputScale !== 1 ? [outputScale, 0, 0, outputScale, 0, 0] : null;
? [outputScale, 0, 0, outputScale, 0, 0]
: null;
// Render PDF page into canvas context. // Render PDF page into canvas context.
var renderContext = { var renderContext = {
@ -68,14 +65,13 @@
viewport, viewport,
}; };
page.render(renderContext); page.render(renderContext);
</script> </script>
<hr> <hr />
<h2>JavaScript code:</h2> <h2>JavaScript code:</h2>
<pre id="code"></pre> <pre id="code"></pre>
<script> <script>
document.getElementById('code').textContent = document.getElementById("code").textContent = document.getElementById("script").text;
document.getElementById('script').text; </script>
</script> </body>
</body>
</html> </html>

57
examples/learning/prevnext.html
View File

@ -1,48 +1,46 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<title>Previous/Next example</title> <title>Previous/Next example</title>
</head> </head>
<body> <body>
<h1>'Previous/Next' example</h1>
<h1>'Previous/Next' example</h1> <div>
<div>
<button id="prev" type="button">Previous</button> <button id="prev" type="button">Previous</button>
<button id="next" type="button">Next</button> <button id="next" type="button">Next</button>
&nbsp; &nbsp; &nbsp; &nbsp;
<span>Page: <span id="page_num"></span> / <span id="page_count"></span></span> <span>Page: <span id="page_num"></span> / <span id="page_count"></span></span>
</div> </div>
<div> <div>
<canvas id="the-canvas" style="border: 1px solid black; direction: ltr;"></canvas> <canvas id="the-canvas" style="border: 1px solid black; direction: ltr"></canvas>
</div> </div>
<script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>
<script id="script" type="module"> <script id="script" type="module">
// //
// If absolute URL from the remote server is provided, configure the CORS // If absolute URL from the remote server is provided, configure the CORS
// header on that server. // header on that server.
// //
var url = '../../web/compressed.tracemonkey-pldi-09.pdf'; var url = "../../web/compressed.tracemonkey-pldi-09.pdf";
// //
// In cases when the pdf.worker.js is located at the different folder than the // 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 // PDF.js's one, or the PDF.js is executed via eval(), the workerSrc property
// shall be specified. // shall be specified.
// //
pdfjsLib.GlobalWorkerOptions.workerSrc = pdfjsLib.GlobalWorkerOptions.workerSrc = "../../node_modules/pdfjs-dist/build/pdf.worker.mjs";
'../../node_modules/pdfjs-dist/build/pdf.worker.mjs';
var pdfDoc = null, var pdfDoc = null,
pageNum = 1, pageNum = 1,
pageRendering = false, pageRendering = false,
pageNumPending = null, pageNumPending = null,
scale = 0.8, scale = 0.8,
canvas = document.getElementById('the-canvas'), canvas = document.getElementById("the-canvas"),
ctx = canvas.getContext('2d'); ctx = canvas.getContext("2d");
/** /**
* Get page info from document, resize canvas accordingly, and render page. * Get page info from document, resize canvas accordingly, and render page.
@ -51,8 +49,8 @@
function renderPage(num) { function renderPage(num) {
pageRendering = true; pageRendering = true;
// Using promise to fetch the page // Using promise to fetch the page
pdfDoc.getPage(num).then(function(page) { pdfDoc.getPage(num).then(function (page) {
var viewport = page.getViewport({ scale: scale, }); var viewport = page.getViewport({ scale: scale });
// Support HiDPI-screens. // Support HiDPI-screens.
var outputScale = window.devicePixelRatio || 1; var outputScale = window.devicePixelRatio || 1;
@ -61,9 +59,7 @@
canvas.style.width = Math.floor(viewport.width) + "px"; canvas.style.width = Math.floor(viewport.width) + "px";
canvas.style.height = Math.floor(viewport.height) + "px"; canvas.style.height = Math.floor(viewport.height) + "px";
var transform = outputScale !== 1 var transform = outputScale !== 1 ? [outputScale, 0, 0, outputScale, 0, 0] : null;
? [outputScale, 0, 0, outputScale, 0, 0]
: null;
// Render PDF page into canvas context // Render PDF page into canvas context
var renderContext = { var renderContext = {
@ -85,7 +81,7 @@
}); });
// Update page counters // Update page counters
document.getElementById('page_num').textContent = num; document.getElementById("page_num").textContent = num;
} }
/** /**
@ -110,7 +106,7 @@
pageNum--; pageNum--;
queueRenderPage(pageNum); queueRenderPage(pageNum);
} }
document.getElementById('prev').addEventListener('click', onPrevPage); document.getElementById("prev").addEventListener("click", onPrevPage);
/** /**
* Displays next page. * Displays next page.
@ -122,18 +118,17 @@
pageNum++; pageNum++;
queueRenderPage(pageNum); queueRenderPage(pageNum);
} }
document.getElementById('next').addEventListener('click', onNextPage); document.getElementById("next").addEventListener("click", onNextPage);
/** /**
* Asynchronously downloads PDF. * Asynchronously downloads PDF.
*/ */
var loadingTask = pdfjsLib.getDocument(url); var loadingTask = pdfjsLib.getDocument(url);
pdfDoc = await loadingTask.promise; pdfDoc = await loadingTask.promise;
document.getElementById('page_count').textContent = pdfDoc.numPages; document.getElementById("page_count").textContent = pdfDoc.numPages;
// Initial/first page rendering // Initial/first page rendering
renderPage(pageNum); renderPage(pageNum);
</script> </script>
</body>
</body>
</html> </html>

12
examples/mobile-viewer/viewer.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2016 Mozilla Foundation Copyright 2016 Mozilla Foundation
@ -16,13 +16,13 @@ limitations under the License.
--> -->
<html dir="ltr"> <html dir="ltr">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<title>PDF.js viewer</title> <title>PDF.js viewer</title>
<link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css"> <link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css" />
<link rel="stylesheet" type="text/css" href="viewer.css"> <link rel="stylesheet" type="text/css" href="viewer.css" />
<script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>
<script src="../../node_modules/pdfjs-dist/web/pdf_viewer.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/web/pdf_viewer.mjs" type="module"></script>
@ -46,7 +46,7 @@ limitations under the License.
<button class="toolbarButton pageUp" title="Previous Page" id="previous" type="button"></button> <button class="toolbarButton pageUp" title="Previous Page" id="previous" type="button"></button>
<button class="toolbarButton pageDown" title="Next Page" id="next" type="button"></button> <button class="toolbarButton pageDown" title="Next Page" id="next" type="button"></button>
<input type="number" id="pageNumber" class="toolbarField pageNumber" value="1" size="4" min="1"> <input type="number" id="pageNumber" class="toolbarField pageNumber" value="1" size="4" min="1" />
<button class="toolbarButton zoomOut" title="Zoom Out" id="zoomOut" type="button"></button> <button class="toolbarButton zoomOut" title="Zoom Out" id="zoomOut" type="button"></button>
<button class="toolbarButton zoomIn" title="Zoom In" id="zoomIn" type="button"></button> <button class="toolbarButton zoomIn" title="Zoom In" id="zoomIn" type="button"></button>

15
examples/text-only/index.html
View File

@ -1,14 +1,13 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<title>Text-only PDF.js example</title> <title>Text-only PDF.js example</title>
<script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script> <script src="../../node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>
<script src="pdf2svg.mjs" type="module"></script> <script src="pdf2svg.mjs" type="module"></script>
</head> </head>
<body> <body>
<p>Text-only PDF.js example</p> <p>Text-only PDF.js example</p>
<div id="pageContainer" style="display: inline-block; border: solid 1px black;"> <div id="pageContainer" style="display: inline-block; border: solid 1px black"></div>
</div> </body>
</body>
</html> </html>

12
examples/webpack/index.html
View File

@ -1,11 +1,11 @@
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<title>webpack example</title> <title>webpack example</title>
<script src="../../build/webpack/main.bundle.js"></script> <script src="../../build/webpack/main.bundle.js"></script>
</head> </head>
<body> <body>
<canvas id="theCanvas"></canvas> <canvas id="theCanvas"></canvas>
</body> </body>
</html> </html>

120
extensions/chromium/options/options.html
View File

@ -15,41 +15,41 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
--> -->
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<title>PDF.js viewer options</title> <title>PDF.js viewer options</title>
<style> <style>
body { body {
min-width: 400px; /* a page at the settings page is at least 400px wide */ min-width: 400px; /* a page at the settings page is at least 400px wide */
margin: 14px 17px; /* already added by default in Chrome 40.0.2212.0 */ margin: 14px 17px; /* already added by default in Chrome 40.0.2212.0 */
} }
.settings-row { .settings-row {
margin: 1em 0; margin: 1em 0;
} }
.checkbox label { .checkbox label {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
} }
.checkbox label input { .checkbox label input {
flex-shrink: 0; flex-shrink: 0;
} }
</style> </style>
</head> </head>
<body> <body>
<div id="settings-boxes"></div> <div id="settings-boxes"></div>
<button id="reset-button" type="button">Restore default settings</button> <button id="reset-button" type="button">Restore default settings</button>
<template id="checkbox-template"> <template id="checkbox-template">
<div class="settings-row checkbox"> <div class="settings-row checkbox">
<label> <label>
<input type="checkbox"> <input type="checkbox" />
<span></span> <span></span>
</label> </label>
</div> </div>
</template> </template>
<template id="viewerCssTheme-template"> <template id="viewerCssTheme-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -58,11 +58,11 @@ body {
<option value="2">Dark theme</option> <option value="2">Dark theme</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<template id="viewOnLoad-template"> <template id="viewOnLoad-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -71,11 +71,11 @@ body {
<option value="1">Show initial position</option> <option value="1">Show initial position</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<template id="defaultZoomValue-template"> <template id="defaultZoomValue-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -94,11 +94,11 @@ body {
<option value="400">400%</option> <option value="400">400%</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<template id="sidebarViewOnLoad-template"> <template id="sidebarViewOnLoad-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -109,11 +109,11 @@ body {
<option value="3">Show attachments in sidebar</option> <option value="3">Show attachments in sidebar</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<template id="cursorToolOnLoad-template"> <template id="cursorToolOnLoad-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -121,11 +121,11 @@ body {
<option value="1">Hand tool</option> <option value="1">Hand tool</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<template id="textLayerMode-template"> <template id="textLayerMode-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -133,11 +133,11 @@ body {
<option value="1">Enable text selection</option> <option value="1">Enable text selection</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<template id="externalLinkTarget-template"> <template id="externalLinkTarget-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -148,11 +148,11 @@ body {
<option value="4">Top window/tab</option> <option value="4">Top window/tab</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<template id="scrollModeOnLoad-template"> <template id="scrollModeOnLoad-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -163,11 +163,11 @@ body {
<option value="2">Wrapped scrolling</option> <option value="2">Wrapped scrolling</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<template id="spreadModeOnLoad-template"> <template id="spreadModeOnLoad-template">
<div class="settings-row"> <div class="settings-row">
<label> <label>
<span></span> <span></span>
<select> <select>
@ -177,9 +177,9 @@ body {
<option value="2">Even spreads</option> <option value="2">Even spreads</option>
</select> </select>
</label> </label>
</div> </div>
</template> </template>
<script src="options.js"></script> <script src="options.js"></script>
</body> </body>
</html> </html>

4
external/builder/builder.mjs vendored
View File

@ -151,7 +151,7 @@ function preprocess(inFilename, outFilename, defines) {
let state = STATE_NONE; let state = STATE_NONE;
const stack = []; const stack = [];
const control = const control =
/^(?:\/\/|\s*\/\*|<!--)\s*#(if|elif|else|endif|expand|include|error)\b(?:\s+(.*?)(?:\*\/|-->)?$)?/; /^(?:\/\/|\s*\/\*|\s*<!--)\s*#(if|elif|else|endif|expand|include|error)\b(?:\s+(.*?)(?:\*\/|-->)?$)?/;
while ((line = readLine()) !== null) { while ((line = readLine()) !== null) {
++lineNumber; ++lineNumber;
@ -213,7 +213,7 @@ function preprocess(inFilename, outFilename, defines) {
) { ) {
writeLine( writeLine(
line line
.replaceAll(/^\/\/|^<!--/g, " ") .replaceAll(/^\/\/|^\s*<!--/g, " ")
.replaceAll(/(^\s*)\/\*/g, "$1 ") .replaceAll(/(^\s*)\/\*/g, "$1 ")
.replaceAll(/\*\/$|-->$/g, "") .replaceAll(/\*\/$|-->$/g, "")
); );

5
gulpfile.mjs
View File

@ -2023,7 +2023,7 @@ gulp.task(
gulp.task("lint", function (done) { gulp.task("lint", function (done) {
console.log(); console.log();
console.log("### Linting JS/CSS/JSON/SVG files"); console.log("### Linting JS/CSS/JSON/SVG/HTML files");
// Ensure that we lint the Firefox specific *.jsm files too. // Ensure that we lint the Firefox specific *.jsm files too.
const esLintOptions = [ const esLintOptions = [
@ -2047,9 +2047,10 @@ gulp.task("lint", function (done) {
const prettierOptions = [ const prettierOptions = [
"node_modules/prettier/bin/prettier.cjs", "node_modules/prettier/bin/prettier.cjs",
"**/*.json", "**/*.json",
"**/*.html",
]; ];
if (process.argv.includes("--fix")) { if (process.argv.includes("--fix")) {
prettierOptions.push("--log-level", "silent", "--write"); prettierOptions.push("--log-level", "error", "--write");
} else { } else {
prettierOptions.push("--log-level", "warn", "--check"); prettierOptions.push("--log-level", "warn", "--check");
} }

11
test/font/font_test.html
View File

@ -1,9 +1,9 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<title>PDF.js font tests</title> <title>PDF.js font tests</title>
<link rel="stylesheet" type="text/css" href="../../node_modules/jasmine-core/lib/jasmine-core/jasmine.css"> <link rel="stylesheet" type="text/css" href="../../node_modules/jasmine-core/lib/jasmine-core/jasmine.css" />
<script src="../../node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script> <script src="../../node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script>
<script src="../../node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script> <script src="../../node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script>
@ -19,7 +19,6 @@
} }
</script> </script>
<script src="jasmine-boot.js" type="module"></script> <script src="jasmine-boot.js" type="module"></script>
</head> </head>
<body> <body></body>
</body>
</html> </html>

51
test/resources/reftest-analyzer.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2012 Mozilla Foundation Copyright 2012 Mozilla Foundation
@ -30,23 +30,23 @@ the terms of any one of the MPL, the GPL or the LGPL.
Original author: L. David Baron <dbaron@dbaron.org> Original author: L. David Baron <dbaron@dbaron.org>
--> -->
<html> <html>
<head> <head>
<title>Reftest analyzer</title> <title>Reftest analyzer</title>
<meta charset="utf-8"> <meta charset="utf-8" />
<link rel="stylesheet" href="reftest-analyzer.css"> <link rel="stylesheet" href="reftest-analyzer.css" />
<script src="reftest-analyzer.js"></script> <script src="reftest-analyzer.js"></script>
</head> </head>
<body> <body>
<div id="entry"> <div id="entry">
<h1>Reftest analyzer</h1> <h1>Reftest analyzer</h1>
<p> <p>
Paste your log into this textarea:<br> Paste your log into this textarea:<br />
<textarea cols="80" rows="10" id="logEntry"></textarea><br> <textarea cols="80" rows="10" id="logEntry"></textarea><br />
<input type="button" value="Process pasted log" id="logPasted"> <input type="button" value="Process pasted log" id="logPasted" />
</p> </p>
<p> <p>
<br>...or load it from a file:<br> <br />...or load it from a file:<br />
<input type="file" id="fileEntry"> <input type="file" id="fileEntry" />
</p> </p>
</div> </div>
<div id="loading">Loading log...</div> <div id="loading">Loading log...</div>
@ -72,13 +72,14 @@ Original author: L. David Baron <dbaron@dbaron.org>
</tbody> </tbody>
</table> </table>
<div> <div>
<div id="pixelhint">? <div id="pixelhint">
?
<div> <div>
<p>Move the mouse over the reftest image on the right to show <p>
magnified pixels on the left. The color information above is for Move the mouse over the reftest image on the right to show magnified pixels on the left. The color information above is for the pixel centered
the pixel centered in the magnified view.</p> in the magnified view.
<p>The test is shown in the upper triangle of each pixel and </p>
the reference is shown in the lower triangle.</p> <p>The test is shown in the upper triangle of each pixel and the reference is shown in the lower triangle.</p>
</div> </div>
</div> </div>
</div> </div>
@ -95,22 +96,21 @@ Original author: L. David Baron <dbaron@dbaron.org>
<div id="imagepane"> <div id="imagepane">
<form id="imgcontrols"> <form id="imgcontrols">
<label> <label>
<input type="radio" name="which" id="testImage" value="0" checked="checked"> Test <input type="radio" name="which" id="testImage" value="0" checked="checked" />
Test
</label> </label>
<label> <label>
<input type="radio" name="which" id="referenceImage" value="1"> Reference <input type="radio" name="which" id="referenceImage" value="1" />
</label> Reference
<label>
<input type="checkbox" id="differences"> Circle differences
</label> </label>
<label> <input type="checkbox" id="differences" /> Circle differences </label>
<span id="shortcuts">Shortcuts: n=next p=previous t=toggle d=differences</span> <span id="shortcuts">Shortcuts: n=next p=previous t=toggle d=differences</span>
</form> </form>
<div id="images"> <div id="images">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="800" height="1000" id="svg"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="800" height="1000" id="svg">
<defs> <defs>
<!-- use sRGB to avoid loss of data --> <!-- use sRGB to avoid loss of data -->
<filter id="showDifferences" x="0%" y="0%" width="100%" height="100%" <filter id="showDifferences" x="0%" y="0%" width="100%" height="100%" style="color-interpolation-filters: sRGB">
style="color-interpolation-filters: sRGB">
<feImage id="feimage1" result="img1" xlink:href="#image1" /> <feImage id="feimage1" result="img1" xlink:href="#image1" />
<feImage id="feimage2" result="img2" xlink:href="#image2" /> <feImage id="feimage2" result="img2" xlink:href="#image2" />
<!-- inv1 and inv2 are the images with RGB inverted --> <!-- inv1 and inv2 are the images with RGB inverted -->
@ -174,5 +174,6 @@ Original author: L. David Baron <dbaron@dbaron.org>
</svg> </svg>
</div> </div>
</div> </div>
</body> </div>
</body>
</html> </html>

18
test/test_slave.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2015 Mozilla Foundation Copyright 2015 Mozilla Foundation
@ -17,29 +17,29 @@ limitations under the License.
<html> <html>
<head> <head>
<title>PDF.js test slave</title> <title>PDF.js test slave</title>
<meta charset="utf-8"> <meta charset="utf-8" />
<script src="../build/generic/build/pdf.mjs" type="module"></script> <script src="../build/generic/build/pdf.mjs" type="module"></script>
<script src="../build/components/pdf_viewer.mjs" type="module"></script> <script src="../build/components/pdf_viewer.mjs" type="module"></script>
<link rel="resource" type="application/l10n" href="../build/generic/web/locale/locale.json"> <link rel="resource" type="application/l10n" href="../build/generic/web/locale/locale.json" />
</head> </head>
<body> <body>
<p>Inflight requests: <span id="inflight"></span></p> <p>Inflight requests: <span id="inflight"></span></p>
<p> <p>
<input type="checkbox" id="disableScrolling"> <input type="checkbox" id="disableScrolling" />
<label for="disableScrolling">Disable automatic scrolling</label> <label for="disableScrolling">Disable automatic scrolling</label>
</p> </p>
<pre id="output" style="max-height: 800px; overflow-y: scroll;"></pre> <pre id="output" style="max-height: 800px; overflow-y: scroll"></pre>
<div id="end"></div> <div id="end"></div>
</body> </body>
<script type="module"> <script type="module">
import { Driver } from "./driver.js"; import { Driver } from "./driver.js";
const driver = new Driver({ const driver = new Driver({
disableScrolling: document.getElementById('disableScrolling'), disableScrolling: document.getElementById("disableScrolling"),
inflight: document.getElementById('inflight'), inflight: document.getElementById("inflight"),
output: document.getElementById('output'), output: document.getElementById("output"),
end: document.getElementById('end') end: document.getElementById("end"),
}); });
driver.run(); driver.run();
</script> </script>

11
test/unit/unit_test.html
View File

@ -1,9 +1,9 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<title>PDF.js unit tests</title> <title>PDF.js unit tests</title>
<link rel="stylesheet" type="text/css" href="../../node_modules/jasmine-core/lib/jasmine-core/jasmine.css"> <link rel="stylesheet" type="text/css" href="../../node_modules/jasmine-core/lib/jasmine-core/jasmine.css" />
<script src="../../node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script> <script src="../../node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script>
<script src="../../node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script> <script src="../../node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script>
@ -50,7 +50,6 @@
} }
</script> </script>
<script src="jasmine-boot.js" type="module"></script> <script src="jasmine-boot.js" type="module"></script>
</head> </head>
<body> <body></body>
</body>
</html> </html>

61
web/viewer-geckoview.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2012 Mozilla Foundation Copyright 2012 Mozilla Foundation
@ -22,26 +22,26 @@ See https://github.com/adobe-type-tools/cmap-resources
--> -->
<html dir="ltr" mozdisallowselectionprint> <html dir="ltr" mozdisallowselectionprint>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<title>PDF.js viewer</title> <title>PDF.js viewer</title>
<!--#if MOZCENTRAL--> <!--#if MOZCENTRAL-->
<!--#include viewer-snippet-firefox-extension.html--> <!--#include viewer-snippet-firefox-extension.html-->
<!--#endif--> <!--#endif-->
<!--#if MOZCENTRAL--> <!--#if MOZCENTRAL-->
<!--<link rel="stylesheet" href="resource://pdf.js/web/viewer.css">--> <!--<link rel="stylesheet" href="resource://pdf.js/web/viewer.css">-->
<!--<link rel="localization" href="toolkit/pdfviewer/viewer.ftl"/>--> <!--<link rel="localization" href="toolkit/pdfviewer/viewer.ftl"/>-->
<!--#else--> <!--#else-->
<link rel="stylesheet" href="viewer-geckoview.css"> <link rel="stylesheet" href="viewer-geckoview.css" />
<!--#endif--> <!--#endif-->
<!--#if !MOZCENTRAL--> <!--#if !MOZCENTRAL-->
<link rel="resource" type="application/l10n" href="locale/locale.json"> <link rel="resource" type="application/l10n" href="locale/locale.json" />
<!--#endif--> <!--#endif-->
<!--#if !MOZCENTRAL--> <!--#if !MOZCENTRAL-->
<script> <script>
if (typeof PDFJSDev === "undefined") { if (typeof PDFJSDev === "undefined") {
window.isGECKOVIEW = true; window.isGECKOVIEW = true;
@ -91,17 +91,14 @@ See https://github.com/adobe-type-tools/cmap-resources
} }
</script> </script>
<script src="viewer-geckoview.js" type="module"></script> <script src="viewer-geckoview.js" type="module"></script>
<!--#else--> <!--#else-->
<!--<script src="resource://pdf.js/web/viewer.mjs" type="module"></script>--> <!--<script src="resource://pdf.js/web/viewer.mjs" type="module"></script>-->
<!--#endif--> <!--#endif-->
</head> </head>
<body tabindex="0"> <body tabindex="0">
<div id="outerContainer"> <div id="outerContainer">
<div id="mainContainer"> <div id="mainContainer">
<div id="floatingToolbar"> <div id="floatingToolbar">
<button id="download" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-download-button"> <button id="download" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-download-button">
<span data-l10n-id="pdfjs-download-button-label"></span> <span data-l10n-id="pdfjs-download-button-label"></span>
@ -111,7 +108,8 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="viewerContainer" tabindex="0"> <div id="viewerContainer" tabindex="0">
<div id="viewer" class="pdfViewer"></div> <div id="viewer" class="pdfViewer"></div>
</div> </div>
</div> <!-- mainContainer --> </div>
<!-- mainContainer -->
<div id="dialogContainer"> <div id="dialogContainer">
<dialog id="passwordDialog"> <dialog id="passwordDialog">
@ -119,16 +117,21 @@ See https://github.com/adobe-type-tools/cmap-resources
<label for="password" id="passwordText" data-l10n-id="pdfjs-password-label"></label> <label for="password" id="passwordText" data-l10n-id="pdfjs-password-label"></label>
</div> </div>
<div class="row"> <div class="row">
<input type="password" id="password" class="toolbarField"> <input type="password" id="password" class="toolbarField" />
</div> </div>
<div class="buttonRow"> <div class="buttonRow">
<button id="passwordCancel" class="dialogButton" type="button"><span data-l10n-id="pdfjs-password-cancel-button"></span></button> <button id="passwordCancel" class="dialogButton" type="button">
<button id="passwordSubmit" class="dialogButton" type="button"><span data-l10n-id="pdfjs-password-ok-button"></span></button> <span data-l10n-id="pdfjs-password-cancel-button"></span>
</button>
<button id="passwordSubmit" class="dialogButton" type="button">
<span data-l10n-id="pdfjs-password-ok-button"></span>
</button>
</div> </div>
</dialog> </dialog>
</div> <!-- dialogContainer --> </div>
<!-- dialogContainer -->
</div> <!-- outerContainer --> </div>
<!-- outerContainer -->
<div id="printContainer"></div> <div id="printContainer"></div>
</body> </body>
</html> </html>

4
web/viewer-snippet-chrome-extension.html
View File

@ -1,4 +1,4 @@
<!-- This snippet is used in the Chromium extension (included from viewer.html) --> <!-- This snippet is used in the Chromium extension (included from viewer.html) -->
<base href="/content/web/"> <base href="/content/web/" />
<link rel="resource" type="application/l10n" href="locale/locale.json"> <link rel="resource" type="application/l10n" href="locale/locale.json" />
<script src="../build/pdf.mjs" type="module"></script> <script src="../build/pdf.mjs" type="module"></script>

16
web/viewer-snippet-chrome-overlays.html
View File

@ -4,7 +4,9 @@
users with recognizing which checkbox they have to click when they users with recognizing which checkbox they have to click when they
visit chrome://extensions. visit chrome://extensions.
--> -->
<p id="chrome-pdfjs-logo-bg" style=" <p
id="chrome-pdfjs-logo-bg"
style="
display: block; display: block;
padding-left: 60px; padding-left: 60px;
min-height: 48px; min-height: 48px;
@ -12,19 +14,19 @@
background-repeat: no-repeat; background-repeat: no-repeat;
font-size: 14px; font-size: 14px;
line-height: 1.8em; line-height: 1.8em;
word-break: break-all;"> word-break: break-all;
Click on "
"<span id="chrome-file-access-label">Allow access to file URLs</span>" >
at Click on "<span id="chrome-file-access-label">Allow access to file URLs</span>" at
<a id="chrome-link-to-extensions-page">chrome://extensions</a> <a id="chrome-link-to-extensions-page">chrome://extensions</a>
<br> <br />
to view <span id="chrome-url-of-local-file">this PDF file.</span> to view <span id="chrome-url-of-local-file">this PDF file.</span>
</p> </p>
</div> </div>
<div class="row"> <div class="row">
<p> <p>
or select the file again: or select the file again:
<input type="file" id="chrome-file-fallback" accept=".pdf"> <input type="file" id="chrome-file-fallback" accept=".pdf" />
</p> </p>
</div> </div>
</dialog> </dialog>

2
web/viewer-snippet.html
View File

@ -1,3 +1,3 @@
<!-- This snippet is used in production (included from viewer.html) --> <!-- This snippet is used in production (included from viewer.html) -->
<link rel="resource" type="application/l10n" href="locale/locale.json"> <link rel="resource" type="application/l10n" href="locale/locale.json" />
<script src="../build/pdf.mjs" type="module"></script> <script src="../build/pdf.mjs" type="module"></script>

613
web/viewer.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<!-- <!--
Copyright 2012 Mozilla Foundation Copyright 2012 Mozilla Foundation
@ -22,34 +22,34 @@ See https://github.com/adobe-type-tools/cmap-resources
--> -->
<html dir="ltr" mozdisallowselectionprint> <html dir="ltr" mozdisallowselectionprint>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<!--#if GENERIC || CHROME--> <!--#if GENERIC || CHROME-->
<meta name="google" content="notranslate"> <meta name="google" content="notranslate" />
<!--#endif--> <!--#endif-->
<title>PDF.js viewer</title> <title>PDF.js viewer</title>
<!--#if MOZCENTRAL--> <!--#if MOZCENTRAL-->
<!--#include viewer-snippet-firefox-extension.html--> <!--#include viewer-snippet-firefox-extension.html-->
<!--#elif CHROME--> <!--#elif CHROME-->
<!--#include viewer-snippet-chrome-extension.html--> <!--#include viewer-snippet-chrome-extension.html-->
<!--#else--> <!--#else-->
<!--#include viewer-snippet.html--> <!--#include viewer-snippet.html-->
<!--#endif--> <!--#endif-->
<!--#if MOZCENTRAL--> <!--#if MOZCENTRAL-->
<!--<link rel="stylesheet" href="resource://pdf.js/web/viewer.css">--> <!--<link rel="stylesheet" href="resource://pdf.js/web/viewer.css">-->
<!--<link rel="localization" href="toolkit/pdfviewer/viewer.ftl"/>--> <!--<link rel="localization" href="toolkit/pdfviewer/viewer.ftl"/>-->
<!--#else--> <!--#else-->
<link rel="stylesheet" href="viewer.css"> <link rel="stylesheet" href="viewer.css" />
<!--#endif--> <!--#endif-->
<!--#if MOZCENTRAL--> <!--#if MOZCENTRAL-->
<!--<script src="resource://pdf.js/web/viewer.mjs" type="module"></script>--> <!--<script src="resource://pdf.js/web/viewer.mjs" type="module"></script>-->
<!--#elif !MOZCENTRAL--> <!--#elif !MOZCENTRAL-->
<!--<script src="viewer.mjs" type="module"></script>--> <!--<script src="viewer.mjs" type="module"></script>-->
<!--#elif /* Development mode. */--> <!--#elif /* Development mode. */-->
<link rel="resource" type="application/l10n" href="locale/locale.json"> <link rel="resource" type="application/l10n" href="locale/locale.json" />
<script type="importmap"> <script type="importmap">
{ {
@ -94,7 +94,7 @@ See https://github.com/adobe-type-tools/cmap-resources
} }
</script> </script>
<script src="viewer.js" type="module"></script> <script src="viewer.js" type="module"></script>
<!--#endif--> <!--#endif-->
</head> </head>
<body tabindex="0"> <body tabindex="0">
@ -105,16 +105,52 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="toolbarSidebar" class="toolbarHorizontalGroup"> <div id="toolbarSidebar" class="toolbarHorizontalGroup">
<div id="toolbarSidebarLeft"> <div id="toolbarSidebarLeft">
<div id="sidebarViewButtons" class="toolbarHorizontalGroup toggled" role="radiogroup"> <div id="sidebarViewButtons" class="toolbarHorizontalGroup toggled" role="radiogroup">
<button id="viewThumbnail" class="toolbarButton toggled" type="button" tabindex="0" data-l10n-id="pdfjs-thumbs-button" role="radio" aria-checked="true" aria-controls="thumbnailView"> <button
id="viewThumbnail"
class="toolbarButton toggled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-thumbs-button"
role="radio"
aria-checked="true"
aria-controls="thumbnailView"
>
<span data-l10n-id="pdfjs-thumbs-button-label"></span> <span data-l10n-id="pdfjs-thumbs-button-label"></span>
</button> </button>
<button id="viewOutline" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-document-outline-button" role="radio" aria-checked="false" aria-controls="outlineView"> <button
id="viewOutline"
class="toolbarButton"
type="button"
tabindex="0"
data-l10n-id="pdfjs-document-outline-button"
role="radio"
aria-checked="false"
aria-controls="outlineView"
>
<span data-l10n-id="pdfjs-document-outline-button-label"></span> <span data-l10n-id="pdfjs-document-outline-button-label"></span>
</button> </button>
<button id="viewAttachments" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-attachments-button" role="radio" aria-checked="false" aria-controls="attachmentsView"> <button
id="viewAttachments"
class="toolbarButton"
type="button"
tabindex="0"
data-l10n-id="pdfjs-attachments-button"
role="radio"
aria-checked="false"
aria-controls="attachmentsView"
>
<span data-l10n-id="pdfjs-attachments-button-label"></span> <span data-l10n-id="pdfjs-attachments-button-label"></span>
</button> </button>
<button id="viewLayers" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-layers-button" role="radio" aria-checked="false" aria-controls="layersView"> <button
id="viewLayers"
class="toolbarButton"
type="button"
tabindex="0"
data-l10n-id="pdfjs-layers-button"
role="radio"
aria-checked="false"
aria-controls="layersView"
>
<span data-l10n-id="pdfjs-layers-button-label"></span> <span data-l10n-id="pdfjs-layers-button-label"></span>
</button> </button>
</div> </div>
@ -124,42 +160,63 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="outlineOptionsContainer" class="toolbarHorizontalGroup"> <div id="outlineOptionsContainer" class="toolbarHorizontalGroup">
<div class="verticalToolbarSeparator"></div> <div class="verticalToolbarSeparator"></div>
<button id="currentOutlineItem" class="toolbarButton" type="button" disabled="disabled" tabindex="0" data-l10n-id="pdfjs-current-outline-item-button"> <button
id="currentOutlineItem"
class="toolbarButton"
type="button"
disabled="disabled"
tabindex="0"
data-l10n-id="pdfjs-current-outline-item-button"
>
<span data-l10n-id="pdfjs-current-outline-item-button-label"></span> <span data-l10n-id="pdfjs-current-outline-item-button-label"></span>
</button> </button>
</div> </div>
</div> </div>
</div> </div>
<div id="sidebarContent"> <div id="sidebarContent">
<div id="thumbnailView"> <div id="thumbnailView"></div>
</div> <div id="outlineView" class="hidden"></div>
<div id="outlineView" class="hidden"> <div id="attachmentsView" class="hidden"></div>
</div> <div id="layersView" class="hidden"></div>
<div id="attachmentsView" class="hidden">
</div>
<div id="layersView" class="hidden">
</div>
</div> </div>
<div id="sidebarResizer"></div> <div id="sidebarResizer"></div>
</div> <!-- sidebarContainer --> </div>
<!-- sidebarContainer -->
<div id="mainContainer"> <div id="mainContainer">
<div class="toolbar"> <div class="toolbar">
<div id="toolbarContainer"> <div id="toolbarContainer">
<div id="toolbarViewer" class="toolbarHorizontalGroup"> <div id="toolbarViewer" class="toolbarHorizontalGroup">
<div id="toolbarViewerLeft" class="toolbarHorizontalGroup"> <div id="toolbarViewerLeft" class="toolbarHorizontalGroup">
<button id="sidebarToggleButton" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-toggle-sidebar-button" aria-expanded="false" aria-haspopup="true" aria-controls="sidebarContainer"> <button
id="sidebarToggleButton"
class="toolbarButton"
type="button"
tabindex="0"
data-l10n-id="pdfjs-toggle-sidebar-button"
aria-expanded="false"
aria-haspopup="true"
aria-controls="sidebarContainer"
>
<span data-l10n-id="pdfjs-toggle-sidebar-button-label"></span> <span data-l10n-id="pdfjs-toggle-sidebar-button-label"></span>
</button> </button>
<div class="toolbarButtonSpacer"></div> <div class="toolbarButtonSpacer"></div>
<div class="toolbarButtonWithContainer"> <div class="toolbarButtonWithContainer">
<button id="viewFindButton" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-findbar-button" aria-expanded="false" aria-controls="findbar"> <button
id="viewFindButton"
class="toolbarButton"
type="button"
tabindex="0"
data-l10n-id="pdfjs-findbar-button"
aria-expanded="false"
aria-controls="findbar"
>
<span data-l10n-id="pdfjs-findbar-button-label"></span> <span data-l10n-id="pdfjs-findbar-button-label"></span>
</button> </button>
<div class="hidden doorHanger toolbarHorizontalGroup" id="findbar"> <div class="hidden doorHanger toolbarHorizontalGroup" id="findbar">
<div id="findInputContainer" class="toolbarHorizontalGroup"> <div id="findInputContainer" class="toolbarHorizontalGroup">
<span class="loadingInput end toolbarHorizontalGroup"> <span class="loadingInput end toolbarHorizontalGroup">
<input id="findInput" class="toolbarField" tabindex="0" data-l10n-id="pdfjs-find-input" aria-invalid="false"> <input id="findInput" class="toolbarField" tabindex="0" data-l10n-id="pdfjs-find-input" aria-invalid="false" />
</span> </span>
<div class="toolbarHorizontalGroup"> <div class="toolbarHorizontalGroup">
<button id="findPreviousButton" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-find-previous-button"> <button id="findPreviousButton" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-find-previous-button">
@ -197,7 +254,8 @@ See https://github.com/adobe-type-tools/cmap-resources
<span id="findResultsCount" class="toolbarLabel"></span> <span id="findResultsCount" class="toolbarLabel"></span>
<span id="findMsg" class="toolbarLabel"></span> <span id="findMsg" class="toolbarLabel"></span>
</div> </div>
</div> <!-- findbar --> </div>
<!-- findbar -->
</div> </div>
<div class="toolbarHorizontalGroup hiddenSmallView"> <div class="toolbarHorizontalGroup hiddenSmallView">
<button class="toolbarButton" type="button" id="previous" tabindex="0" data-l10n-id="pdfjs-previous-button"> <button class="toolbarButton" type="button" id="previous" tabindex="0" data-l10n-id="pdfjs-previous-button">
@ -210,7 +268,16 @@ See https://github.com/adobe-type-tools/cmap-resources
</div> </div>
<div class="toolbarHorizontalGroup"> <div class="toolbarHorizontalGroup">
<span class="loadingInput start toolbarHorizontalGroup"> <span class="loadingInput start toolbarHorizontalGroup">
<input type="number" id="pageNumber" class="toolbarField" value="1" min="1" tabindex="0" data-l10n-id="pdfjs-page-input" autocomplete="off"> <input
type="number"
id="pageNumber"
class="toolbarField"
value="1"
min="1"
tabindex="0"
data-l10n-id="pdfjs-page-input"
autocomplete="off"
/>
</span> </span>
<span id="numPages" class="toolbarLabel"></span> <span id="numPages" class="toolbarLabel"></span>
</div> </div>
@ -231,7 +298,14 @@ See https://github.com/adobe-type-tools/cmap-resources
<option id="pageActualOption" value="page-actual" data-l10n-id="pdfjs-page-scale-actual"></option> <option id="pageActualOption" value="page-actual" data-l10n-id="pdfjs-page-scale-actual"></option>
<option id="pageFitOption" value="page-fit" data-l10n-id="pdfjs-page-scale-fit"></option> <option id="pageFitOption" value="page-fit" data-l10n-id="pdfjs-page-scale-fit"></option>
<option id="pageWidthOption" value="page-width" data-l10n-id="pdfjs-page-scale-width"></option> <option id="pageWidthOption" value="page-width" data-l10n-id="pdfjs-page-scale-width"></option>
<option id="customScaleOption" value="custom" disabled="disabled" hidden="true" data-l10n-id="pdfjs-page-scale-percent" data-l10n-args='{ "scale": 0 }'></option> <option
id="customScaleOption"
value="custom"
disabled="disabled"
hidden="true"
data-l10n-id="pdfjs-page-scale-percent"
data-l10n-args='{ "scale": 0 }'
></option>
<option value="0.5" data-l10n-id="pdfjs-page-scale-percent" data-l10n-args='{ "scale": 50 }'></option> <option value="0.5" data-l10n-id="pdfjs-page-scale-percent" data-l10n-args='{ "scale": 50 }'></option>
<option value="0.75" data-l10n-id="pdfjs-page-scale-percent" data-l10n-args='{ "scale": 75 }'></option> <option value="0.75" data-l10n-id="pdfjs-page-scale-percent" data-l10n-args='{ "scale": 75 }'></option>
<option value="1" data-l10n-id="pdfjs-page-scale-percent" data-l10n-args='{ "scale": 100 }'></option> <option value="1" data-l10n-id="pdfjs-page-scale-percent" data-l10n-args='{ "scale": 100 }'></option>
@ -246,7 +320,17 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="toolbarViewerRight" class="toolbarHorizontalGroup"> <div id="toolbarViewerRight" class="toolbarHorizontalGroup">
<div id="editorModeButtons" class="toolbarHorizontalGroup"> <div id="editorModeButtons" class="toolbarHorizontalGroup">
<div id="editorComment" class="toolbarButtonWithContainer" hidden="true"> <div id="editorComment" class="toolbarButtonWithContainer" hidden="true">
<button id="editorCommentButton" class="toolbarButton" type="button" tabindex="0" disabled="disabled" aria-expanded="false" aria-haspopup="true" aria-controls="editorCommentParamsToolbar" data-l10n-id="pdfjs-editor-comment-button"> <button
id="editorCommentButton"
class="toolbarButton"
type="button"
tabindex="0"
disabled="disabled"
aria-expanded="false"
aria-haspopup="true"
aria-controls="editorCommentParamsToolbar"
data-l10n-id="pdfjs-editor-comment-button"
>
<span data-l10n-id="pdfjs-editor-comment-button-label"></span> <span data-l10n-id="pdfjs-editor-comment-button-label"></span>
</button> </button>
<div class="editorParamsToolbar hidden menu" id="editorCommentParamsToolbar"> <div class="editorParamsToolbar hidden menu" id="editorCommentParamsToolbar">
@ -268,19 +352,45 @@ See https://github.com/adobe-type-tools/cmap-resources
</div> </div>
</div> </div>
<div id="editorSignature" class="toolbarButtonWithContainer" hidden="true"> <div id="editorSignature" class="toolbarButtonWithContainer" hidden="true">
<button id="editorSignatureButton" class="toolbarButton" type="button" tabindex="0" disabled="disabled" aria-expanded="false" aria-haspopup="true" aria-controls="editorSignatureParamsToolbar" data-l10n-id="pdfjs-editor-signature-button"> <button
id="editorSignatureButton"
class="toolbarButton"
type="button"
tabindex="0"
disabled="disabled"
aria-expanded="false"
aria-haspopup="true"
aria-controls="editorSignatureParamsToolbar"
data-l10n-id="pdfjs-editor-signature-button"
>
<span data-l10n-id="pdfjs-editor-signature-button-label"></span> <span data-l10n-id="pdfjs-editor-signature-button-label"></span>
</button> </button>
<div class="editorParamsToolbar hidden doorHangerRight menu" id="editorSignatureParamsToolbar"> <div class="editorParamsToolbar hidden doorHangerRight menu" id="editorSignatureParamsToolbar">
<div id="addSignatureDoorHanger" class="menuContainer" role="region" data-l10n-id="pdfjs-editor-add-signature-container"> <div id="addSignatureDoorHanger" class="menuContainer" role="region" data-l10n-id="pdfjs-editor-add-signature-container">
<button id="editorSignatureAddSignature" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-editor-signature-add-signature-button"> <button
id="editorSignatureAddSignature"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-editor-signature-add-signature-button"
>
<span data-l10n-id="pdfjs-editor-signature-add-signature-button-label" class="editorParamsLabel"></span> <span data-l10n-id="pdfjs-editor-signature-add-signature-button-label" class="editorParamsLabel"></span>
</button> </button>
</div> </div>
</div> </div>
</div> </div>
<div id="editorHighlight" class="toolbarButtonWithContainer"> <div id="editorHighlight" class="toolbarButtonWithContainer">
<button id="editorHighlightButton" class="toolbarButton" type="button" disabled="disabled" aria-expanded="false" aria-haspopup="true" aria-controls="editorHighlightParamsToolbar" tabindex="0" data-l10n-id="pdfjs-editor-highlight-button"> <button
id="editorHighlightButton"
class="toolbarButton"
type="button"
disabled="disabled"
aria-expanded="false"
aria-haspopup="true"
aria-controls="editorHighlightParamsToolbar"
tabindex="0"
data-l10n-id="pdfjs-editor-highlight-button"
>
<span data-l10n-id="pdfjs-editor-highlight-button-label"></span> <span data-l10n-id="pdfjs-editor-highlight-button-label"></span>
</button> </button>
<div class="editorParamsToolbar hidden doorHangerRight" id="editorHighlightParamsToolbar"> <div class="editorParamsToolbar hidden doorHangerRight" id="editorHighlightParamsToolbar">
@ -289,66 +399,123 @@ See https://github.com/adobe-type-tools/cmap-resources
<span id="highlightColorPickerLabel" class="editorParamsLabel" data-l10n-id="pdfjs-editor-highlight-colorpicker-label"></span> <span id="highlightColorPickerLabel" class="editorParamsLabel" data-l10n-id="pdfjs-editor-highlight-colorpicker-label"></span>
</div> </div>
<div id="editorHighlightThickness"> <div id="editorHighlightThickness">
<label for="editorFreeHighlightThickness" class="editorParamsLabel" data-l10n-id="pdfjs-editor-free-highlight-thickness-input"></label> <label
for="editorFreeHighlightThickness"
class="editorParamsLabel"
data-l10n-id="pdfjs-editor-free-highlight-thickness-input"
></label>
<div class="thicknessPicker"> <div class="thicknessPicker">
<input type="range" id="editorFreeHighlightThickness" class="editorParamsSlider" data-l10n-id="pdfjs-editor-free-highlight-thickness-title" value="12" min="8" max="24" step="1" tabindex="0"> <input
type="range"
id="editorFreeHighlightThickness"
class="editorParamsSlider"
data-l10n-id="pdfjs-editor-free-highlight-thickness-title"
value="12"
min="8"
max="24"
step="1"
tabindex="0"
/>
</div> </div>
</div> </div>
<div id="editorHighlightVisibility"> <div id="editorHighlightVisibility">
<div class="divider"></div> <div class="divider"></div>
<div class="toggler"> <div class="toggler">
<label for="editorHighlightShowAll" class="editorParamsLabel" data-l10n-id="pdfjs-editor-highlight-show-all-button-label"></label> <label for="editorHighlightShowAll" class="editorParamsLabel" data-l10n-id="pdfjs-editor-highlight-show-all-button-label"></label>
<button id="editorHighlightShowAll" class="toggle-button" type="button" data-l10n-id="pdfjs-editor-highlight-show-all-button" aria-pressed="true" tabindex="0"></button> <button
id="editorHighlightShowAll"
class="toggle-button"
type="button"
data-l10n-id="pdfjs-editor-highlight-show-all-button"
aria-pressed="true"
tabindex="0"
></button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div id="editorFreeText" class="toolbarButtonWithContainer"> <div id="editorFreeText" class="toolbarButtonWithContainer">
<button id="editorFreeTextButton" class="toolbarButton" type="button" disabled="disabled" aria-expanded="false" aria-haspopup="true" aria-controls="editorFreeTextParamsToolbar" tabindex="0" data-l10n-id="pdfjs-editor-free-text-button"> <button
id="editorFreeTextButton"
class="toolbarButton"
type="button"
disabled="disabled"
aria-expanded="false"
aria-haspopup="true"
aria-controls="editorFreeTextParamsToolbar"
tabindex="0"
data-l10n-id="pdfjs-editor-free-text-button"
>
<span data-l10n-id="pdfjs-editor-free-text-button-label"></span> <span data-l10n-id="pdfjs-editor-free-text-button-label"></span>
</button> </button>
<div class="editorParamsToolbar hidden doorHangerRight" id="editorFreeTextParamsToolbar"> <div class="editorParamsToolbar hidden doorHangerRight" id="editorFreeTextParamsToolbar">
<div class="editorParamsToolbarContainer"> <div class="editorParamsToolbarContainer">
<div class="editorParamsSetter"> <div class="editorParamsSetter">
<label for="editorFreeTextColor" class="editorParamsLabel" data-l10n-id="pdfjs-editor-free-text-color-input"></label> <label for="editorFreeTextColor" class="editorParamsLabel" data-l10n-id="pdfjs-editor-free-text-color-input"></label>
<input type="color" id="editorFreeTextColor" class="editorParamsColor" tabindex="0"> <input type="color" id="editorFreeTextColor" class="editorParamsColor" tabindex="0" />
</div> </div>
<div class="editorParamsSetter"> <div class="editorParamsSetter">
<label for="editorFreeTextFontSize" class="editorParamsLabel" data-l10n-id="pdfjs-editor-free-text-size-input"></label> <label for="editorFreeTextFontSize" class="editorParamsLabel" data-l10n-id="pdfjs-editor-free-text-size-input"></label>
<input type="range" id="editorFreeTextFontSize" class="editorParamsSlider" value="10" min="5" max="100" step="1" tabindex="0"> <input type="range" id="editorFreeTextFontSize" class="editorParamsSlider" value="10" min="5" max="100" step="1" tabindex="0" />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div id="editorInk" class="toolbarButtonWithContainer"> <div id="editorInk" class="toolbarButtonWithContainer">
<button id="editorInkButton" class="toolbarButton" type="button" disabled="disabled" aria-expanded="false" aria-haspopup="true" aria-controls="editorInkParamsToolbar" tabindex="0" data-l10n-id="pdfjs-editor-ink-button"> <button
id="editorInkButton"
class="toolbarButton"
type="button"
disabled="disabled"
aria-expanded="false"
aria-haspopup="true"
aria-controls="editorInkParamsToolbar"
tabindex="0"
data-l10n-id="pdfjs-editor-ink-button"
>
<span data-l10n-id="pdfjs-editor-ink-button-label"></span> <span data-l10n-id="pdfjs-editor-ink-button-label"></span>
</button> </button>
<div class="editorParamsToolbar hidden doorHangerRight" id="editorInkParamsToolbar"> <div class="editorParamsToolbar hidden doorHangerRight" id="editorInkParamsToolbar">
<div class="editorParamsToolbarContainer"> <div class="editorParamsToolbarContainer">
<div class="editorParamsSetter"> <div class="editorParamsSetter">
<label for="editorInkColor" class="editorParamsLabel" data-l10n-id="pdfjs-editor-ink-color-input"></label> <label for="editorInkColor" class="editorParamsLabel" data-l10n-id="pdfjs-editor-ink-color-input"></label>
<input type="color" id="editorInkColor" class="editorParamsColor" tabindex="0"> <input type="color" id="editorInkColor" class="editorParamsColor" tabindex="0" />
</div> </div>
<div class="editorParamsSetter"> <div class="editorParamsSetter">
<label for="editorInkThickness" class="editorParamsLabel" data-l10n-id="pdfjs-editor-ink-thickness-input"></label> <label for="editorInkThickness" class="editorParamsLabel" data-l10n-id="pdfjs-editor-ink-thickness-input"></label>
<input type="range" id="editorInkThickness" class="editorParamsSlider" value="1" min="1" max="20" step="1" tabindex="0"> <input type="range" id="editorInkThickness" class="editorParamsSlider" value="1" min="1" max="20" step="1" tabindex="0" />
</div> </div>
<div class="editorParamsSetter"> <div class="editorParamsSetter">
<label for="editorInkOpacity" class="editorParamsLabel" data-l10n-id="pdfjs-editor-ink-opacity-input"></label> <label for="editorInkOpacity" class="editorParamsLabel" data-l10n-id="pdfjs-editor-ink-opacity-input"></label>
<input type="range" id="editorInkOpacity" class="editorParamsSlider" value="1" min="0.05" max="1" step="0.05" tabindex="0"> <input type="range" id="editorInkOpacity" class="editorParamsSlider" value="1" min="0.05" max="1" step="0.05" tabindex="0" />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div id="editorStamp" class="toolbarButtonWithContainer"> <div id="editorStamp" class="toolbarButtonWithContainer">
<button id="editorStampButton" class="toolbarButton" type="button" disabled="disabled" aria-expanded="false" aria-haspopup="true" aria-controls="editorStampParamsToolbar" tabindex="0" data-l10n-id="pdfjs-editor-stamp-button"> <button
id="editorStampButton"
class="toolbarButton"
type="button"
disabled="disabled"
aria-expanded="false"
aria-haspopup="true"
aria-controls="editorStampParamsToolbar"
tabindex="0"
data-l10n-id="pdfjs-editor-stamp-button"
>
<span data-l10n-id="pdfjs-editor-stamp-button-label"></span> <span data-l10n-id="pdfjs-editor-stamp-button-label"></span>
</button> </button>
<div class="editorParamsToolbar hidden doorHangerRight menu" id="editorStampParamsToolbar"> <div class="editorParamsToolbar hidden doorHangerRight menu" id="editorStampParamsToolbar">
<div class="menuContainer"> <div class="menuContainer">
<button id="editorStampAddImage" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-editor-stamp-add-image-button"> <button
id="editorStampAddImage"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-editor-stamp-add-image-button"
>
<span class="editorParamsLabel" data-l10n-id="pdfjs-editor-stamp-add-image-button-label"></span> <span class="editorParamsLabel" data-l10n-id="pdfjs-editor-stamp-add-image-button-label"></span>
</button> </button>
</div> </div>
@ -371,16 +538,25 @@ See https://github.com/adobe-type-tools/cmap-resources
<div class="verticalToolbarSeparator hiddenMediumView"></div> <div class="verticalToolbarSeparator hiddenMediumView"></div>
<div id="secondaryToolbarToggle" class="toolbarButtonWithContainer"> <div id="secondaryToolbarToggle" class="toolbarButtonWithContainer">
<button id="secondaryToolbarToggleButton" class="toolbarButton" type="button" tabindex="0" data-l10n-id="pdfjs-tools-button" aria-expanded="false" aria-haspopup="true" aria-controls="secondaryToolbar"> <button
id="secondaryToolbarToggleButton"
class="toolbarButton"
type="button"
tabindex="0"
data-l10n-id="pdfjs-tools-button"
aria-expanded="false"
aria-haspopup="true"
aria-controls="secondaryToolbar"
>
<span data-l10n-id="pdfjs-tools-button-label"></span> <span data-l10n-id="pdfjs-tools-button-label"></span>
</button> </button>
<div id="secondaryToolbar" class="hidden doorHangerRight menu"> <div id="secondaryToolbar" class="hidden doorHangerRight menu">
<div id="secondaryToolbarButtonContainer" class="menuContainer"> <div id="secondaryToolbarButtonContainer" class="menuContainer">
<!--#if GENERIC--> <!--#if GENERIC-->
<button id="secondaryOpenFile" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-open-file-button"> <button id="secondaryOpenFile" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-open-file-button">
<span data-l10n-id="pdfjs-open-file-button-label"></span> <span data-l10n-id="pdfjs-open-file-button-label"></span>
</button> </button>
<!--#endif--> <!--#endif-->
<div class="visibleMediumView"> <div class="visibleMediumView">
<button id="secondaryPrint" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-print-button"> <button id="secondaryPrint" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-print-button">
@ -391,14 +567,14 @@ See https://github.com/adobe-type-tools/cmap-resources
<span data-l10n-id="pdfjs-save-button-label"></span> <span data-l10n-id="pdfjs-save-button-label"></span>
</button> </button>
<!--#if !GENERIC--> <!--#if !GENERIC-->
<!-- <div class="horizontalToolbarSeparator"></div>--> <!-- <div class="horizontalToolbarSeparator"></div>-->
<!--#endif--> <!--#endif-->
</div> </div>
<!--#if GENERIC--> <!--#if GENERIC-->
<div class="horizontalToolbarSeparator"></div> <div class="horizontalToolbarSeparator"></div>
<!--#endif--> <!--#endif-->
<button id="presentationMode" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-presentation-mode-button"> <button id="presentationMode" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-presentation-mode-button">
<span data-l10n-id="pdfjs-presentation-mode-button-label"></span> <span data-l10n-id="pdfjs-presentation-mode-button-label"></span>
@ -429,10 +605,26 @@ See https://github.com/adobe-type-tools/cmap-resources
<div class="horizontalToolbarSeparator"></div> <div class="horizontalToolbarSeparator"></div>
<div id="cursorToolButtons" role="radiogroup"> <div id="cursorToolButtons" role="radiogroup">
<button id="cursorSelectTool" class="toolbarButton labeled toggled" type="button" tabindex="0" data-l10n-id="pdfjs-cursor-text-select-tool-button" role="radio" aria-checked="true"> <button
id="cursorSelectTool"
class="toolbarButton labeled toggled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-cursor-text-select-tool-button"
role="radio"
aria-checked="true"
>
<span data-l10n-id="pdfjs-cursor-text-select-tool-button-label"></span> <span data-l10n-id="pdfjs-cursor-text-select-tool-button-label"></span>
</button> </button>
<button id="cursorHandTool" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-cursor-hand-tool-button" role="radio" aria-checked="false"> <button
id="cursorHandTool"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-cursor-hand-tool-button"
role="radio"
aria-checked="false"
>
<span data-l10n-id="pdfjs-cursor-hand-tool-button-label"></span> <span data-l10n-id="pdfjs-cursor-hand-tool-button-label"></span>
</button> </button>
</div> </div>
@ -440,16 +632,48 @@ See https://github.com/adobe-type-tools/cmap-resources
<div class="horizontalToolbarSeparator"></div> <div class="horizontalToolbarSeparator"></div>
<div id="scrollModeButtons" role="radiogroup"> <div id="scrollModeButtons" role="radiogroup">
<button id="scrollPage" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-scroll-page-button" role="radio" aria-checked="false"> <button
id="scrollPage"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-scroll-page-button"
role="radio"
aria-checked="false"
>
<span data-l10n-id="pdfjs-scroll-page-button-label"></span> <span data-l10n-id="pdfjs-scroll-page-button-label"></span>
</button> </button>
<button id="scrollVertical" class="toolbarButton labeled toggled" type="button" tabindex="0" data-l10n-id="pdfjs-scroll-vertical-button" role="radio" aria-checked="true"> <button
id="scrollVertical"
class="toolbarButton labeled toggled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-scroll-vertical-button"
role="radio"
aria-checked="true"
>
<span data-l10n-id="pdfjs-scroll-vertical-button-label"></span> <span data-l10n-id="pdfjs-scroll-vertical-button-label"></span>
</button> </button>
<button id="scrollHorizontal" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-scroll-horizontal-button" role="radio" aria-checked="false"> <button
id="scrollHorizontal"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-scroll-horizontal-button"
role="radio"
aria-checked="false"
>
<span data-l10n-id="pdfjs-scroll-horizontal-button-label"></span> <span data-l10n-id="pdfjs-scroll-horizontal-button-label"></span>
</button> </button>
<button id="scrollWrapped" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-scroll-wrapped-button" role="radio" aria-checked="false"> <button
id="scrollWrapped"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-scroll-wrapped-button"
role="radio"
aria-checked="false"
>
<span data-l10n-id="pdfjs-scroll-wrapped-button-label"></span> <span data-l10n-id="pdfjs-scroll-wrapped-button-label"></span>
</button> </button>
</div> </div>
@ -457,36 +681,74 @@ See https://github.com/adobe-type-tools/cmap-resources
<div class="horizontalToolbarSeparator"></div> <div class="horizontalToolbarSeparator"></div>
<div id="spreadModeButtons" role="radiogroup"> <div id="spreadModeButtons" role="radiogroup">
<button id="spreadNone" class="toolbarButton labeled toggled" type="button" tabindex="0" data-l10n-id="pdfjs-spread-none-button" role="radio" aria-checked="true"> <button
id="spreadNone"
class="toolbarButton labeled toggled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-spread-none-button"
role="radio"
aria-checked="true"
>
<span data-l10n-id="pdfjs-spread-none-button-label"></span> <span data-l10n-id="pdfjs-spread-none-button-label"></span>
</button> </button>
<button id="spreadOdd" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-spread-odd-button" role="radio" aria-checked="false"> <button
id="spreadOdd"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-spread-odd-button"
role="radio"
aria-checked="false"
>
<span data-l10n-id="pdfjs-spread-odd-button-label"></span> <span data-l10n-id="pdfjs-spread-odd-button-label"></span>
</button> </button>
<button id="spreadEven" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-spread-even-button" role="radio" aria-checked="false"> <button
id="spreadEven"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-spread-even-button"
role="radio"
aria-checked="false"
>
<span data-l10n-id="pdfjs-spread-even-button-label"></span> <span data-l10n-id="pdfjs-spread-even-button-label"></span>
</button> </button>
</div> </div>
<div id="imageAltTextSettingsSeparator" class="horizontalToolbarSeparator hidden"></div> <div id="imageAltTextSettingsSeparator" class="horizontalToolbarSeparator hidden"></div>
<button id="imageAltTextSettings" type="button" class="toolbarButton labeled hidden" tabindex="0" data-l10n-id="pdfjs-image-alt-text-settings-button" aria-controls="altTextSettingsDialog"> <button
id="imageAltTextSettings"
type="button"
class="toolbarButton labeled hidden"
tabindex="0"
data-l10n-id="pdfjs-image-alt-text-settings-button"
aria-controls="altTextSettingsDialog"
>
<span data-l10n-id="pdfjs-image-alt-text-settings-button-label"></span> <span data-l10n-id="pdfjs-image-alt-text-settings-button-label"></span>
</button> </button>
<div class="horizontalToolbarSeparator"></div> <div class="horizontalToolbarSeparator"></div>
<button id="documentProperties" class="toolbarButton labeled" type="button" tabindex="0" data-l10n-id="pdfjs-document-properties-button" aria-controls="documentPropertiesDialog"> <button
id="documentProperties"
class="toolbarButton labeled"
type="button"
tabindex="0"
data-l10n-id="pdfjs-document-properties-button"
aria-controls="documentPropertiesDialog"
>
<span data-l10n-id="pdfjs-document-properties-button-label"></span> <span data-l10n-id="pdfjs-document-properties-button-label"></span>
</button> </button>
</div> </div>
</div> <!-- secondaryToolbar --> </div>
<!-- secondaryToolbar -->
</div> </div>
</div> </div>
</div> </div>
<div id="loadingBar"> <div id="loadingBar">
<div class="progress"> <div class="progress">
<div class="glimmer"> <div class="glimmer"></div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -495,7 +757,8 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="viewerContainer" tabindex="0"> <div id="viewerContainer" tabindex="0">
<div id="viewer" class="pdfViewer"></div> <div id="viewer" class="pdfViewer"></div>
</div> </div>
</div> <!-- mainContainer --> </div>
<!-- mainContainer -->
<div id="dialogContainer"> <div id="dialogContainer">
<dialog id="passwordDialog"> <dialog id="passwordDialog">
@ -503,7 +766,7 @@ See https://github.com/adobe-type-tools/cmap-resources
<label for="password" id="passwordText" data-l10n-id="pdfjs-password-label"></label> <label for="password" id="passwordText" data-l10n-id="pdfjs-password-label"></label>
</div> </div>
<div class="row"> <div class="row">
<input type="password" id="password" class="toolbarField"> <input type="password" id="password" class="toolbarField" />
</div> </div>
<div class="buttonRow"> <div class="buttonRow">
<button id="passwordCancel" class="dialogButton" type="button"><span data-l10n-id="pdfjs-password-cancel-button"></span></button> <button id="passwordCancel" class="dialogButton" type="button"><span data-l10n-id="pdfjs-password-cancel-button"></span></button>
@ -583,7 +846,7 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="addDescription"> <div id="addDescription">
<div class="radio"> <div class="radio">
<div class="radioButton"> <div class="radioButton">
<input type="radio" id="descriptionButton" name="altTextOption" tabindex="0" aria-describedby="descriptionAreaLabel" checked> <input type="radio" id="descriptionButton" name="altTextOption" tabindex="0" aria-describedby="descriptionAreaLabel" checked />
<label for="descriptionButton" data-l10n-id="pdfjs-editor-alt-text-add-description-label"></label> <label for="descriptionButton" data-l10n-id="pdfjs-editor-alt-text-add-description-label"></label>
</div> </div>
<div class="radioLabel"> <div class="radioLabel">
@ -597,7 +860,7 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="markAsDecorative"> <div id="markAsDecorative">
<div class="radio"> <div class="radio">
<div class="radioButton"> <div class="radioButton">
<input type="radio" id="decorativeButton" name="altTextOption" aria-describedby="decorativeLabel"> <input type="radio" id="decorativeButton" name="altTextOption" aria-describedby="decorativeLabel" />
<label for="decorativeButton" data-l10n-id="pdfjs-editor-alt-text-mark-decorative-label"></label> <label for="decorativeButton" data-l10n-id="pdfjs-editor-alt-text-mark-decorative-label"></label>
</div> </div>
<div class="radioLabel"> <div class="radioLabel">
@ -606,7 +869,9 @@ See https://github.com/adobe-type-tools/cmap-resources
</div> </div>
</div> </div>
<div id="buttons"> <div id="buttons">
<button id="altTextCancel" class="secondaryButton" type="button" tabindex="0"><span data-l10n-id="pdfjs-editor-alt-text-cancel-button"></span></button> <button id="altTextCancel" class="secondaryButton" type="button" tabindex="0">
<span data-l10n-id="pdfjs-editor-alt-text-cancel-button"></span>
</button>
<button id="altTextSave" class="primaryButton" type="button" tabindex="0"><span data-l10n-id="pdfjs-editor-alt-text-save-button"></span></button> <button id="altTextSave" class="primaryButton" type="button" tabindex="0"><span data-l10n-id="pdfjs-editor-alt-text-save-button"></span></button>
</div> </div>
</div> </div>
@ -621,17 +886,43 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="descriptionInstruction"> <div id="descriptionInstruction">
<div id="newAltTextDescriptionContainer"> <div id="newAltTextDescriptionContainer">
<div class="altTextSpinner" role="status" aria-live="polite"></div> <div class="altTextSpinner" role="status" aria-live="polite"></div>
<textarea id="newAltTextDescriptionTextarea" aria-labelledby="descriptionAreaLabel" data-l10n-id="pdfjs-editor-new-alt-text-textarea" tabindex="0"></textarea> <textarea
id="newAltTextDescriptionTextarea"
aria-labelledby="descriptionAreaLabel"
data-l10n-id="pdfjs-editor-new-alt-text-textarea"
tabindex="0"
></textarea>
</div> </div>
<span id="newAltTextDescription" role="note" data-l10n-id="pdfjs-editor-new-alt-text-description"></span> <span id="newAltTextDescription" role="note" data-l10n-id="pdfjs-editor-new-alt-text-description"></span>
<div id="newAltTextDisclaimer" role="note"><div><span data-l10n-id="pdfjs-editor-new-alt-text-disclaimer1"></span> <a href="https://support.mozilla.org/en-US/kb/pdf-alt-text" target="_blank" rel="noopener noreferrer" id="newAltTextLearnMore" data-l10n-id="pdfjs-editor-new-alt-text-disclaimer-learn-more-url" tabindex="0"></a></div></div> <div id="newAltTextDisclaimer" role="note">
<div>
<span data-l10n-id="pdfjs-editor-new-alt-text-disclaimer1"></span>
<a
href="https://support.mozilla.org/en-US/kb/pdf-alt-text"
target="_blank"
rel="noopener noreferrer"
id="newAltTextLearnMore"
data-l10n-id="pdfjs-editor-new-alt-text-disclaimer-learn-more-url"
tabindex="0"
></a>
</div>
</div>
</div> </div>
<div id="newAltTextCreateAutomatically" class="toggler"> <div id="newAltTextCreateAutomatically" class="toggler">
<button id="newAltTextCreateAutomaticallyButton" class="toggle-button" type="button" aria-pressed="true" tabindex="0"></button> <button id="newAltTextCreateAutomaticallyButton" class="toggle-button" type="button" aria-pressed="true" tabindex="0"></button>
<label for="newAltTextCreateAutomaticallyButton" class="togglerLabel" data-l10n-id="pdfjs-editor-new-alt-text-create-automatically-button-label"></label> <label
for="newAltTextCreateAutomaticallyButton"
class="togglerLabel"
data-l10n-id="pdfjs-editor-new-alt-text-create-automatically-button-label"
></label>
</div> </div>
<div id="newAltTextDownloadModel" class="hidden"> <div id="newAltTextDownloadModel" class="hidden">
<span id="newAltTextDownloadModelDescription" data-l10n-id="pdfjs-editor-new-alt-text-ai-model-downloading-progress" aria-valuemin="0" data-l10n-args='{ "totalSize": 0, "downloadedSize": 0 }'></span> <span
id="newAltTextDownloadModelDescription"
data-l10n-id="pdfjs-editor-new-alt-text-ai-model-downloading-progress"
aria-valuemin="0"
data-l10n-args='{ "totalSize": 0, "downloadedSize": 0 }'
></span>
</div> </div>
</div> </div>
<div id="newAltTextImagePreview"></div> <div id="newAltTextImagePreview"></div>
@ -642,13 +933,21 @@ See https://github.com/adobe-type-tools/cmap-resources
<span class="title" data-l10n-id="pdfjs-editor-new-alt-text-error-title"></span> <span class="title" data-l10n-id="pdfjs-editor-new-alt-text-error-title"></span>
<span class="description" data-l10n-id="pdfjs-editor-new-alt-text-error-description"></span> <span class="description" data-l10n-id="pdfjs-editor-new-alt-text-error-description"></span>
</div> </div>
<button id="newAltTextCloseButton" class="closeButton" type="button" tabindex="0"><span data-l10n-id="pdfjs-editor-new-alt-text-error-close-button"></span></button> <button id="newAltTextCloseButton" class="closeButton" type="button" tabindex="0">
<span data-l10n-id="pdfjs-editor-new-alt-text-error-close-button"></span>
</button>
</div> </div>
</div> </div>
<div id="newAltTextButtons" class="dialogButtonsGroup"> <div id="newAltTextButtons" class="dialogButtonsGroup">
<button id="newAltTextCancel" type="button" class="secondaryButton hidden" tabindex="0"><span data-l10n-id="pdfjs-editor-alt-text-cancel-button"></span></button> <button id="newAltTextCancel" type="button" class="secondaryButton hidden" tabindex="0">
<button id="newAltTextNotNow" type="button" class="secondaryButton" tabindex="0"><span data-l10n-id="pdfjs-editor-new-alt-text-not-now-button"></span></button> <span data-l10n-id="pdfjs-editor-alt-text-cancel-button"></span>
<button id="newAltTextSave" type="button" class="primaryButton" tabindex="0"><span data-l10n-id="pdfjs-editor-alt-text-save-button"></span></button> </button>
<button id="newAltTextNotNow" type="button" class="secondaryButton" tabindex="0">
<span data-l10n-id="pdfjs-editor-new-alt-text-not-now-button"></span>
</button>
<button id="newAltTextSave" type="button" class="primaryButton" tabindex="0">
<span data-l10n-id="pdfjs-editor-alt-text-save-button"></span>
</button>
</div> </div>
</div> </div>
</dialog> </dialog>
@ -667,7 +966,15 @@ See https://github.com/adobe-type-tools/cmap-resources
<label for="createModelButton" class="togglerLabel" data-l10n-id="pdfjs-editor-alt-text-settings-create-model-button-label"></label> <label for="createModelButton" class="togglerLabel" data-l10n-id="pdfjs-editor-alt-text-settings-create-model-button-label"></label>
</div> </div>
<div id="createModelDescription" class="description"> <div id="createModelDescription" class="description">
<span data-l10n-id="pdfjs-editor-alt-text-settings-create-model-description"></span> <a href="https://support.mozilla.org/en-US/kb/pdf-alt-text" target="_blank" rel="noopener noreferrer" id="altTextSettingsLearnMore" data-l10n-id="pdfjs-editor-new-alt-text-disclaimer-learn-more-url" tabindex="0"></a> <span data-l10n-id="pdfjs-editor-alt-text-settings-create-model-description"></span>
<a
href="https://support.mozilla.org/en-US/kb/pdf-alt-text"
target="_blank"
rel="noopener noreferrer"
id="altTextSettingsLearnMore"
data-l10n-id="pdfjs-editor-new-alt-text-disclaimer-learn-more-url"
tabindex="0"
></a>
</div> </div>
</div> </div>
<div id="aiModelSettings"> <div id="aiModelSettings">
@ -677,8 +984,12 @@ See https://github.com/adobe-type-tools/cmap-resources
<span data-l10n-id="pdfjs-editor-alt-text-settings-ai-model-description"></span> <span data-l10n-id="pdfjs-editor-alt-text-settings-ai-model-description"></span>
</div> </div>
</div> </div>
<button id="deleteModelButton" type="button" class="secondaryButton" tabindex="0"><span data-l10n-id="pdfjs-editor-alt-text-settings-delete-model-button"></span></button> <button id="deleteModelButton" type="button" class="secondaryButton" tabindex="0">
<button id="downloadModelButton" type="button" class="secondaryButton" tabindex="0"><span data-l10n-id="pdfjs-editor-alt-text-settings-download-model-button"></span></button> <span data-l10n-id="pdfjs-editor-alt-text-settings-delete-model-button"></span>
</button>
<button id="downloadModelButton" type="button" class="secondaryButton" tabindex="0">
<span data-l10n-id="pdfjs-editor-alt-text-settings-download-model-button"></span>
</button>
</div> </div>
</div> </div>
</div> </div>
@ -696,7 +1007,9 @@ See https://github.com/adobe-type-tools/cmap-resources
</div> </div>
</div> </div>
<div id="buttons" class="dialogButtonsGroup"> <div id="buttons" class="dialogButtonsGroup">
<button id="altTextSettingsCloseButton" type="button" class="primaryButton" tabindex="0"><span data-l10n-id="pdfjs-editor-alt-text-settings-close-button"></span></button> <button id="altTextSettingsCloseButton" type="button" class="primaryButton" tabindex="0">
<span data-l10n-id="pdfjs-editor-alt-text-settings-close-button"></span>
</button>
</div> </div>
</div> </div>
</dialog> </dialog>
@ -708,13 +1021,37 @@ See https://github.com/adobe-type-tools/cmap-resources
<span role="sectionhead" data-l10n-id="pdfjs-editor-add-signature-dialog-title" tabindex="0"></span> <span role="sectionhead" data-l10n-id="pdfjs-editor-add-signature-dialog-title" tabindex="0"></span>
</div> </div>
<div role="tablist" id="addSignatureOptions"> <div role="tablist" id="addSignatureOptions">
<button id="addSignatureTypeButton" type="button" role="tab" aria-selected="true" aria-controls="addSignatureTypeContainer" data-l10n-id="pdfjs-editor-add-signature-type-button" tabindex="0"></button> <button
<button id="addSignatureDrawButton" type="button" role="tab" aria-selected="false" aria-controls="addSignatureDrawContainer" data-l10n-id="pdfjs-editor-add-signature-draw-button" tabindex="0"></button> id="addSignatureTypeButton"
<button id="addSignatureImageButton" type="button" role="tab" aria-selected="false" aria-controls="addSignatureImageContainer" data-l10n-id="pdfjs-editor-add-signature-image-button" tabindex="-1"></button> type="button"
role="tab"
aria-selected="true"
aria-controls="addSignatureTypeContainer"
data-l10n-id="pdfjs-editor-add-signature-type-button"
tabindex="0"
></button>
<button
id="addSignatureDrawButton"
type="button"
role="tab"
aria-selected="false"
aria-controls="addSignatureDrawContainer"
data-l10n-id="pdfjs-editor-add-signature-draw-button"
tabindex="0"
></button>
<button
id="addSignatureImageButton"
type="button"
role="tab"
aria-selected="false"
aria-controls="addSignatureImageContainer"
data-l10n-id="pdfjs-editor-add-signature-image-button"
tabindex="-1"
></button>
</div> </div>
<div id="addSignatureActionContainer" data-selected="type"> <div id="addSignatureActionContainer" data-selected="type">
<div id="addSignatureTypeContainer" role="tabpanel" aria-labelledby="addSignatureTypeContainer"> <div id="addSignatureTypeContainer" role="tabpanel" aria-labelledby="addSignatureTypeContainer">
<input id="addSignatureTypeInput" type="text" data-l10n-id="pdfjs-editor-add-signature-type-input" tabindex="0"></input> <input id="addSignatureTypeInput" type="text" data-l10n-id="pdfjs-editor-add-signature-type-input" tabindex="0" />
</div> </div>
<div id="addSignatureDrawContainer" role="tabpanel" aria-labelledby="addSignatureDrawButton" tabindex="-1"> <div id="addSignatureDrawContainer" role="tabpanel" aria-labelledby="addSignatureDrawButton" tabindex="-1">
<svg id="addSignatureDraw" xmlns="http://www.w3.org/2000/svg" aria-labelledby="addSignatureDrawPlaceholder"></svg> <svg id="addSignatureDraw" xmlns="http://www.w3.org/2000/svg" aria-labelledby="addSignatureDrawPlaceholder"></svg>
@ -722,7 +1059,17 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="thickness"> <div id="thickness">
<div> <div>
<label for="addSignatureDrawThickness" data-l10n-id="pdfjs-editor-add-signature-draw-thickness-range-label"></label> <label for="addSignatureDrawThickness" data-l10n-id="pdfjs-editor-add-signature-draw-thickness-range-label"></label>
<input type="range" id="addSignatureDrawThickness" min="1" max="5" step="1" value="1" data-l10n-id="pdfjs-editor-add-signature-draw-thickness-range" data-l10n-args='{ "thickness": 1 }' tabindex="0"> <input
type="range"
id="addSignatureDrawThickness"
min="1"
max="5"
step="1"
value="1"
data-l10n-id="pdfjs-editor-add-signature-draw-thickness-range"
data-l10n-args='{ "thickness": 1 }'
tabindex="0"
/>
</div> </div>
</div> </div>
</div> </div>
@ -733,7 +1080,7 @@ See https://github.com/adobe-type-tools/cmap-resources
<label id="addSignatureImageBrowse" for="addSignatureFilePicker" tabindex="0"> <label id="addSignatureImageBrowse" for="addSignatureFilePicker" tabindex="0">
<a data-l10n-id="pdfjs-editor-add-signature-image-browse-link"></a> <a data-l10n-id="pdfjs-editor-add-signature-image-browse-link"></a>
</label> </label>
<input id="addSignatureFilePicker" type="file"></input> <input id="addSignatureFilePicker" type="file" />
</div> </div>
</div> </div>
<div id="addSignatureControls"> <div id="addSignatureControls">
@ -741,14 +1088,16 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="addSignatureDescriptionContainer"> <div id="addSignatureDescriptionContainer">
<label for="addSignatureDescInput" data-l10n-id="pdfjs-editor-add-signature-description-label"></label> <label for="addSignatureDescInput" data-l10n-id="pdfjs-editor-add-signature-description-label"></label>
<span id="addSignatureDescription" class="inputWithClearButton"> <span id="addSignatureDescription" class="inputWithClearButton">
<input id="addSignatureDescInput" type="text" data-l10n-id="pdfjs-editor-add-signature-description-input" tabindex="0"></input> <input id="addSignatureDescInput" type="text" data-l10n-id="pdfjs-editor-add-signature-description-input" tabindex="0" />
<button class="clearInputButton" type="button" tabindex="0" aria-hidden="true"></button> <button class="clearInputButton" type="button" tabindex="0" aria-hidden="true"></button>
</span> </span>
</div> </div>
<button id="clearSignatureButton" type="button" data-l10n-id="pdfjs-editor-add-signature-clear-button" tabindex="0"><span data-l10n-id="pdfjs-editor-add-signature-clear-button-label"></span></button> <button id="clearSignatureButton" type="button" data-l10n-id="pdfjs-editor-add-signature-clear-button" tabindex="0">
<span data-l10n-id="pdfjs-editor-add-signature-clear-button-label"></span>
</button>
</div> </div>
<div id="addSignatureSaveContainer"> <div id="addSignatureSaveContainer">
<input type="checkbox" id="addSignatureSaveCheckbox"></input> <input type="checkbox" id="addSignatureSaveCheckbox" />
<label for="addSignatureSaveCheckbox" data-l10n-id="pdfjs-editor-add-signature-save-checkbox"></label> <label for="addSignatureSaveCheckbox" data-l10n-id="pdfjs-editor-add-signature-save-checkbox"></label>
<span></span> <span></span>
<span id="addSignatureSaveWarning" data-l10n-id="pdfjs-editor-add-signature-save-warning-message"></span> <span id="addSignatureSaveWarning" data-l10n-id="pdfjs-editor-add-signature-save-warning-message"></span>
@ -760,12 +1109,18 @@ See https://github.com/adobe-type-tools/cmap-resources
<span id="addSignatureErrorTitle" class="title" data-l10n-id="pdfjs-editor-add-signature-image-upload-error-title"></span> <span id="addSignatureErrorTitle" class="title" data-l10n-id="pdfjs-editor-add-signature-image-upload-error-title"></span>
<span id="addSignatureErrorDescription" class="description" data-l10n-id="pdfjs-editor-add-signature-image-upload-error-description"></span> <span id="addSignatureErrorDescription" class="description" data-l10n-id="pdfjs-editor-add-signature-image-upload-error-description"></span>
</div> </div>
<button id="addSignatureErrorCloseButton" class="closeButton" type="button" tabindex="0"><span data-l10n-id="pdfjs-editor-add-signature-error-close-button"></span></button> <button id="addSignatureErrorCloseButton" class="closeButton" type="button" tabindex="0">
<span data-l10n-id="pdfjs-editor-add-signature-error-close-button"></span>
</button>
</div> </div>
</div> </div>
<div class="dialogButtonsGroup"> <div class="dialogButtonsGroup">
<button id="addSignatureCancelButton" type="button" class="secondaryButton" tabindex="0"><span data-l10n-id="pdfjs-editor-add-signature-cancel-button"></span></button> <button id="addSignatureCancelButton" type="button" class="secondaryButton" tabindex="0">
<button id="addSignatureAddButton" type="button" class="primaryButton" disabled tabindex="0"><span data-l10n-id="pdfjs-editor-add-signature-add-button"></span></button> <span data-l10n-id="pdfjs-editor-add-signature-cancel-button"></span>
</button>
<button id="addSignatureAddButton" type="button" class="primaryButton" disabled tabindex="0">
<span data-l10n-id="pdfjs-editor-add-signature-add-button"></span>
</button>
</div> </div>
</div> </div>
</div> </div>
@ -780,15 +1135,19 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="editSignatureDescriptionContainer"> <div id="editSignatureDescriptionContainer">
<label for="editSignatureDescInput" data-l10n-id="pdfjs-editor-add-signature-description-label"></label> <label for="editSignatureDescInput" data-l10n-id="pdfjs-editor-add-signature-description-label"></label>
<span id="editSignatureDescription" class="inputWithClearButton"> <span id="editSignatureDescription" class="inputWithClearButton">
<input id="editSignatureDescInput" type="text" data-l10n-id="pdfjs-editor-add-signature-description-input" tabindex="0"></input> <input id="editSignatureDescInput" type="text" data-l10n-id="pdfjs-editor-add-signature-description-input" tabindex="0" />
<button class="clearInputButton" type="button" tabindex="0" aria-hidden="true"></button> <button class="clearInputButton" type="button" tabindex="0" aria-hidden="true"></button>
</span> </span>
</div> </div>
<svg id="editSignatureView" xmlns="http://www.w3.org/2000/svg"></svg> <svg id="editSignatureView" xmlns="http://www.w3.org/2000/svg"></svg>
</div> </div>
<div class="dialogButtonsGroup"> <div class="dialogButtonsGroup">
<button id="editSignatureCancelButton" type="button" class="secondaryButton" tabindex="0"><span data-l10n-id="pdfjs-editor-add-signature-cancel-button"></span></button> <button id="editSignatureCancelButton" type="button" class="secondaryButton" tabindex="0">
<button id="editSignatureUpdateButton" type="button" class="primaryButton" disabled tabindex="0"><span data-l10n-id="pdfjs-editor-edit-signature-update-button"></span></button> <span data-l10n-id="pdfjs-editor-add-signature-cancel-button"></span>
</button>
<button id="editSignatureUpdateButton" type="button" class="primaryButton" disabled tabindex="0">
<span data-l10n-id="pdfjs-editor-edit-signature-update-button"></span>
</button>
</div> </div>
</div> </div>
</dialog> </dialog>
@ -810,8 +1169,8 @@ See https://github.com/adobe-type-tools/cmap-resources
</div> </div>
</dialog> </dialog>
<!--#if !MOZCENTRAL--> <!--#if !MOZCENTRAL-->
<dialog id="printServiceDialog" style="min-width: 200px;"> <dialog id="printServiceDialog" style="min-width: 200px">
<div class="row"> <div class="row">
<span data-l10n-id="pdfjs-print-progress-message"></span> <span data-l10n-id="pdfjs-print-progress-message"></span>
</div> </div>
@ -823,11 +1182,12 @@ See https://github.com/adobe-type-tools/cmap-resources
<button id="printCancel" class="dialogButton" type="button"><span data-l10n-id="pdfjs-print-progress-close-button"></span></button> <button id="printCancel" class="dialogButton" type="button"><span data-l10n-id="pdfjs-print-progress-close-button"></span></button>
</div> </div>
</dialog> </dialog>
<!--#endif--> <!--#endif-->
<!--#if CHROME--> <!--#if CHROME-->
<!--#include viewer-snippet-chrome-overlays.html--> <!--#include viewer-snippet-chrome-overlays.html-->
<!--#endif--> <!--#endif-->
</div> <!-- dialogContainer --> </div>
<!-- dialogContainer -->
<div id="editorUndoBar" class="messageBar" role="status" aria-labelledby="editorUndoBarMessage" tabindex="-1" hidden> <div id="editorUndoBar" class="messageBar" role="status" aria-labelledby="editorUndoBarMessage" tabindex="-1" hidden>
<div> <div>
@ -841,9 +1201,10 @@ See https://github.com/adobe-type-tools/cmap-resources
<span data-l10n-id="pdfjs-editor-undo-bar-close-button-label"></span> <span data-l10n-id="pdfjs-editor-undo-bar-close-button-label"></span>
</button> </button>
</div> </div>
</div> <!-- editorUndoBar --> </div>
<!-- editorUndoBar -->
</div> <!-- outerContainer --> </div>
<!-- outerContainer -->
<div id="printContainer"></div> <div id="printContainer"></div>
</body> </body>
</html> </html>