Convert the thumbnail viewer to ES6 syntax

This commit is contained in:
Tim van der Meij 2017-06-04 19:26:57 +02:00
parent 63b89c1100
commit a682d77e71
No known key found for this signature in database
GPG Key ID: 8C3FD2925A5F2762

View File

@ -18,7 +18,7 @@ import {
} from './ui_utils'; } from './ui_utils';
import { PDFThumbnailView } from './pdf_thumbnail_view'; import { PDFThumbnailView } from './pdf_thumbnail_view';
var THUMBNAIL_SCROLL_MARGIN = -19; const THUMBNAIL_SCROLL_MARGIN = -19;
/** /**
* @typedef {Object} PDFThumbnailViewerOptions * @typedef {Object} PDFThumbnailViewerOptions
@ -30,201 +30,193 @@ var THUMBNAIL_SCROLL_MARGIN = -19;
*/ */
/** /**
* Simple viewer control to display thumbnails for pages. * Viewer control to display thumbnails for pages in a PDF document.
* @class *
* @implements {IRenderableView} * @implements {IRenderableView}
*/ */
var PDFThumbnailViewer = (function PDFThumbnailViewerClosure() { class PDFThumbnailViewer {
/** /**
* @constructs PDFThumbnailViewer
* @param {PDFThumbnailViewerOptions} options * @param {PDFThumbnailViewerOptions} options
*/ */
function PDFThumbnailViewer(options) { constructor({ container, linkService, renderingQueue, l10n = NullL10n, }) {
this.container = options.container; this.container = container;
this.renderingQueue = options.renderingQueue; this.linkService = linkService;
this.linkService = options.linkService; this.renderingQueue = renderingQueue;
this.l10n = options.l10n || NullL10n; this.l10n = l10n;
this.scroll = watchScroll(this.container, this._scrollUpdated.bind(this)); this.scroll = watchScroll(this.container, this._scrollUpdated.bind(this));
this._resetView(); this._resetView();
} }
PDFThumbnailViewer.prototype = { /**
/** * @private
* @private */
*/ _scrollUpdated() {
_scrollUpdated: function PDFThumbnailViewer_scrollUpdated() { this.renderingQueue.renderHighestPriority();
this.renderingQueue.renderHighestPriority(); }
},
getThumbnail: function PDFThumbnailViewer_getThumbnail(index) { getThumbnail(index) {
return this.thumbnails[index]; return this._thumbnails[index];
}, }
/** /**
* @private * @private
*/ */
_getVisibleThumbs: function PDFThumbnailViewer_getVisibleThumbs() { _getVisibleThumbs() {
return getVisibleElements(this.container, this.thumbnails); return getVisibleElements(this.container, this._thumbnails);
}, }
scrollThumbnailIntoView: scrollThumbnailIntoView(page) {
function PDFThumbnailViewer_scrollThumbnailIntoView(page) { let selected = document.querySelector('.thumbnail.selected');
var selected = document.querySelector('.thumbnail.selected'); if (selected) {
if (selected) { selected.classList.remove('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. get pagesRotation() {
if (numVisibleThumbs > 0) { return this._pagesRotation;
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() { set pagesRotation(rotation) {
return this._pagesRotation; this._pagesRotation = rotation;
}, for (let i = 0, l = this._thumbnails.length; i < l; i++) {
this._thumbnails[i].update(rotation);
}
}
set pagesRotation(rotation) { cleanup() {
this._pagesRotation = rotation; PDFThumbnailView.cleanup();
for (var i = 0, l = this.thumbnails.length; i < l; i++) { }
var thumb = this.thumbnails[i];
thumb.update(rotation);
}
},
cleanup: function PDFThumbnailViewer_cleanup() { /**
PDFThumbnailView.cleanup(); * @private
}, */
_resetView() {
this._thumbnails = [];
this._pageLabels = null;
this._pagesRotation = 0;
this._pagesRequests = [];
/** // Remove the thumbnails from the DOM.
* @private this.container.textContent = '';
*/ }
_resetView: function PDFThumbnailViewer_resetView() {
this.thumbnails = [];
this._pageLabels = null;
this._pagesRotation = 0;
this._pagesRequests = [];
// Remove the thumbnails from the DOM. setDocument(pdfDocument) {
this.container.textContent = ''; if (this.pdfDocument) {
}, this._cancelRendering();
this._resetView();
}
setDocument: function PDFThumbnailViewer_setDocument(pdfDocument) { this.pdfDocument = pdfDocument;
if (this.pdfDocument) { if (!pdfDocument) {
this._cancelRendering(); return Promise.resolve();
this._resetView(); }
}
this.pdfDocument = pdfDocument; return pdfDocument.getPage(1).then((firstPage) => {
if (!pdfDocument) { let pagesCount = pdfDocument.numPages;
return Promise.resolve(); let viewport = firstPage.getViewport(1.0);
} for (let pageNum = 1; pageNum <= pagesCount; ++pageNum) {
let thumbnail = new PDFThumbnailView({
return pdfDocument.getPage(1).then((firstPage) => { container: this.container,
var pagesCount = pdfDocument.numPages; id: pageNum,
var viewport = firstPage.getViewport(1.0); defaultViewport: viewport.clone(),
for (let pageNum = 1; pageNum <= pagesCount; ++pageNum) { linkService: this.linkService,
var thumbnail = new PDFThumbnailView({ renderingQueue: this.renderingQueue,
container: this.container, disableCanvasToImageConversion: false,
id: pageNum, l10n: this.l10n,
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 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 { export {
PDFThumbnailViewer, PDFThumbnailViewer,