Skip to main content

Callbacks

The JavaScript API of FSI Pages can be useful if you - for example - want to set certain actions when FSI Pages is initialized, while pages change, the user interface is used or links are clicked.

You can define callback functions by assigning methods to the FSI Pages instance.

Refer to the appropriate chapter to learn how to implement callbacks.

The following callback methods exist:

onAfterRegisterExternalButton​

onAfterRegisterExternalButton(button, buttonID, buttonPresent)
Removes inactive buttons from the menu bar if you are using a custom skin.
button
element
Button element
buttonID
string
Button ID
buttonPresent
boolean
If button is present in the viewer
instance.addListener('onAfterRegisterExternalButton', (button, buttonID, buttonPresent) => {
  // external button registered
  myFunc(button, buttonID, buttonPresent)
})
Example

onAutoPageLayoutChange​

onAutoPageLayoutChange(doublePage)
Calls an action as soon as the page layout is automatically changed.
doublePage
boolean
If page is a double page
instance.addListener('onAutoPageLayoutChange', (doublePage) => {
  // page layout changes
  myFunc(doublePage)
})
Example

onBookmarkAdded​

onBookmarkAdded(page)
Calls an action as soon as a bookmark is added to the page.
page
integer
Page number
instance.addListener('onBookmarkAdded', (page) => {
  // bookmark added
  myFunc(page)
})
Example

onBookmarkRemoved​

onBookmarkRemoved(page)
Calls an action as soon as a bookmark is removed from the page.
page
integer
Page number
instance.addListener('onBookmarkRemoved', (page) => {
  // bookmark removed
  myFunc(page)
})
Example

onBookmarksLoaded​

onBookmarksLoaded(loaded)
Calls an action as soon as the bookmarks are loaded.
loaded
string
Page numbers of the bookmarks currently existing
instance.addListener('onBookmarksLoaded', (loaded) => {
  // bookmarks loaded
  myFunc(loaded)
})
Example

onBookmarksSaved​

onBookmarksSaved(stored)
Calls an action as soon as the bookmarks are saved.
stored
string
Page numbers of the bookmarks currently existing
instance.addListener('onBookmarksSaved', (stored) => {
  // bookmarks saved
  myFunc(stored)
})
Example

onChangeConfig​

onChangeConfig(cfgFile, parameters)
Called as soon as the config is changed.
cfgFile
string
Name of the config file
parameters
object
Configuration parameters as object
instance.addListener('onChangeConfig', (cfgFile, parameters) => {
  // config changed
  myFunc(cfgFile, parameters)
})
Example

onClickDemoMode​

onClickDemoMode(url, targetFrame)
Calls an action as soon as the demo mode instance is clicked on. (You need to return `false` in order to prevent default action!)
config
object
Configuration parameters as object
instance.addListener('onClickDemoMode', (url, targetFrame) => {
  // click on demo mode instance
  myFunc(url, targetFrame)
})
Example

onDestroy​

onDestroy()
Called as soon as the viewer is destroyed.
instance.addListener('onDestroy', () => {
  // instance is destroyed
  doReallyGoodThings()
})
Example

onGetChaptersData​

onGetChaptersData(chaptersData)
Calls an action as soon as the chapters' data is loaded.
chaptersData
node
Chapters data in node form
instance.addListener('onGetChaptersData', (chaptersData) => {
  // chapter data loaded
  myFunc(chaptersData)
})
Example

onGetIntroContent​

onGetIntroContent(introData)
Calls an action as soon as the chapters' data is loaded.
introData
node
Intro data in node form
instance.addListener('onGetIntroContent', (introData) => {
  // intro loaded
  myFunc(introData)
})
Example

onEnterDemoMode​

onEnterDemoMode()
Call an action as soon as the demo mode is entered.
instance.addListener('onEnterDemoMode', () => {
  // demo mode is entered
  doReallyGoodThings()
})
Example

onExitDemoMode​

onExitDemoMode()
Call an action as soon as the demo mode is entered.
instance.addListener('onExitDemoMode', () => {
  // demo mode is entered
  doReallyGoodThings()
})
Example

onFullScreen​

onFullScreen(set)
Calls an action when `FullScreen` mode is enabled or disabled.
set
boolean
`true` = FullScreen mode enabled
instance.addListener('onFullScreen', (set) => {
  // FullScreen enabled/disabled
  myFunc(set)
})
Example

onInitFailed​

onInitFailed(reason)
Called when the initialization is failed. This could happen if e.g. an image cannot be loaded or the dimensions of an image cannot be requested. The listener returns a string with the reason why the initialization failed.
reason
string
Reason for fail
instance.addListener('onInitFailed', (reason) => {
  // init fails
  myFunc(reason)
})
Example

onLinkHover​

onLinkHover(linkData, hover)
Calls an action as soon as the cursor hovers over the link.
linkData
object
Link data object
hover
boolean
`true` = hover active
instance.addListener('onLinkHover', (linkData, hover) => {
  // hover over link
  myFunc(linkData, hover)
})
Example

