UIContainerPlugin Class
The base class for an ui container plugin
Constructor
UIContainerPlugin
()
Item Index
Methods
Events
- CONTAINER_BITRATE
- CONTAINER_HIGHDEFINITIONUPDATE
- CONTAINER_LOADEDMETADATA
- CONTAINER_LOADEDTEXTTRACK
- CONTAINER_MEDIACONTROL_HIDE
- CONTAINER_MEDIACONTROL_SHOW
- CONTAINER_OPTIONS_CHANGE
- CONTAINER_PLAYBACKSTATE
- CONTAINER_PROGRESS
- CONTAINER_READY
- CONTAINER_SEEK
- CONTAINER_SETTINGSUPDATE
- CONTAINER_STATE_BUFFERFULL
- CONTAINER_STATE_BUFFERING
- CONTAINER_TIMEUPDATE
- CORE_CONTAINERS_CREATED
- CORE_FULLSCREEN
- CORE_OPTIONS_CHANGE
- CORE_READY
- CORE_SCREEN_ORIENTATION_CHANGED
- MEDIACONTROL_CONTAINERCHANGED
- MEDIACONTROL_FULLSCREEN
- MEDIACONTROL_HIDE
- MEDIACONTROL_MOUSELEAVE_SEEKBAR
- MEDIACONTROL_MOUSEMOVE_SEEKBAR
- MEDIACONTROL_NOTPLAYING
- MEDIACONTROL_PLAYING
- MEDIACONTROL_SHOW
- PLAYBACK_BITRATE
- PLAYBACK_BUFFERFULL
- PLAYBACK_BUFFERING
- PLAYBACK_DVR
- PLAYBACK_ENDED
- PLAYBACK_ERROR
- PLAYBACK_HIGHDEFINITIONUPDATE
- PLAYBACK_LEVEL_SWITCH_END
- PLAYBACK_LEVEL_SWITCH_START
- PLAYBACK_LEVELS_AVAILABLE
- PLAYBACK_LOADEDMETADATA
- PLAYBACK_PAUSE
- PLAYBACK_PLAY
- PLAYBACK_PLAY_INTENT
- PLAYBACK_PLAYBACKSTATE
- PLAYBACK_PROGRESS
- PLAYBACK_READY
- PLAYBACK_SETTINGSUPDATE
- PLAYBACK_STOP
- PLAYBACK_TIMEUPDATE
- PLAYER_ENDED
- PLAYER_ERROR
- PLAYER_FULLSCREEN
- PLAYER_PAUSE
- PLAYER_PLAY
- PLAYER_READY
- PLAYER_RESIZE
- PLAYER_SEEK
- PLAYER_STOP
- PLAYER_TIMEUPDATE
- PLAYER_VOLUMEUPDATE
Methods
$
-
selector
Parameters:
-
selectorStringa selector to find within the component.
Returns:
Example:
fullScreenBarUIComponent.$('.button-full') //will return only .button-full within the component
_ensureElement
()
private
constructor
-
options
cid
* making sure the element is created $el
* delegating all events to the element
Parameters:
-
optionsObjectthe options object
delegateEvents
-
events
events on element to its callbacks
Parameters:
-
eventsObject
Returns:
listenTo
-
obj -
name -
callback -
context
listen to an event indefinitely for a given obj
Example:
this.listenTo(this.core.playback, Events.PLAYBACK_PAUSE, this.callback)
listenToOnce
-
obj -
name -
callback -
context
listen to an event once for a given obj
Example:
this.listenToOnce(this.core.playback, Events.PLAYBACK_PAUSE, this.callback)
off
-
name -
callback -
context
stop listening to an event
on
-
name -
callback -
context
listen to an event indefinitely, if you want to stop you need to call off
once
-
name -
callback -
context
listen to an event only once
render
()
UIObject
element
Returns:
setElement
-
element -
delegate
el and $el
Parameters:
-
elementHTMLElement -
delegateBooleanwhether is delegate or not
Returns:
stopListening
-
obj -
name -
callback
stop listening an event for a given object
Properties
attributes
Object
Example:
class MyButton extends UIObject {
constructor(options) { super(options) }
get attributes() { return { class: 'my-button'} }
}
// MyButton.el.className will be 'my-button'
events
Object
Example:
class MyButton extends UIObject {
constructor(options) {
super(options)
this.myId = 0
}
get events() { return { 'click': 'myClick' } }
myClick(){ this.myId = 42 }
}
// when you click on MyButton the method myClick will be called
Events
CONTAINER_BITRATE
Fired when the container updates its bitrate
Event Payload:
-
bitrateObjectData bitrate object
-
[bandwidth]Number optionalbitrate bandwidth when it's available
-
[width]Number optionalplayback width (ex: 720, 640, 1080)
-
[height]Number optionalplayback height (ex: 240, 480, 720)
-
[level]Number optionalplayback level when it's available, it could be just a map for width (0 => 240, 1 => 480, 2 => 720)
-
CONTAINER_HIGHDEFINITIONUPDATE
Fired when container updates its video quality
Event Payload:
-
isHD trueBooleanwhen is on HD, false otherwise
CONTAINER_LOADEDMETADATA
Fired when the container loaded its metadata
CONTAINER_LOADEDTEXTTRACK
Fired when a text track is loaded and available on container for display
CONTAINER_MEDIACONTROL_HIDE
Fired when the media control hides
CONTAINER_MEDIACONTROL_SHOW
Fired when the media control shows
CONTAINER_OPTIONS_CHANGE
Fired when the options were changed for the container
CONTAINER_PLAYBACKSTATE
Fired when the container internal state changes
CONTAINER_PROGRESS
Fired when the container is downloading the media
CONTAINER_READY
Fired when the container is ready
CONTAINER_SEEK
Fired when the container seeks the video
Event Payload:
-
timeNumberthe current time in seconds
CONTAINER_SETTINGSUPDATE
Fired when the container changes any settings (volume, seek and etc)
CONTAINER_STATE_BUFFERFULL
Fired when the container filled the buffer
CONTAINER_STATE_BUFFERING
Fired when container is buffering
CONTAINER_TIMEUPDATE
Fired when the time is updated on container
CORE_CONTAINERS_CREATED
Fired when the containers are created
CORE_FULLSCREEN
Fired when the fullscreen state change
Event Payload:
-
whetherBooleanor not the player is on fullscreen mode
CORE_OPTIONS_CHANGE
Fired when the options were changed for the core
CORE_READY
Fired after creating containers, when the core is ready
CORE_SCREEN_ORIENTATION_CHANGED
Fired when the screen orientation has changed. This event is trigger only for mobile devices.
MEDIACONTROL_CONTAINERCHANGED
Fired when the container was changed
MEDIACONTROL_FULLSCREEN
Fired when the player enters/exit on fullscreen
MEDIACONTROL_HIDE
Fired when the media control hides
MEDIACONTROL_MOUSELEAVE_SEEKBAR
Fired when mouse leaves the seekbar
Event Payload:
-
event theObjectjavascript event
MEDIACONTROL_MOUSEMOVE_SEEKBAR
Fired when mouse enters on the seekbar
Event Payload:
-
event theObjectjavascript event
MEDIACONTROL_NOTPLAYING
Fired when the media is not being played
MEDIACONTROL_PLAYING
Fired when the media is being played
MEDIACONTROL_SHOW
Fired when the media control shows
PLAYBACK_BITRATE
Fired when playback updates its bitrate
Event Payload:
-
bitrateObjectData bitrate object
-
[bandwidth]Number optionalbitrate bandwidth when it's available
-
[width]Number optionalplayback width (ex: 720, 640, 1080)
-
[height]Number optionalplayback height (ex: 240, 480, 720)
-
[level]Number optionalplayback level when it's available, it could be just a map for width (0 => 240, 1 => 480, 2 => 720)
-
PLAYBACK_BUFFERFULL
Fired when the playback has enough in the buffer to be able to play smoothly, after previously being unable to do this.
This corresponds to the playback buffering property being
false.
PLAYBACK_BUFFERING
Fired when the playback starts having to buffer because playback can currently not be smooth.
This corresponds to the playback buffering property being
true.
PLAYBACK_DVR
Fired when DVR becomes enabled/disabled.
Event Payload:
-
stateBooleantrue if dvr enabled
PLAYBACK_ENDED
Fired when the media for a playback ends.
Event Payload:
-
nameStringthe name of the playback
PLAYBACK_ERROR
Fired if an error occurs in the playback.
PLAYBACK_HIGHDEFINITIONUPDATE
Fired when playback updates its video quality
Event Payload:
-
isHD trueBooleanwhen is on HD, false otherwise
PLAYBACK_LEVEL_SWITCH_END
Fired when the playback ends the level switch
PLAYBACK_LEVEL_SWITCH_START
Fired when the playback starts to switch level
PLAYBACK_LEVELS_AVAILABLE
Fired when the playback has its levels
PLAYBACK_LOADEDMETADATA
Fired when playback loaded its metadata
PLAYBACK_PAUSE
Fired when the media for a playback pauses.
PLAYBACK_PLAY
Fired when the media for a playback starts playing.
This is not necessarily when the user requests play()
The media may have to buffer first.
I.e. isPlaying() might return true before this event is fired,
because isPlaying() represents the intended state.
PLAYBACK_PLAY_INTENT
Fired when user requests play()
PLAYBACK_PLAYBACKSTATE
Fired when playback internal state changes
PLAYBACK_PROGRESS
Fired when the playback is downloading the media
PLAYBACK_READY
Fired when playback is ready
PLAYBACK_SETTINGSUPDATE
Fired when playback changes any settings (volume, seek and etc)
PLAYBACK_STOP
Fired when the media for a playback is stopped.
PLAYBACK_TIMEUPDATE
Fired when the time is updated on playback
PLAYER_ENDED
Fired when player ends the video
PLAYER_FULLSCREEN
Fired when player changes its fullscreen state
Event Payload:
-
whetherBooleanor not the player is on fullscreen mode
PLAYER_PAUSE
Fired when player pauses
PLAYER_PLAY
Fired when player starts to play
PLAYER_READY
Fired when the player is ready on startup
PLAYER_RESIZE
Fired when player resizes
Event Payload:
-
currentSizeObjectan object with the current size
PLAYER_SEEK
Fired when player seeks the video
Event Payload:
-
timeNumberthe current time in seconds
PLAYER_STOP
Fired when player stops
PLAYER_TIMEUPDATE
Fired when the time is updated on player
PLAYER_VOLUMEUPDATE
Fired when player updates its volume
Event Payload:
-
volumeNumberthe current volume