Third party viewer usage

The default viewer is built on the display layer and is the UI for PDF viewer in Firefox and the other browser extensions within the project. It can be a good starting point for building your own viewer. However, we do ask if you plan to embed the viewer in your own site, that it not just be an unmodified version. Please re-skin it or build upon it.

Initialization promise

For custom deployments it is often useful to know when the viewer is fully initialized. Previously this was possible by listening to the localized event, but since pull request #11607 there is a simpler way:

document.addEventListener("webviewerloaded", function() {
  PDFViewerApplication.initializedPromise.then(function() {
    // The viewer has now been initialized.
  })
});

Event bus

The viewer components can dispatch events on an event bus to which other components can listen and act upon. PDF.js dispatches common events on the event bus that the user provides. For custom deployments it is required to provide a manually made event bus instance since pull request #11631. This prevents having to use DOM events for this purpose, making the viewer more stand-alone. Event bus instances have an on method to start listening for an event, an off method to stop listening for an event and a dispatch method to send an event through the event bus for other viewer components.

For example, to perform an action when the page is initialized, you can use the following code:

// Create the event bus instance for the viewer application.
const eventBus = new pdfjsViewer.EventBus();

// Pass the event bus instance to the PDF viewer.
const pdfViewer = new pdfjsViewer.PDFViewer({
  ...
  eventBus: eventBus,
});

// Listen for `pagesinit` events on the event bus.
eventBus.on("pagesinit", function() {
  // Handle the `pagesinit` event here.
});