diff --git a/web/pdf_thumbnail_viewer.js b/web/pdf_thumbnail_viewer.js index 1185371bf..5c2796b58 100644 --- a/web/pdf_thumbnail_viewer.js +++ b/web/pdf_thumbnail_viewer.js @@ -18,7 +18,7 @@ import { } from './ui_utils'; import { PDFThumbnailView } from './pdf_thumbnail_view'; -var THUMBNAIL_SCROLL_MARGIN = -19; +const THUMBNAIL_SCROLL_MARGIN = -19; /** * @typedef {Object} PDFThumbnailViewerOptions @@ -30,201 +30,193 @@ var THUMBNAIL_SCROLL_MARGIN = -19; */ /** - * Simple viewer control to display thumbnails for pages. - * @class + * Viewer control to display thumbnails for pages in a PDF document. + * * @implements {IRenderableView} */ -var PDFThumbnailViewer = (function PDFThumbnailViewerClosure() { +class PDFThumbnailViewer { /** - * @constructs PDFThumbnailViewer * @param {PDFThumbnailViewerOptions} options */ - function PDFThumbnailViewer(options) { - this.container = options.container; - this.renderingQueue = options.renderingQueue; - this.linkService = options.linkService; - this.l10n = options.l10n || NullL10n; + constructor({ container, linkService, renderingQueue, l10n = NullL10n, }) { + this.container = container; + this.linkService = linkService; + this.renderingQueue = renderingQueue; + this.l10n = l10n; this.scroll = watchScroll(this.container, this._scrollUpdated.bind(this)); this._resetView(); } - PDFThumbnailViewer.prototype = { - /** - * @private - */ - _scrollUpdated: function PDFThumbnailViewer_scrollUpdated() { - this.renderingQueue.renderHighestPriority(); - }, + /** + * @private + */ + _scrollUpdated() { + this.renderingQueue.renderHighestPriority(); + } - getThumbnail: function PDFThumbnailViewer_getThumbnail(index) { - return this.thumbnails[index]; - }, + getThumbnail(index) { + return this._thumbnails[index]; + } - /** - * @private - */ - _getVisibleThumbs: function PDFThumbnailViewer_getVisibleThumbs() { - return getVisibleElements(this.container, this.thumbnails); - }, + /** + * @private + */ + _getVisibleThumbs() { + return getVisibleElements(this.container, this._thumbnails); + } - scrollThumbnailIntoView: - function PDFThumbnailViewer_scrollThumbnailIntoView(page) { - var selected = document.querySelector('.thumbnail.selected'); - if (selected) { - selected.classList.remove('selected'); + scrollThumbnailIntoView(page) { + let selected = document.querySelector('.thumbnail.selected'); + if (selected) { + selected.classList.remove('selected'); + } + let thumbnail = document.querySelector( + 'div.thumbnail[data-page-number="' + page + '"]'); + if (thumbnail) { + thumbnail.classList.add('selected'); + } + let visibleThumbs = this._getVisibleThumbs(); + let numVisibleThumbs = visibleThumbs.views.length; + + // If the thumbnail isn't currently visible, scroll it into view. + if (numVisibleThumbs > 0) { + let first = visibleThumbs.first.id; + // Account for only one thumbnail being visible. + let last = (numVisibleThumbs > 1 ? visibleThumbs.last.id : first); + if (page <= first || page >= last) { + scrollIntoView(thumbnail, { top: THUMBNAIL_SCROLL_MARGIN, }); } - var thumbnail = document.querySelector( - 'div.thumbnail[data-page-number="' + page + '"]'); - if (thumbnail) { - thumbnail.classList.add('selected'); - } - var visibleThumbs = this._getVisibleThumbs(); - var numVisibleThumbs = visibleThumbs.views.length; + } + } - // If the thumbnail isn't currently visible, scroll it into view. - if (numVisibleThumbs > 0) { - var first = visibleThumbs.first.id; - // Account for only one thumbnail being visible. - var last = (numVisibleThumbs > 1 ? visibleThumbs.last.id : first); - if (page <= first || page >= last) { - scrollIntoView(thumbnail, { top: THUMBNAIL_SCROLL_MARGIN, }); - } - } - }, + get pagesRotation() { + return this._pagesRotation; + } - get pagesRotation() { - return this._pagesRotation; - }, + set pagesRotation(rotation) { + this._pagesRotation = rotation; + for (let i = 0, l = this._thumbnails.length; i < l; i++) { + this._thumbnails[i].update(rotation); + } + } - set pagesRotation(rotation) { - this._pagesRotation = rotation; - for (var i = 0, l = this.thumbnails.length; i < l; i++) { - var thumb = this.thumbnails[i]; - thumb.update(rotation); - } - }, + cleanup() { + PDFThumbnailView.cleanup(); + } - cleanup: function PDFThumbnailViewer_cleanup() { - PDFThumbnailView.cleanup(); - }, + /** + * @private + */ + _resetView() { + this._thumbnails = []; + this._pageLabels = null; + this._pagesRotation = 0; + this._pagesRequests = []; - /** - * @private - */ - _resetView: function PDFThumbnailViewer_resetView() { - this.thumbnails = []; - this._pageLabels = null; - this._pagesRotation = 0; - this._pagesRequests = []; + // Remove the thumbnails from the DOM. + this.container.textContent = ''; + } - // Remove the thumbnails from the DOM. - this.container.textContent = ''; - }, + setDocument(pdfDocument) { + if (this.pdfDocument) { + this._cancelRendering(); + this._resetView(); + } - setDocument: function PDFThumbnailViewer_setDocument(pdfDocument) { - if (this.pdfDocument) { - this._cancelRendering(); - this._resetView(); - } + this.pdfDocument = pdfDocument; + if (!pdfDocument) { + return Promise.resolve(); + } - this.pdfDocument = pdfDocument; - if (!pdfDocument) { - return Promise.resolve(); - } - - return pdfDocument.getPage(1).then((firstPage) => { - var pagesCount = pdfDocument.numPages; - var viewport = firstPage.getViewport(1.0); - for (let pageNum = 1; pageNum <= pagesCount; ++pageNum) { - var thumbnail = new PDFThumbnailView({ - container: this.container, - id: pageNum, - defaultViewport: viewport.clone(), - linkService: this.linkService, - renderingQueue: this.renderingQueue, - disableCanvasToImageConversion: false, - l10n: this.l10n, - }); - this.thumbnails.push(thumbnail); - } - }); - }, - - /** - * @private - */ - _cancelRendering: function PDFThumbnailViewer_cancelRendering() { - for (var i = 0, ii = this.thumbnails.length; i < ii; i++) { - if (this.thumbnails[i]) { - this.thumbnails[i].cancelRendering(); - } - } - }, - - /** - * @param {Array|null} labels - */ - setPageLabels: function PDFThumbnailViewer_setPageLabels(labels) { - if (!this.pdfDocument) { - return; - } - if (!labels) { - this._pageLabels = null; - } else if (!(labels instanceof Array && - this.pdfDocument.numPages === labels.length)) { - this._pageLabels = null; - console.error('PDFThumbnailViewer_setPageLabels: Invalid page labels.'); - } else { - this._pageLabels = labels; - } - // Update all the `PDFThumbnailView` instances. - for (var i = 0, ii = this.thumbnails.length; i < ii; i++) { - var thumbnailView = this.thumbnails[i]; - var label = this._pageLabels && this._pageLabels[i]; - thumbnailView.setPageLabel(label); - } - }, - - /** - * @param {PDFThumbnailView} thumbView - * @returns {PDFPage} - * @private - */ - _ensurePdfPageLoaded(thumbView) { - if (thumbView.pdfPage) { - return Promise.resolve(thumbView.pdfPage); - } - var pageNumber = thumbView.id; - if (this._pagesRequests[pageNumber]) { - return this._pagesRequests[pageNumber]; - } - var promise = this.pdfDocument.getPage(pageNumber).then((pdfPage) => { - thumbView.setPdfPage(pdfPage); - this._pagesRequests[pageNumber] = null; - return pdfPage; - }); - this._pagesRequests[pageNumber] = promise; - return promise; - }, - - forceRendering() { - var visibleThumbs = this._getVisibleThumbs(); - var thumbView = this.renderingQueue.getHighestPriority(visibleThumbs, - this.thumbnails, - this.scroll.down); - if (thumbView) { - this._ensurePdfPageLoaded(thumbView).then(() => { - this.renderingQueue.renderView(thumbView); + return pdfDocument.getPage(1).then((firstPage) => { + let pagesCount = pdfDocument.numPages; + let viewport = firstPage.getViewport(1.0); + for (let pageNum = 1; pageNum <= pagesCount; ++pageNum) { + let thumbnail = new PDFThumbnailView({ + container: this.container, + id: pageNum, + defaultViewport: viewport.clone(), + linkService: this.linkService, + renderingQueue: this.renderingQueue, + disableCanvasToImageConversion: false, + l10n: this.l10n, }); - return true; + this._thumbnails.push(thumbnail); } - return false; - }, - }; + }); + } - return PDFThumbnailViewer; -})(); + /** + * @private + */ + _cancelRendering() { + for (let i = 0, ii = this._thumbnails.length; i < ii; i++) { + if (this._thumbnails[i]) { + this._thumbnails[i].cancelRendering(); + } + } + } + + /** + * @param {Array|null} labels + */ + setPageLabels(labels) { + if (!this.pdfDocument) { + return; + } + if (!labels) { + this._pageLabels = null; + } else if (!(labels instanceof Array && + this.pdfDocument.numPages === labels.length)) { + this._pageLabels = null; + console.error('PDFThumbnailViewer_setPageLabels: Invalid page labels.'); + } else { + this._pageLabels = labels; + } + // Update all the `PDFThumbnailView` instances. + for (let i = 0, ii = this._thumbnails.length; i < ii; i++) { + let label = this._pageLabels && this._pageLabels[i]; + this._thumbnails[i].setPageLabel(label); + } + } + + /** + * @param {PDFThumbnailView} thumbView + * @returns {PDFPage} + * @private + */ + _ensurePdfPageLoaded(thumbView) { + if (thumbView.pdfPage) { + return Promise.resolve(thumbView.pdfPage); + } + let pageNumber = thumbView.id; + if (this._pagesRequests[pageNumber]) { + return this._pagesRequests[pageNumber]; + } + let promise = this.pdfDocument.getPage(pageNumber).then((pdfPage) => { + thumbView.setPdfPage(pdfPage); + this._pagesRequests[pageNumber] = null; + return pdfPage; + }); + this._pagesRequests[pageNumber] = promise; + return promise; + } + + forceRendering() { + let visibleThumbs = this._getVisibleThumbs(); + let thumbView = this.renderingQueue.getHighestPriority(visibleThumbs, + this._thumbnails, + this.scroll.down); + if (thumbView) { + this._ensurePdfPageLoaded(thumbView).then(() => { + this.renderingQueue.renderView(thumbView); + }); + return true; + } + return false; + } +} export { PDFThumbnailViewer,