diff --git a/examples/mobile-viewer/README.md b/examples/mobile-viewer/README.md new file mode 100644 index 000000000..767f915d4 --- /dev/null +++ b/examples/mobile-viewer/README.md @@ -0,0 +1,11 @@ +## Overview + +Example to demonstrate PDF.js library usage with a viewer optimized for mobile usage. + +## Getting started + +Build PDF.js using `gulp dist` and run `gulp server` to start a web server. +You can then work with the mobile viewer at +http://localhost:8888/examples/mobile-viewer/viewer.html. + +Refer to `viewer.js` for the source code of the mobile viewer. diff --git a/extensions/b2g/images/div_line_left.png b/examples/mobile-viewer/images/div_line_left.png similarity index 100% rename from extensions/b2g/images/div_line_left.png rename to examples/mobile-viewer/images/div_line_left.png diff --git a/extensions/b2g/images/div_line_left@1.5x.png b/examples/mobile-viewer/images/div_line_left@1.5x.png similarity index 100% rename from extensions/b2g/images/div_line_left@1.5x.png rename to examples/mobile-viewer/images/div_line_left@1.5x.png diff --git a/extensions/b2g/images/div_line_left@2x.png b/examples/mobile-viewer/images/div_line_left@2x.png similarity index 100% rename from extensions/b2g/images/div_line_left@2x.png rename to examples/mobile-viewer/images/div_line_left@2x.png diff --git a/extensions/b2g/images/div_line_right.png b/examples/mobile-viewer/images/div_line_right.png similarity index 100% rename from extensions/b2g/images/div_line_right.png rename to examples/mobile-viewer/images/div_line_right.png diff --git a/extensions/b2g/images/div_line_right@1.5x.png b/examples/mobile-viewer/images/div_line_right@1.5x.png similarity index 100% rename from extensions/b2g/images/div_line_right@1.5x.png rename to examples/mobile-viewer/images/div_line_right@1.5x.png diff --git a/extensions/b2g/images/div_line_right@2x.png b/examples/mobile-viewer/images/div_line_right@2x.png similarity index 100% rename from extensions/b2g/images/div_line_right@2x.png rename to examples/mobile-viewer/images/div_line_right@2x.png diff --git a/extensions/b2g/images/document_bg.png b/examples/mobile-viewer/images/document_bg.png similarity index 100% rename from extensions/b2g/images/document_bg.png rename to examples/mobile-viewer/images/document_bg.png diff --git a/extensions/b2g/images/icon_next_page.png b/examples/mobile-viewer/images/icon_next_page.png similarity index 100% rename from extensions/b2g/images/icon_next_page.png rename to examples/mobile-viewer/images/icon_next_page.png diff --git a/extensions/b2g/images/icon_next_page@1.5x.png b/examples/mobile-viewer/images/icon_next_page@1.5x.png similarity index 100% rename from extensions/b2g/images/icon_next_page@1.5x.png rename to examples/mobile-viewer/images/icon_next_page@1.5x.png diff --git a/extensions/b2g/images/icon_previous_page.png b/examples/mobile-viewer/images/icon_previous_page.png similarity index 100% rename from extensions/b2g/images/icon_previous_page.png rename to examples/mobile-viewer/images/icon_previous_page.png diff --git a/extensions/b2g/images/icon_previous_page@1.5x.png b/examples/mobile-viewer/images/icon_previous_page@1.5x.png similarity index 100% rename from extensions/b2g/images/icon_previous_page@1.5x.png rename to examples/mobile-viewer/images/icon_previous_page@1.5x.png diff --git a/extensions/b2g/images/icon_zoom_in.png b/examples/mobile-viewer/images/icon_zoom_in.png similarity index 100% rename from extensions/b2g/images/icon_zoom_in.png rename to examples/mobile-viewer/images/icon_zoom_in.png diff --git a/extensions/b2g/images/icon_zoom_in@1.5x.png b/examples/mobile-viewer/images/icon_zoom_in@1.5x.png similarity index 100% rename from extensions/b2g/images/icon_zoom_in@1.5x.png rename to examples/mobile-viewer/images/icon_zoom_in@1.5x.png diff --git a/extensions/b2g/images/icon_zoom_out.png b/examples/mobile-viewer/images/icon_zoom_out.png similarity index 100% rename from extensions/b2g/images/icon_zoom_out.png rename to examples/mobile-viewer/images/icon_zoom_out.png diff --git a/extensions/b2g/images/icon_zoom_out@1.5x.png b/examples/mobile-viewer/images/icon_zoom_out@1.5x.png similarity index 100% rename from extensions/b2g/images/icon_zoom_out@1.5x.png rename to examples/mobile-viewer/images/icon_zoom_out@1.5x.png diff --git a/extensions/b2g/images/spinner.png b/examples/mobile-viewer/images/spinner.png similarity index 100% rename from extensions/b2g/images/spinner.png rename to examples/mobile-viewer/images/spinner.png diff --git a/extensions/b2g/images/toolbar_background.png b/examples/mobile-viewer/images/toolbar_background.png similarity index 100% rename from extensions/b2g/images/toolbar_background.png rename to examples/mobile-viewer/images/toolbar_background.png diff --git a/extensions/b2g/viewer.css b/examples/mobile-viewer/viewer.css similarity index 93% rename from extensions/b2g/viewer.css rename to examples/mobile-viewer/viewer.css index 2d494e91f..bd0b7790c 100644 --- a/extensions/b2g/viewer.css +++ b/examples/mobile-viewer/viewer.css @@ -1,4 +1,4 @@ -/* Copyright 2012 Mozilla Foundation +/* Copyright 2016 Mozilla Foundation * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -25,6 +25,23 @@ html { font-size: 10px; } +header { + background-color: #f4f4f4; +} + +header h1 { + border-bottom: 1px solid #d8d8d8; + color: #858585; + font-size: 23px; + font-style: italic; + font-weight: normal; + overflow: hidden; + padding: 10px; + text-align: center; + text-overflow: ellipsis; + white-space: nowrap; +} + body { background: url(images/document_bg.png); color: #fff; @@ -57,7 +74,6 @@ footer { box-shadow: 0 -0.2rem 0.5rem rgba(50, 50, 50, 0.75); } - .toolbarButton { display: block; padding: 0; diff --git a/examples/mobile-viewer/viewer.html b/examples/mobile-viewer/viewer.html new file mode 100644 index 000000000..9c2eee125 --- /dev/null +++ b/examples/mobile-viewer/viewer.html @@ -0,0 +1,76 @@ + + + + + + + + PDF.js viewer + + + + + + + + + + + +
+

