Choose Search Mode

Media

Search media metadata

Subtitles

Search content subtitles

Tools and Options

Create and Import New Content

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



Target Video Player Container
Current Time
Duration
Is Paused
Playback Rate
Is Muted
User Settings
Dark Mode

Enable dark mode

Language

Select preferred language

Email Notifications

Choose to subscribe or unsubscribe to email notifcations

Cookie Policy Status

Choose to decline the cookie policy status. If you choose to decline the cookie policy you will be logged out of the solution. You will still be able to login to the website but will be asked to accept the policy again.

LGfL TV Site Logo
Login with Account
Cancel
LGfL TV is an open access resource. there is no need to log in to view content.

It appears you are offline, please check network connectivity.

Close

Search Filters

Toggle Advanced
Keywords
Media Types
Category Filter

Select a student that has been tagged in media

Create New Media Create New Photoset Create New Playlist

Category selection is mandatory

Add to a Category

Add your items to a single or any number of Categories

Select Categories

Chapters

Sorry, there are no Chapters available for this item.

Slide Search Text

Item Options

Item Details

Interactive Timeline

Sorry, there are no Quizzes available for this item, open the editor below to create a new interactive timeline.