References
This page lists all the properties and methods present in the various features of Nuggets. It only gives a brief description of each property and method, sometimes using a code extract as an example.
For more details, please refer to the various tutorials on the Youtube channel and/or on Features page.
core.globals
All nodes created with globals
functions have a data-id='nuggets'
assigned.
CreateJSNode('source');
Creates and returns a script
node with the value 'source'
as its source.
JavaScript
const node = CreateJSNode('myJS.js');
// <script src='monJS.js' type='text/JavaScript' data-id='nuggets'></script>
CreateNode('tagName');
Creates and returns a 'tagName'
node.
JavaScript
const node = CreateNode('script');
// <script data-id='nuggets'></script>
const node = CreateNode('styles');
// <styles data-id='nuggets'></styles>
CreateTypedNode('tagName', 'type');
Creates and returns a tagName
node of type type
.
JavaScript
const node = CreateTypedNode('script','text/JavaScript');
// <script data-id='nuggets' type='text/JavaScript'></script>
Query(element, 'selector', [...dataSet]);
Returns the HTML element targeted by 'selector'
with [dataSet]
attributes if it exists.
JavaScript
const node = Query(document,'div',['id','myId');
// <div id='myId'>[...]</div>
core.nuggets
nuggets.getFolder();
Returns the library path as a character string.
JavaScript
const string = nuggets.getFolder();
console.log(string);
// output : story_content/WebObjects/5kTE9jP49mq/assets/js/nuggets
nuggets.initialize();
Initializes the listening methods reserved for Nuggets.
The method is called automatically once the library has been loaded.
nuggets.addEventListener('eventType', handler);
Binds a function to be called each time the specified event is sent to the nuggets
target.
nuggets.removeEventListener('eventType', handler);
Removes from the nuggets
target an event listener previously registered with nuggets.addEventListener
.
nuggets.dispatchEvent(event, detail);
Sends an Event
to the nuggets
target by calling the EventListener
in the appropriate order.
core.storyline
Communication with the Storyline player
GetVarFromSTL('name');
Returns the value of the 'name'
variable existing in Storyline.
JavaScript
let myVar = GetVarFromSTL('myVar');
UpdateVarInSTL('name', value);
Sends the value value
to the variable 'name'
existing in Storyline.
JavaScript
let myVar = 'oneValue';
UpdateVarInSTL('myVar', myVar);
The 2 methods are equivalent to GetPlayer().GetVar
and GetPlayer().SetVar
.
Nuggets recommends using these two functions rather than those created by the Articulate developers; if the Editor decides to modify them (name, etc.), it will be sufficient to update only the code of the Nuggets functions targeting those of Articulate.
Cibling Storyline player elements (in French)
The functions listed here target and return the main HTML nodes in the Storyline player.
General elements | Caption elements | Lightbox elements |
---|---|---|
GetPreso() GetCanvas() GetSlide() 1 |
GetCaptionContainer() GetCaption() 1GetCaptiontext() |
GetOverlay() GetLightboxWrapper() 1GetLightboxCloseButton() |
- HTML elements in the Storyline player followed by the Nuggets event interface.
Storyline player events
storyline.watchCaption();
Initializes an observer on the Caption element targeted by GetCaption()
.
Initialisation
JavaScript
storyline.watchCaption();
Event types
Types | Arguments | Propagation |
---|---|---|
DISPLAY_CAPTION 'displayCaption' |
- | Emitted when a subtitle appears. |
CHANGE_CAPTION 'changeCaption' |
- | Emitted when two captions follow each other. If there is a blank interval between two captions, the events REMOVE_CAPTION and DISPLAY_CAPTION , in that order, are notified. |
REMOVE_CAPTION 'removeCaption' |
- | Emitted when the displayed caption disappears. |
storyline.watchLightbox();
Initializes an observer on the Lightbox element targeted by GetLightboxWrapper()
.
Initialisation
JavaScript
storyline.watchLightbox();
Event types
Types | Arguments | Propagation |
---|---|---|
OPEN_LIGHTBOX 'openLightbox' |
- | Emitted when the Lightbox is open. |
CLOSE_LIGHTBOX 'closeLightbox' |
- | Emitted when the Lightbox is closed. |
storyline.watchSlide();
Initializes a viewer on the Slide element targeted by GetSlide()
.
Initialisation
JavaScript
storyline.watchSlide();
Event types
Types | Arguments | Propagation |
---|---|---|
SLIDE_CHANGE 'onSlideChange' |
slideId |
Emitted when two slides are sequenced. |
SCENE_CHANGE 'onSceneChange' |
sceneId |
When two slides are sequenced, emitted when they are not on the same stage. |
customization.Caption
Caption.watch();
Initializes an observer on the Caption element targeted by GetCaption()
.
Is called automatically by the Caption.clearBox()
method.
Caption.clearBox();
Resets the margin
and padding
attributes to 0
and deletes all styles in the GetCaptionText()
node.
Caption.setShadow(color='#000000', alpha=0.6, blur=2, offset=1);
Apply a background and shadow to the GetCaptionText()
node.
Caption.setFont('font', color='white', size='2em');
Applies a font to the GetCaptionText()
node.
The font must first be imported using one of the following methods:
CustomCSS.newFontFace()
GoogleFont.link()
GoogleFont.import()
customization.CaptionBBCode
CaptionBBCode.initialize();
Allows to use a pseudo-code embedded in Storyline subtitles.
For more information about BB Codes, please refer to section « How to use > CaptionBBCode ».
customization.CustomCSS
CustomCSS.newRule('definition');
Implements a new style sheet declaration.
CustomCSS.newFontFace('folder', 'name', 'style', weight);
Implements a font previously imported into a Web Object.
customization.GoogleFonts
GoogleFonts.link('family');
Implements a font using the link
nodes provided by the Google API.
GoogleFonts.import('family');
Implements a font using the @import
stylesheet declaration provided by the Google API.
customization.Lightbox
Lightbox.reset( {background, closeButton });
Resets the visual appearance of the Lightbox item in the Storyline player.
- Deletes the white square from the Lightbox
- Deletes the Close button used to close the Lightbox in the Storyline player.
Lightbox.resetOverlay();
Method currently deactivated
Lightbox.resetPosition();
Method currently deactivated
Lightbox.resetSize();
Method currently deactivated
Lightbox.watch();
Initializes an observer on the Lightbox element targeted by GetLightboxWrapper()
.
Is called automatically by Lightbox.reset()
.
features.Keys
Keys.type:String;
String specifying the type of value used in the KeyboardEvent
interface when a key is pressed.
Can be equal to key
(default) or code
.
Keys.registerShortcut(...args);
Allocates a keystroke combination to a Storyline variable of type Boolean
.
features.LocalTrack
LocalTrack.parse('variable','result','str');
Used to update a variable of type Number
with one or more binary values, positive or negative, at one or more precise indexes.
JavaScript
LocalTrack.parse('myVar','myResult','_str');
Must be called when variable
changes.
Storyline trigger
When 'myVar' change
- Execute 'JavaScript'
If 'nuggetsLoaded' = value 'True'
features.Timer
Timer.reset({initialTime, {increment, {'format'}}});
Initialises a timer.
JavaScript
Timer.reset();
// Resets the timer to zero for incrementing.
Arguments :
-
initialTime : Number indicating the starting value. Defaults to
zero
. -
increment : Boolean indicating whether the timer increments or decrements. By default, it increments.
-
'format' : Character string indicating the formatting of the timer if it is to be displayed in a text field. Defaults to
mm:ss
.
JavaScript
Timer.reset(10,false);
// Resets the timer to 10 seconds for decrementing.
Timer.play();
Starts the timer from the moment T
at which it was stopped.
Timer.pause();
Stops the timer at an instant T
without resetting it.
Timer.stop();
Stops the timer and resets it to the values defined in the Timer.reset
call.
webobjects.WebObject
WebObject.connect(source='postMessage');
Used to initiate a connection between the Storyline player and a Web Object present on a slide.
JavaScript
WebObject.connect();
WebObject.receiveMessage();
Used to send values to variables in Storyline.
Is triggered each time a Web Object sends a message
event via the postMessage
method.
WebObject.disconnect();
Disconnects the Web Object from the Storyline player. Is called automatically each time a slide is output.
webobjects.postMessage
SendToSTL(object);
Used to send a value to a variable in Storyline. To be called from the content of the page included in the Web Object.
JavaScript
SendToSTL('myVar',value);