Livestream video embed

Dailymotion custom embed supports the embed of a livestream.

Embed Example:

You only need to add your livestream’s xid in videoId field. Here is an example.

<div class="dm-player"
    playerId="{PLAYER_ID}"
    owners="{YOUR_CHANNEL_NAME}"
    videoId="{VIDEO_ID}"
/>

This also works with private videos using a kid in the privateVideoId.

Livestream replacement logic:

• If the livestream is onair, the player will embed the livestream.
• if the livestream is offair and scheduled, the player will embed the livestream.
• if the livestream is offair and not scheduled, The player will embed will find any recording related to the Livestream and embed that video.
• if the livestream is offair, not scheduled with no record, the player check fallbackplaylist parameter present then player will embed the playlist.
• if the livestream is offair, not scheduled with no record and no fallbackplaylist parameter, The player will fetch a recent video from the given CHANNEL_NAME to embed.

Livestream replacement with fallbackPlaylist: Here is an example to add fallbackplaylist parameter.

<div class="dm-player"
    playerId="{PLAYER_ID}"
    owners="{YOUR_CHANNEL_NAME}"
    videoId="{VIDEO_ID}"
    fallbackplaylist="{PLAYLIST_ID}">
/>

We provide also information on the player notifying that the current video is a replacement of a Livestream. The player also checks in every 5 minutes ( by default ) from the DATA-API the onair status of the Livestream. If the Livestream is live / on air then the player will change back the current video to Livestream instead. Even when the player loads, the player checks Livestream on air status and follows the same flow.

Replacement information:

We also provide the option to change auto replacement, the interval and the text in the information when Livestream is replaced. By adding <script type="application/json" id="dm_player_text" > tag, the text in the information can be changed.

Here is an example.

<script type="application/json" id="dm_player_text">
    {
        "livestream" : {
            "auto_replace": false,
            "info_time" : 0.5,
            "info_title" : "this is custom message.",
            "info_learn" : "Learn more..",
            "info_details" : "this is custom details of the livesteam message. It can be edited as needed."
        }
    }
</script>

Data Format :

Name	Type	Default	Description
auto_replace	boolean	true	Auto replacement with current video/playlist when Livestream is onair. For false player will not replace with Livestream video automatically. Learn More
info_time	number	5	Interval time in minutes for checking Livestream video’s onair status. reference
info_title	string	This video is a livestream replacement.	short note at bottom of the player if replacement video is playing
info_learn	string	Learn more..	Anchor text to show details of the replacement information.
info_details	string	The livestream is currently off air. The system will check for livestream's status every 5 minutes; you can also refresh the page.	Details of the replacement information.

auto_replace:

By default the player will reload with Livestream video when it is onair replacing the current video/playlist in the player. Setting false will have two more features. i.e.,

• player will not load the Livestream video even if it is onair. Switch to Live button will show the details of replacement information.
• The Player will also dispatch customEvent named dm-player-onair on document when Livestream is onair. Here is an example.

document.addEventListener("dm-player-onair", (e)=>{
  const player = e.detail.player;  // player object : JavaScript Player API Reference
})

Fetching video metadata:

We trigger a customEvent named dm-player-created on document when player is created. We also expose player object(JavaScript Player API Reference) with the event. By the player object reference, you can fetch player state containing video metadata such as videoTitle, videoDuration etc.

Here is an example.

document.addEventListener("dm-player-create", (e)=>{
  const player = e.detail.player;  // player object : JavaScript Player API Reference
  player.getState().then(state=>{
    console.log(state.videoDuration); // result : duration of the video in seconds  E.g. 78
    console.log(state.videoTitle); // result : title of the video E.g. "this a video title"
  });
})

Example:

• livestream playground

This site is open source. Improve this page.