Event Catalog

Event Catalog

Many different events are triggered internally by the framework as the user interacts with the application. You can use them to write event driven code to keep your features synchronized with the current state of the application. Other third party widgets may also create their own events that you can interact with, however, the following catalog of events refer only to the core events provided by the framework.

Sandbox

Launch Sandbox Want to get hands on with the examples in this documentation? We've put together a sandbox that you can use to fiddle with the framework in real time. Use it to test new designs or run your own experiments!

Music Events

Playlist Events

Music Events

Music Change: bbflex-nowplaying : (media)

Event Params:

  • media: object : A beat object representing the new song

This event is triggered each time the active beat in the application is changed, either by the playlist advancing to the next song, or through an API method that selects a new song to be active.

Example:
flexloader.execute(function($, App) {
  App.on('bbflex-nowplaying', function(media) {
    alert('New Song: ' + media.title);
  });
});

Music Play: bbflex-play : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

This event is triggered each time the music player begins playing a new song, or resumes playing a paused song.

Example:
flexloader.execute(function($, App) {
  App.on('bbflex-play', function(event, player) {
    var media = event.jPlayer.status.media;
    alert('Playing: ' + media.title);
  });
});

Music Pause: bbflex-pause : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

This event is triggered each time the music player is paused.

Example:
flexloader.execute(function($, App) {
  App.on('bbflex-pause', function(event, player) {
    var media = event.jPlayer.status.media;
    alert('Paused: ' + media.title);
  });
});

Volume Change: bbflex-volumechange : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

This event is triggered each time the volume of the music player is changed.

Example:
 

Time Update: bbflex-timeupdate : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

This event is triggered continually as the play position changes for the currently playing song in the music player.

Example:
 

Music Seeking: bbflex-seeking : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

Example:
 

Loading Progress: bbflex-progress : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

This event is triggered continually as new media is being downloaded to the music player.

Example:
 

Repeat Changed: bbflex-repeat : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

This event is triggered each time the "repeat" feature of the music player is changed.

Example:
 

Music Ended: bbflex-ended : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

This event is triggered when the music player reaches the end of a song.

Example:
 

Music Error: bbflex-jplayer-error : (event, player)

Event Params:

  • event : object : A jPlayer event object
  • player : jQuery instance : The jPlayer instance that generated the event

Example:
 

Playlist Events

Showing Playlists: bbflex-playlists-show

Event Params:

  • None

This event is triggered when the framework is going to show a dialog to the user to select from the available playlists.

Example:
 

Playlist Reset: bbflex-playlist-reset : (id)

Event Params:

  • id: String : The ID of the playlist which has been reset

This event is triggered immediately after a playlist is initialized by the framework, or after a playlist is reset by the framework in order to begin reloading the playlist media. Either way, information about the playlist is available immediately via the playlists interface, but the playlist will have been reset to an empty media array.

Example:
 

Playlist Updated: bbflex-playlist-updated : (id, media, index)

Event Params:

  • id: String : The ID of the playlist which has been updated
  • media: Object : The media object of the beat that was added
  • index: Integer : The index of the beat in the playlists media array

This event is triggered every time a playlist is updated with a new beat. It is triggered once for each and every time a new beat is added to the playlist.

Example:
 

Playlist Changed: bbflex-playlist-changed : (id)

Event Params:

  • id: String : The ID of the new active playlist

This event is triggered by the framework any time the active playlist in the application is changed.

Example: