Statistics
Once the video is published, or you’ve created a playlist or a live event, you can get the Embed code to insert the video on your website or on the Web TV. Click on Embed button to get the code: copy and paste it in your web page.
In Customize embedding code is also possible to personalize some parameters for a better integration of the video on your website.
- Player Style: here to choose the player theme we want to use. The theme must be configured inside the Player section
- Social Share URL: here you can insert the link of the web page where you’re going to embed the video. The link will be auto-generated when the users will click the social share button to share the video on social medias (like Tumblr, Facebook, Twitter, LinkedIn, etc.)
- Auto-Play: if enabled, the video will be automatically started at the opening of the web page
- Use HTTPS: enable only if the website is on a HTTPS domain
In the same window we can send the video via e-mail or get a direct link.
It’s possible to use another form of embed, by using Javascript.
You can do it by declaring in header the mainstreaming.js file using next line:
<script src=”//video.mainstreaming.tv/sdk/13/js/mainstreaming.js” type=”text/javascript”></script>
Successively declare an empty div and give it an id; this div will be the video container.
<div id=”video”></div>
Call Javascript embed function and pass the contentId and an object of parameters.
<script type=”text/javascript”>
myplayer = new MainStreaming.embed(‘contentId’, { containerID: ‘video’, wmode: ‘direct’ });
</script>
As option parameters you can specify:
- skinId: skin id
- hideControls:you can hide video player controls (true or false)
- cuepoint: You can active programmable cuepoints (true or false)
- width: div width
- height: div height
The object created by the embed function will be inserted in a list of object called MainStreaming.instances. In every instance you can insert some event listeners.
The id instance of the list is composed by MsPlayer-containerID, where containerId is the id previously declared to the div. So in our example the name will be MainStreaming.instances[‘MsPlayer-video’].
MainStreaming’s player has different JavaScript methods that permits to control the video, so you can do different customizable logics. Using player’s instance you can do the follows:
Start video reproduction:
myplayer.play();
Stop video reproduction:
myplayer.pause();
Do the seek inside a video (t parameter is expressed in seconds):
myplayer.seek(t);
Enable the video mute (insert true or false as status parameter):
myplayer.muted(status);
In the playlist one shot you can go on the next or prev videos using this methods:
myplayer.next();
myplayer.prev();
From MainStreaming.instances, list of objects, we can take one player and assign to it some personalized events as:
function myFunctionOnProgress(t){
console.log(t);
}
MainStreaming.instances[‘MsPlayer-video’].onProgress = myFunctionOnProgress;
Video player supports different listeners and they are:
- onProgress: called continuously while player is in play, and return the current playing second
- onCuePoint: called when there is correspondence with a cuepoint defined via API
- onLiveUTCTimeStamp: if the video is a transcoded LIVE, this listener emits every ten seconds the date when the video is been trasmitted. The date is in UTC.
- onFirstPlay: called when first play is clicked
- onAdPlay: called when an advertising preroll video is watched
- onAdFullView: called when an advertising preroll video is entirely watched.
