Create a free ticket and our support team will provide you necessary assistance.
API Methods - Storm JavaScript Library
| Method name | Returns | Return type | Description |
|---|---|---|---|
| initialize() | - | void | Initializes the library object. From this point, a connection to the server is established and authentication occurs. It is recommended to add all event listeners before calling this method to ensure they can be properly captured. |
| isInitialized() | true if this library instance was already initialized | boolean | Returns true if this library instance has already been initialized. |
| isConnected() | true if this library instance is connected to a server | boolean | Returns true if this library instance is connected to a server. |
| isAuthorized() | true if this library instance is authorized with a server | boolean | Returns true if this library instance is authorized with a server. |
| getLibraryID() | Library ID (first instance starts with 0, next one gets 1, etc.) | number | Returns the ID of this library instance. Each subsequent instance has a higher number. |
| getBranch() | Name of a development branch | string | Returns the development branch of this library (e.g., main, experimental). |
| getVersion() | Library version in xx.xx.xx format | string | Returns the version of this library instance. The version is returned in the SemVer format (Major.Minor.Patch). |
| getServerInfo() | An object containing server info | ServerInfo | Returns an object containing server info like its common name, version, and protocol version. |
| play() | - | void | Initiates playback of a video stream. If a video was previously paused, you can use this method to resume playback. For this method to work, the library must be subscribed to a stream (check the streamKey field in the config and/or the subscribe method). |
| pause() | - | void | Pauses current playback. To restart playback, please use the play() method. |
| stop() | - | void | Stops the current playback and ceases all operations. It also disconnects the library from a server. To restore connection, use the subscribe() method. |
| togglePlay() | - | void | Works as a pause/play switch depending on the current object state. |
| isPlaying() | true if playback is active | boolean | Returns true if this library instance is currently playing a stream. To obtain more detailed information about the stream's state, you can use the getPlaybackState() method. |
| getPlaybackState() | Current Playback State | PlaybackState | Returns the current playback state of this library instance. |
| getStreamState() | Current Stream State | StreamState | Returns the current stream state to which the library is subscribed. |
| seek(time:number) | - | void | Seeks stream to a given time (stream source timestamp). |
| mute() | - | void | Mutes the library's video object. It's not the same as setVolume(0), as both methods can be applied together. |
| unmute() | - | void | Unmutes the library's video object. |
| toggleMute() | - | void | Switches between mute and unmute methods depending on the current state. |
| isMute() | true if the library is muted | boolean | Checks whether the library is muted. |
| setVolume(newVolume:number) | - | void | Sets new volume for the library (0-100). Once the method is performed, the volumeChange event will be triggered. If the video was muted prior to the volume change, it will be automatically unmuted. |
| getVolume() | Current volume level 0-100 | number | Returns library volume (0-100). |
| setSize(width:number | string, height:number | string) | - | void | Sets a new width and height for the video element. The values can be given as a number (in which case they are treated as the number of pixels), or as a string ending with "px" (this will also be the number of pixels) or "%", where the number is treated as a percentage of the parent container's value. |
| setWidth(width:number | string) | - | void | Sets a new width for the library. The value can be given as a number (in which case it is treated as the number of pixels), or as a string ending with "px" (this will also be the number of pixels) or "%", where the number is treated as a percentage of the parent container's value. |
| getWidth() | Video object width | number | Returns current library width in pixels. |
| setHeight(height:number | string) | - | void | Sets a new height for the library. The value can be given as a number (in which case it is treated as the number of pixels), or as a string ending with "px" (this will also be the number of pixels) or "%", where the number is treated as a percentage of the parent container's value. |
| getHeight() | Video object height | number | Returns current library height in pixels. |
| updateToSize() | - | void | Forces the library to recalculate its size based on parent internal dimensions. |
| setScalingMode(newMode:ScalingType) | - | void | Changes the library scaling mode. For reference, please check scaling mode in the library config . |
| getScalingMode() | Current scaling mode | ScalingType | Returns the current library scaling mode. For reference, please check scaling mode in the library config . |
| setStreamConfig(config:StormStreamConfig) | - | void | Sets stream config for the library (or overwrites an existing one). |
| getStreamConfig() | Storm Streaming Configuration object | StormStreamingConfig | Returns the current config for the library. |
| makeScreenshot() | A promise containing either a blob or null | Promise<Blob | null> | Returns a promise that resolves with a screenshot of the video element as a blob, or null if taking the screenshot was not possible. |
| destroy() | - | void | Destroys this instance of StormLibrary and disconnects from a server. |
| addEventListener(eventName:string, callback:function, removable:boolean = true) | - | void | Registers an event with a library instance. Whenever a registered event occurs, the library will call the provided function. |
| removeEventListener(eventName:string, callback:function) | - | void | Removes event listener from the library. If callback is not provided, all events of that type will be removed. |
| removeAllEventListeners() | - | void | Removes all removable event listeners from the library. |
| getSourceItemList() | Array containing available sources | ISourceItem[] | Returns an array of all available source items. |
| removeAllSources() | - | void | Removes all SourceItems from a library instance. This method, however, will not stop current playback. |
| getQualityItemList() | Array containing available stream quality options | QualityItem[] | Returns an array of all available stream quality items. |
| subscribe(streamKey:string, andPlay:boolean) | - | void | Requests a subscription to a given streamKey. When a library is subscribed to a certain streamKey, it will receive notifications regarding its status. |
| unsubscribe() | - | void | Cancels subscription to a currently selected stream and stops playback. |
| playSourceItem(sourceItem:ISourceItem) | - | void | Starts a playback of a provided Stream Source Item. |
| playQualityItem(id:number) | true if Source Item related to that quality was found | boolean | Changes the selected video quality to the one corresponding to the specified ID. A list of qualities can be obtained through the getQualityItemList() method. |
| getCurrentSourceItem() | ISourceItem object or null | ISourceItem | null | Returns the current source item. If no source was selected yet, null might be returned instead. |
| addSourceItem(sourceItem:SourceItem, addAndPlay:boolean) | - | void | Adds a new stream object to the library. It can also start playing it automatically. |
| attachToContainer(containerID:string | HTMLElement) | true if attaching was successful | boolean | Attaches the library to a new parent container using either a container ID (string) or a reference to an HTMLElement. If the instance is already attached, it will be moved to a new parent. |
| detachFromContainer() | true if detaching was successful | boolean | Detaches the library from the current parent element, if possible. |
| getContainer() | Parent HTMLElement or null | HTMLElement | null | Returns the current parent element of the library, or null if none exists. |
| enterFullScreen() | - | void | Enters the FullScreen mode. |
| exitFullScreen() | - | void | Exits the FullScreen mode. |
| isFullScreenMode() | true if the library is in FullScreen mode | boolean | Returns true if the library instance is in FullScreen mode. |
| getAbsoluteStreamTime() | Unixtime | number | Returns the current playback time. |
| getVideoElement() | Reference to the main Video Element | HTMLVideoElement | Returns the Video Element used by this instance of the library. |
| getQualityControlMode() | Current Quality Control Mode | QualityControlMode | Returns the currently used quality control mode. |
| setQualityControlMode(mode:QualityControlMode, forceRestart:boolean = true) | - | void | Sets the quality control mode for this player instance. You can force a reload of the mechanism, which may result in an immediate quality change. |
| getPlaybackRate() | Playback Speed | number | Returns current playback ratio (usually between 0.9 and 1.1). |
| getBandwidthAnalyser() | Object containing bandwidth stability statistics | BandwidthAnalyser | Returns the Bandwidth Analyser component for the library. This component contains statistical data regarding the stability of the internet connection. |
| getBandwidthMeter() | Object containing bandwidth performance statistics | BandwidthMeter | Returns the Bandwidth Meter component for the library. This component contains statistical data related to the performance of the internet connection. |
| getBufferAnalyser() | Object containing buffer state and stability | BufferAnalyser | Returns the Buffer Analyser component for the library. This component contains statistical data regarding the buffer state and its stability. |
| createBufferGraph(container:string | HTMLElement, interval:number) | Graph for video buffer size | BufferGraph | Creates a buffer size graph in the specified location (container ID or reference). The graph is a separate object that must be started using its start() method and stopped using its stop() method. The dimensions of the graph depend on the dimensions of the specified container. |
| createBandwidthGraph(container:string | HTMLElement, interval:number) | Graph for bandwidth speed | BandwidthGraph | Creates a bandwidth performance graph in the specified location (container ID or reference). The graph is a separate object that must be started using its start() method and stopped using its stop() method. The dimensions of the graph depend on the dimensions of the specified container. |
| createBufferStabilityGraph(container:string | HTMLElement, interval:number) | Graph for buffer stability | BufferStabilityGraph | Creates a buffer stability graph in the specified location (container ID or reference). The graph is a separate object that must be started using its start() method and stopped using its stop() method. The dimensions of the graph depend on the dimensions of the specified container. |
Table 1. API methods table.
Objects & Enums
PlaybackState Enum| Value | Description |
|---|---|
| INITIALIZED | Component has been initialized. |
| PLAYING | Stream is playing. |
| BUFFERING | Stream is buffering. |
| PAUSED | Stream was paused by user or a browser. |
| STOPPED | Stream has been stopped. |
| UNKNOWN | Unknown state. |
Table 2. PlaybackState Enum table.
| Value | Description |
|---|---|
| NOT_INITIALIZED | Stream has not been initialized. |
| INITIALIZED | Stream has been initialized. |
| NOT_FOUND | Stream has not been found. |
| AWAITING | Stream exists, but there is no data yet. |
| NOT_PUBLISHED | Stream exists, but hasn't been published. |
| PUBLISHED | Stream exists and it's published (can stream). |
| UNPUBLISHED | Stream exists, but has been unublished. |
| STOPPED | Stream existed, but has been stopped (server-side). |
| CLOSED | Stream existed, but has been removed (server-side). |
| UNKNOWN | Stream status is unknown (there is no connection a the server). |
| ERROR | Error while retrieving stream status. |
Table 3. StreamState Enum table.
| Value | Description |
|---|---|
| FILL | Scales content to fill the entire container, may distort aspect ratio. |
| LETTER_BOX | Scales content to fit within container while preserving aspect ratio, may add black bars. |
| CROP | Scales content to fill container while preserving aspect ratio, may crop edges. |
| ORIGINAL | Displays content at its original size without scaling. |
Table 4. ScalingType Enum table.
| Value | Description |
|---|---|
| PASSIVE | Library will use previously saved information from RESOLUTIN_AWARE mode, but it'll not react to any resize. |
| RESOLUTION_AWARE | Quality will depend on library screen size and source resolution (closest match). |
| HIGHEST_QUALITY | Library will always pick the highest available quality. |
| LOWEST_QUALITY | Library will always pick the lowest available quality. |
| UNKNOWN | Quality mode has not been provided or Quality Control has not been initialized yet. |
Table 5. QualityControlMode Enum table.
| Field | Return Value | Description |
|---|---|---|
| name | string | Common name of the server. |
| group | string | Group name of the server. |
| protocolVersion | number | Protocol version used by the server. |
| serverInitTime | number | Server initialization time as Unix timestamp. |
| version | number | Version of the server protocol. |
Table 6. ServerInfo Object table.
| Field | Return Value | Description |
|---|---|---|
| id | number | Returns the quality item ID, which can later be used to activate this particular quality. |
| label | string | Returns the quality label, which consists of the vertical resolution and "p", e.g., "1080p". |
| monogram | string | Returns the monogram for this quality based on its resolution, e.g., "LQ", "SD", "HD", "FH", "2K", "4K". |
| isAuto | boolean | Returns true if this quality item is of the auto type. |
Table 7. QualityItem Object table.
Support Needed?