+
+ +
+
+
+ +
+
+
+
+ + + + + + diff --git a/extensions/b2g/viewer.js b/examples/mobile-viewer/viewer.js similarity index 86% rename from extensions/b2g/viewer.js rename to examples/mobile-viewer/viewer.js index 49a2007c7..2521ee6d3 100644 --- a/extensions/b2g/viewer.js +++ b/examples/mobile-viewer/viewer.js @@ -1,4 +1,4 @@ -/* Copyright 2014 Mozilla Foundation +/* Copyright 2016 Mozilla Foundation * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -17,13 +17,19 @@ 'use strict'; +if (!PDFJS.PDFViewer || !PDFJS.getDocument) { + alert('Please build the pdfjs-dist library using\n' + + ' `gulp dist`'); +} + PDFJS.useOnlyCssZoom = true; PDFJS.disableTextLayer = true; PDFJS.maxImageSize = 1024 * 1024; -PDFJS.workerSrc = '../pdfjs-components/build/pdf.worker.js'; -PDFJS.cMapUrl = '../pdfjs-components/cmaps/'; +PDFJS.workerSrc = '../../build/dist/build/pdf.worker.js'; +PDFJS.cMapUrl = '../../build/dist/cmaps/'; PDFJS.cMapPacked = true; +var DEFAULT_URL = '../../web/compressed.tracemonkey-pldi-09.pdf'; var DEFAULT_SCALE_DELTA = 1.1; var MIN_SCALE = 0.25; var MAX_SCALE = 10.0; @@ -36,9 +42,9 @@ var PDFViewerApplication = { pdfLinkService: null, open: function (params) { - var url = params.url, originalUrl = params.originalUrl; + var url = params.url; var self = this; - this.setTitleUsingUrl(originalUrl); + this.setTitleUsingUrl(url); // Loading document. var loadingTask = PDFJS.getDocument(url); @@ -134,7 +140,7 @@ var PDFViewerApplication = { setTitle: function pdfViewSetTitle(title) { document.title = title; - document.getElementById('activityTitle').textContent = title; + document.getElementById('title').textContent = title; }, error: function pdfViewError(message, moreInfo) { @@ -273,10 +279,11 @@ var PDFViewerApplication = { document.getElementById('pageNumber').addEventListener('change', function() { - // Handle the user inputting a floating point number. PDFViewerApplication.page = (this.value | 0); - if (this.value !== (this.value | 0).toString()) { + // Ensure that the page number input displays the correct value, even if the + // value entered by the user was invalid (e.g. a floating point number). + if (this.value !== PDFViewerApplication.page.toString()) { this.value = PDFViewerApplication.page; } }); @@ -310,38 +317,9 @@ document.addEventListener('DOMContentLoaded', function () { }); })(); -// Support of the new version of navigator.mozL10n -- in PDF.js older/custom -// version is used. -var mozL10n = { - get: function (id, args, fallback) { - var s = (navigator.mozL10n && navigator.mozL10n.get(id)) || fallback; - s = s.replace(/\{\{\s*(\w+)\s*\}\}/g, function (all, key) { - return args[key] || ''; - }); - return s; - }, - - translate: function (fragment) { - if (navigator.mozL10n) { - navigator.mozL10n.translateFragment(fragment); - } - } -}; - -window.navigator.mozSetMessageHandler('activity', function(activity) { - var blob = activity.source.data.blob; - var fileURL = activity.source.data.url || - activity.source.data.filename || - ' '; // if no url or filename, use a non-empty string - - var url = URL.createObjectURL(blob); - // We need to delay opening until all HTML is loaded. - PDFViewerApplication.animationStartedPromise.then(function () { - PDFViewerApplication.open({url: url, originalUrl: fileURL}); - - var header = document.getElementById('header'); - header.addEventListener('action', function() { - activity.postResult('close'); - }); +// We need to delay opening until all HTML is loaded. +PDFViewerApplication.animationStartedPromise.then(function () { + PDFViewerApplication.open({ + url: DEFAULT_URL }); }); diff --git a/extensions/b2g/viewer.html b/extensions/b2g/viewer.html deleted file mode 100644 index 7baa1f7f4..000000000 --- a/extensions/b2g/viewer.html +++ /dev/null @@ -1,88 +0,0 @@ - - - - - - - PDF.js viewer - - - - - - - - - - - - - - - - - - - - - - -
- -

-
- - -
- -
-
-
- -
-
-
-
- - - - diff --git a/make.js b/make.js index 1598f1f04..8af822155 100644 --- a/make.js +++ b/make.js @@ -40,7 +40,6 @@ var ROOT_DIR = __dirname + '/', // absolute path to project's root BUILD_TARGETS = [BUILD_TARGET, BUILD_WORKER_TARGET], FIREFOX_BUILD_DIR = BUILD_DIR + '/firefox/', CHROME_BUILD_DIR = BUILD_DIR + '/chromium/', - B2G_BUILD_DIR = BUILD_DIR + '/b2g/', JSDOC_DIR = BUILD_DIR + 'jsdoc', EXTENSION_SRC_DIR = 'extensions/', FIREFOX_CONTENT_DIR = EXTENSION_SRC_DIR + '/firefox/content/', @@ -226,7 +225,6 @@ target.jsdoc = function() { target.web = function() { target.generic(); target.extension(); - target.b2g(); target.jsdoc(); echo(); @@ -241,7 +239,6 @@ target.web = function() { mkdir('-p', GH_PAGES_DIR + BUILD_DIR); mkdir('-p', GH_PAGES_DIR + EXTENSION_SRC_DIR + '/firefox'); mkdir('-p', GH_PAGES_DIR + EXTENSION_SRC_DIR + '/chromium'); - mkdir('-p', GH_PAGES_DIR + EXTENSION_SRC_DIR + '/b2g'); mkdir('-p', GH_PAGES_DIR + '/api/draft/'); mkdir('-p', GH_PAGES_DIR + '/examples/'); @@ -252,7 +249,6 @@ target.web = function() { GH_PAGES_DIR + EXTENSION_SRC_DIR + 'chromium/'); cp('-R', 'test/features', GH_PAGES_DIR); cp('-R', 'examples/learning', GH_PAGES_DIR + '/examples/'); - cp('-R', B2G_BUILD_DIR, GH_PAGES_DIR + EXTENSION_SRC_DIR + 'b2g/'); cp('-R', JSDOC_DIR + '/*', GH_PAGES_DIR + '/api/draft/'); var wintersmith = require('wintersmith'); @@ -881,51 +877,6 @@ target.mozcentral = function() { MOZCENTRAL_CONTENT_DIR + 'PdfjsChromeUtils.jsm'); }; -target.b2g = function() { - target.generic(); - target.components(); - - echo(); - echo('### Building B2G (Firefox OS App)'); - var B2G_BUILD_CONTENT_DIR = B2G_BUILD_DIR + '/content/'; - - // Clear out everything in the b2g build directory - cd(ROOT_DIR); - rm('-Rf', B2G_BUILD_DIR); - mkdir('-p', B2G_BUILD_CONTENT_DIR); - mkdir('-p', B2G_BUILD_CONTENT_DIR + '/web'); - // Simulating pdfjs-dist structure in the pdfjs-components folder. - mkdir('-p', B2G_BUILD_CONTENT_DIR + '/pdfjs-components/web'); - mkdir('-p', B2G_BUILD_CONTENT_DIR + '/pdfjs-components/build'); - mkdir('-p', B2G_BUILD_CONTENT_DIR + '/pdfjs-components/cmaps'); - - var setup = { - defines: DEFINES, - copy: [ - ['extensions/b2g/images', B2G_BUILD_CONTENT_DIR + '/web'], - ['extensions/b2g/viewer.html', B2G_BUILD_CONTENT_DIR + '/web'], - ['extensions/b2g/viewer.css', B2G_BUILD_CONTENT_DIR + '/web'], - ['extensions/b2g/viewer.js', B2G_BUILD_CONTENT_DIR + '/web'], - ['web/locale', B2G_BUILD_CONTENT_DIR + '/web'], - ['build/generic/build/pdf.js', - B2G_BUILD_CONTENT_DIR + '/pdfjs-components/build'], - ['build/generic/build/pdf.worker.js', - B2G_BUILD_CONTENT_DIR + '/pdfjs-components/build'], - ['build/components/pdf_viewer.js', - B2G_BUILD_CONTENT_DIR + '/pdfjs-components/web'], - ['build/components/pdf_viewer.css', - B2G_BUILD_CONTENT_DIR + '/pdfjs-components/web'], - ['build/components/images', - B2G_BUILD_CONTENT_DIR + '/pdfjs-components/web'], - ['external/bcmaps/*', B2G_BUILD_CONTENT_DIR + '/pdfjs-components/cmaps'] - ], - preprocess: [] - }; - builder.build(setup); - - cleanupJSSource(B2G_BUILD_CONTENT_DIR + '/web/viewer.js'); -}; - // // make chrome //