Dailymotion Play Dailymotion videos directly within JW Player 7



The Dailymotion JW Player plugin uses the Data API to show the Dailymotion videos using JW Player 7. Bitrate selection is provided by the default controlbar bitrates menu.


Tags:

This demonstrates a setup to play a video from Dailymotion with a manually configured playlist of Dailymotion videos. The filetype due to a limitation with the Jw Player 7 API is required to be set with an `mp4` extension.

The plugin works with manual playlists aswell in combination with the jwplayer playlist javascript api.

Starting from JWPlayer 7 the Dailymotion feature is a javascript provider only using the Html5 api for both desktop and mobile.

Features

  • Chromeless player support with full functionality and integration with other JwPlayer plugins.
  • Provides an event for obtaining detailed data for the video to be used for customised features via the javascript API and Dailymotion data API.
  • Full control of the player controls including fullscreen.
  • Chrome embedded player support with full chrome configuration support.
  • Full playlist support provided by JW Player to play with other video formats.
  • Html5 API player for both desktop and mobile.

Known Issues

  • The DailyMotion html5 api is severely limited compared to the Flash api and there is no indication of improvement. Some features like bitrate quality selection are not enabled and have not been enabled for a while. Added features will be made when the api changes become available.

NOTE:

(Current Version 4.0.0)

Compatibility

  • JW Player 7 and above
License Options
Domain(s)

(Version 4.0.0)

License Information

The Dailymotion Plugin is a once off commercial license with updates and support to the Dailymotion plugin only. JW Player related questions and support may be provided on their forums at http://www.longtailvideo.com/support/forums/jw-player/

  • Single Domain License - Suitable for small to medium sites with updates and unlimited support included.
  • Multi Domain License - Suitable for larger sites and video platform sites with updates, feature requests and unlimited priority support included.
  • Single Domain Not For Profit License - Suitable for not for profit organisations.

Note:

With your purchase please provide your domains to be provided with your licensed plugin. New domains need to be requested manually for the moment.

Refund Policy:

Please try the demo before purchase or request for a 60 day site demo. Refunds will not be issued unless under some circumstances sorry for the inconvenience.

Demo

Contact for a site or local demo download.

List Of Examples

Examples

Example of Dailymotion videos in a playlist

Configuration