onMenuButtonEnabled​

onMenuButtonEnabled(buttonID, null, enable)
Calls an action when a button is enabled or disabled.
buttonID
string
Button ID
enable
boolean
`true` = button enabled
instance.addListener('onMenuButtonEnabled', (buttonID, null, enable) => {
  // button enabled/ disabled
  myFunc(buttonID, null, enable)
})
Example

onMenuButtonMouseDown​

onMenuButtonMouseDown(buttonID, evt)
Calls an action when the mouse pointer is over the element and the mouse button is pressed.
buttonID
string
Button ID
evt
event
Event which will be used
instance.addListener('onMenuButtonMouseDown', (buttonID, evt) => {
  // button mouse down
  myFunc(buttonID, evt)
})
Example

onMenuButtonPressed​

onMenuButtonPressed(buttonID, evt)
Sets an action that starts when a button is pressed.
buttonID
string
Button ID
evt
event
Event which will be used
instance.addListener('onMenuButtonPressed', (buttonID, evt) => {
  // button pressed
  myFunc(buttonID, evt)
})
Example

onMenuButtonReleased​

onMenuButtonReleased(buttonID, evt)
Sets an action that starts when a button is released.
buttonID
string
Button ID
evt
event
Event which will be used
instance.addListener('onMenuButtonReleased', (buttonID, evt) => {
  // button released
  myFunc(buttonID, evt)
})
Example

onMenuButtonClicked​

onMenuButtonClicked(buttonID, evt)
Sets an action that starts when a button is clicked.
buttonID
string
Button ID
evt
event
Event which will be used
instance.addListener('onMenuButtonClicked', (buttonID, evt) => {
  // button clicked
  myFunc(buttonID, evt)
})
Example

onMenuButtonSetPressed​

onMenuButtonSetPressed(pressed)
Called as soon as the button is set to `pressed`.
pressed
boolean
`true` = button is set to pressed
instance.addListener('onMenuButtonSetPressed', (pressed) => {
  // button set to pressed
  myFunc(pressed)
})
Example

onMenuDestroy​

onMenuDestroy()
Called if the menu is destroyed.
instance.addListener('onMenuDestroy', () => {
  // menu is destroyed
  doReallyGoodThings()
})
Example

onMenuEnabled​

onMenuEnabled(enabled)
Called if the menu is enabled/disabled.
enabled
boolean
Configuration parameters as object
instance.addListener('onMenuEnabled', (enabled) => {
  // menu enabled
  myFunc(config)
})
Example

onMenuReady​

onMenuReady()
Sets an action when the menu is ready (after all buttons are added).
instance.addListener('onMenuReady', () => {
  // menu is ready
  doReallyGoodThings()
})
Example

onOpenPageLink(linkAreaIndex, URL, target)
Calls an action if links are clicked.
linkAreaIndex
integer
Index of the link area
URL
string
Link URL
target
string
Link target
RETURN
string
Return `false` to prevent opening the link, return `{strURL:"foo", strTarget: "bar"}` to modify the URL or the target (both are optional)
instance.addListener('onOpenPageLink', (linkAreaIndex, URL, target) => {
  // page link opened
  myFunc(linkAreaIndex, URL, target)
})
Example

onPageChanged​

onPageChanged(page, pageStr, maxPage)
Calls an action as soon as the viewed page changes.
page
integer
Page number
pageStr
string
Page number as string
maxPage
string
Amount of pages existing
instance.addListener('onPageChanged', (page, pageStr, maxPage) => {
  // page changed
  myFunc(page, pageStr, maxPage)
})
Example

onPageLayoutChanged​

onPageLayoutChanged(layoutData)
Calls an action as soon as the page layout is manually changed.
layoutData
object
Page layout data as object
instance.addListener('onPageLayoutChanged', (layoutData) => {
  // page layout changed
  myFunc(layoutData)
})
Example

onPageSizeChanged​

onPageSizeChanged(width, height)
Calls an action as soon as the page size is changed.
width
integer
Page width
height
integer
Page height
instance.addListener('onPageSizeChanged', (width, height) => {
  // page size changed
  myFunc(width, height)
})
Example

onPageToolTip​

onPageToolTip(linkAreaIndex, URL, tipContent)
Called as soon as the page tool tip appears, useful if you want to modify the tool tip content.
linkAreaIndex
integer
Index of the link area
URL
string
Link URL
tipContent
string
Tooltip content
RETURN
string
Returns the modified tool tip content
instance.addListener('onPageToolTip', (linkAreaIndex, URL, tipContent) => {
  // page tool tip appears
  myFunc(linkAreaIndex, URL, tipContent)
})
Example

onPageZoomStart​

