/* Copyright 2012 Mozilla Foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import {
getVisibleElements,
isValidRotation,
NullL10n,
scrollIntoView,
watchScroll,
} from './ui_utils.js'
import { PDFThumbnailView } from './pdf_thumbnail_view.js'
const THUMBNAIL_SCROLL_MARGIN = -19
const THUMBNAIL_SELECTED_CLASS = 'selected'
/**
* @typedef {Object} PDFThumbnailViewerOptions
* @property {HTMLDivElement} container - The container for the thumbnail
* elements.
* @property {EventBus} eventBus - The application event bus.
* @property {IPDFLinkService} linkService - The navigation/linking service.
* @property {PDFRenderingQueue} renderingQueue - The rendering queue object.
* @property {IL10n} l10n - Localization service.
*/
/**
* Viewer control to display thumbnails for pages in a PDF document.
*
* @implements {IRenderableView}
*/
class PDFThumbnailViewer {
/**
* @param {PDFThumbnailViewerOptions} options
*/
constructor({
container,
eventBus,
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()
eventBus._on('optionalcontentconfigchanged', () => {
// Ensure that the thumbnails always render with the *default* optional
// content configuration.
this._setImageDisabled = true
})
}
/**
* @private
*/
_scrollUpdated() {
this.renderingQueue.renderHighestPriority()
}
getThumbnail(index) {
return this._thumbnails[index]
}
/**
* @private
*/
_getVisibleThumbs() {
return getVisibleElements(this.container, this._thumbnails)
}
scrollThumbnailIntoView(pageNumber) {
if (!this.pdfDocument) {
return
}
const thumbnailView = this._thumbnails[pageNumber - 1]
if (!thumbnailView) {
console.error('scrollThumbnailIntoView: Invalid "pageNumber" parameter.')
return
}
if (pageNumber !== this._currentPageNumber) {
const prevThumbnailView = this._thumbnails[this._currentPageNumber - 1]
// Remove the highlight from the previous thumbnail...
prevThumbnailView.div.classList.remove(THUMBNAIL_SELECTED_CLASS)
// ... and add the highlight to the new thumbnail.
thumbnailView.div.classList.add(THUMBNAIL_SELECTED_CLASS)
}
const visibleThumbs = this._getVisibleThumbs()
const numVisibleThumbs = visibleThumbs.views.length
// If the thumbnail isn't currently visible, scroll it into view.
if (numVisibleThumbs > 0) {
const first = visibleThumbs.first.id
// Account for only one thumbnail being visible.
const last = numVisibleThumbs > 1 ? visibleThumbs.last.id : first
let shouldScroll = false
if (pageNumber <= first || pageNumber >= last) {
shouldScroll = true
} else {
visibleThumbs.views.some(function (view) {
if (view.id !== pageNumber) {
return false
}
shouldScroll = view.percent < 100
return true
})
}
if (shouldScroll) {
scrollIntoView(thumbnailView.div, { top: THUMBNAIL_SCROLL_MARGIN })
}
}
this._currentPageNumber = pageNumber
}
get pagesRotation() {
return this._pagesRotation
}
set pagesRotation(rotation) {
if (!isValidRotation(rotation)) {
throw new Error('Invalid thumbnails rotation angle.')
}
if (!this.pdfDocument) {
return
}
if (this._pagesRotation === rotation) {
return // The rotation didn't change.
}
this._pagesRotation = rotation
for (let i = 0, ii = this._thumbnails.length; i < ii; i++) {
this._thumbnails[i].update(rotation)
}
}
cleanup() {
PDFThumbnailView.cleanup()
}
/**
* @private
*/
_resetView() {
this._thumbnails = []
this._currentPageNumber = 1
this._pageLabels = null
this._pagesRotation = 0
this._optionalContentConfigPromise = null
this._pagesRequests = new WeakMap()
this._setImageDisabled = false
// Remove the thumbnails from the DOM.
this.container.textContent = ''
}
setDocument(pdfDocument) {
if (this.pdfDocument) {
this._cancelRendering()
this._resetView()
}
this.pdfDocument = pdfDocument
if (!pdfDocument) {
return
}
const firstPagePromise = pdfDocument.getPage(1)
const optionalContentConfigPromise = pdfDocument.getOptionalContentConfig()
firstPagePromise
.then((firstPdfPage) => {
this._optionalContentConfigPromise = optionalContentConfigPromise
const pagesCount = pdfDocument.numPages
const viewport = firstPdfPage.getViewport({ scale: 1 })
const checkSetImageDisabled = () => {
return this._setImageDisabled
}
for (let pageNum = 1; pageNum <= pagesCount; ++pageNum) {
const thumbnail = new PDFThumbnailView({
container: this.container,
id: pageNum,
defaultViewport: viewport.clone(),
optionalContentConfigPromise,
linkService: this.linkService,
renderingQueue: this.renderingQueue,
checkSetImageDisabled,
disableCanvasToImageConversion: false,
l10n: this.l10n,
})
this._thumbnails.push(thumbnail)
}
// Set the first `pdfPage` immediately, since it's already loaded,
// rather than having to repeat the `PDFDocumentProxy.getPage` call in
// the `this._ensurePdfPageLoaded` method before rendering can start.
const firstThumbnailView = this._thumbnails[0]
if (firstThumbnailView) {
firstThumbnailView.setPdfPage(firstPdfPage)
}
// Ensure that the current thumbnail is always highlighted on load.
const thumbnailView = this._thumbnails[this._currentPageNumber - 1]
thumbnailView.div.classList.add(THUMBNAIL_SELECTED_CLASS)
})
.catch((reason) => {
console.error('Unable to initialize thumbnail viewer', reason)
})
}
/**
* @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 (
!(Array.isArray(labels) && 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++) {
const 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)
}
if (this._pagesRequests.has(thumbView)) {
return this._pagesRequests.get(thumbView)
}
const promise = this.pdfDocument
.getPage(thumbView.id)
.then((pdfPage) => {
if (!thumbView.pdfPage) {
thumbView.setPdfPage(pdfPage)
}
this._pagesRequests.delete(thumbView)
return pdfPage
})
.catch((reason) => {
console.error('Unable to get page for thumb view', reason)
// Page error -- there is nothing that can be done.
this._pagesRequests.delete(thumbView)
})
this._pagesRequests.set(thumbView, promise)
return promise
}
forceRendering() {
const visibleThumbs = this._getVisibleThumbs()
const 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 }