First, a valid IBM Cloud Video embed iframe will be needed to use the Embed API. Log in to your managed IBM Cloud Video account as an administrator of your channel. Then navigate to the Embed Configurator page on your Dashboard by selecting the "Embed" option as seen below:
+
First, a valid IBM Watson Media embed iframe will be needed to use the Embed API. Log in to your managed IBM Watson Media account as an administrator of your channel. Then navigate to the Embed Configurator page on your Dashboard by selecting the "Embed" option as seen below:
After selecting an option with the IBM Cloud Video Player, the Embed Configurator is displayed. The Configurator enables channel administrators to set the properties of the Player embed. When it's done, the proper iframe HTML element can be copied to the clipboard with the button which is highlighted in the next picture.
-
The next step is to include a unique ID in this iframe element. We will use "UstreamIframe".
+
The next step is to include a unique ID in this iframe element. We will use "PlayerIframe".
Create an instance of the Embed API by providing the ID of the iframe. The iframe code should look like this:
The default behaviour of the player can be modified by extending the src URL with any of the following parameters:
@@ -44,13 +44,13 @@
URL parameters
allowfullscreen
-
Disables fullscreen and remove the button.
+
Enables full-screen. False value makes the full-screen button inactive.
true/false
true
autoplay
-
Starts video playback automatically.
+
Starts video playback automatically. Browser settings are stronger and may override the value of this parameter.
true/false
false
@@ -66,35 +66,29 @@
URL parameters
true/false
false
-
-
offaircontent
-
Disables displaying offair content.
-
true/false
-
true
-
forced-quality
-
Overrides the automatic quality selection.
+
Turns off the automatic quality selection and selects the appropriate quality. Low is the smallest available quality, high is the largest and med is the middlemost choice.
low, med, high
-
auto
+
N/A
initial-quality
-
Sets the initial quality for the automatic quality selection.
+
Sets the initial quality for the automatic quality selection. The quality selection logic is still turned on and can switch to another quality after playback is started.
low, med, high
-
auto
+
N/A
showtitle
-
Hides title and viewer count.
+
Shows title and viewer count information inside the player area.
true/false
true
volume
-
Overrides the default volume. 0 is mute, 1 is max volume.
-
0.0-1.0
-
user setting
+
Set volume for playback as a percentage of the max volume. Overrides the default volume (100).
+
0-100
+
100
@@ -118,7 +112,7 @@
Example
stop
-
Pauses the live stream, or stops the video and jumps back to the start.
+
Pauses the live stream. In case of videos it stops the video and jumps back to the start.
Example
viewer.callMethod('stop');
@@ -127,8 +121,8 @@
Example
load
Loads a channel or a video in the player. Requires two additional arguments:
-
type - the loaded content type (channel | video)
-
id - the loaded content id
+
type - content type ('channel' or 'video')
+
id - media id
Example
@@ -139,7 +133,7 @@
Example
seek
Jumps to given position in played recorded video. Requires one argument:
-
position in seconds
+
position - target time in seconds
Example
@@ -149,7 +143,7 @@
Example
volume
Sets the playback sound volume. Requires one argument:
-
volume percent between 0-100
+
volume percent between 0-100
Example
@@ -159,20 +153,20 @@
Example
quality
Sets the stream quality, if available. Requires one argument:
-
a qualityID key from received quality options in quality event
+
an id key from received quality options in quality event
Example
-
viewer.callMethod('quality', 16); //set to high
+
viewer.callMethod('quality', 0); //set to highest quality
cc (closed caption)
-
Enables the selected closed caption if available. Requires one argument:
+
Displays the selected closed caption if available. You can use the 'None' option by using -1 as the argumnet. Otherwise it requires this argument:
-
a ccIndex key from the received closed caption array in cc event
+
an index key from the received closed caption object in cc event
Example
-
viewer.callMethod('cc', 1); //enable the closed caption with index 1
+
viewer.callMethod('cc', 1); //enables the closed caption with index 1viewer.callMethod('cc', -1); //disables the closed caption
getProperty
@@ -180,22 +174,30 @@
getProperty
Accessible properties by getProperty:
duration
-
Get the video duration in seconds.
+
Get the video duration in seconds.milliseconds precision.
Example
viewer.getProperty('duration', function (duration) {
...
-});
+}); //returns e.g. 123.654
viewers
-
Get the current viewer count for the loaded live stream.
+
Get the current viewer count for the loaded live stream. Doesn't return anything in case of videos.
Example
viewer.getProperty('viewers', function (viewerNumber) {
...
});
+
allTimeTotalviewers
+
Get the accumulated total viewer number for the loaded channel. Doesn't return anything in case of videos.
+
+
Example
+
viewer.getProperty('allTimeTotalViewers', function (allTimeViewerNumber) {
+ ...
+});
+
progress
Get the current progress for recorded video playback, in seconds.
var list = $('.quality-selector');
list.empty();
for (var id in data) {
- list.append('');
+ list.append('');
}
//updating value of the custom select gui element
diff --git a/_posts/2015-11-10-dynamic-insertion.html b/_posts/2015-11-10-dynamic-insertion.html
index 3b84e47..54d9398 100644
--- a/_posts/2015-11-10-dynamic-insertion.html
+++ b/_posts/2015-11-10-dynamic-insertion.html
@@ -33,7 +33,7 @@
-