onPageZoomStart(page, imageData, offset, config)
Calls an action as soon as a page is clicked for zoom.
page
integer
Page number
imageData
object
Image data as object
offset
object
Offset
config
object
Image configuration parameters as object
instance.addListener('onPageZoomStart', (page, imageData, offset, config) => {
  // page zoom starts
  myFunc(page, imageData, offset, config)
})
Example

onPageZoomed​

onPageZoomed(page)
Calls an action as soon as the page is zoomed.
page
integer
Page number
instance.addListener('onPageZoomed', (page) => {
  // page zoomed
  myFunc(page)
})
Example

onPrintPages​

onPrintPages(pageIndices, imageURLs)
Calls an action as soon as the pages are printed.
pageIndices
array
Page indices
imageURLs
array
Image URLS
instance.addListener('onPrintPages', (pageIndices, imageURLs) => {
  // page print activated
  myFunc(pageIndices, imageURLs)
})
Example

onReady​

onReady()
Called as soon as FSI Pages finished loading data and gets interactive.
instance.addListener('onReady', () => {
  // instance is ready
  doReallyGoodThings()
})
Example

onRegisterExternalMenuButtons​

onRegisterExternalMenuButtons()
Calls an action as soon as external menu buttons are registered.
instance.addListener('onRegisterExternalMenuButtons', () => {
  // menu button registered
  doReallyGoodThings()
})
Example

onRemoveAllBookmarks​

onRemoveAllBookmarks()
Calls an action as soon as all bookmarks are removed.
instance.addListener('onRemoveAllBookmarks', () => {
  // bookmarks removed
  doReallyGoodThings()
})
Example

onResize​

onResize(width, height, done, fullScreen)
Called as soon as the instance is resized.
width
integer
width of instance
height
integer
height of instance
done
boolean
`true` = resize process is finished
fullScreen
boolean
FullScreen activated or deactivated
instance.addListener('onResize', (width, height, done, fullScreen) => {
  // resize
  myFunc(width, height, done, fullScreen)
})
Example

onSearchInit​

onSearchInit(input)
Calls an action as soon as the search is initialized..
input
element
Input element
instance.addListener('onSearchInit', (input) => {
  // search initiated
  myFunc(input)
})
Example

onSearchResults​

onSearchResults(pageNumbers, images)
Calls an action as soon as the search results are returned.
pageNumbers
array
Page numbers
images
array
Image array
instance.addListener('onSearchResults', (pageNumbers, images) => {
  // Search results appear
  myFunc(pageNumbers, images)
})
Example

onSearchStart​

onSearchStart(keyWords, input)
Calls an action as soon as the search is started.
keyWords
string
Search key words
input
string
Input
instance.addListener('onSearchStart', (keyWords, input) => {
  // Page search started
  myFunc(keyWords, input)
})
Example

onShowBookmarkList​

onShowBookmarkList(show)
Calls an action as soon as the bookmark list is opened.
show
boolean
Bookmark list visible or hidden
instance.addListener('onShowBookmarkList', (show) => {
  // Bookmark list is shown
  myFunc(show)
})
Example

onShowChapters​

onShowChapters(show)
Calls an action as soon as the chapters section is opened.
show
boolean
Chapters visible or hidden
instance.addListener('onShowChapters', (show) => {
  // Chapters section shown
  myFunc(show)
})
Example

onShowChaptersData​

onShowChaptersData(indexItems)
Return the `Chapters` data if the `Chapters` plugin is implemented.
indexItems
array
Index items, can be multidimensional if subchapters exist
instance.addListener('onShowChaptersData', (indexItems) => {
  // Chapters data shown
  myFunc(indexItems)
})
Example

onShowPageIndex​

onShowPageIndex(show)
Calls an action as soon as the Page index section is opened.
show
boolean
Page index visible or hidden
instance.addListener('onShowPageIndex', (show) => {
  // Page index section opened
  myFunc(show)
})
Example

onShowPrintDialog​

onShowPrintDialog(show)
Calls an action as soon as the Print Dialog is opened.
show
boolean
Print Dialog visible or hidden
instance.addListener('onShowPrintDialog', (show) => {
  // Print Dialog opened
  myFunc(show)
})
Example

onShowSaveDialog​

onShowSaveDialog(show)
Calls an action as soon as the Save Dialog is opened.
show
boolean
Save Dialog visible or hidden
instance.addListener('onShowSaveDialog', (show) => {
  // Save Dialog opened
  myFunc(show)
})
Example

onShowSearchDialog​

onShowSearchDialog(show)
Calls an action as soon as the Search Dialog is opened.
show
boolean
Search Dialog visible or hidden
instance.addListener('onShowSearchDialog', (show) => {
  // Search Dialog opened
  myFunc(show)
})
Example

onSkinChanged​

onSkinChanged(currentSkin, beforeSkin)
Called when the skin class is changed.
currentSkin
string
Currently used skin class
beforeSkin
string
Skin class used beforehand
instance.addListener('onSkinChanged', (currentSkin, beforeSkin) => {
  // skin class is changed
  myFunc(currentSkin, beforeSkin)
})
Example