Planet eStream iFrame Player API
Getting Started
The following sample shows some basic HTML Markup that will add the Planet eStream Player API script and then load a Planet eStream Player Object. It also includes a couple of examples of making calls to control the playback of the media.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<!--The Planet eStream Video Player will be placed within this <div> tag-->
<div id="pesvideo"></div>
<script>
//Add the reference the Planet eStream iFrame Player API
var tag = document.createElement('script');
tag.src = "//dev.planetestream.org/w/?id=225727&code=i9~F8tlhbCi6vLIcKHrjYCSfnmM76deu5ESdDRuVmUh";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var pesplayer;
//Once the API script is loaded it will call the following named function
function funcPESPlayerAPIReady() {
//Create a new instance of the Planet eStream Player Object by passing the ID of the <div> element
//which will contain the iFrame Player as the first argument.
//Pass an object as the second parameter that sets out the player parameters required
pesplayer = new PESPlayer('pesvideo', {
ShowSubs: false,
Loop: false,
mediaReady: function(){
//Callback for when the iFrame Player has loaded up the media ready for playback
}
});
}
//Make a call to the API to play this instance of the Planet eStream Player
function funcPlayVideo(){
pesplayer.Play();
}
//Make a call to the API to pause this instance of the Planet eStream Player
function funcPauseVideo(){
pesplayer.Pause();
}
</script>
</body>
</html>
Player Parameters
The Planet eStream Player API will accept a number of parameters when the Player Object is created.
Parameter |
Example |
Usage |
MuteOnInit |
Boolean |
Set the player to initialise with muted audio. |
AutoStart |
Boolean |
Set the player to start the media when ready, please note some browsers disable autostart of non-muted video content. |
Loop |
Boolean |
Set the media to be played back on a loop. |
OverlayControls |
Boolean |
A styling option to set the controls to be overlaid the video content. |
HideControls |
Boolean |
Set to true to hide the controls in the iFrame. This option is recommended for instances that will have custom controls. |
ShowSubs |
Boolean |
Set to show the default subtitle track automatically, if available. |
Player Functions
Name |
Details |
pesplayer.Play():Void |
This will start the media playback if not currently playing, and will resume playback after the media has started. |
pesplayer.Pause():Void |
Call to pause the playback of the media. |
pesplayer.getVolume():Promise |
Returns a Promise, which when successful passes a decimal value representing the current volume level. Volume levels are decimal numbers between 0 and 1. |
pesplayer.setVolume(val:Number):Void |
Set the volume level with a decimal value between 0 and 1. |
pesplayer.ToggleMute():Void |
Call to toggle the mute status of the audio. |
pesplayer.getPlaybackRate():Promise |
Returns a Promise, which when successful passes a decimal value representing the current playback rate.
|
pesplayer.getState():Promise |
Returns a Promise, which when successful passes an object including details on the current state of the media playback.
{
DisplayTime: Number;
DisplayDuration: Number;
Paused: Boolean;
PlaybackRate: Number;
Muted: Boolean;
}
|
pesplayer.OpenMedia(id:String):Void |
|
pesplayer.Destroy():Void |
|
Example Test Player
Muted
Controls Hidden
Overlay Controls
AutoStart
Loop
Show Subtitles
Basic Splashscreen
Show Playlist Items
Show Notes
Show Link
Require Authentication (remove player to ensure options take effect)
Target Video Player Container
Current Time |
|
Duration |
|
Is Paused |
|
Playback Rate |
|
Is Muted |
|