Skip to main content
MuPDF WebViewer can listen for the following events:
Event TypeDescription
ACTION_HISTORY_CHANGEWhen an action causes the history to change
ANNOTATION_CREATEA new annotation is created
ANNOTATION_MODIFYAn existing annotation is modified
ANNOTATION_REMOVEAn existing annotation is deleted
ANNOTATION_SELECTION_CHANGEAnother annotation is selected
ANNOTATION_TOOL_CHANGEA different annotation tool type is selected
CURRENT_PAGE_INDEX_CHANGEThe current page index changes
CURRENT_READING_PAGE_CHANGEThe current reading page changes
CUSTOM_CONTEXT_MENU_EXECUTEA custom context menu is executed
DOCUMENT_DOWNLOADA document download is initiated
KEYDOWNA key is pressed down
KEYUPA key is released
MOUSEDOWNA mouse button is pressed down
MOUSEUPA mouse button is released
POINTERDOWNFires for all pointer down devices: mouse, touch, stylus/pen, etc.
POINTERUPFires for all pointer up devices: mouse, touch, stylus/pen, etc.
REDACTION_CREATEA new redaction is created
REDACTION_MODIFYAn existing redaction is modified
REDACTION_REMOVEAn existing redaction is removed
SCALE_CHANGEThe document scale changes
SCROLL_POSITION_CHANGEThe document is scrolled
SIDE_VIEW_CLOSEThe side view is closed
SIDE_VIEW_OPENThe side view is opened
TEXT_SEARCH_STARTA text search is started
TEXT_SELECTION_CHANGEThe text selection changes
In order to register a listener just use the mupdf.addEventListener method.

Examples

Page Change

mupdf.addEventListener(mupdf.refs.event.type.CURRENT_PAGE_INDEX_CHANGE, (e) => {
  console.log(Object.keys(e.data));
  console.log(e.data.currentPageIndex);
});

Redaction and Annotation Events

Redaction Create Event

mupdf.addEventListener(mupdf.refs.event.type.REDACTION_CREATE, (e) => {
    console.log("REDACTION_CREATE");
});

Annotation Removed Event

mupdf.addEventListener(mupdf.refs.event.type.ANNOTATION_REMOVE, (e) => {
    console.log("ANNOTATION_REMOVE");
});

Key Events

// Listen for a key down
mupdf.addEventListener(mupdf.refs.event.type.KEYDOWN, keyDown);

function keyDown(e) {

    console.log(Object.keys(e.data));
    
    for (var i in e.data) {
        console.log(e.data[i]);
    }

    console.log("Keycode="+e.data.event.keyCode);
}

Pointer Events

// Listen for a pointer down
mupdf.addEventListener(mupdf.refs.event.type.POINTERDOWN, pointerDown);

function pointerDown(e) {

    console.log(Object.keys(e.data));

    for (var i in e.data) {
        console.log(e.data[i]);
    }

    console.log("clientX="+e.data.event.clientX);
}

Listening for Multiple Key Presses

For example, if you would like to add a shortcut for ctrl+s to save a document you could do the following to register for multiple key presses:
mupdf.addEventListener(mupdf.refs.event.type.KEYDOWN, (event) => {
  if (event.data.event.ctrlKey && event.data.event.key === 's') {
    mupdf.document.download();
  }
});

Removing Event Listeners

Event listeners can be removed using the mupdf.removeEventListener method. You need to pass in the same function reference that was used to add the event listener.
function keyDown(e) {   
    console.log("Keycode="+e.data.event.keyCode);
}

mupdf.removeEventListener(mupdf.refs.event.type.KEYDOWN, keyDown);