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

Merge pull request #8482 from timvandermeij/es6-thumbnails

Browse Source 
Convert the thumbnail view/viewer to ES6 syntax
This commit is contained in:
Tim van der Meij 2017-06-04 21:38:15 +02:00 committed by GitHub
commit 8654635b0b
2 changed files with 419 additions and 443 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

528
web/pdf_thumbnail_view.js
View File

@ -19,8 +19,9 @@ import {
import { getOutputScale, NullL10n } from './ui_utils'; import { getOutputScale, NullL10n } from './ui_utils';
import { RenderingStates } from './pdf_rendering_queue'; import { RenderingStates } from './pdf_rendering_queue';
var THUMBNAIL_WIDTH = 98; // px const MAX_NUM_SCALING_STEPS = 3;
var THUMBNAIL_CANVAS_BORDER_WIDTH = 1; // px const THUMBNAIL_CANVAS_BORDER_WIDTH = 1; // px
const THUMBNAIL_WIDTH = 98; // px
/** /**
* @typedef {Object} PDFThumbnailViewOptions * @typedef {Object} PDFThumbnailViewOptions
@ -31,7 +32,7 @@ var THUMBNAIL_CANVAS_BORDER_WIDTH = 1; // px
* @property {PDFRenderingQueue} renderingQueue - The rendering queue object. * @property {PDFRenderingQueue} renderingQueue - The rendering queue object.
* @property {boolean} disableCanvasToImageConversion - (optional) Don't convert * @property {boolean} disableCanvasToImageConversion - (optional) Don't convert
* the canvas thumbnails to images. This prevents `toDataURL` calls, * the canvas thumbnails to images. This prevents `toDataURL` calls,
* but increases the overall memory usage. The default value is false. * but increases the overall memory usage. The default value is `false`.
* @property {IL10n} l10n - Localization service. * @property {IL10n} l10n - Localization service.
*/ */
@ -77,23 +78,14 @@ const TempImageFactory = (function TempImageFactoryClosure() {
})(); })();
/** /**
* @class
* @implements {IRenderableView} * @implements {IRenderableView}
*/ */
var PDFThumbnailView = (function PDFThumbnailViewClosure() { class PDFThumbnailView {
/** /**
* @constructs PDFThumbnailView
* @param {PDFThumbnailViewOptions} options * @param {PDFThumbnailViewOptions} options
*/ */
function PDFThumbnailView(options) { constructor({ container, id, defaultViewport, linkService, renderingQueue,
var container = options.container; disableCanvasToImageConversion = false, l10n = NullL10n, }) {
var id = options.id;
var defaultViewport = options.defaultViewport;
var linkService = options.linkService;
var renderingQueue = options.renderingQueue;
var disableCanvasToImageConversion =
options.disableCanvasToImageConversion || false;
this.id = id; this.id = id;
this.renderingId = 'thumbnail' + id; this.renderingId = 'thumbnail' + id;
this.pageLabel = null; this.pageLabel = null;
@ -119,21 +111,21 @@ var PDFThumbnailView = (function PDFThumbnailViewClosure() {
this.canvasHeight = (this.canvasWidth / this.pageRatio) | 0; this.canvasHeight = (this.canvasWidth / this.pageRatio) | 0;
this.scale = this.canvasWidth / this.pageWidth; this.scale = this.canvasWidth / this.pageWidth;
this.l10n = options.l10n || NullL10n; this.l10n = l10n;
var anchor = document.createElement('a'); let anchor = document.createElement('a');
anchor.href = linkService.getAnchorUrl('#page=' + id); anchor.href = linkService.getAnchorUrl('#page=' + id);
this.l10n.get('thumb_page_title', { page: id, }, 'Page {{page}}'). this.l10n.get('thumb_page_title', { page: id, }, 'Page {{page}}').
then((msg) => { then((msg) => {
anchor.title = msg; anchor.title = msg;
}); });
anchor.onclick = function stopNavigation() { anchor.onclick = function() {
linkService.page = id; linkService.page = id;
return false; return false;
}; };
this.anchor = anchor; this.anchor = anchor;
var div = document.createElement('div'); let div = document.createElement('div');
div.className = 'thumbnail'; div.className = 'thumbnail';
div.setAttribute('data-page-number', this.id); div.setAttribute('data-page-number', this.id);
this.div = div; this.div = div;
@ -144,9 +136,9 @@ var PDFThumbnailView = (function PDFThumbnailViewClosure() {
div.classList.add('selected'); div.classList.add('selected');
} }
var ring = document.createElement('div'); let ring = document.createElement('div');
ring.className = 'thumbnailSelectionRing'; ring.className = 'thumbnailSelectionRing';
var borderAdjustment = 2 * THUMBNAIL_CANVAS_BORDER_WIDTH; let borderAdjustment = 2 * THUMBNAIL_CANVAS_BORDER_WIDTH;
ring.style.width = this.canvasWidth + borderAdjustment + 'px'; ring.style.width = this.canvasWidth + borderAdjustment + 'px';
ring.style.height = this.canvasHeight + borderAdjustment + 'px'; ring.style.height = this.canvasHeight + borderAdjustment + 'px';
this.ring = ring; this.ring = ring;
@ -156,296 +148,288 @@ var PDFThumbnailView = (function PDFThumbnailViewClosure() {
container.appendChild(anchor); container.appendChild(anchor);
} }
PDFThumbnailView.prototype = { setPdfPage(pdfPage) {
setPdfPage: function PDFThumbnailView_setPdfPage(pdfPage) { this.pdfPage = pdfPage;
this.pdfPage = pdfPage; this.pdfPageRotate = pdfPage.rotate;
this.pdfPageRotate = pdfPage.rotate; let totalRotation = (this.rotation + this.pdfPageRotate) % 360;
var totalRotation = (this.rotation + this.pdfPageRotate) % 360; this.viewport = pdfPage.getViewport(1, totalRotation);
this.viewport = pdfPage.getViewport(1, totalRotation); this.reset();
this.reset(); }
},
reset: function PDFThumbnailView_reset() { reset() {
this.cancelRendering(); this.cancelRendering();
this.pageWidth = this.viewport.width; this.pageWidth = this.viewport.width;
this.pageHeight = this.viewport.height; this.pageHeight = this.viewport.height;
this.pageRatio = this.pageWidth / this.pageHeight; this.pageRatio = this.pageWidth / this.pageHeight;
this.canvasHeight = (this.canvasWidth / this.pageRatio) | 0; this.canvasHeight = (this.canvasWidth / this.pageRatio) | 0;
this.scale = (this.canvasWidth / this.pageWidth); this.scale = (this.canvasWidth / this.pageWidth);
this.div.removeAttribute('data-loaded'); this.div.removeAttribute('data-loaded');
var ring = this.ring; let ring = this.ring;
var childNodes = ring.childNodes; let childNodes = ring.childNodes;
for (var i = childNodes.length - 1; i >= 0; i--) { for (let i = childNodes.length - 1; i >= 0; i--) {
ring.removeChild(childNodes[i]); ring.removeChild(childNodes[i]);
} }
var borderAdjustment = 2 * THUMBNAIL_CANVAS_BORDER_WIDTH; let borderAdjustment = 2 * THUMBNAIL_CANVAS_BORDER_WIDTH;
ring.style.width = this.canvasWidth + borderAdjustment + 'px'; ring.style.width = this.canvasWidth + borderAdjustment + 'px';
ring.style.height = this.canvasHeight + borderAdjustment + 'px'; ring.style.height = this.canvasHeight + borderAdjustment + 'px';
if (this.canvas) {
// Zeroing the width and height causes Firefox to release graphics
// resources immediately, which can greatly reduce memory consumption.
this.canvas.width = 0;
this.canvas.height = 0;
delete this.canvas;
}
if (this.image) {
this.image.removeAttribute('src');
delete this.image;
}
},
update: function PDFThumbnailView_update(rotation) {
if (typeof rotation !== 'undefined') {
this.rotation = rotation;
}
var totalRotation = (this.rotation + this.pdfPageRotate) % 360;
this.viewport = this.viewport.clone({
scale: 1,
rotation: totalRotation,
});
this.reset();
},
cancelRendering: function PDFThumbnailView_cancelRendering() {
if (this.renderTask) {
this.renderTask.cancel();
this.renderTask = null;
}
this.renderingState = RenderingStates.INITIAL;
this.resume = null;
},
/**
* @private
*/
_getPageDrawContext:
function PDFThumbnailView_getPageDrawContext(noCtxScale) {
var canvas = document.createElement('canvas');
// Keep the no-thumbnail outline visible, i.e. `data-loaded === false`,
// until rendering/image conversion is complete, to avoid display issues.
this.canvas = canvas;
if (typeof PDFJSDev === 'undefined' ||
PDFJSDev.test('MOZCENTRAL || FIREFOX || GENERIC')) {
canvas.mozOpaque = true;
}
var ctx = canvas.getContext('2d', { alpha: false, });
var outputScale = getOutputScale(ctx);
canvas.width = (this.canvasWidth * outputScale.sx) | 0;
canvas.height = (this.canvasHeight * outputScale.sy) | 0;
canvas.style.width = this.canvasWidth + 'px';
canvas.style.height = this.canvasHeight + 'px';
if (!noCtxScale && outputScale.scaled) {
ctx.scale(outputScale.sx, outputScale.sy);
}
return ctx;
},
/**
* @private
*/
_convertCanvasToImage: function PDFThumbnailView_convertCanvasToImage() {
if (!this.canvas) {
return;
}
if (this.renderingState !== RenderingStates.FINISHED) {
return;
}
var id = this.renderingId;
var className = 'thumbnailImage';
if (this.disableCanvasToImageConversion) {
this.canvas.id = id;
this.canvas.className = className;
this.l10n.get('thumb_page_canvas', { page: this.pageId, },
'Thumbnail of Page {{page}}').then((msg) => {
this.canvas.setAttribute('aria-label', msg);
});
this.div.setAttribute('data-loaded', true);
this.ring.appendChild(this.canvas);
return;
}
var image = document.createElement('img');
image.id = id;
image.className = className;
this.l10n.get('thumb_page_canvas', { page: this.pageId, },
'Thumbnail of Page {{page}}').
then((msg) => {
image.setAttribute('aria-label', msg);
});
image.style.width = this.canvasWidth + 'px';
image.style.height = this.canvasHeight + 'px';
image.src = this.canvas.toDataURL();
this.image = image;
this.div.setAttribute('data-loaded', true);
this.ring.appendChild(image);
if (this.canvas) {
// Zeroing the width and height causes Firefox to release graphics // Zeroing the width and height causes Firefox to release graphics
// resources immediately, which can greatly reduce memory consumption. // resources immediately, which can greatly reduce memory consumption.
this.canvas.width = 0; this.canvas.width = 0;
this.canvas.height = 0; this.canvas.height = 0;
delete this.canvas; delete this.canvas;
}, }
if (this.image) {
this.image.removeAttribute('src');
delete this.image;
}
}
draw() { update(rotation) {
if (this.renderingState !== RenderingStates.INITIAL) { if (typeof rotation !== 'undefined') {
console.error('Must be in new state before drawing'); this.rotation = rotation;
return Promise.resolve(undefined); }
} let totalRotation = (this.rotation + this.pdfPageRotate) % 360;
this.viewport = this.viewport.clone({
scale: 1,
rotation: totalRotation,
});
this.reset();
}
this.renderingState = RenderingStates.RUNNING; cancelRendering() {
if (this.renderTask) {
this.renderTask.cancel();
this.renderTask = null;
}
this.renderingState = RenderingStates.INITIAL;
this.resume = null;
}
let renderCapability = createPromiseCapability(); /**
* @private
*/
_getPageDrawContext(noCtxScale = false) {
let canvas = document.createElement('canvas');
// Keep the no-thumbnail outline visible, i.e. `data-loaded === false`,
// until rendering/image conversion is complete, to avoid display issues.
this.canvas = canvas;
let finishRenderTask = (error) => { if (typeof PDFJSDev === 'undefined' ||
// The renderTask may have been replaced by a new one, so only remove PDFJSDev.test('MOZCENTRAL || FIREFOX || GENERIC')) {
// the reference to the renderTask if it matches the one that is canvas.mozOpaque = true;
// triggering this callback. }
if (renderTask === this.renderTask) { let ctx = canvas.getContext('2d', { alpha: false, });
this.renderTask = null; let outputScale = getOutputScale(ctx);
}
if (((typeof PDFJSDev === 'undefined' || canvas.width = (this.canvasWidth * outputScale.sx) | 0;
!PDFJSDev.test('PDFJS_NEXT')) && error === 'cancelled') || canvas.height = (this.canvasHeight * outputScale.sy) | 0;
error instanceof RenderingCancelledException) { canvas.style.width = this.canvasWidth + 'px';
renderCapability.resolve(undefined); canvas.style.height = this.canvasHeight + 'px';
return;
}
this.renderingState = RenderingStates.FINISHED; if (!noCtxScale && outputScale.scaled) {
this._convertCanvasToImage(); ctx.scale(outputScale.sx, outputScale.sy);
}
return ctx;
}
if (!error) { /**
renderCapability.resolve(undefined); * @private
} else { */
renderCapability.reject(error); _convertCanvasToImage() {
} if (!this.canvas) {
}; return;
}
if (this.renderingState !== RenderingStates.FINISHED) {
return;
}
let id = this.renderingId;
let className = 'thumbnailImage';
let ctx = this._getPageDrawContext(); if (this.disableCanvasToImageConversion) {
let drawViewport = this.viewport.clone({ scale: this.scale, }); this.canvas.id = id;
let renderContinueCallback = (cont) => { this.canvas.className = className;
if (!this.renderingQueue.isHighestPriority(this)) { this.l10n.get('thumb_page_canvas', { page: this.pageId, },
this.renderingState = RenderingStates.PAUSED; 'Thumbnail of Page {{page}}').then((msg) => {
this.resume = () => { this.canvas.setAttribute('aria-label', msg);
this.renderingState = RenderingStates.RUNNING;
cont();
};
return;
}
cont();
};
let renderContext = {
canvasContext: ctx,
viewport: drawViewport,
};
let renderTask = this.renderTask = this.pdfPage.render(renderContext);
renderTask.onContinue = renderContinueCallback;
renderTask.promise.then(function() {
finishRenderTask(null);
}, function(error) {
finishRenderTask(error);
}); });
return renderCapability.promise;
},
setImage: function PDFThumbnailView_setImage(pageView) { this.div.setAttribute('data-loaded', true);
if (this.renderingState !== RenderingStates.INITIAL) { this.ring.appendChild(this.canvas);
return; return;
}
let image = document.createElement('img');
image.id = id;
image.className = className;
this.l10n.get('thumb_page_canvas', { page: this.pageId, },
'Thumbnail of Page {{page}}').
then((msg) => {
image.setAttribute('aria-label', msg);
});
image.style.width = this.canvasWidth + 'px';
image.style.height = this.canvasHeight + 'px';
image.src = this.canvas.toDataURL();
this.image = image;
this.div.setAttribute('data-loaded', true);
this.ring.appendChild(image);
// Zeroing the width and height causes Firefox to release graphics
// resources immediately, which can greatly reduce memory consumption.
this.canvas.width = 0;
this.canvas.height = 0;
delete this.canvas;
}
draw() {
if (this.renderingState !== RenderingStates.INITIAL) {
console.error('Must be in new state before drawing');
return Promise.resolve(undefined);
}
this.renderingState = RenderingStates.RUNNING;
let renderCapability = createPromiseCapability();
let finishRenderTask = (error) => {
// The renderTask may have been replaced by a new one, so only remove
// the reference to the renderTask if it matches the one that is
// triggering this callback.
if (renderTask === this.renderTask) {
this.renderTask = null;
} }
var img = pageView.canvas;
if (!img) { if (((typeof PDFJSDev === 'undefined' ||
!PDFJSDev.test('PDFJS_NEXT')) && error === 'cancelled') ||
error instanceof RenderingCancelledException) {
renderCapability.resolve(undefined);
return; return;
} }
if (!this.pdfPage) {
this.setPdfPage(pageView.pdfPage);
}
this.renderingState = RenderingStates.FINISHED; this.renderingState = RenderingStates.FINISHED;
this._convertCanvasToImage();
var ctx = this._getPageDrawContext(true); if (!error) {
var canvas = ctx.canvas; renderCapability.resolve(undefined);
} else {
renderCapability.reject(error);
}
};
if (img.width <= 2 * canvas.width) { let ctx = this._getPageDrawContext();
ctx.drawImage(img, 0, 0, img.width, img.height, let drawViewport = this.viewport.clone({ scale: this.scale, });
0, 0, canvas.width, canvas.height); let renderContinueCallback = (cont) => {
this._convertCanvasToImage(); if (!this.renderingQueue.isHighestPriority(this)) {
this.renderingState = RenderingStates.PAUSED;
this.resume = () => {
this.renderingState = RenderingStates.RUNNING;
cont();
};
return; return;
} }
// drawImage does an awful job of rescaling the image, doing it gradually. cont();
var MAX_NUM_SCALING_STEPS = 3; };
var reducedWidth = canvas.width << MAX_NUM_SCALING_STEPS;
var reducedHeight = canvas.height << MAX_NUM_SCALING_STEPS;
var reducedImage = TempImageFactory.getCanvas(reducedWidth,
reducedHeight);
var reducedImageCtx = reducedImage.getContext('2d');
while (reducedWidth > img.width || reducedHeight > img.height) { let renderContext = {
reducedWidth >>= 1; canvasContext: ctx,
reducedHeight >>= 1; viewport: drawViewport,
} };
reducedImageCtx.drawImage(img, 0, 0, img.width, img.height, let renderTask = this.renderTask = this.pdfPage.render(renderContext);
0, 0, reducedWidth, reducedHeight); renderTask.onContinue = renderContinueCallback;
while (reducedWidth > 2 * canvas.width) {
reducedImageCtx.drawImage(reducedImage, renderTask.promise.then(function() {
0, 0, reducedWidth, reducedHeight, finishRenderTask(null);
0, 0, reducedWidth >> 1, reducedHeight >> 1); }, function(error) {
reducedWidth >>= 1; finishRenderTask(error);
reducedHeight >>= 1; });
} return renderCapability.promise;
ctx.drawImage(reducedImage, 0, 0, reducedWidth, reducedHeight, }
setImage(pageView) {
if (this.renderingState !== RenderingStates.INITIAL) {
return;
}
let img = pageView.canvas;
if (!img) {
return;
}
if (!this.pdfPage) {
this.setPdfPage(pageView.pdfPage);
}
this.renderingState = RenderingStates.FINISHED;
let ctx = this._getPageDrawContext(true);
let canvas = ctx.canvas;
if (img.width <= 2 * canvas.width) {
ctx.drawImage(img, 0, 0, img.width, img.height,
0, 0, canvas.width, canvas.height); 0, 0, canvas.width, canvas.height);
this._convertCanvasToImage(); this._convertCanvasToImage();
}, return;
}
get pageId() { // drawImage does an awful job of rescaling the image, doing it gradually.
return (this.pageLabel !== null ? this.pageLabel : this.id); let reducedWidth = canvas.width << MAX_NUM_SCALING_STEPS;
}, let reducedHeight = canvas.height << MAX_NUM_SCALING_STEPS;
let reducedImage = TempImageFactory.getCanvas(reducedWidth,
reducedHeight);
let reducedImageCtx = reducedImage.getContext('2d');
/** while (reducedWidth > img.width || reducedHeight > img.height) {
* @param {string|null} label reducedWidth >>= 1;
*/ reducedHeight >>= 1;
setPageLabel: function PDFThumbnailView_setPageLabel(label) { }
this.pageLabel = (typeof label === 'string' ? label : null); reducedImageCtx.drawImage(img, 0, 0, img.width, img.height,
0, 0, reducedWidth, reducedHeight);
while (reducedWidth > 2 * canvas.width) {
reducedImageCtx.drawImage(reducedImage,
0, 0, reducedWidth, reducedHeight,
0, 0, reducedWidth >> 1, reducedHeight >> 1);
reducedWidth >>= 1;
reducedHeight >>= 1;
}
ctx.drawImage(reducedImage, 0, 0, reducedWidth, reducedHeight,
0, 0, canvas.width, canvas.height);
this._convertCanvasToImage();
}
this.l10n.get('thumb_page_title', { page: this.pageId, }, get pageId() {
'Page {{page}}').then((msg) => { return (this.pageLabel !== null ? this.pageLabel : this.id);
this.anchor.title = msg; }
});
if (this.renderingState !== RenderingStates.FINISHED) { /**
return; * @param {string|null} label
*/
setPageLabel(label) {
this.pageLabel = (typeof label === 'string' ? label : null);
this.l10n.get('thumb_page_title', { page: this.pageId, },
'Page {{page}}').then((msg) => {
this.anchor.title = msg;
});
if (this.renderingState !== RenderingStates.FINISHED) {
return;
}
this.l10n.get('thumb_page_canvas', { page: this.pageId, },
'Thumbnail of Page {{page}}').then((ariaLabel) => {
if (this.image) {
this.image.setAttribute('aria-label', ariaLabel);
} else if (this.disableCanvasToImageConversion && this.canvas) {
this.canvas.setAttribute('aria-label', ariaLabel);
} }
});
}
this.l10n.get('thumb_page_canvas', { page: this.pageId, }, static cleanup() {
'Thumbnail of Page {{page}}').then((ariaLabel) => {
if (this.image) {
this.image.setAttribute('aria-label', ariaLabel);
} else if (this.disableCanvasToImageConversion && this.canvas) {
this.canvas.setAttribute('aria-label', ariaLabel);
}
});
},
};
PDFThumbnailView.cleanup = function() {
TempImageFactory.destroyCanvas(); TempImageFactory.destroyCanvas();
}; }
}
return PDFThumbnailView;
})();
export { export {
PDFThumbnailView, PDFThumbnailView,

334
web/pdf_thumbnail_viewer.js
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,