ImageViewer

The ImageViewer module allows article images to render in full screen mode.

Source:
Properties:
Name Type Description
selectors Object

DOM element selectors

states Object

different css states

template String

template used for populating the image viewer

$viewer HTMLElement

the current image viewer

$currentImage HTMLElement

the current image selected to be shown in the image viewer

$body HTMLElement

the body element

$html HTMLElement

the root HTML Element

keyboardListener function

keyboard key up listener

maxWidth integer

maximum width for an image in the image viewer

Methods

(inner) close(evt)

Source:

Close the image viewer with an animation.

Parameters:
Name Type Description
evt Event

mouse click event.

(inner) destroy()

Source:

Completely remove the image viewer and the reference to it.

(inner) imageLoad($image)

Source:

Flag an image as being loaded

Parameters:
Name Type Description
$image HTMLElement

the image that has been loaded

(inner) init()

Source:

Select expandable images and set up click listeners to trigger the image viewer.

(inner) initializeFullScreen($image, evt)

Source:

Initialize the image viewer for viewing the selected image in full screen mode.

Parameters:
Name Type Description
$image HTMLElement

the selected image to be shown in full screen mode

evt Event

click event

(inner) interactWithKeyboard(evt)

Source:

Close the image viewer with ESC key.

Parameters:
Name Type Description
evt Event

key up event

(inner) track($elem)

Source:

Analytics tracking.

Parameters:
Name Type Description
$elem HTMLElement

element triggering click tracking