Player SDK 1.0 : Getting Started

{TOC}

====Embedding the Player====

Embedding the Player involves:
::loading a JavaScript library from Company Webcast servers
::adding a DIV to your DOM that the Javascript library can fill with the Player
::initializing the Player from Javascript.{BR}{BR}
{BR}{BR}
@@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Player SDK Sample Application</title>
</head>
<body>
    <div id="playerContainer" style="width:640px;height:360px;"></div>
</body>
</html>

< script type="text/javascript" src="//sdk.companywebcast.com/sdk/cwc/iframe/player/client.js"></script>
< script type="text/javascript">

    var cwcPlayer = cwc.iframe.player.client.create({
        id: 'customer/code'
    });

    document.getElementById("playerContainer").appendChild(cwcPlayer.element);

</script>
@@
{BR}{BR}{BR}
====Customizing playback====

Players can be configured to start playback from a specific position.{BR}
Players can be configured to play a fragment, or a series of fragments, from a single Webcast.{BR}
Players can be configured to hide specific Player functionality and UI features.{BR}

Player initialization accepts the following parameters:{BR}{BR}
::''id''
:::A string. This is the WebcastCode, or WebcastGuid that you have retrieved through other components of the Company Webcast API.
::''offsets''
:::An array of integers. Expose only parts of the media stream. This is essentially virtual fragment generation. In milliseconds: <nowiki>[</nowiki>start, end, start, end<nowiki>]</nowiki>.
::''start''
:::An integer. In milliseconds, the position from where the Player will commence playback. The start property is applied after any configured offsets are applied.
::''identificationToken''
:::A string. Allows for Single Signon scenarios.
::''display''
:::A Bitwise OR. Configures which parts of the Player are visible.
:::Not setting this property will display all buttons.

:::Options are:
::::1
:::::display home button
::::2
:::::display topics button

@@
< script type="text/javascript">

    var cwcPlayer = cwc.iframe.player.client.create({
        id: 'customer/code',
        start: 5000,
        offsets: [20000, 40000, 50000, 80000],
        display: 1 | 2
    });

</script>
@@
{BR}{BR}


====Methods====

An instance of the embedded player has 2 methods.
{BR}{BR}
Available methods:{BR}{BR}
::''on''
:::See ''[#Event_handling_3|Event handling]''
::''seek''
:::Accepts an integer as its input parameter. In milliseconds. Media playback jumps to the given position.
{BR}{BR}
@@
< script type="text/javascript">

    cwcPlayer.seek(5000);

</script>
@@
{BR}{BR}
{BR}{BR}
====Event handling====

Event listeners can be attached to the embedded player, so events can be received for changes in metadata.
{BR}{BR}
Available Events:{BR}{BR}
::''cwc.sdk.player.resource.create''{BR}{BR}
:::Fires when a new ''resource'' is added to the model. This happens during initialization, when metadata is loaded into the player, and when new resources are added during a live Webcast.{BR}
:::Returns a ''resourceCreateEvent''.{BR}{BR}
::::properties of ''resourceCreateEvent'' are:
{BR}
:::::''playerId''
::::::A string. The id of the player instance that generated the event.
:::::''resource''
::::::Either a ''[#ispeakerResourcei_4|speakerResource]'', or a ''[#itopicResourcei_5|topicResource]''. The ''resource'' that was added to the model.
{BR}{BR}
::''cwc.sdk.player.resource.properties.change''{BR}{BR}
:::Fires when a resource activates or de-activates.{BR}
:::Returns a ''resourceChangeEvent''.{BR}{BR}
::::properties of ''resourceChangeEvent'' are:
{BR}
:::::''playerId''
::::::A string. The id of the player instance that generated the event.
:::::''resource''
::::::Either a ''[#ispeakerResourcei_4|speakerResource]'', or a ''[#itopicResourcei_5|topicResource]''. The ''resource'' that was changed.
:::::''properties.isActive''
::::::A boolean. If true, the resource is currently active.
:::::''view''
::::::A string. Either "current" or "live". The embedded player has DVR features, meaning users are able to pause and rewind a live stream. This is why the ''cwc.sdk.player.resource.properties.change'' event fires both when a ''resource'' changes on the current position in the timeline, and when a ''resource'' changes in the "live playhead". For most cases you would only be interested in events of the "current" view.
{BR}{BR}
{BR}{BR}
@@
< script type="text/javascript">

    cwcPlayer.on('cwc.sdk.player.resource.create', function (resourceCreateEvent) {

    });

    cwcPlayer.on('cwc.sdk.player.resource.properties.change', function (resourceChangeEvent) {

    });

</script>
@@
{BR}{BR}
{BR}{BR}
====''speakerResource''====
Contains information about a speaker.{BR}{BR}
''speakerResource'' has the following properties:{BR}{BR}
::''id''
:::A string. The id of the resource. These map onto id's that you've retrieved from other components of the Company Webcast API.
::''namespace''
:::A string. Contains "cwc.legacy.speaker".
::''order''
:::An integer. If applicable, contains a number indicating the position of the resource in a list of resources of the same type.
::''category''
:::A string. The category of the speaker. This may contain the political party of the speaker, or a company department, for example.
::''name''
:::A ''speakerName'' object.
:::''speakerName'' has the following properties:
::::''title''
:::::A string. The title of the speaker.
::::''first''
:::::A string. The first name of the speaker.
::::''middle''
:::::A string. The middle name of the speaker.
::::''last''
:::::A string. The last name of the speaker.
::::''full''
:::::A string. The full name of the speaker.
::''role''
:::A string. The role of the speaker.
{BR}{BR}
{BR}{BR}
====''topicResource''====
Contains information about a topic.{BR}{BR}
''topicResource'' has the following properties:{BR}{BR}
::''id''
:::A string. The id of the resource. These map onto id's that you've retrieved from other components of the Company Webcast API.
::''namespace''
:::A string. Contains "cwc.legacy.topic".
::''order''
:::An integer. If applicable, contains a number indicating the position of the resource in a list of resources of the same type.
::''label''
:::A string. Contains the title of the topic.
::''description''
:::A string. Present if available. Contains a description of the topic.
Companywebcast API Wiki

Navigation

Player SDK 1.0 : Getting Started
