Documentation

Slideshow

Description

The Slideshow addon allows users to embed a slideshow presentation together with the corresponding audio recording.

Note: Image Viewer supports the following graphic formats: JPG, PNG, BMP. Vector formats are not supported.

Note: It's recommended to use files with bitrate 64 kb/s or higher. The files with lower quality could experience some difficulties in reproduction. It's also important that audio files have constant bitrate because Mozilla Firefox experiences problems while seeking in the files that have variable bitrate mode.

Properties

Property name Description
Audio A collection of audio files played by the Addon. Only first item is taken under consideration as narration for the slideshow. Supported formats are: MP3 and OGG Vorbis.

This property allows online resources. Find out more »

Slides A collection of slides composed of image file (slide) and starting time in MM:SS format. First slide always starts at 00:00 regardless of the user input.

This property allows online resources. Find out more »

Texts A collection of text label shown at some time of presentation. Each Text is composed of text string, starting end ending time (in MM:SS format) and its position (counted from slide upper-left corner) in pixels
Slide animation Selecting this property will result in showing and hidding slides with additional animation (except for selecting specific slide with Previous and Next buttons)
Text animation Selecting this property will result in showing and hidding text label with additional animation (except for selecting specific slide with Previous and Next buttons)
Hide progressbar Selecting this property will result in hiding progress bar (which results in more space for other Slideshow controls elements))
Show slide This option is for Presentation Editor only! It allows you to view specified slide (counted from 1 to Frames)
Group next and previous buttons Wrap Next and Previous buttons in additional DIV element
Narration Narration for recorded audio
No audio When checked, no audio file will be played during the presentation. "Audio" property is no longer required, but "Presentation Duration" property must be filled out.
Presentation Duration The duration of the presentation without an audio file (in seconds). This property is required when "No audio" is checked, but will be ignored otherwise.

Events

The end event occurs when the slideshow playback is finished.

Field name Description
Item end
Value N/A
Score N/A

The playing event occurs when the slideshow is playing.

Field name Description
Item N/A
Value playing
Score N/A

The pause event occurs when the slideshow is paused.

Field name Description
Item N/A
Value pause
Score N/A

The stop event occurs when the slideshow is stopped.

Field name Description
Item N/A
Value stop
Score N/A

Supported commands

Command name Params Description
show --- Shows the module.
hide --- Hides the module.
play --- Plays the module.
pause --- Pauses the module.
stop --- Stops the module.
next --- Changes a slide to the next one if available. Sets audio to the time set in the next slide.
previous --- Changes a slide to the previous one if available. Sets audio to the time set in the next slide.
moveTo Slide index Changes a slide to the provided slide index if such a slide exists. Sets audio to the time set in the selected slide.

Advanced Connector integration

Each command supported by SlideShow Addon can be used in Advanced Connector Addon scripts. Below example shows how to show the addon, when is invisible.

EVENTSTART
Source:Text2
SCRIPTSTART
    var slideShowModule = presenter.playerController.getModule('Slideshow1');
    slideShowModule.show();
SCRIPTEND
EVENTEND

CSS classes

Class name Description
slideshow-container DIV surrounding all slideshow elements. Slides, texts and controls panel elements are a direct childs of this element
slideshow-container-slide Slides are DIV elements (with background-image property set to image) which are shown/hidden accordingly to narration time. Do not change/set position attributes for this elements!
slideshow-container-text Texts are span elements which are shown/hidden accordingly to narration time. Do not change/set position attributes for this elements!
slideshow-controls-container DIV containing all controls elements. It's width is adjusted to Addons Width property. Height is by default 50px (with horizontal padding, each 5px), but can be changed by user freely. Each child elements have height equal 40px (except for progress bar components)
slideshow-controls-timer DIV containing spans for current playback time and audio duration. Default width is 120px and shouldn't be lowered by user
slideshow-controls-timer-time SPAN element containing narration current time
slideshow-controls-timer-duration SPAN element containing audio file duration
slideshow-controls-play Button to start narration. It's default width is 40px
slideshow-controls-play-pause Button to pause narration. It's default width is 40px
slideshow-controls-stop Button to stop narration. It's default width is 40px
slideshow-controls-previous Button to select previous slide (if possible) and change narration time to specified in configuration time. It's default width is 40px
slideshow-controls-previous-inactive Button to select previous slide if there are no previous slides available
slideshow-controls-next Button to select next slide (if possible) and change narration time to specified in configuration time. It's default width is 40px
slideshow-controls-next-inactive Button to select next slide if there are no more slides available
slideshow-controls-navigation Next and Previous buttons container while 'Group next and previous buttons' option is checked
slideshow-controls-progressbar DIV element which contains narration progress bar. It's width is automaticly set on Addon creation to use all spare space in controls sections.
slideshow-controls-progressbar-slider DIV element which serves as slider. By default it's shape is a circle, but can be freely changed by user. Do not change/set position attributes for this elements!
slideshow-controls-progressbar-line DIV element which serves as horizontal line. Do not change/set position attributes for this elements!
slideshow-loading-image Loading image showed while loading resources. Image is placed in slides center. Default width and hight are 80px. Do not change/set position attributes for this elements!
slideshow-loading-text Loading status showed while loading resources. Element is placed at slides bottom. Default width is 250px and hight is 40px. Do not change/set position attributes for this elements!
slideshow-controls-play-mouse-hover,
slideshow-controls-play-pause-mouse-hover,
slideshow-controls-stop-mouse-hover,
slideshow-controls-previous-mouse-hover,
slideshow-controls-previous-inactive-mouse-hover,
slideshow-controls-next-mouse-hover,
slideshow-controls-next-inactive-mouse-hover
Buttons states on mouse hover

Demo presentation

Demo presentation contains examples of how to use Slideshow Addon.