function formatContent(text){
    if (text) {
        text = text.replace(
            /((https?\:\/\/)|(www\.))(\S+)(\w{2,4})(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/gi,
            function(url){
                var full_url = url;
                if (!full_url.match('^https?:\/\/')) {
                    full_url = 'http://' + full_url;
                }
                return '' + url + '';
            }
        ).replace(/(\r\n|\r|\n)/g, "
");
    }
    return text;
}

function showInfo(data, container) {
    $('#category-content').html(data.category);
    $('#tags-content').html(data.tags.join(","));

    $('#description').html(data.description);

    $('#content-container').show();

}


(function(jwplayer) {

    var player = jwplayer("related").setup({
            width: 760,
            height: 350,
            playlist: [
        	    {  file: "http://www.dailymotion.com/video/x5q9zr", type: "mp4" , title: "Big Buck Bunny", duration: "10:05",  thumbnail: "//static2.dmcdn.net/static/video/780/426/9624087:jpeg_preview_small.jpg?20110909144910", image: "//static2.dmcdn.net/static/video/780/426/9624087:jpeg_preview_large.jpg?20110909144910" },
        	    {  file: "http://www.dailymotion.com/video/x76smm", type: "mp4", title: "Killcow", duration: "6:24", thumbnail: "//static2.dmcdn.net/static/video/053/470/12074350:jpeg_preview_small.jpg?20110903151936", image: "//static2.dmcdn.net/static/video/053/470/12074350:jpeg_preview_large.jpg?20110903151936" },
        	    {  file: "http://www.dailymotion.com/video/xh71yi", type: "mp4", title: "Lutins", duration: "5:51", thumbnail: "//static2.dmcdn.net/static/video/206/288/28882602:jpeg_preview_small.jpg?20110723222720", image: "//static2.dmcdn.net/static/video/206/288/28882602:jpeg_preview_large.jpg?20110723222720" },
        	    {  file: "http://www.dailymotion.com/video/xcvm0v", type: "mp4", title: "Timber",  duration: "2:48", thumbnail: "//static2.dmcdn.net/static/video/172/036/21630271:jpeg_preview_small.jpg?20110813084528", image: "//static2.dmcdn.net/static/video/172/036/21630271:jpeg_preview_large.jpg?20110813084528" },
        	    {  file: "http://www.dailymotion.com/video/x5wnjc", type: "mp4", title: "Valse avec Bachir Le film de la semaine", duration: "2.00", thumbnail: "//static2.dmcdn.net/static/video/675/129/9921576:jpeg_preview_small.jpg?20110908205236", image: "//static2.dmcdn.net/static/video/675/129/9921576:jpeg_preview_large.jpg?20110908205236" },
        	    {  file: "http://www.dailymotion.com/video/x5gc77", type: "mp4", title: "Red River Bay", duration: "1:29", thumbnail: "//static2.dmcdn.net/static/video/783/061/9160387:jpeg_preview_small.jpg?20110910192718", image: "//static2.dmcdn.net/static/video/783/061/9160387:jpeg_preview_large.jpg?20110910192718" },

            ],
            dailymotion: {
               //this is not required
               enableApiData: true
            }
    });

    player.on("ready",function() {

                    player.on("dailymotiondata",function(data) {
                        showInfo(data);
                    });

     });

})(window.jwplayer);

Configuration

The configuration of the Dailymotion provider plugin needs to be in a config object property `dailymotion` like so:


dailymotion: {
    ....
}

Here is a list of the configuration options:

property / datatype default description
enableApiData
boolean
enable and load the dailymotion data for the current video.
defaultQuality
string
hq The default quality level (240, 380, 480, 720, 1080, 1440, 2160). If used in conjunction with the hd toggle feature, setting a default quality here will start playback with the desired default bitrate. If none is set, a bitrate level will be auto detected by the Dailymotion player.

Dailymotion Video Playlist Example

This example demonstrates using a playlist combination of Dailymotion and Youtube videos. 



(function(jwplayer) {

     jwplayer("manualVideoPlaylist").setup({
                width: 760,
                height: 350,
                playlist: [
                            {   file: "http://www.dailymotion.com/video/x5q9zr", type: "mp4", title: "Big Buck Bunny Dailymotion", duration: "10:05",  thumbnail: "//static2.dmcdn.net/static/video/780/426/9624087:jpeg_preview_small.jpg?20110909144910", image: "//static2.dmcdn.net/static/video/780/426/9624087:jpeg_preview_large.jpg?20110909144910" },
                            { file: "http://www.youtube.com/watch?v=YE7VzlLtp-4", title: "Big Buck Bunny Youtube"},
                            {
                                sources: [
                                                                        { type: "webm", file: "//videos.electroteque.org/bitrate/elephants_dream_600k.webm"},
                                                                        { type: "mp4", file: "//videos.electroteque.org/bitrate/elephants_dream_600k.mp4"},
                                                                        { type: "ogg", file: "//videos.electroteque.org/bitrate/elephants_dream_600k.ogv"}
                                ],
                                title: "Elephants Dream - Mp4", author: "Blender Foundation", videoDuration: "10.54", image: "http://i.ytimg.com/vi/XSGBVzeBUbk/default.jpg"
                            },

                            {   file: "http://www.dailymotion.com/video/x76smm", type: "mp4", title: "Killcow Dailymotion", duration: "6:24", thumbnail: "//static2.dmcdn.net/static/video/053/470/12074350:jpeg_preview_small.jpg?20110903151936", image: "//static2.dmcdn.net/static/video/053/470/12074350:jpeg_preview_large.jpg?20110903151936" },
                            {
                                                                                        sources: [
                                                                                            { type: "webm", file: "//videos.electroteque.org/bitrate/big_buck_bunny_600k.webm"},
                                                                                            { type: "mp4", file: "//videos.electroteque.org/bitrate/big_buck_bunny_600k.mp4"},
                                                                                            { type: "ogg", file: "//videos.electroteque.org/bitrate/big_buck_bunny_600k.ogv"}
                                                                                        ],
                                                                                        title: "Big Buck Bunny - Mp4", author: "Blender Foundation", videoDuration: "9.56",  image: "http://i.ytimg.com/vi/XSGBVzeBUbk/default.jpg"
                            },
                            {  file: "http://www.dailymotion.com/video/xh71yi", type: "mp4", title: "Lutins", duration: "5:51", thumbnail: "//static2.dmcdn.net/static/video/206/288/28882602:jpeg_preview_small.jpg?20110723222720", image: "//static2.dmcdn.net/static/video/206/288/28882602:jpeg_preview_large.jpg?20110723222720" }
                ],
                dailymotion: {

                }
        });


})(window.jwplayer);

Events

Event When does it fire?
dailymotiondata Fires when the data feed information is collected when the enableApiData config is enabled. The callback is fed with the following arguments:
  • data the data object with information of the video.