Changeset 950


Ignore:
Timestamp:
04/26/10 00:22:37 (3 years ago)
Author:
zach
Message:

Cleaning up the model

Location:
trunk/html5
Files:
11 edited

Legend:

Unmodified
Added
Removed
  • trunk/html5/index.html

    r944 r950  
    2626        id="player1" 
    2727        class="jwplayer" 
    28         poster="http://localhost/files/bunny.jpg" 
    29         src="http://developer.longtailvideo.com/player/testing/files/bunny.mp4" 
     28        poster="http://localhost/html5/test/files/bunny.jpg" 
     29        src="http://localhost/html5/test/files/bunny.mp4" 
    3030        width="480" 
    3131> 
     
    3636        height="270" 
    3737        id="player2" 
    38         poster="http://localhost/files/bunny.jpg" 
    39         src="http://localhost/files/bunny.mp4" 
     38        poster="http://localhost/html5/test/files/bunny.jpg" 
     39        src="http://localhost/html5/test/files/bunny.mp4" 
    4040        width="480" 
    4141> 
     
    5454        width="480" 
    5555        height="270" 
    56         poster="http://localhost/files/bunny.jpg" 
     56        poster="http://localhost/html5/test/files/bunny.jpg" 
    5757> 
    58 <source src='http://localhost/files/bunny.ogv' type='video/ogg; codecs="theora, vorbis"'> 
     58<source src='http://localhost/html5/test/files/bunny.ogv' type='video/ogg; codecs="theora, vorbis"'> 
    5959</video> 
    6060 
     
    6666        width="480" 
    6767        height="270" 
    68         poster="http://localhost/files/bunny.jpg" 
     68        poster="http://localhost/html5/test/files/bunny.jpg" 
    6969> 
    70 <source src='http://localhost/files/bunny.ogv' type='video/ogg; codecs="theora, vorbis"'> 
    71 <source src='http://localhost/files/bunny.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'> 
     70<source src='http://localhost/html5/test/files/bunny.ogv' type='video/ogg; codecs="theora, vorbis"'> 
     71<source src='http://localhost/html5/test/files/bunny.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'> 
    7272</video> 
    7373 
     
    7878        width="480" 
    7979        height="270" 
    80         poster="http://localhost/files/bunny.jpg" 
     80        poster="http://localhost/html5/test/files/bunny.jpg" 
    8181> 
    82 <source src='http://developer.longtailvideo.com/player/testing/files/bunny.ogv' type='video/ogg; codecs="theora, vorbis"'> 
    83 <source src='http://developer.longtailvideo.com/player/testing/files/bunny.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'> 
     82<source src='http://localhost/html5/test/files/bunny.ogv' type='video/ogg; codecs="theora, vorbis"'> 
     83<source src='http://localhost/html5/test/files/bunny.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'> 
    8484</video> 
    8585 
  • trunk/html5/jquery.jwplayer.js

    r949 r950  
    1111 
    1212        /** Hooking the jwplayerControlbar up to jQuery. **/ 
    13         $.fn.jwplayerControlbar = function(ops) { 
    14                 return this.each(function() { 
    15                         var id = $(this)[0].id; 
    16                         var div = $('#' + id).parents()[0].id; 
    17                         //$($('#' + id).parents()[0]).append('<div id="' + div + '">'); 
    18                         var player = document.getElementById(id); 
    19                         var options = $.extend({}, $.fn.jwplayerControlbar.defaults, ops); 
    20                         $.extend(options, $('#' + id).data("model")); 
    21                         // Add positioning options and change the player css, so we can full-browser-screen it. 
    22                         $.extend(options, { 
    23                                 id: id, 
    24                                 div: div, 
    25                                 left: 0, 
    26                                 top: 0 
    27                         }); 
    28                         // Save the variables globally and start loading the skin. 
    29                         config = { 
    30                                 player: player, 
    31                                 options: options, 
    32                                 images: $(player).data("skin").controlbar.elements 
    33                         }; 
    34                         $.fn.jwplayerControlbar.bars[id] = config; 
    35                         buildElements(config); 
    36                         buildHandlers(config); 
    37                 }); 
    38         }; 
    39          
    40          
    41         /** Map with all jwplayerControlbars. **/ 
    42         $.fn.jwplayerControlbar.bars = {}; 
    43          
    44          
     13        $.fn.jwplayerControlbar = function(player) { 
     14                player.controlbar = $.extend({}, $.fn.jwplayerControlbar.defaults, player.controlbar); 
     15                buildElements(player); 
     16                buildHandlers(player); 
     17        }; 
     18         
     19                 
    4520        /** Map with config for the jwplayerControlbar plugin. **/ 
    4621        $.fn.jwplayerControlbar.defaults = { 
    47                 buffer: 0, 
    48                 div: 'container', 
    49                 duration: 0, 
    50                 elapsed: 0, 
    5122                fontsize: 10, 
    5223                fontcolor: '000000', 
    53                 fullscreen: false, 
    54                 id: 'player', 
    55                 images: 0, 
    5624                position: 'bottom', 
    57                 skin: 'assets/five/five.xml', 
    58                 width: 400, 
    59                 height: 300, 
    60                 left: 0, 
    6125                leftmargin: 0, 
    62                 top: 0, 
    6326                rightmargin: 0, 
    64                 scrubber: 'none', 
    65                 state: 'idle', 
    66                 volume: 100 
     27                scrubber: 'none' 
    6728        }; 
    6829         
    6930         
    7031        /** Callbacks called by Flash players to update stats. **/ 
    71         $.fn.jwplayerControlbar.bufferHandler = function(event, obj) { 
     32        $.fn.jwplayerControlbar.bufferHandler = function(obj) {  
    7233                bufferHandler({ 
    7334                        id: obj.id, 
     
    7536                }); 
    7637        }; 
    77         $.fn.jwplayerControlbar.muteHandler = function(event, obj) { 
     38         
     39        $.fn.jwplayerControlbar.muteHandler = function(obj) { 
    7840                muteHandler({ 
    7941                        id: obj.id, 
     
    8143                }); 
    8244        }; 
    83         $.fn.jwplayerControlbar.stateHandler = function(event, obj) { 
     45         
     46        $.fn.jwplayerControlbar.stateHandler = function(obj) { 
    8447                stateHandler({ 
    8548                        id: obj.id, 
     
    8750                }); 
    8851        }; 
    89         $.fn.jwplayerControlbar.timeHandler = function(event, obj) { 
     52         
     53        $.fn.jwplayerControlbar.timeHandler = function(obj) { 
    9054                timeHandler({ 
    9155                        id: obj.id, 
    92                         elapsed: obj.position, 
     56                        position: obj.position, 
    9357                        duration: obj.duration 
    9458                }); 
    9559        }; 
     60         
    9661        $.fn.jwplayerControlbar.volumeHandler = function(obj) { 
    9762                volumeHandler({ 
     
    10368         
    10469        /** Draw the jwplayerControlbar elements. **/ 
    105         function buildElements(config) { 
     70        function buildElements(player) { 
    10671                // Draw the background. 
    107                 $('#' + config.options.div).append('<div id="' + config.options.id + '_jwplayerControlbar"></div>'); 
    108                 $('#' + config.options.id + '_jwplayerControlbar').css('position', 'relative'); 
    109                 $('#' + config.options.id + '_jwplayerControlbar').css('height', config.images.background.height); 
    110                 $('#' + config.options.id + '_jwplayerControlbar').css('background', 'url(' + config.images.background.src + ') repeat-x center left'); 
     72                player.model.domelement.parents(":first").append('<div id="' +player.id + '_jwplayerControlbar"></div>'); 
     73                $("#"+player.id + '_jwplayerControlbar').css('position', 'relative'); 
     74                $("#"+player.id + '_jwplayerControlbar').css('height', player.skin.controlbar.elements.background.height); 
     75                $("#"+player.id + '_jwplayerControlbar').css('background', 'url(' + player.skin.controlbar.elements.background.src + ') repeat-x center left'); 
    11176                // Draw all elements on top of the bar. 
    112                 buildElement('capLeft', 'left', true, config); 
    113                 buildElement('playButton', 'left', false, config); 
    114                 buildElement('pauseButton', 'left', true, config); 
    115                 buildElement('divider1', 'left', true, config); 
    116                 buildElement('elapsedText', 'left', true, config); 
    117                 buildElement('timeSliderRail', 'left', false, config); 
    118                 buildElement('timeSliderBuffer', 'left', false, config); 
    119                 buildElement('timeSliderProgress', 'left', false, config); 
    120                 buildElement('timeSliderThumb', 'left', false, config); 
    121                 buildElement('capRight', 'right', true, config); 
    122                 buildElement('fullscreenButton', 'right', false, config); 
    123                 buildElement('normalscreenButton', 'right', true, config); 
    124                 buildElement('divider2', 'right', true, config); 
    125                 buildElement('volumeSliderRail', 'right', false, config); 
    126                 buildElement('volumeSliderProgress', 'right', true, config); 
    127                 buildElement('muteButton', 'right', false, config); 
    128                 buildElement('unmuteButton', 'right', true, config); 
    129                 buildElement('divider3', 'right', true, config); 
    130                 buildElement('durationText', 'right', true, config); 
     77                buildElement('capLeft', 'left', true, player); 
     78                buildElement('playButton', 'left', false, player); 
     79                buildElement('pauseButton', 'left', true, player); 
     80                buildElement('divider1', 'left', true, player); 
     81                buildElement('elapsedText', 'left', true, player); 
     82                buildElement('timeSliderRail', 'left', false, player); 
     83                buildElement('timeSliderBuffer', 'left', false, player); 
     84                buildElement('timeSliderProgress', 'left', false, player); 
     85                buildElement('timeSliderThumb', 'left', false, player); 
     86                buildElement('capRight', 'right', true, player); 
     87                buildElement('fullscreenButton', 'right', false, player); 
     88                buildElement('normalscreenButton', 'right', true, player); 
     89                buildElement('divider2', 'right', true, player); 
     90                buildElement('volumeSliderRail', 'right', false, player); 
     91                buildElement('volumeSliderProgress', 'right', true, player); 
     92                buildElement('muteButton', 'right', false, player); 
     93                buildElement('unmuteButton', 'right', true, player); 
     94                buildElement('divider3', 'right', true, player); 
     95                buildElement('durationText', 'right', true, player); 
    13196        } 
    13297         
    13398         
    13499        /** Draw a single element into the jwplayerControlbar. **/ 
    135         function buildElement(element, align, offset, config) { 
    136                 var nam = config.options.id + '_' + element; 
    137                 $('#' + config.options.id + '_jwplayerControlbar').append('<div id="' + nam + '"></div>'); 
     100        function buildElement(element, align, offset, player) { 
     101                var nam =player.id + '_' + element; 
     102                $('#' +player.id + '_jwplayerControlbar').append('<div id="' + nam + '"></div>'); 
    138103                $('#' + nam).css('position', 'absolute'); 
    139104                $('#' + nam).css('top', 0); 
    140105                if (element.indexOf('Text') > 0) { 
    141106                        $('#' + nam).html('00:00'); 
    142                         $('#' + nam).css('font', config.options.fontsize + 'px/' + (config.images.background.height + 1) + 'px Arial,sans-serif'); 
     107                        $('#' + nam).css('font', player.controlbar.fontsize + 'px/' + (player.skin.controlbar.elements.background.height + 1) + 'px Arial,sans-serif'); 
    143108                        $('#' + nam).css('text-align', 'center'); 
    144109                        $('#' + nam).css('font-weight', 'bold'); 
    145110                        $('#' + nam).css('cursor', 'default'); 
    146                         var wid = 14 + 3 * config.options.fontsize; 
    147                         $('#' + nam).css('color', '#' + config.options.fontcolor.substr(-6)); 
     111                        var wid = 14 + 3 * player.controlbar.fontsize; 
     112                        $('#' + nam).css('color', '#' + player.controlbar.fontcolor.substr(-6)); 
    148113                } else if (element.indexOf('divider') === 0) { 
    149                         $('#' + nam).css('background', 'url(' + config.images.divider.src + ') repeat-x center left'); 
    150                         var wid = config.images.divider.width; 
     114                        $('#' + nam).css('background', 'url(' + player.skin.controlbar.elements.divider.src + ') repeat-x center left'); 
     115                        var wid = player.skin.controlbar.elements.divider.width; 
    151116                } else { 
    152                         $('#' + nam).css('background', 'url(' + config.images[element].src + ') repeat-x center left'); 
    153                         var wid = config.images[element].width; 
     117                        $('#' + nam).css('background', 'url(' + player.skin.controlbar.elements[element].src + ') repeat-x center left'); 
     118                        var wid = player.skin.controlbar.elements[element].width; 
    154119                } 
    155120                if (align == 'left') { 
    156                         $('#' + nam).css(align, config.options.leftmargin); 
     121                        $('#' + nam).css(align, player.controlbar.leftmargin); 
    157122                        if (offset) { 
    158                                 config.options.leftmargin += wid; 
     123                                player.controlbar.leftmargin += wid; 
    159124                        } 
    160125                } else if (align == 'right') { 
    161                         $('#' + nam).css(align, config.options.rightmargin); 
     126                        $('#' + nam).css(align, player.controlbar.rightmargin); 
    162127                        if (offset) { 
    163                                 config.options.rightmargin += wid; 
     128                                player.controlbar.rightmargin += wid; 
    164129                        } 
    165130                } 
    166131                $('#' + nam).css('width', wid); 
    167                 $('#' + nam).css('height', config.images.background.height); 
     132                $('#' + nam).css('height', player.skin.controlbar.elements.background.height); 
    168133        } 
    169134         
    170135         
    171136        /** Add interactivity to the jwplayerControlbar elements. **/ 
    172         function buildHandlers(config) { 
     137        function buildHandlers(player) { 
    173138                // Register events with the buttons. 
    174                 buildHandler('playButton', 'play', config.player, config.options); 
    175                 buildHandler('pauseButton', 'pause', config.player, config.options); 
    176                 buildHandler('muteButton', 'mute', config.player, config.options); 
    177                 buildHandler('unmuteButton', 'mute', config.player, config.options); 
    178                 buildHandler('fullscreenButton', 'fullscreen', config.player, config.options); 
    179                 buildHandler('normalscreenButton', 'fullscreen', config.player, config.options); 
    180                 /* 
    181                  addSliders(options); 
    182                  */ 
     139                buildHandler('playButton', 'play', player); 
     140                buildHandler('pauseButton', 'pause', player); 
     141                buildHandler('muteButton', 'mute', player); 
     142                buildHandler('unmuteButton', 'mute', player); 
     143                buildHandler('fullscreenButton', 'fullscreen', player); 
     144                buildHandler('normalscreenButton', 'fullscreen', player); 
     145                 
     146                addSliders(player); 
     147 
    183148                // Register events with the player. 
    184                 $.jwplayer("#" + config.player.id).buffer($.fn.jwplayerControlbar.bufferHandler); 
    185                 $.jwplayer("#" + config.player.id).state($.fn.jwplayerControlbar.stateHandler); 
    186                 $.jwplayer("#" + config.player.id).time($.fn.jwplayerControlbar.timeHandler); 
    187                 $.jwplayer("#" + config.player.id).mute($.fn.jwplayerControlbar.muteHandler); 
    188                 $.jwplayer("#" + config.player.id).volume($.fn.jwplayerControlbar.volumeHandler); 
     149                player.buffer($.fn.jwplayerControlbar.bufferHandler); 
     150                player.state($.fn.jwplayerControlbar.stateHandler); 
     151                player.time($.fn.jwplayerControlbar.timeHandler); 
     152                player.mute($.fn.jwplayerControlbar.muteHandler); 
     153                player.volume($.fn.jwplayerControlbar.volumeHandler); 
    189154                // Trigger a few events so the bar looks good on startup. 
    190                 fullscreenHandler(config.options); 
    191                 muteHandler(config.options); 
    192                 stateHandler(config.options); 
    193                 volumeHandler(config.options); 
     155                fullscreenHandler(player); 
     156                muteHandler(player); 
     157                stateHandler(player); 
     158                volumeHandler(player); 
    194159        } 
    195160         
    196161         
    197162        /** Set a single button handler. **/ 
    198         function buildHandler(element, handler, player, options) { 
    199                 var nam = options.id + '_' + element; 
     163        function buildHandler(element, handler, player) { 
     164                var nam = player.id + '_' + element; 
    200165                $('#' + nam).css('cursor', 'pointer'); 
    201166                if (handler == 'fullscreen') { 
    202167                        $('#' + nam).mouseup(function(evt) { 
    203168                                evt.stopPropagation(); 
    204                                 options.fullscreen = !options.fullscreen; 
    205                                 fullscreenHandler(options); 
     169                                player.fullscreen() = !player.fullscreen(); 
     170                                fullscreenHandler(player); 
    206171                        }); 
    207172                } else { 
     
    215180         
    216181        /** Set the volume drag handler. **/ 
    217         function addSliders() { 
    218                 var bar = '#' + config.id + '_jwplayerControlbar'; 
    219                 var trl = '#' + config.id + '_timeSliderRail'; 
    220                 var vrl = '#' + config.id + '_volumeSliderRail'; 
     182        function addSliders(player) { 
     183                var bar = '#' +player.id + '_jwplayerControlbar'; 
     184                var trl = '#' +player.id + '_timeSliderRail'; 
     185                var vrl = '#' +player.id + '_volumeSliderRail'; 
    221186                $(bar).css('cursor', 'hand'); 
    222187                $(bar).mousedown(function(evt) { 
    223188                        var xps = evt.pageX - $(bar).position().left; 
    224189                        if (xps > $(trl).position().left && xps < $(trl).position().left + $(trl).width()) { 
    225                                 config.scrubber = 'time'; 
     190                                player.controlbar.scrubber = 'time'; 
    226191                        } else if (xps > $(vrl).position().left && xps < $(vrl).position().left + $(vrl).width()) { 
    227                                 config.scrubber = 'volume'; 
     192                                player.controlbar.scrubber = 'volume'; 
    228193                        } 
    229194                }); 
    230195                $(bar).mouseup(function(evt) { 
    231196                        evt.stopPropagation(); 
    232                         sliderUp(evt.pageX); 
     197                        sliderUp(evt.pageX, player); 
    233198                }); 
    234199                $(bar).mouseleave(function(evt) { 
    235                         sliderUp(evt.pageX); 
     200                        sliderUp(evt.pageX, player); 
    236201                        evt.stopPropagation(); 
    237202                }); 
    238203                $(bar).mousemove(function(evt) { 
    239                         if (config.scrubber == 'time') { 
     204                        if (player.controlbar.scrubber == 'time') { 
    240205                                var xps = evt.pageX - $(bar).position().left; 
    241                                 $('#' + config.id + '_timeSliderThumb').css('left', xps); 
     206                                $('#' +player.id + '_timeSliderThumb').css('left', xps); 
    242207                        } 
    243208                }); 
     
    246211         
    247212        /** The slider has been moved up. **/ 
    248         function sliderUp(msx) { 
    249                 if (config.scrubber == 'time') { 
    250                         var xps = msx - $('#' + config.id + '_timeSliderRail').position().left; 
    251                         var wid = $('#' + config.id + '_timeSliderRail').width(); 
    252                         var pos = xps / wid * config.duration; 
     213        function sliderUp(msx, player) { 
     214                if (player.controlbar.scrubber == 'time') { 
     215                        var xps = msx - $('#' +player.id + '_timeSliderRail').position().left; 
     216                        var wid = $('#' +player.id + '_timeSliderRail').width(); 
     217                        var pos = xps / wid * player.duration(); 
    253218                        if (pos < 0) { 
    254219                                pos = 0; 
    255                         } else if (pos > config.duration) { 
    256                                 pos = config.duration - 3; 
     220                        } else if (pos > player.controlbar.duration) { 
     221                                pos = player.controlbar.duration - 3; 
    257222                        } 
    258223                        player.seek(pos); 
    259                 } else if (config.scrubber == 'volume') { 
    260                         var bar = $('#' + config.id + '_jwplayerControlbar').width(); 
    261                         var brx = $('#' + config.id + '_jwplayerControlbar').position().left; 
    262                         var rig = $('#' + config.id + '_volumeSliderRail').css('right').substr(0, 2); 
    263                         var wid = config.images.volumeSliderRail.width; 
     224                } else if (player.controlbar.scrubber == 'volume') { 
     225                        var bar = $('#' +player.id + '_jwplayerControlbar').width(); 
     226                        var brx = $('#' +player.id + '_jwplayerControlbar').position().left; 
     227                        var rig = $('#' +player.id + '_volumeSliderRail').css('right').substr(0, 2); 
     228                        var wid = player.skin.controlbar.elements.volumeSliderRail.width; 
    264229                        var pct = Math.round((msx - bar - brx + 1 * rig + wid) / wid * 100); 
    265230                        if (pct < 0) { 
     
    270235                        player.volume(pct); 
    271236                } 
    272                 config.scrubber = 'none'; 
    273         } 
    274          
    275          
     237                player.controlbar.scrubber = 'none'; 
     238        } 
    276239         
    277240         
    278241        /** Update the buffer percentage. **/ 
    279         function bufferHandler(options) { 
    280                 if (options.bufferPercent === 0) { 
    281                         $('#' + options.id + '_timeSliderBuffer').css('display', 'none'); 
     242        function bufferHandler(event) { 
     243                var player = $.jwplayer(event.id); 
     244                if (event.bufferPercent === 0) { 
     245                        $('#' +player.id + '_timeSliderBuffer').css('display', 'none'); 
    282246                } else { 
    283                         $('#' + options.id + '_timeSliderBuffer').css('display', 'block'); 
    284                         var wid = $('#' + options.id + '_timeSliderRail').width(); 
    285                         $('#' + options.id + '_timeSliderBuffer').css('width', Math.round(wid * options.bufferPercent / 100)); 
     247                        $('#' +player.id + '_timeSliderBuffer').css('display', 'block'); 
     248                        var wid = $('#' +player.id + '_timeSliderRail').width(); 
     249                        $('#' +player.id + '_timeSliderBuffer').css('width', Math.round(wid * event.bufferPercent / 100)); 
    286250                } 
    287251        } 
     
    289253         
    290254        /** Update the mute state. **/ 
    291         function muteHandler(options) { 
    292                 if (options.mute) { 
    293                         $('#' + options.id + '_muteButton').css('display', 'none'); 
    294                         $('#' + options.id + '_unmuteButton').css('display', 'block'); 
    295                         $('#' + options.id + '_volumeSliderProgress').css('display', 'none'); 
     255        function muteHandler(event) { 
     256                var player = $.jwplayer(event.id); 
     257                if (event.mute) { 
     258                        $('#' +player.id + '_muteButton').css('display', 'none'); 
     259                        $('#' +player.id + '_unmuteButton').css('display', 'block'); 
     260                        $('#' +player.id + '_volumeSliderProgress').css('display', 'none'); 
    296261                } else { 
    297                         $('#' + options.id + '_muteButton').css('display', 'block'); 
    298                         $('#' + options.id + '_unmuteButton').css('display', 'none'); 
    299                         $('#' + options.id + '_volumeSliderProgress').css('display', 'block'); 
     262                        $('#' +player.id + '_muteButton').css('display', 'block'); 
     263                        $('#' +player.id + '_unmuteButton').css('display', 'none'); 
     264                        $('#' +player.id + '_volumeSliderProgress').css('display', 'block'); 
    300265                } 
    301266        } 
     
    303268         
    304269        /** Update the playback state. **/ 
    305         function stateHandler(options) { 
    306                 if (options.state == 'buffering' || options.state == 'playing') { 
    307                         $('#' + options.id + '_pauseButton').css('display', 'block'); 
    308                         $('#' + options.id + '_playButton').css('display', 'none'); 
     270        function stateHandler(event) { 
     271                var player = $.jwplayer(event.id); 
     272                if (event.state == $.fn.jwplayer.states.BUFFERING || player.state() ==  $.fn.jwplayer.states.PLAYING) { 
     273                        $('#' +player.id + '_pauseButton').css('display', 'block'); 
     274                        $('#' +player.id + '_playButton').css('display', 'none'); 
    309275                } else { 
    310                         $('#' + options.id + '_pauseButton').css('display', 'none'); 
    311                         $('#' + options.id + '_playButton').css('display', 'block'); 
    312                 } 
    313                 if (options.state == 'idle') { 
    314                         options.elapsed = 0; 
    315                         timeHandler(options); 
     276                        $('#' +player.id + '_pauseButton').css('display', 'none'); 
     277                        $('#' +player.id + '_playButton').css('display', 'block'); 
     278                } 
     279                if (player.state() ==  $.fn.jwplayer.states.IDLE) { 
     280                        timeHandler({ 
     281                                id: player.id, 
     282                                position: 0 
     283                        }); 
    316284                } 
    317285        } 
     
    319287         
    320288        /** Update the playback time. **/ 
    321         function timeHandler(options) { 
    322                 var wid = $('#' + options.id + '_timeSliderRail').width(); 
    323                 var thb = $('#' + options.id + '_timeSliderThumb').width(); 
    324                 var lft = $('#' + options.id + '_timeSliderRail').position().left; 
    325                 if (options.elapsed === 0) { 
    326                         $('#' + options.id + '_timeSliderProgress').css('display', 'none'); 
    327                         $('#' + options.id + '_timeSliderThumb').css('display', 'none'); 
     289        function timeHandler(event) { 
     290                var player = $.jwplayer(event.id); 
     291                var wid = $('#' +player.id + '_timeSliderRail').width(); 
     292                var thb = $('#' +player.id + '_timeSliderThumb').width(); 
     293                var lft = $('#' +player.id + '_timeSliderRail').position().left; 
     294                if (event.position === 0) { 
     295                        $('#' +player.id + '_timeSliderProgress').css('display', 'none'); 
     296                        $('#' +player.id + '_timeSliderThumb').css('display', 'none'); 
    328297                } else { 
    329                         $('#' + options.id + '_timeSliderProgress').css('display', 'block'); 
    330                         $('#' + options.id + '_timeSliderProgress').css('width', Math.round(wid * options.elapsed / options.duration)); 
    331                         $('#' + options.id + '_timeSliderThumb').css('display', 'block'); 
    332                         $('#' + options.id + '_timeSliderThumb').css('left', lft + 
    333                         Math.round((wid - thb) * options.elapsed / options.duration)); 
    334                         $('#' + options.id + '_durationText').html(timeFormat(options.duration)); 
    335                 } 
    336                 $('#' + options.id + '_elapsedText').html(timeFormat(options.elapsed)); 
     298                        $('#' +player.id + '_timeSliderProgress').css('display', 'block'); 
     299                        $('#' +player.id + '_timeSliderProgress').css('width', Math.round(wid * event.position / event.duration)); 
     300                        $('#' +player.id + '_timeSliderThumb').css('display', 'block'); 
     301                        $('#' +player.id + '_timeSliderThumb').css('left', lft + 
     302                        Math.round((wid - thb) * event.position / event.duration)); 
     303                        $('#' +player.id + '_durationText').html(timeFormat(event.duration)); 
     304                } 
     305                $('#' +player.id + '_elapsedText').html(timeFormat(event.position)); 
    337306        } 
    338307         
     
    350319         
    351320        /** Flip the player size to/from full-browser-screen. **/ 
    352         function fullscreenHandler(options) { 
    353                 if (options.fullscreen) { 
     321        function fullscreenHandler(event) { 
     322                var player = $.jwplayer(event.id); 
     323                if (event.fullscreen) { 
    354324                        //$('#' + options.div).css('position', 'absolute'); 
    355325                        //$('#' + options.div).css('left', 0); 
     
    357327                        //$('#' + options.div).css('height', '100%'); 
    358328                        //$('#' + options.div).css('width', '100%'); 
    359                         $('#' + options.id + '_normalscreenButton').css('display', 'block'); 
    360                         $('#' + options.id + '_fullscreenButton').css('display', 'none'); 
     329                        $('#' +player.id + '_normalscreenButton').css('display', 'block'); 
     330                        $('#' +player.id + '_fullscreenButton').css('display', 'none'); 
    361331                        $(window).resize(function() { 
    362                                 resizeBar(options); 
     332                                resizeBar(player); 
    363333                        }); 
    364334                } else { 
     
    368338                        //$('#' + options.div).css('height', options.height); 
    369339                        //$('#' + options.div).css('width', options.width); 
    370                         $('#' + options.id + '_normalscreenButton').css('display', 'none'); 
    371                         $('#' + options.id + '_fullscreenButton').css('display', 'block'); 
     340                        $('#' +player.id + '_normalscreenButton').css('display', 'none'); 
     341                        $('#' +player.id + '_fullscreenButton').css('display', 'block'); 
    372342                        $(window).resize(null); 
    373343                } 
    374                 resizeBar(options); 
    375                 timeHandler(options); 
    376                 bufferHandler(options); 
     344                resizeBar(player); 
     345                timeHandler(player); 
     346                bufferHandler(player); 
    377347        } 
    378348         
    379349         
    380350        /** Resize the jwplayerControlbar. **/ 
    381         function resizeBar(options) { 
    382                 var lft = options.left; 
    383                 var top = options.top; 
    384                 var wid = options.width; 
    385                 var hei = $('#' + options.id + '_jwplayerControlbar').height(); 
    386                 if (options.position == 'over') { 
    387                         lft += 1 * options.margin; 
    388                         top -= 1 * options.margin + hei; 
    389                         wid -= 2 * options.margin; 
    390                 } 
    391                 if (options.fullscreen) { 
    392                         lft = options.margin; 
    393                         top = $(window).height() - options.margin - hei; 
    394                         wid = $(window).width() - 2 * options.margin; 
    395                         $('#' + options.id + '_jwplayerControlbar').css('z-index', 99); 
     351        function resizeBar(player) { 
     352                var lft = player.controlbar.left; 
     353                var top = player.controlbar.top; 
     354                var wid = player.model.config.width; 
     355                var hei = $('#' +player.id + '_jwplayerControlbar').height(); 
     356                if (player.controlbar.position == 'over') { 
     357                        lft += 1 * player.controlbar.margin; 
     358                        top -= 1 * player.controlbar.margin + hei; 
     359                        wid -= 2 * player.controlbar.margin; 
     360                } 
     361                if (player.fullscreen()) { 
     362                        lft = player.controlbar.margin; 
     363                        top = $(window).height() - player.controlbar.margin - hei; 
     364                        wid = $(window).width() - 2 * player.controlbar.margin; 
     365                        $('#' +player.id + '_jwplayerControlbar').css('z-index', 99); 
    396366                } else { 
    397                         $('#' + options.id + '_jwplayerControlbar').css('z-index', 97); 
    398                 } 
    399                 $('#' + options.id + '_jwplayerControlbar').css('left', lft); 
    400                 $('#' + options.id + '_jwplayerControlbar').css('top', top); 
    401                 $('#' + options.id + '_jwplayerControlbar').css('width', wid); 
    402                 $('#' + options.id + '_timeSliderRail').css('width', wid - options.leftmargin - options.rightmargin); 
     367                        $('#' +player.id + '_jwplayerControlbar').css('z-index', 97); 
     368                } 
     369                $('#' +player.id + '_jwplayerControlbar').css('left', lft); 
     370                $('#' +player.id + '_jwplayerControlbar').css('top', top); 
     371                $('#' +player.id + '_jwplayerControlbar').css('width', wid); 
     372                $('#' +player.id + '_timeSliderRail').css('width', wid - player.controlbar.leftmargin - player.controlbar.rightmargin); 
    403373        } 
    404374         
    405375         
    406376        /** Update the volume level. **/ 
    407         function volumeHandler(options) { 
    408                 var rwd = $('#' + options.id + '_volumeSliderRail').width(); 
    409                 var wid = Math.round(options.volume / 100 * rwd); 
    410                 var rig = $('#' + options.id + '_volumeSliderRail').css('right').substr(0, 2); 
    411                 $('#' + options.id + '_volumeSliderProgress').css('width', wid); 
    412                 $('#' + options.id + '_volumeSliderProgress').css('right', 1 * rig + rwd - wid); 
     377        function volumeHandler(event) { 
     378                var player = $.jwplayer(event.id); 
     379                var rwd = $('#' +player.id + '_volumeSliderRail').width(); 
     380                var wid = Math.round(event.volume / 100 * rwd); 
     381                var rig = $('#' +player.id + '_volumeSliderRail').css('right').substr(0, 2); 
     382                $('#' +player.id + '_volumeSliderProgress').css('width', wid); 
     383                $('#' +player.id + '_volumeSliderProgress').css('right', 1 * rig + rwd - wid); 
    413384        } 
    414385         
     
    424395(function($) { 
    425396 
     397        var mediaParams ={ 
     398                volume: 100, 
     399                fullscreen: false, 
     400                mute: false, 
     401                width: 480, 
     402                height: 320, 
     403                duration: 0, 
     404                source: 0, 
     405                buffer: 0, 
     406                state: 'IDLE' 
     407        }; 
     408 
    426409        $.fn.jwplayerController = function() { 
    427410                return this.each(function() { 
     
    432415        $.fn.jwplayerController.play = function(player) { 
    433416                try { 
    434                         player.data("media").play(); 
     417                        player.media.play(); 
    435418                        return true; 
    436419                } catch (err) { 
     
    443426        $.fn.jwplayerController.pause = function(player) { 
    444427                try { 
    445                         player.data("media").pause(); 
     428                        player.media.pause(); 
    446429                        return true; 
    447430                } catch (err) { 
     
    455438        $.fn.jwplayerController.seek = function(player, position) { 
    456439                try { 
    457                         player.data("media").seek(position); 
     440                        player.media.seek(position); 
    458441                        return true; 
    459442                } catch (err) { 
     
    468451        $.fn.jwplayerController.stop = function(player) { 
    469452                try { 
    470                         player.data("media").stop(); 
     453                        player.media.stop(); 
    471454                        return true; 
    472455                } catch (err) { 
     
    482465                try { 
    483466                        if (position === undefined) { 
    484                                 return $(player).data("model").volume; 
     467                                return player.model.volume; 
    485468                        } else { 
    486                                 player.data("media").volume(position); 
    487                                 $(player).data("model").volume = position; 
     469                                player.media.volume(position); 
     470                                player.model.volume = position; 
    488471                                return true; 
    489472                        } 
     
    498481                try { 
    499482                        if (state === undefined) { 
    500                                 return $(player).data("model").mute; 
     483                                return player.model.mute; 
    501484                        } else { 
    502                                 player.data("media").mute(state); 
     485                                player.media.mute(state); 
    503486                                return true; 
    504487                        } 
     
    514497        $.fn.jwplayerController.fullscreen = function(player, state) { 
    515498                try { 
    516                         if (position === undefined) { 
    517                                 return $(player).data("model").fullscreen; 
     499                        if (state === undefined) { 
     500                                return player.model.fullscreen; 
    518501                        } else { 
    519                                 player.data("media").fullscreen(state); 
     502                                player.media.fullscreen(state); 
    520503                                return true; 
    521504                        } 
     
    529512        $.fn.jwplayerController.resize = function(player, width, height) { 
    530513                try { 
    531                         player.data("media").resize(width, height); 
     514                        player.media.resize(width, height); 
    532515                        return true; 
    533516                } catch (err) { 
     
    540523        $.fn.jwplayerController.mediaInfo = function(player) { 
    541524                try { 
    542                         player.data("media").mediaInfo(); 
    543                         return true; 
     525                        var result = {}; 
     526                        for (var mediaParam in mediaParams){ 
     527                                result[mediaParam] = player.model[mediaParam]; 
     528                        } 
     529                        return result; 
    544530                } catch (err) { 
    545531                        $.fn.jwplayerUtils.log("error", err); 
     
    551537        $.fn.jwplayerController.load = function(player, path) { 
    552538                try { 
    553                         player.data("media").load(path); 
     539                        player.media.load(path); 
    554540                        return true; 
    555541                } catch (err) { 
     
    569555 */ 
    570556(function($) { 
    571  
     557        /** Hooking the controlbar up to jQuery. **/ 
     558        $.fn.jwplayer = function(options) { 
     559                return this.each(function() { 
     560                        $.fn.jwplayerUtils.log("setup", this); 
     561                        var model = $.fn.jwplayerModel($(this), options); 
     562                        var player = { 
     563                                model: model 
     564                        }; 
     565                        players[model.config.id] = player; 
     566                        player = $.extend(player, api(player)); 
     567                        $.fn.jwplayerView(player); 
     568                        $.fn.jwplayerModel.setActiveMediaProvider(player); 
     569                        $.fn.jwplayerSkinner(player, function() { 
     570                                finishSetup(player); 
     571                        }); 
     572                }); 
     573        }; 
     574         
     575        function finishSetup(player) { 
     576                $.fn.jwplayerControlbar(player); 
     577                player.sendEvent("JWPLAYER_READY"); 
     578        } 
     579         
     580         
     581        /** Map with all players on the page. **/ 
     582        var players = {}; 
     583         
     584         
     585        /** Map with config for the controlbar plugin. **/ 
     586        $.fn.jwplayer.defaults = { 
     587                autostart: false, 
     588                file: undefined, 
     589                height: 300, 
     590                image: undefined, 
     591                skin: 'assets/five/five.xml', 
     592                volume: 100, 
     593                width: 400, 
     594                flashplayer: 'assets/player.swf' 
     595        }; 
     596         
     597         
     598        /** Start playback or resume. **/ 
     599        function play(player) { 
     600                return function() { 
     601                        $.fn.jwplayerController.play(player); 
     602                        return jwplayer(player); 
     603                }; 
     604        } 
     605         
     606        /** Switch the pause state of the player. **/ 
     607        function pause(player) { 
     608                return function() { 
     609                        $.fn.jwplayerController.pause(player); 
     610                        return jwplayer(player); 
     611                }; 
     612        } 
     613         
     614         
     615        /** Seek to a position in the video. **/ 
     616        function seek(player) { 
     617                return function(arg) { 
     618                        $.fn.jwplayerController.seek(player, arg); 
     619                        return jwplayer(player); 
     620                }; 
     621        } 
     622         
     623         
     624        /** Stop playback and loading of the video. **/ 
     625        function stop(player) { 
     626                return function() { 
     627                        $.fn.jwplayerController.stop(player); 
     628                        return jwplayer(player); 
     629                }; 
     630        } 
     631         
     632         
     633        /** Change the video's volume level. **/ 
     634        function volume(player) { 
     635                return function(arg) { 
     636                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     637                                case "function": 
     638                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_VOLUME, arg); 
     639                                        break; 
     640                                case "number": 
     641                                        $.fn.jwplayerController.volume(player, arg); 
     642                                        break; 
     643                                case "string": 
     644                                        $.fn.jwplayerController.volume(player, parseInt(arg, 10)); 
     645                                        break; 
     646                                default: 
     647                                        return $.fn.jwplayerController.volume(player); 
     648                        } 
     649                        return jwplayer(player); 
     650                }; 
     651        } 
     652         
     653        /** Switch the mute state of the player. **/ 
     654        function mute(player, state) { 
     655                return function(arg) { 
     656                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     657                                case "function": 
     658                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_MUTE, arg); 
     659                                        break; 
     660                                case "boolean": 
     661                                        $.fn.jwplayerController.mute(player, arg); 
     662                                        break; 
     663                                default: 
     664                                        $.fn.jwplayerController.mute(player); 
     665                                        break; 
     666                        } 
     667                        return jwplayer(player); 
     668                }; 
     669        } 
     670         
     671        /** Resizing the player **/ 
     672        function resize(player, state) { 
     673                return function(arg1, arg2) { 
     674                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     675                                case "function": 
     676                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_RESIZE, arg); 
     677                                        break; 
     678                                case "number": 
     679                                        $.fn.jwplayerController.resize(player, arg1, arg2); 
     680                                        break; 
     681                                default: 
     682                                        break; 
     683                        } 
     684                        return jwplayer(player); 
     685                }; 
     686        } 
     687         
     688        /** Fullscreen the player **/ 
     689        function fullscreen(player, state) { 
     690                return function(arg) { 
     691                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     692                                case "function": 
     693                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_FULLSCREEN, arg); 
     694                                        break; 
     695                                case "boolean": 
     696                                        $.fn.jwplayerController.fullscreen(player, arg); 
     697                                        break; 
     698                                default: 
     699                                        return $.fn.jwplayerController.fullscreen(player); 
     700                        } 
     701                        return jwplayer(player); 
     702                }; 
     703        } 
     704         
     705        /** Adds a state listener **/ 
     706        function state(player) { 
     707                return function(arg) { 
     708                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     709                                case "function": 
     710                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_PLAYER_STATE, arg); 
     711                                        break; 
     712                                default: 
     713                                        $.fn.jwplayerUtils.log("mediainfo", $.fn.jwplayerController.mediaInfo(player)); 
     714                                        return $.fn.jwplayerController.mediaInfo(player).state; 
     715                        } 
     716                        return jwplayer(player); 
     717                }; 
     718        } 
     719         
     720        /** Adds a buffer listener **/ 
     721        function buffer(player) { 
     722                return function(arg) { 
     723                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     724                                case "function": 
     725                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_BUFFER, arg); 
     726                                        break; 
     727                                default: 
     728                                        return $.fn.jwplayerController.mediaInfo(player).buffer; 
     729                        } 
     730                        return jwplayer(player); 
     731                }; 
     732        } 
     733         
     734        /** Returns the current time **/ 
     735        function time(player) { 
     736                return function(arg) { 
     737                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     738                                case "function": 
     739                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_TIME, arg); 
     740                                        break; 
     741                                default: 
     742                                        return $.fn.jwplayerController.mediaInfo(player).time; 
     743                        } 
     744                        return jwplayer(player); 
     745                }; 
     746        } 
     747         
     748        /** Loads a new video into the player **/ 
     749        function load(player) { 
     750                return function(arg) { 
     751                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     752                                case "function": 
     753                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_LOADED, arg); 
     754                                        break; 
     755                                default: 
     756                                        $.fn.jwplayerController.load(player, arg); 
     757                        } 
     758                        return jwplayer(player); 
     759                }; 
     760        } 
     761         
     762        /** Adds a listener for video completion **/ 
     763        function complete(player) { 
     764                return function(arg) { 
     765                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_COMPLETE, arg); 
     766                        return jwplayer(player); 
     767                }; 
     768        } 
     769         
     770        /** Returns the duration **/ 
     771        function duration(player) { 
     772                return function() { 
     773                        return $.fn.jwplayerController.mediaInfo(player).duration; 
     774                }; 
     775        } 
     776         
     777        /** Adds a listener for media errors. **/ 
     778        function error(player) { 
     779                return function(arg) { 
     780                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_ERROR, arg); 
     781                        return jwplayer(player); 
     782                }; 
     783        } 
     784         
     785         
     786        /** Returns the width **/ 
     787        function width(player) { 
     788                return function() { 
     789                        return $.fn.jwplayerController.mediaInfo(player).width; 
     790                }; 
     791        } 
     792         
     793         
     794        /** Returns the height **/ 
     795        function height(player) { 
     796                return function() { 
     797                        return $.fn.jwplayerController.mediaInfo(player).height; 
     798                }; 
     799        } 
     800         
     801        /** Returns the available meta-data **/ 
     802        function meta(player) { 
     803                return function() { 
     804                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     805                                case "function": 
     806                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_META, arg); 
     807                                        break; 
     808                                default: 
     809                                        return $.fn.jwplayerController.mediaInfo(player); 
     810                        } 
     811                        return jwplayer(player); 
     812                }; 
     813        } 
     814         
     815        /** Returns the API method for adding an event listener.**/ 
     816        function apiAddEventListener(player) { 
     817                return function(type, listener) { 
     818                        addEventListener(player, type, listener); 
     819                }; 
     820        } 
     821         
     822        /** Returns the API method for adding an event listener.**/ 
     823        function apiRemoveEventListener(player) { 
     824                return function(type, listener) { 
     825                        removeEventListener(player, type, listener); 
     826                }; 
     827        } 
     828         
     829        /** Add an event listener. **/ 
     830        function addEventListener(player, type, listener) { 
     831                if (player.model.listeners[type] === undefined) { 
     832                        player.model.listeners[type] = []; 
     833                } 
     834                player.model.listeners[type].push(listener); 
     835        } 
     836         
     837         
     838        /** Remove an event listener. **/ 
     839        function removeEventListener(player, type, listener) { 
     840                for (var lisenterIndex in player.model.listeners[type]) { 
     841                        if (player.model.listeners[type][lisenterIndex] == listener) { 
     842                                player.model.listeners[type].slice(lisenterIndex, lisenterIndex + 1); 
     843                                break; 
     844                        } 
     845                } 
     846        } 
     847         
     848        /** Send an event **/ 
     849        function sendEvent(player) { 
     850                return function(type, data) { 
     851                        for (var listener in player.model.listeners[type]) { 
     852                                player.model.listeners[type][listener](data); 
     853                        } 
     854                }; 
     855        } 
     856         
     857        function api(player) { 
     858                return { 
     859                        id: player.model.config.id, 
     860                        buffer: buffer(player), 
     861                        duration: duration(player), 
     862                        complete: complete(player), 
     863                        fullscreen: fullscreen(player), 
     864                        height: buffer(player), 
     865                        load: load(player), 
     866                        meta: meta(player), 
     867                        mute: mute(player), 
     868                        pause: pause(player), 
     869                        play: play(player), 
     870                        resize: resize(player), 
     871                        seek: seek(player), 
     872                        state: state(player), 
     873                        stop: stop(player), 
     874                        time: time(player), 
     875                        volume: volume(player), 
     876                        width: width(player), 
     877                        addEventListener: apiAddEventListener(player), 
     878                        removeEventListener: apiRemoveEventListener(player), 
     879                        sendEvent: sendEvent(player), 
     880                        version: '0.1-alpha' 
     881                }; 
     882        } 
     883         
    572884        function jwplayer(selector) { 
    573885                if (selector === undefined) { 
    574                         selector = ".jwplayer:first"; 
    575                 } 
    576                 if ($.fn.jwplayerUtils.typeOf(selector) == "string") { 
    577                         selector = $(selector); 
    578                 } 
    579                 return { 
    580                         buffer: buffer(selector), 
    581                         duration: duration(selector), 
    582                         complete: complete(selector), 
    583                         fullscreen: fullscreen(selector), 
    584                         height: buffer(selector), 
    585                         load: load(selector), 
    586                         meta: meta(selector), 
    587                         mute: mute(selector), 
    588                         pause: pause(selector), 
    589                         play: play(selector), 
    590                         resize: resize(selector), 
    591                         seek: seek(selector), 
    592                         state: state(selector), 
    593                         stop: stop(selector), 
    594                         time: time(selector), 
    595                         volume: volume(selector), 
    596                         width: width(selector), 
    597                         addEventListener: apiAddEventListener(selector), 
    598                         removeEventListener: apiRemoveEventListener(selector), 
    599                         events: events 
    600                 }; 
    601         } 
    602          
    603         var events = { 
     886                        for (var player in players) { 
     887                                return players[player]; 
     888                        } 
     889                } else { 
     890                        return players[selector]; 
     891                } 
     892                return null; 
     893        } 
     894         
     895        $.fn.jwplayer.states = { 
     896                IDLE: 'IDLE', 
     897                BUFFERING: 'BUFFERING', 
     898                PLAYING: 'PLAYING', 
     899                PAUSED: 'PAUSED' 
     900        }; 
     901         
     902        $.fn.jwplayer.events = { 
    604903                JWPLAYER_READY: 'jwplayerReady', 
    605904                JWPLAYER_FULLSCREEN: 'jwplayerFullscreen', 
     
    607906                //JWPLAYER_LOCKED: 'jwplayerLocked', 
    608907                //JWPLAYER_UNLOCKED: 'jwplayerLocked', 
    609                 //JWPLAYER_ERROR: 'jwplayerError', 
     908                JWPLAYER_ERROR: 'jwplayerError', 
    610909                JWPLAYER_MEDIA_BUFFER: 'jwplayerMediaBuffer', 
    611910                //JWPLAYER_MEDIA_BUFFER_FULL: 'jwplayerMediaBufferFull', 
     
    624923                'jwplayer': jwplayer 
    625924        }); 
    626          
    627         /** Hooking the controlbar up to jQuery. **/ 
    628         $.fn.jwplayer = function(options) { 
    629                 return this.each(function() { 
    630                         var player = $(this); 
    631                         player.jwplayerModel(options); 
    632                         player.jwplayerView(); 
    633                         $.fn.jwplayerModel.setActiveMediaProvider(player); 
    634                         $("#"+player[0].id).jwplayerSkinner(function() { 
    635                                 finishSetup(player); 
    636                         }); 
    637                 }); 
    638         }; 
    639          
    640         function finishSetup(player) { 
    641                 player.jwplayerControlbar(); 
    642                 player.trigger("JWPLAYER_READY", { 
    643                         id: player[0].id 
    644                 }); 
    645         } 
    646          
    647          
    648         /** Map with all players on the page. **/ 
    649         $.fn.jwplayer.players = {}; 
    650          
    651          
    652         /** Map with config for the controlbar plugin. **/ 
    653         $.fn.jwplayer.defaults = { 
    654                 autostart: false, 
    655                 duration: 0, 
    656                 file: undefined, 
    657                 height: 300, 
    658                 image: undefined, 
    659                 skin: 'assets/five/five.xml', 
    660                 volume: 100, 
    661                 width: 400, 
    662                 source: 0, 
    663                 flashplayer: 'assets/player.swf' 
    664         }; 
    665          
    666          
    667         /** Start playback or resume. **/ 
    668         function play(player) { 
    669                 return function() { 
    670                         $.fn.jwplayerController.play(player); 
    671                         return jwplayer(player); 
    672                 }; 
    673         } 
    674          
    675         /** Switch the pause state of the player. **/ 
    676         function pause(player) { 
    677                 return function() { 
    678                         $.fn.jwplayerController.pause(player); 
    679                         return jwplayer(player); 
    680                 }; 
    681         } 
    682          
    683          
    684         /** Seek to a position in the video. **/ 
    685         function seek(player) { 
    686                 return function(arg) { 
    687                         $.fn.jwplayerController.seek(player, arg); 
    688                         return jwplayer(player); 
    689                 }; 
    690         } 
    691          
    692          
    693         /** Stop playback and loading of the video. **/ 
    694         function stop(player) { 
    695                 return function() { 
    696                         $.fn.jwplayerController.stop(player); 
    697                         return jwplayer(player); 
    698                 }; 
    699         } 
    700          
    701          
    702         /** Change the video's volume level. **/ 
    703         function volume(player) { 
    704                 return function(arg) { 
    705                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    706                                 case "function": 
    707                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_VOLUME, arg); 
    708                                         break; 
    709                                 case "number": 
    710                                         $.fn.jwplayerController.volume(player, arg); 
    711                                         break; 
    712                                 case "string": 
    713                                         $.fn.jwplayerController.volume(player, parseInt(arg, 10)); 
    714                                         break; 
    715                                 default: 
    716                                         return $.fn.jwplayerController.volume(player); 
    717                         } 
    718                         return jwplayer(player); 
    719                 }; 
    720         } 
    721          
    722         /** Switch the mute state of the player. **/ 
    723         function mute(player, state) { 
    724                 return function(arg) { 
    725                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    726                                 case "function": 
    727                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_MUTE, arg); 
    728                                         break; 
    729                                 case "boolean": 
    730                                         $.fn.jwplayerController.mute(player, arg); 
    731                                         break; 
    732                                 default: 
    733                                         $.fn.jwplayerController.mute(player); 
    734                                         break; 
    735                         } 
    736                         return jwplayer(player); 
    737                 }; 
    738         } 
    739          
    740         /** Resizing the player **/ 
    741         function resize(player, state) { 
    742                 return function(arg1, arg2) { 
    743                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    744                                 case "function": 
    745                                         addEventListener(player, $.jwplayer().events.JWPLAYER_RESIZE, arg); 
    746                                         break; 
    747                                 case "number": 
    748                                         $.fn.jwplayerController.resize(player, arg1, arg2); 
    749                                         break; 
    750                                 default: 
    751                                         break; 
    752                         } 
    753                         return jwplayer(player); 
    754                 }; 
    755         } 
    756          
    757         /** Fullscreen the player **/ 
    758         function fullscreen(player, state) { 
    759                 return function(arg) { 
    760                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    761                                 case "function": 
    762                                         addEventListener(player, $.jwplayer().events.JWPLAYER_FULLSCREEN, arg); 
    763                                         break; 
    764                                 case "boolean": 
    765                                         $.fn.jwplayerController.fullscreen(player, arg); 
    766                                         break; 
    767                                 default: 
    768                                         return $.fn.jwplayerController.fullscreen(player); 
    769                         } 
    770                         return jwplayer(player); 
    771                 }; 
    772         } 
    773          
    774         /** Adds a state listener **/ 
    775         function state(player) { 
    776                 return function(arg) { 
    777                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    778                                 case "function": 
    779                                         addEventListener(player, $.jwplayer().events.JWPLAYER_PLAYER_STATE, arg); 
    780                                         break; 
    781                                 default: 
    782                                         return $.fn.jwplayerController.mediaInfo(player).state; 
    783                         } 
    784                         return jwplayer(player); 
    785                 }; 
    786         } 
    787          
    788         /** Adds a buffer listener **/ 
    789         function buffer(player) { 
    790                 return function(arg) { 
    791                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    792                                 case "function": 
    793                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_BUFFER, arg); 
    794                                         break; 
    795                                 default: 
    796                                         return $.fn.jwplayerController.mediaInfo(player).buffer; 
    797                         } 
    798                         return jwplayer(player); 
    799                 }; 
    800         } 
    801          
    802         /** Returns the current time **/ 
    803         function time(player) { 
    804                 return function(arg) { 
    805                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    806                                 case "function": 
    807                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_TIME, arg); 
    808                                         break; 
    809                                 default: 
    810                                         return $.fn.jwplayerController.mediaInfo(player).time; 
    811                         } 
    812                         return jwplayer(player); 
    813                 }; 
    814         } 
    815          
    816         /** Loads a new video into the player **/ 
    817         function load(player) { 
    818                 return function(arg) { 
    819                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    820                                 case "function": 
    821                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_LOADED, arg); 
    822                                         break; 
    823                                 default: 
    824                                         $.fn.jwplayerController.load(player, arg); 
    825                         } 
    826                         return jwplayer(player); 
    827                 }; 
    828         } 
    829  
    830         /** Adds a listener for video completion **/ 
    831         function complete(player) { 
    832                 return function(arg) { 
    833                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_COMPLETE, arg); 
    834                         return jwplayer(player); 
    835                 }; 
    836         } 
    837  
    838         /** Returns the duration **/ 
    839         function duration(player) { 
    840                 return function() { 
    841                         return $.fn.jwplayerController.mediaInfo(player).duration; 
    842                 }; 
    843         } 
    844  
    845         /** Adds a listener for media errors. **/ 
    846         function error(player) { 
    847                 return function(arg) { 
    848                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_ERROR, arg); 
    849                         return jwplayer(player); 
    850                 }; 
    851         } 
    852  
    853  
    854         /** Returns the width **/ 
    855         function width(player) { 
    856                 return function() { 
    857                         return $.fn.jwplayerController.mediaInfo(player).width; 
    858                 }; 
    859         } 
    860          
    861          
    862         /** Returns the height **/ 
    863         function height(player) { 
    864                 return function() { 
    865                         return $.fn.jwplayerController.mediaInfo(player).height; 
    866                 }; 
    867         } 
    868          
    869         /** Returns the available meta-data **/ 
    870         function meta(player) { 
    871                 return function() { 
    872                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    873                                 case "function": 
    874                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_META, arg); 
    875                                         break; 
    876                                 default: 
    877                                         return $.fn.jwplayerController.mediaInfo(player); 
    878                         } 
    879                         return jwplayer(player); 
    880                 }; 
    881         } 
    882          
    883         /** Returns the API method for adding an event listener.**/ 
    884         function apiAddEventListener(player) { 
    885                 return function(event, listener) { 
    886                         addEventListener(player, event, listener); 
    887                 }; 
    888         } 
    889  
    890         /** Returns the API method for adding an event listener.**/ 
    891         function apiRemoveEventListener(player) { 
    892                 return function(event, listener) { 
    893                         removeEventListener(player, event, listener); 
    894                 }; 
    895         } 
    896          
    897         /** Add an event listener. **/ 
    898         function addEventListener(player, event, listener) { 
    899                 $(player).bind(event, listener); 
    900         } 
    901          
    902          
    903         /** Remove an event listener. **/ 
    904         function removeEventListener(player, event, listener) { 
    905                 $(player).unbind(event, listener); 
    906         } 
    907925         
    908926        /** Automatically initializes the player for all <video> tags with the JWPlayer class. **/ 
     
    922940 
    923941        var controllerEvents = { 
    924                 ERROR: "ERROR", 
     942                ERROR: $.fn.jwplayer.events.JWPLAYER_ERROR, 
    925943                ITEM: "ITEM", 
    926                 MUTE: "MUTE", 
     944                MUTE: $.fn.jwplayer.events.JWPLAYER_MEDIA_MUTE, 
    927945                PLAY: "PLAY", 
    928946                PLAYLIST: "PLAYLIST", 
    929                 RESIZE: "RESIZE", 
     947                RESIZE: $.fn.jwplayer.events.JWPLAYER_RESIZE, 
    930948                SEEK: "SEEK", 
    931949                STOP: "STOP", 
    932                 VOLUME: "VOLUME" 
     950                VOLUME: $.fn.jwplayer.events.JWPLAYER_MEDIA_VOLUME 
    933951        }; 
    934952         
    935953        var modelEvents = { 
    936                 BUFFER: "BUFFER", 
    937                 ERROR: "ERROR", 
    938                 LOADED: "LOADED", 
    939                 META: "META", 
    940                 STATE: stateHandler, 
    941                 TIME: "TIME" 
     954                BUFFER: $.fn.jwplayer.events.JWPLAYER_MEDIA_BUFFER, 
     955                ERROR: $.fn.jwplayer.events.JWPLAYER_MEDIA_ERROR, 
     956                LOADED: $.fn.jwplayer.events.JWPLAYER_MEDIA_LOADED, 
     957                META: $.fn.jwplayer.events.JWPLAYER_MEDIA_META, 
     958                STATE: $.fn.jwplayer.events.JWPLAYER_PLAYER_STATE, 
     959                TIME: $.fn.jwplayer.events.JWPLAYER_MEDIA_TIME 
    942960        }; 
    943961         
     
    957975                VOLUME: "VOLUME" 
    958976        }; 
    959          
    960         $.fn.jwplayerMediaFlash = function(options) { 
    961                 return this.each(function() { 
    962                         var model = $(this).data("model"); 
    963                         //model.autostart = true; 
    964                         model.controlbar = 'none'; 
    965                         model.icons = false; 
    966                         $.fn.jwplayerView.embedFlash($(this), model); 
    967                         var media = { 
    968                                 play: play($(this)), 
    969                                 pause: pause($(this)), 
    970                                 seek: seek($(this)), 
    971                                 volume: volume($(this)), 
    972                                 mute: mute($(this)), 
    973                                 fullscreen: fullscreen($(this)), 
    974                                 state: "idle" 
    975                         }; 
    976                         $(this).data("media", media); 
    977                         addEventListeners($(this)); 
    978                 }); 
    979         }; 
    980          
    981         function stateHandler(event) { 
    982                 $(event.id).data("media").state = event.newState; 
    983                 sendEvent($(event.id), $.jwplayer().events.JWPLAYER_PLAYER_STATE, { 
     977 
     978         
     979        $.fn.jwplayerMediaFlash = function(player) { 
     980                var options = {}; 
     981                //options.autostart = true; 
     982                options.controlbar = 'none'; 
     983                options.icons = false; 
     984                $.fn.jwplayerView.embedFlash(player, options); 
     985                var media = { 
     986                        play: play(player), 
     987                        pause: pause(player), 
     988                        seek: seek(player), 
     989                        volume: volume(player), 
     990                        mute: mute(player), 
     991                        fullscreen: fullscreen(player), 
     992                        load: load(player), 
     993                        resize: resize(player), 
     994                        mediaInfo: mediaInfo(player), 
     995                        state: $.fn.jwplayer.states.IDLE 
     996                }; 
     997                player.media = media; 
     998                addEventListeners(player); 
     999        }; 
     1000         
     1001        function stateHandler(event, player) { 
     1002                player.model.state = event.newstate; 
     1003                player.sendEvent($.fn.jwplayer.events.JWPLAYER_PLAYER_STATE, { 
    9841004                        oldstate: event.oldstate, 
    985                         newstate: event.newState 
    986                 }); 
    987         } 
     1005                        newstate: event.newstate 
     1006                }); 
     1007        } 
     1008         
    9881009         
    9891010        function addEventListeners(player) { 
    990                 var event; 
    991                 if ($("#" + player[0].id)[0].addControllerListener === undefined) { 
     1011                if (player.model.domelement[0].addControllerListener === undefined) { 
    9921012                        setTimeout(function() { 
    9931013                                addEventListeners(player); 
     
    9951015                        return; 
    9961016                } 
    997                 for (event in controllerEvents) { 
    998                         $("#" + player[0].id)[0].addControllerListener(event, "$.fn.jwplayerMediaFlash.forward"); 
    999                 } 
    1000                 for (event in modelEvents) { 
    1001                         $("#" + player[0].id)[0].addModelListener(event, "$.fn.jwplayerMediaFlash.forward"); 
    1002                 } 
    1003         } 
    1004          
    1005         $.fn.jwplayerMediaFlash.forward = function(event) { 
    1006                 $(event.id).trigger(event.type, event); 
    1007         }; 
     1017                var video = player.model.domelement; 
     1018                for (var controllerEvent in controllerEvents) { 
     1019                        $.fn.jwplayerMediaFlash.forwarders[controllerEvents[controllerEvent]] = forwardFactory(controllerEvents[controllerEvent], player); 
     1020                        video[0].addControllerListener(controllerEvent, "$.fn.jwplayerMediaFlash.forwarders."+controllerEvents[controllerEvent]); 
     1021                } 
     1022                for (var modelEvent in modelEvents) { 
     1023                        $.fn.jwplayerMediaFlash.forwarders[modelEvents[modelEvent]] = forwardFactory(modelEvents[modelEvent], player); 
     1024                        video[0].addModelListener(modelEvent, "$.fn.jwplayerMediaFlash.forwarders."+modelEvents[modelEvent]); 
     1025                } 
     1026        } 
     1027         
     1028        function forwardFactory(type, player){ 
     1029                return function(event){ 
     1030                        forward(event, type, player); 
     1031                }; 
     1032        } 
     1033         
     1034        $.fn.jwplayerMediaFlash.forwarders = {}; 
     1035         
     1036        function forward(event, type, player) { 
     1037                $.fn.jwplayerUtils.log(type, event); 
     1038                switch (type) { 
     1039                        case $.fn.jwplayer.events.JWPLAYER_PLAYER_STATE: 
     1040                                stateHandler(event, player); 
     1041                                break; 
     1042                        case $.fn.jwplayer.events.JWPLAYER_MEDIA_BUFFER: 
     1043                                event.bufferPercent = event.percentage;  
     1044                                player.sendEvent(type, event); 
     1045                                break; 
     1046                        default: 
     1047                                player.sendEvent(type, event); 
     1048                                break; 
     1049                }        
     1050        } 
    10081051         
    10091052        function play(player) { 
    10101053                return function() { 
    1011                         $("#" + player[0].id)[0].sendEvent("PLAY"); 
     1054                        try { 
     1055                                player.model.domelement[0].sendEvent("PLAY"); 
     1056                        } catch (err){ 
     1057                                $.fn.jwplayerUtils.log("There was an error", err); 
     1058                        } 
    10121059                }; 
    10131060        } 
     
    10161063        function pause(player) { 
    10171064                return function() { 
    1018                         $("#" + player[0].id)[0].sendEvent("PAUSE"); 
     1065                        player.model.domelement[0].sendEvent("PAUSE"); 
    10191066                }; 
    10201067        } 
     
    10241071        function seek(player) { 
    10251072                return function(position) { 
    1026                         $("#" + player[0].id)[0].sendEvent("SEEK", position); 
     1073                        player.model.domelement[0].sendEvent("SEEK", position); 
    10271074                }; 
    10281075        } 
     
    10321079        function stop(player) { 
    10331080                return function() { 
    1034                         $("#" + player[0].id)[0].sendEvent("STOP"); 
     1081                        player.model.domelement[0].sendEvent("STOP"); 
    10351082                }; 
    10361083        } 
     
    10401087        function volume(player) { 
    10411088                return function(position) { 
    1042                         $("#" + player[0].id)[0].sendEvent("VOLUME", position); 
     1089                        player.model.domelement[0].sendEvent("VOLUME", position); 
    10431090                }; 
    10441091        } 
     
    10471094        function mute(player) { 
    10481095                return function(state) { 
    1049                         $("#" + player[0].id)[0].sendEvent("MUTE"); 
     1096                        player.model.domelement[0].sendEvent("MUTE"); 
    10501097                }; 
    10511098        } 
     
    10551102                return function(state) { 
    10561103                        //player.fullscreen = state; 
     1104                }; 
     1105        } 
     1106        /** Load a new video into the player. **/ 
     1107        function load(player) { 
     1108                return function(path) { 
     1109                        //TODO 
     1110                }; 
     1111        } 
     1112         
     1113        /** Resizes the video **/ 
     1114        function resize(player) { 
     1115                return function(width, height) { 
     1116                        //TODO 
     1117                }; 
     1118        } 
     1119         
     1120         
     1121        /** Returns the media info **/ 
     1122        function mediaInfo(player) { 
     1123                return function(){ 
     1124                        return { 
     1125                                width: player.model.width, 
     1126                                player: player.model.height, 
     1127                                state: player.model.state  
     1128                        }; 
    10571129                }; 
    10581130        } 
     
    10681140(function($) { 
    10691141        var states = { 
    1070                 "buffering": "buffering", 
    1071                 "ended": "idle", 
    1072                 "playing": "playing", 
    1073                 "pause": "paused" 
     1142                "ended": $.fn.jwplayer.states.IDLE, 
     1143                "playing": $.fn.jwplayer.states.PLAYING, 
     1144                "pause": $.fn.jwplayer.states.PAUSED, 
     1145                "buffering": $.fn.jwplayer.states.BUFFERING 
    10741146        }; 
    10751147         
     
    10941166                'stalled': stateHandler, 
    10951167                'suspend': stateHandler, 
    1096                 'timeupdate': generalHandler, 
     1168                'timeupdate': positionHandler, 
    10971169                'volumechange': generalHandler, 
    10981170                'waiting': stateHandler, 
     
    11051177         
    11061178         
    1107         $.fn.jwplayerMediaVideo = function(options) { 
    1108                 return this.each(function() { 
    1109                         var video = $(this); 
    1110                         var media = { 
    1111                                 play: play(video), 
    1112                                 pause: pause(video), 
    1113                                 seek: seek(video), 
    1114                                 stop: stop(video), 
    1115                                 volume: volume(video), 
    1116                                 mute: mute(video), 
    1117                                 fullscreen: fullscreen(video), 
    1118                                 load: load(video), 
    1119                                 state: "idle", 
    1120                                 interval: null 
    1121                         }; 
    1122                         video.data("media", media); 
    1123                         $.each(events, function(event, handler) { 
    1124                                 video[0].addEventListener(event, handler, true); 
     1179        $.fn.jwplayerMediaVideo = function(player) { 
     1180                var media = { 
     1181                        play: play(player), 
     1182                        pause: pause(player), 
     1183                        seek: seek(player), 
     1184                        stop: stop(player), 
     1185                        volume: volume(player), 
     1186                        mute: mute(player), 
     1187                        fullscreen: fullscreen(player), 
     1188                        load: load(player), 
     1189                        resize: resize(player), 
     1190                        mediaInfo: mediaInfo(player), 
     1191                        state: $.fn.jwplayer.states.IDLE, 
     1192                        interval: null 
     1193                }; 
     1194                player.media = media; 
     1195                $.each(events, function(event, handler) { 
     1196                        player.model.domelement[0].addEventListener(event, function(event) { 
     1197                                handler(event, player); 
     1198                        }, true); 
     1199                }); 
     1200        }; 
     1201         
     1202        function generalHandler(event, player) { 
     1203                //$.fn.jwplayerUtils.log("general:" + event.type); 
     1204        } 
     1205         
     1206        function stateHandler(event, player) { 
     1207                if (states[event.type]) { 
     1208                        setState(player, states[event.type]); 
     1209                } 
     1210        } 
     1211         
     1212        function setState(player, newstate) { 
     1213                if (player.model.state != newstate) { 
     1214                        var oldstate = player.model.state; 
     1215                        player.model.state = newstate; 
     1216                        sendEvent(player, $.fn.jwplayer.events.JWPLAYER_PLAYER_STATE, { 
     1217                                oldstate: oldstate, 
     1218                                newstate: newstate 
    11251219                        }); 
    1126                 }); 
    1127         }; 
    1128          
    1129         function generalHandler(event) { 
    1130                 //$.fn.jwplayerUtils.log("general:" + event.type); 
    1131         } 
    1132          
    1133         function stateHandler(event) { 
    1134                 if (states[event.type]) { 
    1135                         setState(event.target, states[event.type]); 
    1136                 } 
    1137         } 
    1138          
    1139         function setState(player, newState) { 
    1140                 if ($(player).data("media").state != newState) { 
    1141                         var oldState = $(player).data("media").state; 
    1142                         $(player).data("media").state = newState; 
    1143                         sendEvent($(player), $.jwplayer().events.JWPLAYER_PLAYER_STATE, { 
    1144                                 oldstate: oldState, 
    1145                                 newstate: newState 
    1146                         }); 
    1147                 } 
    1148                 if (newState == 'idle') { 
    1149                         clearInterval($(player).data("media").interval); 
    1150                         $(player).data("media").interval = null; 
    1151                 } 
    1152         } 
    1153          
    1154         function metaHandler(event) { 
    1155                 sendEvent($(event.target), $.jwplayer().events.JWPLAYER_MEDIA_META, { 
    1156                         videoHeight: event.target.videoHeight, 
    1157                         videoWidth: event.target.videoWidth, 
     1220                } 
     1221                if (newstate == $.fn.jwplayer.states.IDLE) { 
     1222                        clearInterval(player.media.interval); 
     1223                        player.media.interval = null; 
     1224                } 
     1225        } 
     1226         
     1227        function metaHandler(event, player) { 
     1228                var meta = { 
     1229                        height: event.target.videoHeight, 
     1230                        width: event.target.videoWidth, 
    11581231                        duration: event.target.duration 
    1159                 }); 
    1160         } 
    1161          
    1162         function positionHandler(event) { 
    1163                 if ($(event.target).data("media").interval === null) { 
    1164                         $(event.target).data("media").interval = window.setInterval(function() { 
    1165                                 positionHandler(event); 
     1232                }; 
     1233                player.model = $.extend(player.model, meta); 
     1234                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_META, meta); 
     1235        } 
     1236         
     1237        function positionHandler(event, player) { 
     1238                if (player.media.interval === null) { 
     1239                        player.media.interval = window.setInterval(function() { 
     1240                                positionHandler(event, player); 
    11661241                        }, 100); 
    11671242                } 
    1168                 sendEvent($(event.target), $.jwplayer().events.JWPLAYER_MEDIA_TIME, { 
     1243                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_TIME, { 
    11691244                        position: event.target.currentTime, 
    11701245                        duration: event.target.duration 
     
    11721247        } 
    11731248         
    1174         function progressHandler(event) { 
     1249        function progressHandler(event, player) { 
    11751250                var buffer; 
    11761251                if (!isNaN(event.loaded / event.total)) { 
    11771252                        buffer = event.loaded / event.total * 100; 
    1178                 } else if (event.target.buffered !== undefined) { 
    1179                         buffer = event.target.buffered.end(0) / event.target.duration * 100; 
    1180                 } 
    1181                 sendEvent($(event.target), $.jwplayer().events.JWPLAYER_MEDIA_BUFFER, { 
     1253                } else if (player.model.domelement.buffered !== undefined) { 
     1254                        buffer = player.model.domelement.buffered.end(0) / player.model.domelement.duration * 100; 
     1255                } 
     1256                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_BUFFER, { 
    11821257                        'bufferPercent': buffer 
    11831258                }); 
    11841259        } 
    11851260         
    1186         function errorHandler(event) { 
    1187                 sendEvent($(event.target), $.jwplayer().events.JWPLAYER_ERROR, {}); 
     1261        function errorHandler(event, player) { 
     1262                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_ERROR, {}); 
    11881263        } 
    11891264         
    11901265        function play(player) { 
    11911266                return function() { 
    1192                         player[0].play(); 
     1267                        player.model.domelement[0].play(); 
    11931268                }; 
    11941269        } 
     
    11971272        function pause(player) { 
    11981273                return function() { 
    1199                         player[0].pause(); 
     1274                        player.model.domelement[0].pause(); 
    12001275                }; 
    12011276        } 
     
    12051280        function seek(player) { 
    12061281                return function(position) { 
    1207                         player[0].currentTime = position; 
     1282                        player.model.domelement[0].currentTime = position; 
    12081283                }; 
    12091284        } 
     
    12131288        function stop(player) { 
    12141289                return function() { 
    1215                         player[0].pause(); 
    1216                         player[0].currentTime = 0; 
    1217                         clearInterval($(player).data("media").interval); 
    1218                         $(player).data("media").interval = null; 
    1219                         setState(player, 'idle'); 
     1290                        player.model.domelement[0].pause(); 
     1291                        player.model.domelement[0].currentTime = 0; 
     1292                        clearInterval(player.media.interval); 
     1293                        player.media.interval = null; 
     1294                        setState(player, $.fn.jwplayer.states.IDLE); 
    12201295                }; 
    12211296        } 
     
    12251300        function volume(player) { 
    12261301                return function(position) { 
    1227                         player[0].volume = position / 100; 
    1228                         sendEvent(player, $.jwplayer().events.JWPLAYER_MEDIA_VOLUME, { 
    1229                                 volume: player[0].volume 
     1302                        player.model.domelement[0].volume = position / 100; 
     1303                        sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_VOLUME, { 
     1304                                volume: player.model.domelement[0].volume 
    12301305                        }); 
    12311306                }; 
     
    12351310        function mute(player) { 
    12361311                return function(state) { 
    1237                         player[0].muted = state; 
    1238                         sendEvent(player, $.jwplayer().events.JWPLAYER_MEDIA_MUTE, { 
    1239                                 mute: player[0].muted 
     1312                        player.model.domelement[0].muted = state; 
     1313                        sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_MUTE, { 
     1314                                mute: player.model.domelement[0].muted 
    12401315                        }); 
    12411316                }; 
     
    12471322                        player.css("width", width); 
    12481323                        player.css("height", height); 
    1249                         sendEvent(player, $.jwplayer().events.JWPLAYER_MEDIA_RESIZE, { 
     1324                        sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_RESIZE, { 
    12501325                                width: width, 
    12511326                                hieght: height 
     
    12601335                                player.css("width", window.width); 
    12611336                                player.css("height", window.height); 
    1262                                 sendEvent(player, $.jwplayer().events.JWPLAYER_MEDIA_RESIZE, { 
     1337                                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_RESIZE, { 
    12631338                                        width: width, 
    12641339                                        hieght: height 
     
    12771352        } 
    12781353         
     1354        /** Returns the media info **/ 
     1355        function mediaInfo(player) { 
     1356                return function(){ 
     1357                        return { 
     1358                                width: player.model.width, 
     1359                                player: player.model.height, 
     1360                                state: player.model.state  
     1361                        }; 
     1362                }; 
     1363        } 
     1364         
    12791365        function sendEvent(player, type, data) { 
    1280                 player.trigger(type, $.extend({ 
    1281                         id: player[0].id, 
    1282                         version: $.jwplayer(player).version 
     1366                player.sendEvent(type, $.extend({ 
     1367                        id: player.model.config.id, 
     1368                        version: player.version 
    12831369                }, data)); 
    12841370        } 
     
    12941380 */ 
    12951381(function($) { 
     1382        var jwplayerid = 1; 
     1383         
     1384        var modelParams ={ 
     1385                volume: 100, 
     1386                fullscreen: false, 
     1387                mute: false, 
     1388                width: 480, 
     1389                height: 320, 
     1390                duration: 0 
     1391        }; 
     1392         
     1393        function createModel(){ 
     1394                return { 
     1395                        config: {}, 
     1396                        sources: {}, 
     1397                        listeners: {}, 
     1398                        state: $.fn.jwplayer.states.IDLE, 
     1399                        source: 0, 
     1400                        buffer: 0 
     1401                }; 
     1402        } 
    12961403 
    1297         $.fn.jwplayerModel = function(options) { 
    1298                 return this.each(function() { 
    1299                         $(this).jwplayerParse(options); 
    1300                 }); 
     1404         
     1405        $.fn.jwplayerModel = function(domElement, options) { 
     1406                var model = createModel(); 
     1407                model.config = $.fn.jwplayerParse(domElement[0], options); 
     1408                if (model.config.id === undefined) { 
     1409                        model.config.id = "jwplayer_"+jwplayerid++; 
     1410                } 
     1411                model.sources = model.config.sources; 
     1412                delete model.config.sources; 
     1413                model.domelement = domElement; 
     1414                for (var modelParam in modelParams) { 
     1415                        if (model.config[modelParam] !== undefined) { 
     1416                                model[modelParam] = model.config[modelParam]; 
     1417                        } else { 
     1418                                model[modelParam] = modelParams[modelParam]; 
     1419                        } 
     1420                } 
     1421                return model; 
    13011422        }; 
    13021423         
    13031424        $.fn.jwplayerModel.setActiveMediaProvider = function(player) { 
    13041425                var source, sourceIndex; 
    1305                 var model = player.data("model"); 
    1306                 for (sourceIndex in model.sources) { 
    1307                         source = model.sources[sourceIndex]; 
     1426                for (sourceIndex in player.model.sources) { 
     1427                        source = player.model.sources[sourceIndex]; 
    13081428                        if (source.type === undefined) { 
    13091429                                source.type = 'video/' + $.fn.jwplayerUtils.extension(source.file) + ';'; 
    13101430                        } 
    13111431                        if ($.fn.jwplayerUtils.supportsType(source.type)) { 
    1312                                 model.source = sourceIndex; 
    1313                                 player.jwplayerMediaVideo(); 
     1432                                player.model.source = sourceIndex 
     1433                                $.fn.jwplayerMediaVideo(player); 
    13141434                                return true; 
    13151435                        } 
    13161436                } 
    1317                 if ($.fn.jwplayerUtils.supportsFlash && model.state != 'playing') { 
    1318                         for (sourceIndex in model.sources) { 
    1319                                 source = model.sources[sourceIndex]; 
     1437                if ($.fn.jwplayerUtils.supportsFlash && player.state != $.fn.jwplayer.states.PLAYING) { 
     1438                        for (sourceIndex in player.model.sources) { 
     1439                                source = player.model.sources[sourceIndex]; 
    13201440                                if ($.fn.jwplayerUtils.flashCanPlay(source.file)) { 
    1321                                         model.source = sourceIndex; 
    1322                                         player.jwplayerMediaFlash(); 
     1441                                        player.model.source = sourceIndex; 
     1442                                        $.fn.jwplayerMediaFlash(player); 
    13231443                                        return true; 
    13241444                                } 
     
    13651485        var parsers = {}; 
    13661486         
    1367         $.fn.jwplayerParse = function(options) { 
    1368                 return this.each(function() { 
    1369                         $(this).data("model", $.extend(true, {}, $.fn.jwplayer.defaults, options, parseElement(this))); 
    1370                 }); 
     1487        $.fn.jwplayerParse = function(player, options) { 
     1488                return $.extend(true, {}, $.fn.jwplayer.defaults, options, parseElement(player)); 
    13711489        }; 
    13721490         
     
    13941512                                } 
    13951513                        } 
    1396                         configuration.screencolor = $(domElement).css("background-color"); 
     1514                        configuration.screencolor = ($(domElement).css("background-color") == "transparent") ? "#ffffff" : $(domElement).css("background-color"); 
    13971515                        return configuration; 
    13981516                } 
     
    14431561 
    14441562        /** Constructor **/ 
    1445         $.fn.jwplayerSkinner = function(completeHandler) { 
    1446                 return this.each(function() { 
    1447                         load($(this), completeHandler); 
    1448                 }); 
     1563        $.fn.jwplayerSkinner = function(player, completeHandler) { 
     1564                load(player, completeHandler); 
    14491565        }; 
    14501566         
    14511567        /** Load the skin **/ 
    14521568        load = function (player, completeHandler){ 
    1453                 $.get(player.data("model").skin, {}, function(xml) { 
     1569                $.get(player.model.config.skin, {}, function(xml) { 
    14541570                        var skin = { 
    14551571                                properties:{}, 
     
    14741590                                skin[componentName] = component; 
    14751591                        } 
    1476                         player.data("skin", skin); 
     1592                        player.skin = skin; 
    14771593                }); 
    14781594        }; 
     
    14831599                var elementName = $(element).attr('name'); 
    14841600                var elementSource = $(element).attr('src'); 
    1485                 var skinUrl = player.data("model").skin.substr(0, player.data("model").skin.lastIndexOf('/')); 
     1601                var skinUrl = player.model.config.skin.substr(0,  player.model.config.skin.lastIndexOf('/')); 
    14861602                $(img).error(function() { 
    1487                         player.data("skin").incompleteElements--; 
     1603                        player.skin.incompleteElements--; 
    14881604                }); 
    14891605                $(img).load(function() { 
    1490                         player.data("skin")[component].elements[elementName] = { 
     1606                        player.skin[component].elements[elementName] = { 
    14911607                                height: this.height, 
    14921608                                width: this.width, 
    14931609                                src: this.src 
    14941610                        }; 
    1495                         player.data("skin").incompleteElements--; 
    1496                         if (player.data("skin").incompleteElements === 0) { 
     1611                        player.skin.incompleteElements--; 
     1612                        if (player.skin.incompleteElements === 0) { 
    14971613                                completeHandler(); 
    14981614                        } 
     
    15021618         
    15031619        $.fn.jwplayerSkinner.hasComponent = function (player, component){ 
    1504                 return (player.data("skin")[component] !== null); 
     1620                return (player.skin[component] !== null); 
    15051621        }; 
    15061622         
     
    15081624        $.fn.jwplayerSkinner.getSkinElement = function (player, component, element){ 
    15091625                try { 
    1510                         return player.data("skin")[component].elements[element]; 
     1626                        return player.skin[component].elements[element]; 
    15111627                } catch (err) { 
    15121628                        $.fn.jwplayerUtils.log("No such skin component / element: ", [player, component, element]); 
     
    15181634        $.fn.jwplayerSkinner.addSkinElement = function (player, component, name, element){ 
    15191635                try { 
    1520                         player.data("skin")[component][name] = element; 
     1636                        player.skin[component][name] = element; 
    15211637                } catch (err){ 
    15221638                        $.fn.jwplayerUtils.log("No such skin component ", [player, component]); 
     
    15251641         
    15261642        $.fn.jwplayerSkinner.getSkinProperties = function (player){ 
    1527                 return player.data("skin").properties; 
     1643                return player.skin.properties; 
    15281644        }; 
    15291645         
     
    17231839        }; 
    17241840         
    1725         $.fn.jwplayerView = function() { 
    1726                 return this.each(function() { 
    1727                         var video = $(this); 
    1728                         if ($(this).attr("src") !== "") { 
    1729                                 $(this).attr("preload", "metadata"); 
    1730                                 $(this).append('<source src="' + $(this).attr("src") + '" >'); 
    1731                                 $(this).removeAttr("src"); 
    1732                         } 
    1733                         $(this).wrap("<div id='" + $(this)[0].id + "_jwplayer' />"); 
    1734                         $(this).parent().css("position", "relative"); 
    1735                         //$(this).css("display", "none"); 
    1736                         $(this).css("position", "absolute"); 
    1737                         $(this).css("left", "0px"); 
    1738                         $(this).css("top", "0px"); 
    1739                         $(this).css("z-index", "0"); 
    1740                         $(this).before("<a href='" + $(this).data("model").sources[$(this).data("model").source].file + "' style='display:block; background:#ffffff url(" + $(this).data("model").image + ") no-repeat center center;width:" + $(this).data("model").width + "px;height:" + $(this).data("model").height + "px;position:relative;'><img src='http://content.bitsontherun.com/staticfiles/play.png' alt='Click to play video' style='position:absolute; top:" + ($(this).data("model").height - 60) / 2 + "px; left:" + ($(this).data("model").width - 60) / 2 + "px; border:0;' /></a>"); 
    1741                         $(this).prev("a").css("position", "relative"); 
    1742                         $(this).prev("a").css("z-index", "100"); 
    1743                         $(this).prev("a").click(function(evt) { 
    1744                                 if (typeof evt.preventDefault != 'undefined') { 
    1745                                         evt.preventDefault(); // W3C  
    1746                                 } else { 
    1747                                         evt.returnValue = false; // IE  
    1748                                 } 
    1749                                 $.jwplayer(video).play(); 
    1750                         }); 
    1751                         $.jwplayer(video).state(imageHandler); 
    1752                 }); 
    1753         }; 
    1754          
    1755         function imageHandler(event, parameters) { 
    1756                 $.fn.jwplayerUtils(event.target); 
    1757                 switch (parameters.newstate) { 
    1758                         case 'idle': 
    1759                                 $(event.target).css("z-index", "0"); 
    1760                                 $(event.target).prev("a").css("z-index", "100"); 
     1841        $.fn.jwplayerView = function(player) { 
     1842                /*if (!(($(this).attr("src") === undefined) || ($(this).attr("src") === ""))) { 
     1843                        $(this).attr("preload", "metadata"); 
     1844                        $(this).append('<source src="' + $(this).attr("src") + '" >'); 
     1845                        $(this).removeAttr("src"); 
     1846                }*/ 
     1847                player.model.domelement.wrap("<div id='" + player.model.config.id + "_jwplayer' />"); 
     1848                player.model.domelement.parent().css("position", "relative"); 
     1849                //$(this).css("display", "none"); 
     1850                player.model.domelement.css("position", "absolute"); 
     1851                player.model.domelement.css("left", "0px"); 
     1852                player.model.domelement.css("top", "0px"); 
     1853                player.model.domelement.css("z-index", "0"); 
     1854                player.model.domelement.before("<a href='" + player.model.sources[player.model.source].file + "' style='display:block; background:#ffffff url(" + player.model.config.image + ") no-repeat center center;width:" + player.model.width + "px;height:" + player.model.height + "px;position:relative;'><img src='http://content.bitsontherun.com/staticfiles/play.png' alt='Click to play video' style='position:absolute; top:" + (player.model.height - 60) / 2 + "px; left:" + (player.model.width - 60) / 2 + "px; border:0;' /></a>"); 
     1855                player.model.domelement.prev("a").css("position", "relative"); 
     1856                player.model.domelement.prev("a").css("z-index", "100"); 
     1857                player.model.domelement.prev("a").click(function(evt) { 
     1858                        if (typeof evt.preventDefault != 'undefined') { 
     1859                                evt.preventDefault(); // W3C  
     1860                        } else { 
     1861                                evt.returnValue = false; // IE  
     1862                        } 
     1863                        if (player.state() !== $.fn.jwplayer.states.PLAYING){ 
     1864                                player.play(); 
     1865                        } else { 
     1866                                player.pause(); 
     1867                        } 
     1868                          
     1869                }); 
     1870                $.jwplayer(player.model.config.id).state(function(obj) { 
     1871                        imageHandler(obj, player); 
     1872                }); 
     1873        }; 
     1874         
     1875        function imageHandler(obj, player) { 
     1876                switch (obj.newstate) { 
     1877                        case $.fn.jwplayer.states.IDLE: 
     1878                                player.model.domelement.css("z-index", "0"); 
     1879                                player.model.domelement.prev("a").css("z-index", "100"); 
    17611880                                break; 
    1762                         case 'playing': 
    1763                                 $(event.target).prev("a").css("z-index", "0"); 
    1764                                 $(event.target).css("z-index", "100"); 
     1881                        case $.fn.jwplayer.states.PLAYING: 
     1882                                player.model.domelement.prev("a").css("z-index", "0"); 
     1883                                player.model.domelement.css("z-index", "100"); 
    17651884                                break; 
    17661885                } 
    17671886        } 
    17681887         
     1888        $.fn.jwplayerView.switchMediaProvider = function(){ 
     1889                 
     1890        }; 
     1891         
    17691892        /** Embeds a Flash Player at the specified location in the DOM. **/ 
    1770         $.fn.jwplayerView.embedFlash = function(domElement, model) { 
    1771                 if (model.flashplayer !== false) { 
     1893        $.fn.jwplayerView.embedFlash = function(player, options) { 
     1894                if (player.model.config.flashplayer !== false) { 
    17721895                        var htmlString, elementvarString = "", flashvarString = ""; 
    17731896                        if (navigator.plugins && navigator.mimeTypes && navigator.mimeTypes.length) { 
     
    17771900                        } 
    17781901                        for (var elementvar in elementvars) { 
    1779                                 if (!((model[elementvar] === undefined) || (model[elementvar] === "") || (model[elementvar] === null))) { 
    1780                                         elementvarString += elementvar + "='" + model[elementvar] + "'"; 
     1902                                if (!((player.model.config[elementvar] === undefined) || (player.model.config[elementvar] === "") || (player.model.config[elementvar] === null))) { 
     1903                                        elementvarString += elementvar + "='" + player.model.config[elementvar] + "'"; 
    17811904                                } 
    17821905                        } 
    1783                         for (var flashvar in model) { 
    1784                                 if (!((model[flashvar] === undefined) || (model[flashvar] === "") || (model[flashvar] === null))) { 
    1785                                         if (flashvar == "sources") { 
    1786                                                 flashvarString += "file=" + model.sources[model.source].file + "&"; 
    1787                                         } else { 
    1788                                                 flashvarString += flashvar + "=" + model[flashvar] + "&"; 
    1789                                         } 
     1906                        flashvarString += "file=" + player.model.sources[player.model.source].file + "&"; 
     1907                        var config = $.extend(true, {}, player.model.config, options); 
     1908                        for (var flashvar in config) { 
     1909                                if (!((config[flashvar] === undefined) || (config[flashvar] === "") || (config[flashvar] === null))) { 
     1910                                                flashvarString += flashvar + "=" + config[flashvar] + "&"; 
    17901911                                } 
    17911912                        } 
    17921913                        htmlString = htmlString.replace("%elementvars%", elementvarString); 
    17931914                        htmlString = htmlString.replace("%flashvars%", flashvarString); 
    1794                         htmlString = htmlString.replace("%flashplayer%", model.flashplayer); 
     1915                        htmlString = htmlString.replace("%flashplayer%", player.model.config.flashplayer); 
    17951916                        htmlString = htmlString.replace("%style%", styleString); 
    1796                         $(domElement).before(htmlString); 
    1797                         var result = $(domElement).prev(); 
    1798                         $(domElement).remove(); 
    1799                         return result; 
     1917                        player.model.domelement.before(htmlString); 
     1918                        var oldDOMElement = player.model.domelement; 
     1919                        player.model.domelement = player.model.domelement.prev(); 
     1920                        oldDOMElement.remove(); 
    18001921                } 
    18011922        }; 
  • trunk/html5/src/jquery.jwplayerControlbar.js

    r949 r950  
    1111 
    1212        /** Hooking the jwplayerControlbar up to jQuery. **/ 
    13         $.fn.jwplayerControlbar = function(ops) { 
    14                 return this.each(function() { 
    15                         var id = $(this)[0].id; 
    16                         var div = $('#' + id).parents()[0].id; 
    17                         //$($('#' + id).parents()[0]).append('<div id="' + div + '">'); 
    18                         var player = document.getElementById(id); 
    19                         var options = $.extend({}, $.fn.jwplayerControlbar.defaults, ops); 
    20                         $.extend(options, $('#' + id).data("model")); 
    21                         // Add positioning options and change the player css, so we can full-browser-screen it. 
    22                         $.extend(options, { 
    23                                 id: id, 
    24                                 div: div, 
    25                                 left: 0, 
    26                                 top: 0 
    27                         }); 
    28                         // Save the variables globally and start loading the skin. 
    29                         config = { 
    30                                 player: player, 
    31                                 options: options, 
    32                                 images: $(player).data("skin").controlbar.elements 
    33                         }; 
    34                         $.fn.jwplayerControlbar.bars[id] = config; 
    35                         buildElements(config); 
    36                         buildHandlers(config); 
    37                 }); 
    38         }; 
    39          
    40          
    41         /** Map with all jwplayerControlbars. **/ 
    42         $.fn.jwplayerControlbar.bars = {}; 
    43          
    44          
     13        $.fn.jwplayerControlbar = function(player) { 
     14                player.controlbar = $.extend({}, $.fn.jwplayerControlbar.defaults, player.controlbar); 
     15                buildElements(player); 
     16                buildHandlers(player); 
     17        }; 
     18         
     19                 
    4520        /** Map with config for the jwplayerControlbar plugin. **/ 
    4621        $.fn.jwplayerControlbar.defaults = { 
    47                 buffer: 0, 
    48                 div: 'container', 
    49                 duration: 0, 
    50                 elapsed: 0, 
    5122                fontsize: 10, 
    5223                fontcolor: '000000', 
    53                 fullscreen: false, 
    54                 id: 'player', 
    55                 images: 0, 
    5624                position: 'bottom', 
    57                 skin: 'assets/five/five.xml', 
    58                 width: 400, 
    59                 height: 300, 
    60                 left: 0, 
    6125                leftmargin: 0, 
    62                 top: 0, 
    6326                rightmargin: 0, 
    64                 scrubber: 'none', 
    65                 state: 'idle', 
    66                 volume: 100 
     27                scrubber: 'none' 
    6728        }; 
    6829         
    6930         
    7031        /** Callbacks called by Flash players to update stats. **/ 
    71         $.fn.jwplayerControlbar.bufferHandler = function(event, obj) { 
     32        $.fn.jwplayerControlbar.bufferHandler = function(obj) {  
    7233                bufferHandler({ 
    7334                        id: obj.id, 
     
    7536                }); 
    7637        }; 
    77         $.fn.jwplayerControlbar.muteHandler = function(event, obj) { 
     38         
     39        $.fn.jwplayerControlbar.muteHandler = function(obj) { 
    7840                muteHandler({ 
    7941                        id: obj.id, 
     
    8143                }); 
    8244        }; 
    83         $.fn.jwplayerControlbar.stateHandler = function(event, obj) { 
     45         
     46        $.fn.jwplayerControlbar.stateHandler = function(obj) { 
    8447                stateHandler({ 
    8548                        id: obj.id, 
     
    8750                }); 
    8851        }; 
    89         $.fn.jwplayerControlbar.timeHandler = function(event, obj) { 
     52         
     53        $.fn.jwplayerControlbar.timeHandler = function(obj) { 
    9054                timeHandler({ 
    9155                        id: obj.id, 
    92                         elapsed: obj.position, 
     56                        position: obj.position, 
    9357                        duration: obj.duration 
    9458                }); 
    9559        }; 
     60         
    9661        $.fn.jwplayerControlbar.volumeHandler = function(obj) { 
    9762                volumeHandler({ 
     
    10368         
    10469        /** Draw the jwplayerControlbar elements. **/ 
    105         function buildElements(config) { 
     70        function buildElements(player) { 
    10671                // Draw the background. 
    107                 $('#' + config.options.div).append('<div id="' + config.options.id + '_jwplayerControlbar"></div>'); 
    108                 $('#' + config.options.id + '_jwplayerControlbar').css('position', 'relative'); 
    109                 $('#' + config.options.id + '_jwplayerControlbar').css('height', config.images.background.height); 
    110                 $('#' + config.options.id + '_jwplayerControlbar').css('background', 'url(' + config.images.background.src + ') repeat-x center left'); 
     72                player.model.domelement.parents(":first").append('<div id="' +player.id + '_jwplayerControlbar"></div>'); 
     73                $("#"+player.id + '_jwplayerControlbar').css('position', 'relative'); 
     74                $("#"+player.id + '_jwplayerControlbar').css('height', player.skin.controlbar.elements.background.height); 
     75                $("#"+player.id + '_jwplayerControlbar').css('background', 'url(' + player.skin.controlbar.elements.background.src + ') repeat-x center left'); 
    11176                // Draw all elements on top of the bar. 
    112                 buildElement('capLeft', 'left', true, config); 
    113                 buildElement('playButton', 'left', false, config); 
    114                 buildElement('pauseButton', 'left', true, config); 
    115                 buildElement('divider1', 'left', true, config); 
    116                 buildElement('elapsedText', 'left', true, config); 
    117                 buildElement('timeSliderRail', 'left', false, config); 
    118                 buildElement('timeSliderBuffer', 'left', false, config); 
    119                 buildElement('timeSliderProgress', 'left', false, config); 
    120                 buildElement('timeSliderThumb', 'left', false, config); 
    121                 buildElement('capRight', 'right', true, config); 
    122                 buildElement('fullscreenButton', 'right', false, config); 
    123                 buildElement('normalscreenButton', 'right', true, config); 
    124                 buildElement('divider2', 'right', true, config); 
    125                 buildElement('volumeSliderRail', 'right', false, config); 
    126                 buildElement('volumeSliderProgress', 'right', true, config); 
    127                 buildElement('muteButton', 'right', false, config); 
    128                 buildElement('unmuteButton', 'right', true, config); 
    129                 buildElement('divider3', 'right', true, config); 
    130                 buildElement('durationText', 'right', true, config); 
     77                buildElement('capLeft', 'left', true, player); 
     78                buildElement('playButton', 'left', false, player); 
     79                buildElement('pauseButton', 'left', true, player); 
     80                buildElement('divider1', 'left', true, player); 
     81                buildElement('elapsedText', 'left', true, player); 
     82                buildElement('timeSliderRail', 'left', false, player); 
     83                buildElement('timeSliderBuffer', 'left', false, player); 
     84                buildElement('timeSliderProgress', 'left', false, player); 
     85                buildElement('timeSliderThumb', 'left', false, player); 
     86                buildElement('capRight', 'right', true, player); 
     87                buildElement('fullscreenButton', 'right', false, player); 
     88                buildElement('normalscreenButton', 'right', true, player); 
     89                buildElement('divider2', 'right', true, player); 
     90                buildElement('volumeSliderRail', 'right', false, player); 
     91                buildElement('volumeSliderProgress', 'right', true, player); 
     92                buildElement('muteButton', 'right', false, player); 
     93                buildElement('unmuteButton', 'right', true, player); 
     94                buildElement('divider3', 'right', true, player); 
     95                buildElement('durationText', 'right', true, player); 
    13196        } 
    13297         
    13398         
    13499        /** Draw a single element into the jwplayerControlbar. **/ 
    135         function buildElement(element, align, offset, config) { 
    136                 var nam = config.options.id + '_' + element; 
    137                 $('#' + config.options.id + '_jwplayerControlbar').append('<div id="' + nam + '"></div>'); 
     100        function buildElement(element, align, offset, player) { 
     101                var nam =player.id + '_' + element; 
     102                $('#' +player.id + '_jwplayerControlbar').append('<div id="' + nam + '"></div>'); 
    138103                $('#' + nam).css('position', 'absolute'); 
    139104                $('#' + nam).css('top', 0); 
    140105                if (element.indexOf('Text') > 0) { 
    141106                        $('#' + nam).html('00:00'); 
    142                         $('#' + nam).css('font', config.options.fontsize + 'px/' + (config.images.background.height + 1) + 'px Arial,sans-serif'); 
     107                        $('#' + nam).css('font', player.controlbar.fontsize + 'px/' + (player.skin.controlbar.elements.background.height + 1) + 'px Arial,sans-serif'); 
    143108                        $('#' + nam).css('text-align', 'center'); 
    144109                        $('#' + nam).css('font-weight', 'bold'); 
    145110                        $('#' + nam).css('cursor', 'default'); 
    146                         var wid = 14 + 3 * config.options.fontsize; 
    147                         $('#' + nam).css('color', '#' + config.options.fontcolor.substr(-6)); 
     111                        var wid = 14 + 3 * player.controlbar.fontsize; 
     112                        $('#' + nam).css('color', '#' + player.controlbar.fontcolor.substr(-6)); 
    148113                } else if (element.indexOf('divider') === 0) { 
    149                         $('#' + nam).css('background', 'url(' + config.images.divider.src + ') repeat-x center left'); 
    150                         var wid = config.images.divider.width; 
    151                 } else { 
    152                         $('#' + nam).css('background', 'url(' + config.images[element].src + ') repeat-x center left'); 
    153                         var wid = config.images[element].width; 
     114                        $('#' + nam).css('background', 'url(' + player.skin.controlbar.elements.divider.src + ') repeat-x center left'); 
     115                        var wid = player.skin.controlbar.elements.divider.width; 
     116                } else { 
     117                        $('#' + nam).css('background', 'url(' + player.skin.controlbar.elements[element].src + ') repeat-x center left'); 
     118                        var wid = player.skin.controlbar.elements[element].width; 
    154119                } 
    155120                if (align == 'left') { 
    156                         $('#' + nam).css(align, config.options.leftmargin); 
     121                        $('#' + nam).css(align, player.controlbar.leftmargin); 
    157122                        if (offset) { 
    158                                 config.options.leftmargin += wid; 
     123                                player.controlbar.leftmargin += wid; 
    159124                        } 
    160125                } else if (align == 'right') { 
    161                         $('#' + nam).css(align, config.options.rightmargin); 
     126                        $('#' + nam).css(align, player.controlbar.rightmargin); 
    162127                        if (offset) { 
    163                                 config.options.rightmargin += wid; 
     128                                player.controlbar.rightmargin += wid; 
    164129                        } 
    165130                } 
    166131                $('#' + nam).css('width', wid); 
    167                 $('#' + nam).css('height', config.images.background.height); 
     132                $('#' + nam).css('height', player.skin.controlbar.elements.background.height); 
    168133        } 
    169134         
    170135         
    171136        /** Add interactivity to the jwplayerControlbar elements. **/ 
    172         function buildHandlers(config) { 
     137        function buildHandlers(player) { 
    173138                // Register events with the buttons. 
    174                 buildHandler('playButton', 'play', config.player, config.options); 
    175                 buildHandler('pauseButton', 'pause', config.player, config.options); 
    176                 buildHandler('muteButton', 'mute', config.player, config.options); 
    177                 buildHandler('unmuteButton', 'mute', config.player, config.options); 
    178                 buildHandler('fullscreenButton', 'fullscreen', config.player, config.options); 
    179                 buildHandler('normalscreenButton', 'fullscreen', config.player, config.options); 
    180                 /* 
    181                  addSliders(options); 
    182                  */ 
     139                buildHandler('playButton', 'play', player); 
     140                buildHandler('pauseButton', 'pause', player); 
     141                buildHandler('muteButton', 'mute', player); 
     142                buildHandler('unmuteButton', 'mute', player); 
     143                buildHandler('fullscreenButton', 'fullscreen', player); 
     144                buildHandler('normalscreenButton', 'fullscreen', player); 
     145                 
     146                addSliders(player); 
     147 
    183148                // Register events with the player. 
    184                 $.jwplayer("#" + config.player.id).buffer($.fn.jwplayerControlbar.bufferHandler); 
    185                 $.jwplayer("#" + config.player.id).state($.fn.jwplayerControlbar.stateHandler); 
    186                 $.jwplayer("#" + config.player.id).time($.fn.jwplayerControlbar.timeHandler); 
    187                 $.jwplayer("#" + config.player.id).mute($.fn.jwplayerControlbar.muteHandler); 
    188                 $.jwplayer("#" + config.player.id).volume($.fn.jwplayerControlbar.volumeHandler); 
     149                player.buffer($.fn.jwplayerControlbar.bufferHandler); 
     150                player.state($.fn.jwplayerControlbar.stateHandler); 
     151                player.time($.fn.jwplayerControlbar.timeHandler); 
     152                player.mute($.fn.jwplayerControlbar.muteHandler); 
     153                player.volume($.fn.jwplayerControlbar.volumeHandler); 
    189154                // Trigger a few events so the bar looks good on startup. 
    190                 fullscreenHandler(config.options); 
    191                 muteHandler(config.options); 
    192                 stateHandler(config.options); 
    193                 volumeHandler(config.options); 
     155                fullscreenHandler(player); 
     156                muteHandler(player); 
     157                stateHandler(player); 
     158                volumeHandler(player); 
    194159        } 
    195160         
    196161         
    197162        /** Set a single button handler. **/ 
    198         function buildHandler(element, handler, player, options) { 
    199                 var nam = options.id + '_' + element; 
     163        function buildHandler(element, handler, player) { 
     164                var nam = player.id + '_' + element; 
    200165                $('#' + nam).css('cursor', 'pointer'); 
    201166                if (handler == 'fullscreen') { 
    202167                        $('#' + nam).mouseup(function(evt) { 
    203168                                evt.stopPropagation(); 
    204                                 options.fullscreen = !options.fullscreen; 
    205                                 fullscreenHandler(options); 
     169                                player.fullscreen() = !player.fullscreen(); 
     170                                fullscreenHandler(player); 
    206171                        }); 
    207172                } else { 
     
    215180         
    216181        /** Set the volume drag handler. **/ 
    217         function addSliders() { 
    218                 var bar = '#' + config.id + '_jwplayerControlbar'; 
    219                 var trl = '#' + config.id + '_timeSliderRail'; 
    220                 var vrl = '#' + config.id + '_volumeSliderRail'; 
     182        function addSliders(player) { 
     183                var bar = '#' +player.id + '_jwplayerControlbar'; 
     184                var trl = '#' +player.id + '_timeSliderRail'; 
     185                var vrl = '#' +player.id + '_volumeSliderRail'; 
    221186                $(bar).css('cursor', 'hand'); 
    222187                $(bar).mousedown(function(evt) { 
    223188                        var xps = evt.pageX - $(bar).position().left; 
    224189                        if (xps > $(trl).position().left && xps < $(trl).position().left + $(trl).width()) { 
    225                                 config.scrubber = 'time'; 
     190                                player.controlbar.scrubber = 'time'; 
    226191                        } else if (xps > $(vrl).position().left && xps < $(vrl).position().left + $(vrl).width()) { 
    227                                 config.scrubber = 'volume'; 
     192                                player.controlbar.scrubber = 'volume'; 
    228193                        } 
    229194                }); 
    230195                $(bar).mouseup(function(evt) { 
    231196                        evt.stopPropagation(); 
    232                         sliderUp(evt.pageX); 
     197                        sliderUp(evt.pageX, player); 
    233198                }); 
    234199                $(bar).mouseleave(function(evt) { 
    235                         sliderUp(evt.pageX); 
     200                        sliderUp(evt.pageX, player); 
    236201                        evt.stopPropagation(); 
    237202                }); 
    238203                $(bar).mousemove(function(evt) { 
    239                         if (config.scrubber == 'time') { 
     204                        if (player.controlbar.scrubber == 'time') { 
    240205                                var xps = evt.pageX - $(bar).position().left; 
    241                                 $('#' + config.id + '_timeSliderThumb').css('left', xps); 
     206                                $('#' +player.id + '_timeSliderThumb').css('left', xps); 
    242207                        } 
    243208                }); 
     
    246211         
    247212        /** The slider has been moved up. **/ 
    248         function sliderUp(msx) { 
    249                 if (config.scrubber == 'time') { 
    250                         var xps = msx - $('#' + config.id + '_timeSliderRail').position().left; 
    251                         var wid = $('#' + config.id + '_timeSliderRail').width(); 
    252                         var pos = xps / wid * config.duration; 
     213        function sliderUp(msx, player) { 
     214                if (player.controlbar.scrubber == 'time') { 
     215                        var xps = msx - $('#' +player.id + '_timeSliderRail').position().left; 
     216                        var wid = $('#' +player.id + '_timeSliderRail').width(); 
     217                        var pos = xps / wid * player.duration(); 
    253218                        if (pos < 0) { 
    254219                                pos = 0; 
    255                         } else if (pos > config.duration) { 
    256                                 pos = config.duration - 3; 
     220                        } else if (pos > player.controlbar.duration) { 
     221                                pos = player.controlbar.duration - 3; 
    257222                        } 
    258223                        player.seek(pos); 
    259                 } else if (config.scrubber == 'volume') { 
    260                         var bar = $('#' + config.id + '_jwplayerControlbar').width(); 
    261                         var brx = $('#' + config.id + '_jwplayerControlbar').position().left; 
    262                         var rig = $('#' + config.id + '_volumeSliderRail').css('right').substr(0, 2); 
    263                         var wid = config.images.volumeSliderRail.width; 
     224                } else if (player.controlbar.scrubber == 'volume') { 
     225                        var bar = $('#' +player.id + '_jwplayerControlbar').width(); 
     226                        var brx = $('#' +player.id + '_jwplayerControlbar').position().left; 
     227                        var rig = $('#' +player.id + '_volumeSliderRail').css('right').substr(0, 2); 
     228                        var wid = player.skin.controlbar.elements.volumeSliderRail.width; 
    264229                        var pct = Math.round((msx - bar - brx + 1 * rig + wid) / wid * 100); 
    265230                        if (pct < 0) { 
     
    270235                        player.volume(pct); 
    271236                } 
    272                 config.scrubber = 'none'; 
    273         } 
    274          
    275          
     237                player.controlbar.scrubber = 'none'; 
     238        } 
    276239         
    277240         
    278241        /** Update the buffer percentage. **/ 
    279         function bufferHandler(options) { 
    280                 if (options.bufferPercent === 0) { 
    281                         $('#' + options.id + '_timeSliderBuffer').css('display', 'none'); 
    282                 } else { 
    283                         $('#' + options.id + '_timeSliderBuffer').css('display', 'block'); 
    284                         var wid = $('#' + options.id + '_timeSliderRail').width(); 
    285                         $('#' + options.id + '_timeSliderBuffer').css('width', Math.round(wid * options.bufferPercent / 100)); 
     242        function bufferHandler(event) { 
     243                var player = $.jwplayer(event.id); 
     244                if (event.bufferPercent === 0) { 
     245                        $('#' +player.id + '_timeSliderBuffer').css('display', 'none'); 
     246                } else { 
     247                        $('#' +player.id + '_timeSliderBuffer').css('display', 'block'); 
     248                        var wid = $('#' +player.id + '_timeSliderRail').width(); 
     249                        $('#' +player.id + '_timeSliderBuffer').css('width', Math.round(wid * event.bufferPercent / 100)); 
    286250                } 
    287251        } 
     
    289253         
    290254        /** Update the mute state. **/ 
    291         function muteHandler(options) { 
    292                 if (options.mute) { 
    293                         $('#' + options.id + '_muteButton').css('display', 'none'); 
    294                         $('#' + options.id + '_unmuteButton').css('display', 'block'); 
    295                         $('#' + options.id + '_volumeSliderProgress').css('display', 'none'); 
    296                 } else { 
    297                         $('#' + options.id + '_muteButton').css('display', 'block'); 
    298                         $('#' + options.id + '_unmuteButton').css('display', 'none'); 
    299                         $('#' + options.id + '_volumeSliderProgress').css('display', 'block'); 
     255        function muteHandler(event) { 
     256                var player = $.jwplayer(event.id); 
     257                if (event.mute) { 
     258                        $('#' +player.id + '_muteButton').css('display', 'none'); 
     259                        $('#' +player.id + '_unmuteButton').css('display', 'block'); 
     260                        $('#' +player.id + '_volumeSliderProgress').css('display', 'none'); 
     261                } else { 
     262                        $('#' +player.id + '_muteButton').css('display', 'block'); 
     263                        $('#' +player.id + '_unmuteButton').css('display', 'none'); 
     264                        $('#' +player.id + '_volumeSliderProgress').css('display', 'block'); 
    300265                } 
    301266        } 
     
    303268         
    304269        /** Update the playback state. **/ 
    305         function stateHandler(options) { 
    306                 if (options.state == 'buffering' || options.state == 'playing') { 
    307                         $('#' + options.id + '_pauseButton').css('display', 'block'); 
    308                         $('#' + options.id + '_playButton').css('display', 'none'); 
    309                 } else { 
    310                         $('#' + options.id + '_pauseButton').css('display', 'none'); 
    311                         $('#' + options.id + '_playButton').css('display', 'block'); 
    312                 } 
    313                 if (options.state == 'idle') { 
    314                         options.elapsed = 0; 
    315                         timeHandler(options); 
     270        function stateHandler(event) { 
     271                var player = $.jwplayer(event.id); 
     272                if (event.state == $.fn.jwplayer.states.BUFFERING || player.state() ==  $.fn.jwplayer.states.PLAYING) { 
     273                        $('#' +player.id + '_pauseButton').css('display', 'block'); 
     274                        $('#' +player.id + '_playButton').css('display', 'none'); 
     275                } else { 
     276                        $('#' +player.id + '_pauseButton').css('display', 'none'); 
     277                        $('#' +player.id + '_playButton').css('display', 'block'); 
     278                } 
     279                if (player.state() ==  $.fn.jwplayer.states.IDLE) { 
     280                        timeHandler({ 
     281                                id: player.id, 
     282                                position: 0 
     283                        }); 
    316284                } 
    317285        } 
     
    319287         
    320288        /** Update the playback time. **/ 
    321         function timeHandler(options) { 
    322                 var wid = $('#' + options.id + '_timeSliderRail').width(); 
    323                 var thb = $('#' + options.id + '_timeSliderThumb').width(); 
    324                 var lft = $('#' + options.id + '_timeSliderRail').position().left; 
    325                 if (options.elapsed === 0) { 
    326                         $('#' + options.id + '_timeSliderProgress').css('display', 'none'); 
    327                         $('#' + options.id + '_timeSliderThumb').css('display', 'none'); 
    328                 } else { 
    329                         $('#' + options.id + '_timeSliderProgress').css('display', 'block'); 
    330                         $('#' + options.id + '_timeSliderProgress').css('width', Math.round(wid * options.elapsed / options.duration)); 
    331                         $('#' + options.id + '_timeSliderThumb').css('display', 'block'); 
    332                         $('#' + options.id + '_timeSliderThumb').css('left', lft + 
    333                         Math.round((wid - thb) * options.elapsed / options.duration)); 
    334                         $('#' + options.id + '_durationText').html(timeFormat(options.duration)); 
    335                 } 
    336                 $('#' + options.id + '_elapsedText').html(timeFormat(options.elapsed)); 
     289        function timeHandler(event) { 
     290                var player = $.jwplayer(event.id); 
     291                var wid = $('#' +player.id + '_timeSliderRail').width(); 
     292                var thb = $('#' +player.id + '_timeSliderThumb').width(); 
     293                var lft = $('#' +player.id + '_timeSliderRail').position().left; 
     294                if (event.position === 0) { 
     295                        $('#' +player.id + '_timeSliderProgress').css('display', 'none'); 
     296                        $('#' +player.id + '_timeSliderThumb').css('display', 'none'); 
     297                } else { 
     298                        $('#' +player.id + '_timeSliderProgress').css('display', 'block'); 
     299                        $('#' +player.id + '_timeSliderProgress').css('width', Math.round(wid * event.position / event.duration)); 
     300                        $('#' +player.id + '_timeSliderThumb').css('display', 'block'); 
     301                        $('#' +player.id + '_timeSliderThumb').css('left', lft + 
     302                        Math.round((wid - thb) * event.position / event.duration)); 
     303                        $('#' +player.id + '_durationText').html(timeFormat(event.duration)); 
     304                } 
     305                $('#' +player.id + '_elapsedText').html(timeFormat(event.position)); 
    337306        } 
    338307         
     
    350319         
    351320        /** Flip the player size to/from full-browser-screen. **/ 
    352         function fullscreenHandler(options) { 
    353                 if (options.fullscreen) { 
     321        function fullscreenHandler(event) { 
     322                var player = $.jwplayer(event.id); 
     323                if (event.fullscreen) { 
    354324                        //$('#' + options.div).css('position', 'absolute'); 
    355325                        //$('#' + options.div).css('left', 0); 
     
    357327                        //$('#' + options.div).css('height', '100%'); 
    358328                        //$('#' + options.div).css('width', '100%'); 
    359                         $('#' + options.id + '_normalscreenButton').css('display', 'block'); 
    360                         $('#' + options.id + '_fullscreenButton').css('display', 'none'); 
     329                        $('#' +player.id + '_normalscreenButton').css('display', 'block'); 
     330                        $('#' +player.id + '_fullscreenButton').css('display', 'none'); 
    361331                        $(window).resize(function() { 
    362                                 resizeBar(options); 
     332                                resizeBar(player); 
    363333                        }); 
    364334                } else { 
     
    368338                        //$('#' + options.div).css('height', options.height); 
    369339                        //$('#' + options.div).css('width', options.width); 
    370                         $('#' + options.id + '_normalscreenButton').css('display', 'none'); 
    371                         $('#' + options.id + '_fullscreenButton').css('display', 'block'); 
     340                        $('#' +player.id + '_normalscreenButton').css('display', 'none'); 
     341                        $('#' +player.id + '_fullscreenButton').css('display', 'block'); 
    372342                        $(window).resize(null); 
    373343                } 
    374                 resizeBar(options); 
    375                 timeHandler(options); 
    376                 bufferHandler(options); 
     344                resizeBar(player); 
     345                timeHandler(player); 
     346                bufferHandler(player); 
    377347        } 
    378348         
    379349         
    380350        /** Resize the jwplayerControlbar. **/ 
    381         function resizeBar(options) { 
    382                 var lft = options.left; 
    383                 var top = options.top; 
    384                 var wid = options.width; 
    385                 var hei = $('#' + options.id + '_jwplayerControlbar').height(); 
    386                 if (options.position == 'over') { 
    387                         lft += 1 * options.margin; 
    388                         top -= 1 * options.margin + hei; 
    389                         wid -= 2 * options.margin; 
    390                 } 
    391                 if (options.fullscreen) { 
    392                         lft = options.margin; 
    393                         top = $(window).height() - options.margin - hei; 
    394                         wid = $(window).width() - 2 * options.margin; 
    395                         $('#' + options.id + '_jwplayerControlbar').css('z-index', 99); 
    396                 } else { 
    397                         $('#' + options.id + '_jwplayerControlbar').css('z-index', 97); 
    398                 } 
    399                 $('#' + options.id + '_jwplayerControlbar').css('left', lft); 
    400                 $('#' + options.id + '_jwplayerControlbar').css('top', top); 
    401                 $('#' + options.id + '_jwplayerControlbar').css('width', wid); 
    402                 $('#' + options.id + '_timeSliderRail').css('width', wid - options.leftmargin - options.rightmargin); 
     351        function resizeBar(player) { 
     352                var lft = player.controlbar.left; 
     353                var top = player.controlbar.top; 
     354                var wid = player.model.config.width; 
     355                var hei = $('#' +player.id + '_jwplayerControlbar').height(); 
     356                if (player.controlbar.position == 'over') { 
     357                        lft += 1 * player.controlbar.margin; 
     358                        top -= 1 * player.controlbar.margin + hei; 
     359                        wid -= 2 * player.controlbar.margin; 
     360                } 
     361                if (player.fullscreen()) { 
     362                        lft = player.controlbar.margin; 
     363                        top = $(window).height() - player.controlbar.margin - hei; 
     364                        wid = $(window).width() - 2 * player.controlbar.margin; 
     365                        $('#' +player.id + '_jwplayerControlbar').css('z-index', 99); 
     366                } else { 
     367                        $('#' +player.id + '_jwplayerControlbar').css('z-index', 97); 
     368                } 
     369                $('#' +player.id + '_jwplayerControlbar').css('left', lft); 
     370                $('#' +player.id + '_jwplayerControlbar').css('top', top); 
     371                $('#' +player.id + '_jwplayerControlbar').css('width', wid); 
     372                $('#' +player.id + '_timeSliderRail').css('width', wid - player.controlbar.leftmargin - player.controlbar.rightmargin); 
    403373        } 
    404374         
    405375         
    406376        /** Update the volume level. **/ 
    407         function volumeHandler(options) { 
    408                 var rwd = $('#' + options.id + '_volumeSliderRail').width(); 
    409                 var wid = Math.round(options.volume / 100 * rwd); 
    410                 var rig = $('#' + options.id + '_volumeSliderRail').css('right').substr(0, 2); 
    411                 $('#' + options.id + '_volumeSliderProgress').css('width', wid); 
    412                 $('#' + options.id + '_volumeSliderProgress').css('right', 1 * rig + rwd - wid); 
     377        function volumeHandler(event) { 
     378                var player = $.jwplayer(event.id); 
     379                var rwd = $('#' +player.id + '_volumeSliderRail').width(); 
     380                var wid = Math.round(event.volume / 100 * rwd); 
     381                var rig = $('#' +player.id + '_volumeSliderRail').css('right').substr(0, 2); 
     382                $('#' +player.id + '_volumeSliderProgress').css('width', wid); 
     383                $('#' +player.id + '_volumeSliderProgress').css('right', 1 * rig + rwd - wid); 
    413384        } 
    414385         
  • trunk/html5/src/jquery.jwplayerController.js

    r936 r950  
    88(function($) { 
    99 
     10        var mediaParams ={ 
     11                volume: 100, 
     12                fullscreen: false, 
     13                mute: false, 
     14                width: 480, 
     15                height: 320, 
     16                duration: 0, 
     17                source: 0, 
     18                buffer: 0, 
     19                state: 'IDLE' 
     20        }; 
     21 
    1022        $.fn.jwplayerController = function() { 
    1123                return this.each(function() { 
     
    1628        $.fn.jwplayerController.play = function(player) { 
    1729                try { 
    18                         player.data("media").play(); 
     30                        player.media.play(); 
    1931                        return true; 
    2032                } catch (err) { 
     
    2739        $.fn.jwplayerController.pause = function(player) { 
    2840                try { 
    29                         player.data("media").pause(); 
     41                        player.media.pause(); 
    3042                        return true; 
    3143                } catch (err) { 
     
    3951        $.fn.jwplayerController.seek = function(player, position) { 
    4052                try { 
    41                         player.data("media").seek(position); 
     53                        player.media.seek(position); 
    4254                        return true; 
    4355                } catch (err) { 
     
    5264        $.fn.jwplayerController.stop = function(player) { 
    5365                try { 
    54                         player.data("media").stop(); 
     66                        player.media.stop(); 
    5567                        return true; 
    5668                } catch (err) { 
     
    6678                try { 
    6779                        if (position === undefined) { 
    68                                 return $(player).data("model").volume; 
     80                                return player.model.volume; 
    6981                        } else { 
    70                                 player.data("media").volume(position); 
    71                                 $(player).data("model").volume = position; 
     82                                player.media.volume(position); 
     83                                player.model.volume = position; 
    7284                                return true; 
    7385                        } 
     
    8294                try { 
    8395                        if (state === undefined) { 
    84                                 return $(player).data("model").mute; 
     96                                return player.model.mute; 
    8597                        } else { 
    86                                 player.data("media").mute(state); 
     98                                player.media.mute(state); 
    8799                                return true; 
    88100                        } 
     
    98110        $.fn.jwplayerController.fullscreen = function(player, state) { 
    99111                try { 
    100                         if (position === undefined) { 
    101                                 return $(player).data("model").fullscreen; 
     112                        if (state === undefined) { 
     113                                return player.model.fullscreen; 
    102114                        } else { 
    103                                 player.data("media").fullscreen(state); 
     115                                player.media.fullscreen(state); 
    104116                                return true; 
    105117                        } 
     
    113125        $.fn.jwplayerController.resize = function(player, width, height) { 
    114126                try { 
    115                         player.data("media").resize(width, height); 
     127                        player.media.resize(width, height); 
    116128                        return true; 
    117129                } catch (err) { 
     
    124136        $.fn.jwplayerController.mediaInfo = function(player) { 
    125137                try { 
    126                         player.data("media").mediaInfo(); 
    127                         return true; 
     138                        var result = {}; 
     139                        for (var mediaParam in mediaParams){ 
     140                                result[mediaParam] = player.model[mediaParam]; 
     141                        } 
     142                        return result; 
    128143                } catch (err) { 
    129144                        $.fn.jwplayerUtils.log("error", err); 
     
    135150        $.fn.jwplayerController.load = function(player, path) { 
    136151                try { 
    137                         player.data("media").load(path); 
     152                        player.media.load(path); 
    138153                        return true; 
    139154                } catch (err) { 
  • trunk/html5/src/jquery.jwplayerCore.js

    r948 r950  
    88 */ 
    99(function($) { 
    10  
     10        /** Hooking the controlbar up to jQuery. **/ 
     11        $.fn.jwplayer = function(options) { 
     12                return this.each(function() { 
     13                        $.fn.jwplayerUtils.log("setup", this); 
     14                        var model = $.fn.jwplayerModel($(this), options); 
     15                        var player = { 
     16                                model: model 
     17                        }; 
     18                        players[model.config.id] = player; 
     19                        player = $.extend(player, api(player)); 
     20                        $.fn.jwplayerView(player); 
     21                        $.fn.jwplayerModel.setActiveMediaProvider(player); 
     22                        $.fn.jwplayerSkinner(player, function() { 
     23                                finishSetup(player); 
     24                        }); 
     25                }); 
     26        }; 
     27         
     28        function finishSetup(player) { 
     29                $.fn.jwplayerControlbar(player); 
     30                player.sendEvent("JWPLAYER_READY"); 
     31        } 
     32         
     33         
     34        /** Map with all players on the page. **/ 
     35        var players = {}; 
     36         
     37         
     38        /** Map with config for the controlbar plugin. **/ 
     39        $.fn.jwplayer.defaults = { 
     40                autostart: false, 
     41                file: undefined, 
     42                height: 300, 
     43                image: undefined, 
     44                skin: 'assets/five/five.xml', 
     45                volume: 100, 
     46                width: 400, 
     47                flashplayer: 'assets/player.swf' 
     48        }; 
     49         
     50         
     51        /** Start playback or resume. **/ 
     52        function play(player) { 
     53                return function() { 
     54                        $.fn.jwplayerController.play(player); 
     55                        return jwplayer(player); 
     56                }; 
     57        } 
     58         
     59        /** Switch the pause state of the player. **/ 
     60        function pause(player) { 
     61                return function() { 
     62                        $.fn.jwplayerController.pause(player); 
     63                        return jwplayer(player); 
     64                }; 
     65        } 
     66         
     67         
     68        /** Seek to a position in the video. **/ 
     69        function seek(player) { 
     70                return function(arg) { 
     71                        $.fn.jwplayerController.seek(player, arg); 
     72                        return jwplayer(player); 
     73                }; 
     74        } 
     75         
     76         
     77        /** Stop playback and loading of the video. **/ 
     78        function stop(player) { 
     79                return function() { 
     80                        $.fn.jwplayerController.stop(player); 
     81                        return jwplayer(player); 
     82                }; 
     83        } 
     84         
     85         
     86        /** Change the video's volume level. **/ 
     87        function volume(player) { 
     88                return function(arg) { 
     89                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     90                                case "function": 
     91                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_VOLUME, arg); 
     92                                        break; 
     93                                case "number": 
     94                                        $.fn.jwplayerController.volume(player, arg); 
     95                                        break; 
     96                                case "string": 
     97                                        $.fn.jwplayerController.volume(player, parseInt(arg, 10)); 
     98                                        break; 
     99                                default: 
     100                                        return $.fn.jwplayerController.volume(player); 
     101                        } 
     102                        return jwplayer(player); 
     103                }; 
     104        } 
     105         
     106        /** Switch the mute state of the player. **/ 
     107        function mute(player, state) { 
     108                return function(arg) { 
     109                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     110                                case "function": 
     111                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_MUTE, arg); 
     112                                        break; 
     113                                case "boolean": 
     114                                        $.fn.jwplayerController.mute(player, arg); 
     115                                        break; 
     116                                default: 
     117                                        $.fn.jwplayerController.mute(player); 
     118                                        break; 
     119                        } 
     120                        return jwplayer(player); 
     121                }; 
     122        } 
     123         
     124        /** Resizing the player **/ 
     125        function resize(player, state) { 
     126                return function(arg1, arg2) { 
     127                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     128                                case "function": 
     129                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_RESIZE, arg); 
     130                                        break; 
     131                                case "number": 
     132                                        $.fn.jwplayerController.resize(player, arg1, arg2); 
     133                                        break; 
     134                                default: 
     135                                        break; 
     136                        } 
     137                        return jwplayer(player); 
     138                }; 
     139        } 
     140         
     141        /** Fullscreen the player **/ 
     142        function fullscreen(player, state) { 
     143                return function(arg) { 
     144                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     145                                case "function": 
     146                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_FULLSCREEN, arg); 
     147                                        break; 
     148                                case "boolean": 
     149                                        $.fn.jwplayerController.fullscreen(player, arg); 
     150                                        break; 
     151                                default: 
     152                                        return $.fn.jwplayerController.fullscreen(player); 
     153                        } 
     154                        return jwplayer(player); 
     155                }; 
     156        } 
     157         
     158        /** Adds a state listener **/ 
     159        function state(player) { 
     160                return function(arg) { 
     161                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     162                                case "function": 
     163                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_PLAYER_STATE, arg); 
     164                                        break; 
     165                                default: 
     166                                        $.fn.jwplayerUtils.log("mediainfo", $.fn.jwplayerController.mediaInfo(player)); 
     167                                        return $.fn.jwplayerController.mediaInfo(player).state; 
     168                        } 
     169                        return jwplayer(player); 
     170                }; 
     171        } 
     172         
     173        /** Adds a buffer listener **/ 
     174        function buffer(player) { 
     175                return function(arg) { 
     176                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     177                                case "function": 
     178                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_BUFFER, arg); 
     179                                        break; 
     180                                default: 
     181                                        return $.fn.jwplayerController.mediaInfo(player).buffer; 
     182                        } 
     183                        return jwplayer(player); 
     184                }; 
     185        } 
     186         
     187        /** Returns the current time **/ 
     188        function time(player) { 
     189                return function(arg) { 
     190                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     191                                case "function": 
     192                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_TIME, arg); 
     193                                        break; 
     194                                default: 
     195                                        return $.fn.jwplayerController.mediaInfo(player).time; 
     196                        } 
     197                        return jwplayer(player); 
     198                }; 
     199        } 
     200         
     201        /** Loads a new video into the player **/ 
     202        function load(player) { 
     203                return function(arg) { 
     204                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     205                                case "function": 
     206                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_LOADED, arg); 
     207                                        break; 
     208                                default: 
     209                                        $.fn.jwplayerController.load(player, arg); 
     210                        } 
     211                        return jwplayer(player); 
     212                }; 
     213        } 
     214         
     215        /** Adds a listener for video completion **/ 
     216        function complete(player) { 
     217                return function(arg) { 
     218                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_COMPLETE, arg); 
     219                        return jwplayer(player); 
     220                }; 
     221        } 
     222         
     223        /** Returns the duration **/ 
     224        function duration(player) { 
     225                return function() { 
     226                        return $.fn.jwplayerController.mediaInfo(player).duration; 
     227                }; 
     228        } 
     229         
     230        /** Adds a listener for media errors. **/ 
     231        function error(player) { 
     232                return function(arg) { 
     233                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_ERROR, arg); 
     234                        return jwplayer(player); 
     235                }; 
     236        } 
     237         
     238         
     239        /** Returns the width **/ 
     240        function width(player) { 
     241                return function() { 
     242                        return $.fn.jwplayerController.mediaInfo(player).width; 
     243                }; 
     244        } 
     245         
     246         
     247        /** Returns the height **/ 
     248        function height(player) { 
     249                return function() { 
     250                        return $.fn.jwplayerController.mediaInfo(player).height; 
     251                }; 
     252        } 
     253         
     254        /** Returns the available meta-data **/ 
     255        function meta(player) { 
     256                return function() { 
     257                        switch ($.fn.jwplayerUtils.typeOf(arg)) { 
     258                                case "function": 
     259                                        addEventListener(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_META, arg); 
     260                                        break; 
     261                                default: 
     262                                        return $.fn.jwplayerController.mediaInfo(player); 
     263                        } 
     264                        return jwplayer(player); 
     265                }; 
     266        } 
     267         
     268        /** Returns the API method for adding an event listener.**/ 
     269        function apiAddEventListener(player) { 
     270                return function(type, listener) { 
     271                        addEventListener(player, type, listener); 
     272                }; 
     273        } 
     274         
     275        /** Returns the API method for adding an event listener.**/ 
     276        function apiRemoveEventListener(player) { 
     277                return function(type, listener) { 
     278                        removeEventListener(player, type, listener); 
     279                }; 
     280        } 
     281         
     282        /** Add an event listener. **/ 
     283        function addEventListener(player, type, listener) { 
     284                if (player.model.listeners[type] === undefined) { 
     285                        player.model.listeners[type] = []; 
     286                } 
     287                player.model.listeners[type].push(listener); 
     288        } 
     289         
     290         
     291        /** Remove an event listener. **/ 
     292        function removeEventListener(player, type, listener) { 
     293                for (var lisenterIndex in player.model.listeners[type]) { 
     294                        if (player.model.listeners[type][lisenterIndex] == listener) { 
     295                                player.model.listeners[type].slice(lisenterIndex, lisenterIndex + 1); 
     296                                break; 
     297                        } 
     298                } 
     299        } 
     300         
     301        /** Send an event **/ 
     302        function sendEvent(player) { 
     303                return function(type, data) { 
     304                        for (var listener in player.model.listeners[type]) { 
     305                                player.model.listeners[type][listener](data); 
     306                        } 
     307                }; 
     308        } 
     309         
     310        function api(player) { 
     311                return { 
     312                        id: player.model.config.id, 
     313                        buffer: buffer(player), 
     314                        duration: duration(player), 
     315                        complete: complete(player), 
     316                        fullscreen: fullscreen(player), 
     317                        height: buffer(player), 
     318                        load: load(player), 
     319                        meta: meta(player), 
     320                        mute: mute(player), 
     321                        pause: pause(player), 
     322                        play: play(player), 
     323                        resize: resize(player), 
     324                        seek: seek(player), 
     325                        state: state(player), 
     326                        stop: stop(player), 
     327                        time: time(player), 
     328                        volume: volume(player), 
     329                        width: width(player), 
     330                        addEventListener: apiAddEventListener(player), 
     331                        removeEventListener: apiRemoveEventListener(player), 
     332                        sendEvent: sendEvent(player), 
     333                        version: '0.1-alpha' 
     334                }; 
     335        } 
     336         
    11337        function jwplayer(selector) { 
    12338                if (selector === undefined) { 
    13                         selector = ".jwplayer:first"; 
     339                        for (var player in players) { 
     340                                return players[player]; 
     341                        } 
     342                } else { 
     343                        return players[selector]; 
    14344                } 
    15                 if ($.fn.jwplayerUtils.typeOf(selector) == "string") { 
    16                         selector = $(selector); 
    17                 } 
    18                 return { 
    19                         buffer: buffer(selector), 
    20                         duration: duration(selector), 
    21                         complete: complete(selector), 
    22                         fullscreen: fullscreen(selector), 
    23                         height: buffer(selector), 
    24                         load: load(selector), 
    25                         meta: meta(selector), 
    26                         mute: mute(selector), 
    27                         pause: pause(selector), 
    28                         play: play(selector), 
    29                         resize: resize(selector), 
    30                         seek: seek(selector), 
    31                         state: state(selector), 
    32                         stop: stop(selector), 
    33                         time: time(selector), 
    34                         volume: volume(selector), 
    35                         width: width(selector), 
    36                         addEventListener: apiAddEventListener(selector), 
    37                         removeEventListener: apiRemoveEventListener(selector), 
    38                         events: events 
    39                 }; 
    40         } 
    41          
    42         var events = { 
     345                return null; 
     346        } 
     347         
     348        $.fn.jwplayer.states = { 
     349                IDLE: 'IDLE', 
     350                BUFFERING: 'BUFFERING', 
     351                PLAYING: 'PLAYING', 
     352                PAUSED: 'PAUSED' 
     353        }; 
     354         
     355        $.fn.jwplayer.events = { 
    43356                JWPLAYER_READY: 'jwplayerReady', 
    44357                JWPLAYER_FULLSCREEN: 'jwplayerFullscreen', 
     
    46359                //JWPLAYER_LOCKED: 'jwplayerLocked', 
    47360                //JWPLAYER_UNLOCKED: 'jwplayerLocked', 
    48                 //JWPLAYER_ERROR: 'jwplayerError', 
     361                JWPLAYER_ERROR: 'jwplayerError', 
    49362                JWPLAYER_MEDIA_BUFFER: 'jwplayerMediaBuffer', 
    50363                //JWPLAYER_MEDIA_BUFFER_FULL: 'jwplayerMediaBufferFull', 
     
    64377        }); 
    65378         
    66         /** Hooking the controlbar up to jQuery. **/ 
    67         $.fn.jwplayer = function(options) { 
    68                 return this.each(function() { 
    69                         var player = $(this); 
    70                         player.jwplayerModel(options); 
    71                         player.jwplayerView(); 
    72                         $.fn.jwplayerModel.setActiveMediaProvider(player); 
    73                         $("#"+player[0].id).jwplayerSkinner(function() { 
    74                                 finishSetup(player); 
    75                         }); 
    76                 }); 
    77         }; 
    78          
    79         function finishSetup(player) { 
    80                 player.jwplayerControlbar(); 
    81                 player.trigger("JWPLAYER_READY", { 
    82                         id: player[0].id 
    83                 }); 
    84         } 
    85          
    86          
    87         /** Map with all players on the page. **/ 
    88         $.fn.jwplayer.players = {}; 
    89          
    90          
    91         /** Map with config for the controlbar plugin. **/ 
    92         $.fn.jwplayer.defaults = { 
    93                 autostart: false, 
    94                 duration: 0, 
    95                 file: undefined, 
    96                 height: 300, 
    97                 image: undefined, 
    98                 skin: 'assets/five/five.xml', 
    99                 volume: 100, 
    100                 width: 400, 
    101                 source: 0, 
    102                 flashplayer: 'assets/player.swf' 
    103         }; 
    104          
    105          
    106         /** Start playback or resume. **/ 
    107         function play(player) { 
    108                 return function() { 
    109                         $.fn.jwplayerController.play(player); 
    110                         return jwplayer(player); 
    111                 }; 
    112         } 
    113          
    114         /** Switch the pause state of the player. **/ 
    115         function pause(player) { 
    116                 return function() { 
    117                         $.fn.jwplayerController.pause(player); 
    118                         return jwplayer(player); 
    119                 }; 
    120         } 
    121          
    122          
    123         /** Seek to a position in the video. **/ 
    124         function seek(player) { 
    125                 return function(arg) { 
    126                         $.fn.jwplayerController.seek(player, arg); 
    127                         return jwplayer(player); 
    128                 }; 
    129         } 
    130          
    131          
    132         /** Stop playback and loading of the video. **/ 
    133         function stop(player) { 
    134                 return function() { 
    135                         $.fn.jwplayerController.stop(player); 
    136                         return jwplayer(player); 
    137                 }; 
    138         } 
    139          
    140          
    141         /** Change the video's volume level. **/ 
    142         function volume(player) { 
    143                 return function(arg) { 
    144                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    145                                 case "function": 
    146                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_VOLUME, arg); 
    147                                         break; 
    148                                 case "number": 
    149                                         $.fn.jwplayerController.volume(player, arg); 
    150                                         break; 
    151                                 case "string": 
    152                                         $.fn.jwplayerController.volume(player, parseInt(arg, 10)); 
    153                                         break; 
    154                                 default: 
    155                                         return $.fn.jwplayerController.volume(player); 
    156                         } 
    157                         return jwplayer(player); 
    158                 }; 
    159         } 
    160          
    161         /** Switch the mute state of the player. **/ 
    162         function mute(player, state) { 
    163                 return function(arg) { 
    164                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    165                                 case "function": 
    166                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_MUTE, arg); 
    167                                         break; 
    168                                 case "boolean": 
    169                                         $.fn.jwplayerController.mute(player, arg); 
    170                                         break; 
    171                                 default: 
    172                                         $.fn.jwplayerController.mute(player); 
    173                                         break; 
    174                         } 
    175                         return jwplayer(player); 
    176                 }; 
    177         } 
    178          
    179         /** Resizing the player **/ 
    180         function resize(player, state) { 
    181                 return function(arg1, arg2) { 
    182                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    183                                 case "function": 
    184                                         addEventListener(player, $.jwplayer().events.JWPLAYER_RESIZE, arg); 
    185                                         break; 
    186                                 case "number": 
    187                                         $.fn.jwplayerController.resize(player, arg1, arg2); 
    188                                         break; 
    189                                 default: 
    190                                         break; 
    191                         } 
    192                         return jwplayer(player); 
    193                 }; 
    194         } 
    195          
    196         /** Fullscreen the player **/ 
    197         function fullscreen(player, state) { 
    198                 return function(arg) { 
    199                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    200                                 case "function": 
    201                                         addEventListener(player, $.jwplayer().events.JWPLAYER_FULLSCREEN, arg); 
    202                                         break; 
    203                                 case "boolean": 
    204                                         $.fn.jwplayerController.fullscreen(player, arg); 
    205                                         break; 
    206                                 default: 
    207                                         return $.fn.jwplayerController.fullscreen(player); 
    208                         } 
    209                         return jwplayer(player); 
    210                 }; 
    211         } 
    212          
    213         /** Adds a state listener **/ 
    214         function state(player) { 
    215                 return function(arg) { 
    216                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    217                                 case "function": 
    218                                         addEventListener(player, $.jwplayer().events.JWPLAYER_PLAYER_STATE, arg); 
    219                                         break; 
    220                                 default: 
    221                                         return $.fn.jwplayerController.mediaInfo(player).state; 
    222                         } 
    223                         return jwplayer(player); 
    224                 }; 
    225         } 
    226          
    227         /** Adds a buffer listener **/ 
    228         function buffer(player) { 
    229                 return function(arg) { 
    230                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    231                                 case "function": 
    232                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_BUFFER, arg); 
    233                                         break; 
    234                                 default: 
    235                                         return $.fn.jwplayerController.mediaInfo(player).buffer; 
    236                         } 
    237                         return jwplayer(player); 
    238                 }; 
    239         } 
    240          
    241         /** Returns the current time **/ 
    242         function time(player) { 
    243                 return function(arg) { 
    244                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    245                                 case "function": 
    246                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_TIME, arg); 
    247                                         break; 
    248                                 default: 
    249                                         return $.fn.jwplayerController.mediaInfo(player).time; 
    250                         } 
    251                         return jwplayer(player); 
    252                 }; 
    253         } 
    254          
    255         /** Loads a new video into the player **/ 
    256         function load(player) { 
    257                 return function(arg) { 
    258                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    259                                 case "function": 
    260                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_LOADED, arg); 
    261                                         break; 
    262                                 default: 
    263                                         $.fn.jwplayerController.load(player, arg); 
    264                         } 
    265                         return jwplayer(player); 
    266                 }; 
    267         } 
    268  
    269         /** Adds a listener for video completion **/ 
    270         function complete(player) { 
    271                 return function(arg) { 
    272                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_COMPLETE, arg); 
    273                         return jwplayer(player); 
    274                 }; 
    275         } 
    276  
    277         /** Returns the duration **/ 
    278         function duration(player) { 
    279                 return function() { 
    280                         return $.fn.jwplayerController.mediaInfo(player).duration; 
    281                 }; 
    282         } 
    283  
    284         /** Adds a listener for media errors. **/ 
    285         function error(player) { 
    286                 return function(arg) { 
    287                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_ERROR, arg); 
    288                         return jwplayer(player); 
    289                 }; 
    290         } 
    291  
    292  
    293         /** Returns the width **/ 
    294         function width(player) { 
    295                 return function() { 
    296                         return $.fn.jwplayerController.mediaInfo(player).width; 
    297                 }; 
    298         } 
    299          
    300          
    301         /** Returns the height **/ 
    302         function height(player) { 
    303                 return function() { 
    304                         return $.fn.jwplayerController.mediaInfo(player).height; 
    305                 }; 
    306         } 
    307          
    308         /** Returns the available meta-data **/ 
    309         function meta(player) { 
    310                 return function() { 
    311                         switch ($.fn.jwplayerUtils.typeOf(arg)) { 
    312                                 case "function": 
    313                                         addEventListener(player, $.jwplayer().events.JWPLAYER_MEDIA_META, arg); 
    314                                         break; 
    315                                 default: 
    316                                         return $.fn.jwplayerController.mediaInfo(player); 
    317                         } 
    318                         return jwplayer(player); 
    319                 }; 
    320         } 
    321          
    322         /** Returns the API method for adding an event listener.**/ 
    323         function apiAddEventListener(player) { 
    324                 return function(event, listener) { 
    325                         addEventListener(player, event, listener); 
    326                 }; 
    327         } 
    328  
    329         /** Returns the API method for adding an event listener.**/ 
    330         function apiRemoveEventListener(player) { 
    331                 return function(event, listener) { 
    332                         removeEventListener(player, event, listener); 
    333                 }; 
    334         } 
    335          
    336         /** Add an event listener. **/ 
    337         function addEventListener(player, event, listener) { 
    338                 $(player).bind(event, listener); 
    339         } 
    340          
    341          
    342         /** Remove an event listener. **/ 
    343         function removeEventListener(player, event, listener) { 
    344                 $(player).unbind(event, listener); 
    345         } 
    346          
    347379        /** Automatically initializes the player for all <video> tags with the JWPlayer class. **/ 
    348380        $(document).ready(function() { 
  • trunk/html5/src/jquery.jwplayerMediaFlash.js

    r938 r950  
    99 
    1010        var controllerEvents = { 
    11                 ERROR: "ERROR", 
     11                ERROR: $.fn.jwplayer.events.JWPLAYER_ERROR, 
    1212                ITEM: "ITEM", 
    13                 MUTE: "MUTE", 
     13                MUTE: $.fn.jwplayer.events.JWPLAYER_MEDIA_MUTE, 
    1414                PLAY: "PLAY", 
    1515                PLAYLIST: "PLAYLIST", 
    16                 RESIZE: "RESIZE", 
     16                RESIZE: $.fn.jwplayer.events.JWPLAYER_RESIZE, 
    1717                SEEK: "SEEK", 
    1818                STOP: "STOP", 
    19                 VOLUME: "VOLUME" 
     19                VOLUME: $.fn.jwplayer.events.JWPLAYER_MEDIA_VOLUME 
    2020        }; 
    2121         
    2222        var modelEvents = { 
    23                 BUFFER: "BUFFER", 
    24                 ERROR: "ERROR", 
    25                 LOADED: "LOADED", 
    26                 META: "META", 
    27                 STATE: stateHandler, 
    28                 TIME: "TIME" 
     23                BUFFER: $.fn.jwplayer.events.JWPLAYER_MEDIA_BUFFER, 
     24                ERROR: $.fn.jwplayer.events.JWPLAYER_MEDIA_ERROR, 
     25                LOADED: $.fn.jwplayer.events.JWPLAYER_MEDIA_LOADED, 
     26                META: $.fn.jwplayer.events.JWPLAYER_MEDIA_META, 
     27                STATE: $.fn.jwplayer.events.JWPLAYER_PLAYER_STATE, 
     28                TIME: $.fn.jwplayer.events.JWPLAYER_MEDIA_TIME 
    2929        }; 
    3030         
     
    4444                VOLUME: "VOLUME" 
    4545        }; 
    46          
    47         $.fn.jwplayerMediaFlash = function(options) { 
    48                 return this.each(function() { 
    49                         var model = $(this).data("model"); 
    50                         //model.autostart = true; 
    51                         model.controlbar = 'none'; 
    52                         model.icons = false; 
    53                         $.fn.jwplayerView.embedFlash($(this), model); 
    54                         var media = { 
    55                                 play: play($(this)), 
    56                                 pause: pause($(this)), 
    57                                 seek: seek($(this)), 
    58                                 volume: volume($(this)), 
    59                                 mute: mute($(this)), 
    60                                 fullscreen: fullscreen($(this)), 
    61                                 state: "idle" 
    62                         }; 
    63                         $(this).data("media", media); 
    64                         addEventListeners($(this)); 
     46 
     47         
     48        $.fn.jwplayerMediaFlash = function(player) { 
     49                var options = {}; 
     50                //options.autostart = true; 
     51                options.controlbar = 'none'; 
     52                options.icons = false; 
     53                $.fn.jwplayerView.embedFlash(player, options); 
     54                var media = { 
     55                        play: play(player), 
     56                        pause: pause(player), 
     57                        seek: seek(player), 
     58                        volume: volume(player), 
     59                        mute: mute(player), 
     60                        fullscreen: fullscreen(player), 
     61                        load: load(player), 
     62                        resize: resize(player), 
     63                        mediaInfo: mediaInfo(player), 
     64                        state: $.fn.jwplayer.states.IDLE 
     65                }; 
     66                player.media = media; 
     67                addEventListeners(player); 
     68        }; 
     69         
     70        function stateHandler(event, player) { 
     71                player.model.state = event.newstate; 
     72                player.sendEvent($.fn.jwplayer.events.JWPLAYER_PLAYER_STATE, { 
     73                        oldstate: event.oldstate, 
     74                        newstate: event.newstate 
    6575                }); 
    66         }; 
    67          
    68         function stateHandler(event) { 
    69                 $(event.id).data("media").state = event.newState; 
    70                 sendEvent($(event.id), $.jwplayer().events.JWPLAYER_PLAYER_STATE, { 
    71                         oldstate: event.oldstate, 
    72                         newstate: event.newState 
    73                 }); 
    74         } 
     76        } 
     77         
    7578         
    7679        function addEventListeners(player) { 
    77                 var event; 
    78                 if ($("#" + player[0].id)[0].addControllerListener === undefined) { 
     80                if (player.model.domelement[0].addControllerListener === undefined) { 
    7981                        setTimeout(function() { 
    8082                                addEventListeners(player); 
     
    8284                        return; 
    8385                } 
    84                 for (event in controllerEvents) { 
    85                         $("#" + player[0].id)[0].addControllerListener(event, "$.fn.jwplayerMediaFlash.forward"); 
     86                var video = player.model.domelement; 
     87                for (var controllerEvent in controllerEvents) { 
     88                        $.fn.jwplayerMediaFlash.forwarders[controllerEvents[controllerEvent]] = forwardFactory(controllerEvents[controllerEvent], player); 
     89                        video[0].addControllerListener(controllerEvent, "$.fn.jwplayerMediaFlash.forwarders."+controllerEvents[controllerEvent]); 
    8690                } 
    87                 for (event in modelEvents) { 
    88                         $("#" + player[0].id)[0].addModelListener(event, "$.fn.jwplayerMediaFlash.forward"); 
     91                for (var modelEvent in modelEvents) { 
     92                        $.fn.jwplayerMediaFlash.forwarders[modelEvents[modelEvent]] = forwardFactory(modelEvents[modelEvent], player); 
     93                        video[0].addModelListener(modelEvent, "$.fn.jwplayerMediaFlash.forwarders."+modelEvents[modelEvent]); 
    8994                } 
    9095        } 
    9196         
    92         $.fn.jwplayerMediaFlash.forward = function(event) { 
    93                 $(event.id).trigger(event.type, event); 
    94         }; 
     97        function forwardFactory(type, player){ 
     98                return function(event){ 
     99                        forward(event, type, player); 
     100                }; 
     101        } 
     102         
     103        $.fn.jwplayerMediaFlash.forwarders = {}; 
     104         
     105        function forward(event, type, player) { 
     106                $.fn.jwplayerUtils.log(type, event); 
     107                switch (type) { 
     108                        case $.fn.jwplayer.events.JWPLAYER_PLAYER_STATE: 
     109                                stateHandler(event, player); 
     110                                break; 
     111                        case $.fn.jwplayer.events.JWPLAYER_MEDIA_BUFFER: 
     112                                event.bufferPercent = event.percentage;  
     113                                player.sendEvent(type, event); 
     114                                break; 
     115                        default: 
     116                                player.sendEvent(type, event); 
     117                                break; 
     118                }        
     119        } 
    95120         
    96121        function play(player) { 
    97122                return function() { 
    98                         $("#" + player[0].id)[0].sendEvent("PLAY"); 
     123                        try { 
     124                                player.model.domelement[0].sendEvent("PLAY"); 
     125                        } catch (err){ 
     126                                $.fn.jwplayerUtils.log("There was an error", err); 
     127                        } 
    99128                }; 
    100129        } 
     
    103132        function pause(player) { 
    104133                return function() { 
    105                         $("#" + player[0].id)[0].sendEvent("PAUSE"); 
     134                        player.model.domelement[0].sendEvent("PAUSE"); 
    106135                }; 
    107136        } 
     
    111140        function seek(player) { 
    112141                return function(position) { 
    113                         $("#" + player[0].id)[0].sendEvent("SEEK", position); 
     142                        player.model.domelement[0].sendEvent("SEEK", position); 
    114143                }; 
    115144        } 
     
    119148        function stop(player) { 
    120149                return function() { 
    121                         $("#" + player[0].id)[0].sendEvent("STOP"); 
     150                        player.model.domelement[0].sendEvent("STOP"); 
    122151                }; 
    123152        } 
     
    127156        function volume(player) { 
    128157                return function(position) { 
    129                         $("#" + player[0].id)[0].sendEvent("VOLUME", position); 
     158                        player.model.domelement[0].sendEvent("VOLUME", position); 
    130159                }; 
    131160        } 
     
    134163        function mute(player) { 
    135164                return function(state) { 
    136                         $("#" + player[0].id)[0].sendEvent("MUTE"); 
     165                        player.model.domelement[0].sendEvent("MUTE"); 
    137166                }; 
    138167        } 
     
    144173                }; 
    145174        } 
     175        /** Load a new video into the player. **/ 
     176        function load(player) { 
     177                return function(path) { 
     178                        //TODO 
     179                }; 
     180        } 
     181         
     182        /** Resizes the video **/ 
     183        function resize(player) { 
     184                return function(width, height) { 
     185                        //TODO 
     186                }; 
     187        } 
     188         
     189         
     190        /** Returns the media info **/ 
     191        function mediaInfo(player) { 
     192                return function(){ 
     193                        return { 
     194                                width: player.model.width, 
     195                                player: player.model.height, 
     196                                state: player.model.state  
     197                        }; 
     198                }; 
     199        } 
    146200         
    147201})(jQuery); 
  • trunk/html5/src/jquery.jwplayerMediaVideo.js

    r943 r950  
    88(function($) { 
    99        var states = { 
    10                 "buffering": "buffering", 
    11                 "ended": "idle", 
    12                 "playing": "playing", 
    13                 "pause": "paused" 
     10                "ended": $.fn.jwplayer.states.IDLE, 
     11                "playing": $.fn.jwplayer.states.PLAYING, 
     12                "pause": $.fn.jwplayer.states.PAUSED, 
     13                "buffering": $.fn.jwplayer.states.BUFFERING 
    1414        }; 
    1515         
     
    3434                'stalled': stateHandler, 
    3535                'suspend': stateHandler, 
    36                 'timeupdate': generalHandler, 
     36                'timeupdate': positionHandler, 
    3737                'volumechange': generalHandler, 
    3838                'waiting': stateHandler, 
     
    4545         
    4646         
    47         $.fn.jwplayerMediaVideo = function(options) { 
    48                 return this.each(function() { 
    49                         var video = $(this); 
    50                         var media = { 
    51                                 play: play(video), 
    52                                 pause: pause(video), 
    53                                 seek: seek(video), 
    54                                 stop: stop(video), 
    55                                 volume: volume(video), 
    56                                 mute: mute(video), 
    57                                 fullscreen: fullscreen(video), 
    58                                 load: load(video), 
    59                                 state: "idle", 
    60                                 interval: null 
    61                         }; 
    62                         video.data("media", media); 
    63                         $.each(events, function(event, handler) { 
    64                                 video[0].addEventListener(event, handler, true); 
    65                         }); 
     47        $.fn.jwplayerMediaVideo = function(player) { 
     48                var media = { 
     49                        play: play(player), 
     50                        pause: pause(player), 
     51                        seek: seek(player), 
     52                        stop: stop(player), 
     53                        volume: volume(player), 
     54                        mute: mute(player), 
     55                        fullscreen: fullscreen(player), 
     56                        load: load(player), 
     57                        resize: resize(player), 
     58                        mediaInfo: mediaInfo(player), 
     59                        state: $.fn.jwplayer.states.IDLE, 
     60                        interval: null 
     61                }; 
     62                player.media = media; 
     63                $.each(events, function(event, handler) { 
     64                        player.model.domelement[0].addEventListener(event, function(event) { 
     65                                handler(event, player); 
     66                        }, true); 
    6667                }); 
    6768        }; 
    6869         
    69         function generalHandler(event) { 
     70        function generalHandler(event, player) { 
    7071                //$.fn.jwplayerUtils.log("general:" + event.type); 
    7172        } 
    7273         
    73         function stateHandler(event) { 
     74        function stateHandler(event, player) { 
    7475                if (states[event.type]) { 
    75                         setState(event.target, states[event.type]); 
    76                 } 
    77         } 
    78          
    79         function setState(player, newState) { 
    80                 if ($(player).data("media").state != newState) { 
    81                         var oldState = $(player).data("media").state; 
    82                         $(player).data("media").state = newState; 
    83                         sendEvent($(player), $.jwplayer().events.JWPLAYER_PLAYER_STATE, { 
    84                                 oldstate: oldState, 
    85                                 newstate: newState 
    86                         }); 
    87                 } 
    88                 if (newState == 'idle') { 
    89                         clearInterval($(player).data("media").interval); 
    90                         $(player).data("media").interval = null; 
    91                 } 
    92         } 
    93          
    94         function metaHandler(event) { 
    95                 sendEvent($(event.target), $.jwplayer().events.JWPLAYER_MEDIA_META, { 
    96                         videoHeight: event.target.videoHeight, 
    97                         videoWidth: event.target.videoWidth, 
     76                        setState(player, states[event.type]); 
     77                } 
     78        } 
     79         
     80        function setState(player, newstate) { 
     81                if (player.model.state != newstate) { 
     82                        var oldstate = player.model.state; 
     83                        player.model.state = newstate; 
     84                        sendEvent(player, $.fn.jwplayer.events.JWPLAYER_PLAYER_STATE, { 
     85                                oldstate: oldstate, 
     86                                newstate: newstate 
     87                        }); 
     88                } 
     89                if (newstate == $.fn.jwplayer.states.IDLE) { 
     90                        clearInterval(player.media.interval); 
     91                        player.media.interval = null; 
     92                } 
     93        } 
     94         
     95        function metaHandler(event, player) { 
     96                var meta = { 
     97                        height: event.target.videoHeight, 
     98                        width: event.target.videoWidth, 
    9899                        duration: event.target.duration 
    99                 }); 
    100         } 
    101          
    102         function positionHandler(event) { 
    103                 if ($(event.target).data("media").interval === null) { 
    104                         $(event.target).data("media").interval = window.setInterval(function() { 
    105                                 positionHandler(event); 
     100                }; 
     101                player.model = $.extend(player.model, meta); 
     102                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_META, meta); 
     103        } 
     104         
     105        function positionHandler(event, player) { 
     106                if (player.media.interval === null) { 
     107                        player.media.interval = window.setInterval(function() { 
     108                                positionHandler(event, player); 
    106109                        }, 100); 
    107110                } 
    108                 sendEvent($(event.target), $.jwplayer().events.JWPLAYER_MEDIA_TIME, { 
     111                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_TIME, { 
    109112                        position: event.target.currentTime, 
    110113                        duration: event.target.duration 
     
    112115        } 
    113116         
    114         function progressHandler(event) { 
     117        function progressHandler(event, player) { 
    115118                var buffer; 
    116119                if (!isNaN(event.loaded / event.total)) { 
    117120                        buffer = event.loaded / event.total * 100; 
    118                 } else if (event.target.buffered !== undefined) { 
    119                         buffer = event.target.buffered.end(0) / event.target.duration * 100; 
    120                 } 
    121                 sendEvent($(event.target), $.jwplayer().events.JWPLAYER_MEDIA_BUFFER, { 
     121                } else if (player.model.domelement.buffered !== undefined) { 
     122                        buffer = player.model.domelement.buffered.end(0) / player.model.domelement.duration * 100; 
     123                } 
     124                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_BUFFER, { 
    122125                        'bufferPercent': buffer 
    123126                }); 
    124127        } 
    125128         
    126         function errorHandler(event) { 
    127                 sendEvent($(event.target), $.jwplayer().events.JWPLAYER_ERROR, {}); 
     129        function errorHandler(event, player) { 
     130                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_ERROR, {}); 
    128131        } 
    129132         
    130133        function play(player) { 
    131134                return function() { 
    132                         player[0].play(); 
     135                        player.model.domelement[0].play(); 
    133136                }; 
    134137        } 
     
    137140        function pause(player) { 
    138141                return function() { 
    139                         player[0].pause(); 
     142                        player.model.domelement[0].pause(); 
    140143                }; 
    141144        } 
     
    145148        function seek(player) { 
    146149                return function(position) { 
    147                         player[0].currentTime = position; 
     150                        player.model.domelement[0].currentTime = position; 
    148151                }; 
    149152        } 
     
    153156        function stop(player) { 
    154157                return function() { 
    155                         player[0].pause(); 
    156                         player[0].currentTime = 0; 
    157                         clearInterval($(player).data("media").interval); 
    158                         $(player).data("media").interval = null; 
    159                         setState(player, 'idle'); 
     158                        player.model.domelement[0].pause(); 
     159                        player.model.domelement[0].currentTime = 0; 
     160                        clearInterval(player.media.interval); 
     161                        player.media.interval = null; 
     162                        setState(player, $.fn.jwplayer.states.IDLE); 
    160163                }; 
    161164        } 
     
    165168        function volume(player) { 
    166169                return function(position) { 
    167                         player[0].volume = position / 100; 
    168                         sendEvent(player, $.jwplayer().events.JWPLAYER_MEDIA_VOLUME, { 
    169                                 volume: player[0].volume 
     170                        player.model.domelement[0].volume = position / 100; 
     171                        sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_VOLUME, { 
     172                                volume: player.model.domelement[0].volume 
    170173                        }); 
    171174                }; 
     
    175178        function mute(player) { 
    176179                return function(state) { 
    177                         player[0].muted = state; 
    178                         sendEvent(player, $.jwplayer().events.JWPLAYER_MEDIA_MUTE, { 
    179                                 mute: player[0].muted 
     180                        player.model.domelement[0].muted = state; 
     181                        sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_MUTE, { 
     182                                mute: player.model.domelement[0].muted 
    180183                        }); 
    181184                }; 
     
    187190                        player.css("width", width); 
    188191                        player.css("height", height); 
    189                         sendEvent(player, $.jwplayer().events.JWPLAYER_MEDIA_RESIZE, { 
     192                        sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_RESIZE, { 
    190193                                width: width, 
    191194                                hieght: height 
     
    200203                                player.css("width", window.width); 
    201204                                player.css("height", window.height); 
    202                                 sendEvent(player, $.jwplayer().events.JWPLAYER_MEDIA_RESIZE, { 
     205                                sendEvent(player, $.fn.jwplayer.events.JWPLAYER_MEDIA_RESIZE, { 
    203206                                        width: width, 
    204207                                        hieght: height 
     
    217220        } 
    218221         
     222        /** Returns the media info **/ 
     223        function mediaInfo(player) { 
     224                return function(){ 
     225                        return { 
     226                                width: player.model.width, 
     227                                player: player.model.height, 
     228                                state: player.model.state  
     229                        }; 
     230                }; 
     231        } 
     232         
    219233        function sendEvent(player, type, data) { 
    220                 player.trigger(type, $.extend({ 
    221                         id: player[0].id, 
    222                         version: $.jwplayer(player).version 
     234                player.sendEvent(type, $.extend({ 
     235                        id: player.model.config.id, 
     236                        version: player.version 
    223237                }, data)); 
    224238        } 
  • trunk/html5/src/jquery.jwplayerModel.js

    r935 r950  
    77 */ 
    88(function($) { 
     9        var jwplayerid = 1; 
     10         
     11        var modelParams ={ 
     12                volume: 100, 
     13                fullscreen: false, 
     14                mute: false, 
     15                width: 480, 
     16                height: 320, 
     17                duration: 0 
     18        }; 
     19         
     20        function createModel(){ 
     21                return { 
     22                        config: {}, 
     23                        sources: {}, 
     24                        listeners: {}, 
     25                        state: $.fn.jwplayer.states.IDLE, 
     26                        source: 0, 
     27                        buffer: 0 
     28                }; 
     29        } 
    930 
    10         $.fn.jwplayerModel = function(options) { 
    11                 return this.each(function() { 
    12                         $(this).jwplayerParse(options); 
    13                 }); 
     31         
     32        $.fn.jwplayerModel = function(domElement, options) { 
     33                var model = createModel(); 
     34                model.config = $.fn.jwplayerParse(domElement[0], options); 
     35                if (model.config.id === undefined) { 
     36                        model.config.id = "jwplayer_"+jwplayerid++; 
     37                } 
     38                model.sources = model.config.sources; 
     39                delete model.config.sources; 
     40                model.domelement = domElement; 
     41                for (var modelParam in modelParams) { 
     42                        if (model.config[modelParam] !== undefined) { 
     43                                model[modelParam] = model.config[modelParam]; 
     44                        } else { 
     45                                model[modelParam] = modelParams[modelParam]; 
     46                        } 
     47                } 
     48                return model; 
    1449        }; 
    1550         
    1651        $.fn.jwplayerModel.setActiveMediaProvider = function(player) { 
    1752                var source, sourceIndex; 
    18                 var model = player.data("model"); 
    19                 for (sourceIndex in model.sources) { 
    20                         source = model.sources[sourceIndex]; 
     53                for (sourceIndex in player.model.sources) { 
     54                        source = player.model.sources[sourceIndex]; 
    2155                        if (source.type === undefined) { 
    2256                                source.type = 'video/' + $.fn.jwplayerUtils.extension(source.file) + ';'; 
    2357                        } 
    2458                        if ($.fn.jwplayerUtils.supportsType(source.type)) { 
    25                                 model.source = sourceIndex; 
    26                                 player.jwplayerMediaVideo(); 
     59                                player.model.source = sourceIndex 
     60                                $.fn.jwplayerMediaVideo(player); 
    2761                                return true; 
    2862                        } 
    2963                } 
    30                 if ($.fn.jwplayerUtils.supportsFlash && model.state != 'playing') { 
    31                         for (sourceIndex in model.sources) { 
    32                                 source = model.sources[sourceIndex]; 
     64                if ($.fn.jwplayerUtils.supportsFlash && player.state != $.fn.jwplayer.states.PLAYING) { 
     65                        for (sourceIndex in player.model.sources) { 
     66                                source = player.model.sources[sourceIndex]; 
    3367                                if ($.fn.jwplayerUtils.flashCanPlay(source.file)) { 
    34                                         model.source = sourceIndex; 
    35                                         player.jwplayerMediaFlash(); 
     68                                        player.model.source = sourceIndex; 
     69                                        $.fn.jwplayerMediaFlash(player); 
    3670                                        return true; 
    3771                                } 
  • trunk/html5/src/jquery.jwplayerParse.js

    r935 r950  
    3535        var parsers = {}; 
    3636         
    37         $.fn.jwplayerParse = function(options) { 
    38                 return this.each(function() { 
    39                         $(this).data("model", $.extend(true, {}, $.fn.jwplayer.defaults, options, parseElement(this))); 
    40                 }); 
     37        $.fn.jwplayerParse = function(player, options) { 
     38                return $.extend(true, {}, $.fn.jwplayer.defaults, options, parseElement(player)); 
    4139        }; 
    4240         
     
    6462                                } 
    6563                        } 
    66                         configuration.screencolor = $(domElement).css("background-color"); 
     64                        configuration.screencolor = ($(domElement).css("background-color") == "transparent") ? "#ffffff" : $(domElement).css("background-color"); 
    6765                        return configuration; 
    6866                } 
  • trunk/html5/src/jquery.jwplayerSkinner.js

    r942 r950  
    1010 
    1111        /** Constructor **/ 
    12         $.fn.jwplayerSkinner = function(completeHandler) { 
    13                 return this.each(function() { 
    14                         load($(this), completeHandler); 
    15                 }); 
     12        $.fn.jwplayerSkinner = function(player, completeHandler) { 
     13                load(player, completeHandler); 
    1614        }; 
    1715         
    1816        /** Load the skin **/ 
    1917        load = function (player, completeHandler){ 
    20                 $.get(player.data("model").skin, {}, function(xml) { 
     18                $.get(player.model.config.skin, {}, function(xml) { 
    2119                        var skin = { 
    2220                                properties:{}, 
     
    4139                                skin[componentName] = component; 
    4240                        } 
    43                         player.data("skin", skin); 
     41                        player.skin = skin; 
    4442                }); 
    4543        }; 
     
    5048                var elementName = $(element).attr('name'); 
    5149                var elementSource = $(element).attr('src'); 
    52                 var skinUrl = player.data("model").skin.substr(0, player.data("model").skin.lastIndexOf('/')); 
     50                var skinUrl = player.model.config.skin.substr(0,  player.model.config.skin.lastIndexOf('/')); 
    5351                $(img).error(function() { 
    54                         player.data("skin").incompleteElements--; 
     52                        player.skin.incompleteElements--; 
    5553                }); 
    5654                $(img).load(function() { 
    57                         player.data("skin")[component].elements[elementName] = { 
     55                        player.skin[component].elements[elementName] = { 
    5856                                height: this.height, 
    5957                                width: this.width, 
    6058                                src: this.src 
    6159                        }; 
    62                         player.data("skin").incompleteElements--; 
    63                         if (player.data("skin").incompleteElements === 0) { 
     60                        player.skin.incompleteElements--; 
     61                        if (player.skin.incompleteElements === 0) { 
    6462                                completeHandler(); 
    6563                        } 
     
    6967         
    7068        $.fn.jwplayerSkinner.hasComponent = function (player, component){ 
    71                 return (player.data("skin")[component] !== null); 
     69                return (player.skin[component] !== null); 
    7270        }; 
    7371         
     
    7573        $.fn.jwplayerSkinner.getSkinElement = function (player, component, element){ 
    7674                try { 
    77                         return player.data("skin")[component].elements[element]; 
     75                        return player.skin[component].elements[element]; 
    7876                } catch (err) { 
    7977                        $.fn.jwplayerUtils.log("No such skin component / element: ", [player, component, element]); 
     
    8583        $.fn.jwplayerSkinner.addSkinElement = function (player, component, name, element){ 
    8684                try { 
    87                         player.data("skin")[component][name] = element; 
     85                        player.skin[component][name] = element; 
    8886                } catch (err){ 
    8987                        $.fn.jwplayerUtils.log("No such skin component ", [player, component]); 
     
    9290         
    9391        $.fn.jwplayerSkinner.getSkinProperties = function (player){ 
    94                 return player.data("skin").properties; 
     92                return player.skin.properties; 
    9593        }; 
    9694         
  • trunk/html5/src/jquery.jwplayerView.js

    r949 r950  
    1919        }; 
    2020         
    21         $.fn.jwplayerView = function() { 
    22                 return this.each(function() { 
    23                         var video = $(this); 
    24                         if ($(this).attr("src") !== "") { 
    25                                 $(this).attr("preload", "metadata"); 
    26                                 $(this).append('<source src="' + $(this).attr("src") + '" >'); 
    27                                 $(this).removeAttr("src"); 
     21        $.fn.jwplayerView = function(player) { 
     22                /*if (!(($(this).attr("src") === undefined) || ($(this).attr("src") === ""))) { 
     23                        $(this).attr("preload", "metadata"); 
     24                        $(this).append('<source src="' + $(this).attr("src") + '" >'); 
     25                        $(this).removeAttr("src"); 
     26                }*/ 
     27                player.model.domelement.wrap("<div id='" + player.model.config.id + "_jwplayer' />"); 
     28                player.model.domelement.parent().css("position", "relative"); 
     29                //$(this).css("display", "none"); 
     30                player.model.domelement.css("position", "absolute"); 
     31                player.model.domelement.css("left", "0px"); 
     32                player.model.domelement.css("top", "0px"); 
     33                player.model.domelement.css("z-index", "0"); 
     34                player.model.domelement.before("<a href='" + player.model.sources[player.model.source].file + "' style='display:block; background:#ffffff url(" + player.model.config.image + ") no-repeat center center;width:" + player.model.width + "px;height:" + player.model.height + "px;position:relative;'><img src='http://content.bitsontherun.com/staticfiles/play.png' alt='Click to play video' style='position:absolute; top:" + (player.model.height - 60) / 2 + "px; left:" + (player.model.width - 60) / 2 + "px; border:0;' /></a>"); 
     35                player.model.domelement.prev("a").css("position", "relative"); 
     36                player.model.domelement.prev("a").css("z-index", "100"); 
     37                player.model.domelement.prev("a").click(function(evt) { 
     38                        if (typeof evt.preventDefault != 'undefined') { 
     39                                evt.preventDefault(); // W3C  
     40                        } else { 
     41                                evt.returnValue = false; // IE  
    2842                        } 
    29                         $(this).wrap("<div id='" + $(this)[0].id + "_jwplayer' />"); 
    30                         $(this).parent().css("position", "relative"); 
    31                         //$(this).css("display", "none"); 
    32                         $(this).css("position", "absolute"); 
    33                         $(this).css("left", "0px"); 
    34                         $(this).css("top", "0px"); 
    35                         $(this).css("z-index", "0"); 
    36                         $(this).before("<a href='" + $(this).data("model").sources[$(this).data("model").source].file + "' style='display:block; background:#ffffff url(" + $(this).data("model").image + ") no-repeat center center;width:" + $(this).data("model").width + "px;height:" + $(this).data("model").height + "px;position:relative;'><img src='http://content.bitsontherun.com/staticfiles/play.png' alt='Click to play video' style='position:absolute; top:" + ($(this).data("model").height - 60) / 2 + "px; left:" + ($(this).data("model").width - 60) / 2 + "px; border:0;' /></a>"); 
    37                         $(this).prev("a").css("position", "relative"); 
    38                         $(this).prev("a").css("z-index", "100"); 
    39                         $(this).prev("a").click(function(evt) { 
    40                                 if (typeof evt.preventDefault != 'undefined') { 
    41                                         evt.preventDefault(); // W3C  
    42                                 } else { 
    43                                         evt.returnValue = false; // IE  
    44                                 } 
    45                                 $.jwplayer(video).play(); 
    46                         }); 
    47                         $.jwplayer(video).state(imageHandler); 
     43                        if (player.state() !== $.fn.jwplayer.states.PLAYING){ 
     44                                player.play(); 
     45                        } else { 
     46                                player.pause(); 
     47                        } 
     48                          
     49                }); 
     50                $.jwplayer(player.model.config.id).state(function(obj) { 
     51                        imageHandler(obj, player); 
    4852                }); 
    4953        }; 
    5054         
    51         function imageHandler(event, parameters) { 
    52                 $.fn.jwplayerUtils(event.target); 
    53                 switch (parameters.newstate) { 
    54                         case 'idle': 
    55                                 $(event.target).css("z-index", "0"); 
    56                                 $(event.target).prev("a").css("z-index", "100"); 
     55        function imageHandler(obj, player) { 
     56                switch (obj.newstate) { 
     57                        case $.fn.jwplayer.states.IDLE: 
     58                                player.model.domelement.css("z-index", "0"); 
     59                                player.model.domelement.prev("a").css("z-index", "100"); 
    5760                                break; 
    58                         case 'playing': 
    59                                 $(event.target).prev("a").css("z-index", "0"); 
    60                                 $(event.target).css("z-index", "100"); 
     61                        case $.fn.jwplayer.states.PLAYING: 
     62                                player.model.domelement.prev("a").css("z-index", "0"); 
     63                                player.model.domelement.css("z-index", "100"); 
    6164                                break; 
    6265                } 
    6366        } 
    6467         
     68        $.fn.jwplayerView.switchMediaProvider = function(){ 
     69                 
     70        }; 
     71         
    6572        /** Embeds a Flash Player at the specified location in the DOM. **/ 
    66         $.fn.jwplayerView.embedFlash = function(domElement, model) { 
    67                 if (model.flashplayer !== false) { 
     73        $.fn.jwplayerView.embedFlash = function(player, options) { 
     74                if (player.model.config.flashplayer !== false) { 
    6875                        var htmlString, elementvarString = "", flashvarString = ""; 
    6976                        if (navigator.plugins && navigator.mimeTypes && navigator.mimeTypes.length) { 
     
    7380                        } 
    7481                        for (var elementvar in elementvars) { 
    75                                 if (!((model[elementvar] === undefined) || (model[elementvar] === "") || (model[elementvar] === null))) { 
    76                                         elementvarString += elementvar + "='" + model[elementvar] + "'"; 
     82                                if (!((player.model.config[elementvar] === undefined) || (player.model.config[elementvar] === "") || (player.model.config[elementvar] === null))) { 
     83                                        elementvarString += elementvar + "='" + player.model.config[elementvar] + "'"; 
    7784                                } 
    7885                        } 
    79                         for (var flashvar in model) { 
    80                                 if (!((model[flashvar] === undefined) || (model[flashvar] === "") || (model[flashvar] === null))) { 
    81                                         if (flashvar == "sources") { 
    82                                                 flashvarString += "file=" + model.sources[model.source].file + "&"; 
    83                                         } else { 
    84                                                 flashvarString += flashvar + "=" + model[flashvar] + "&"; 
    85                                         } 
     86                        flashvarString += "file=" + player.model.sources[player.model.source].file + "&"; 
     87                        var config = $.extend(true, {}, player.model.config, options); 
     88                        for (var flashvar in config) { 
     89                                if (!((config[flashvar] === undefined) || (config[flashvar] === "") || (config[flashvar] === null))) { 
     90                                                flashvarString += flashvar + "=" + config[flashvar] + "&"; 
    8691                                } 
    8792                        } 
    8893                        htmlString = htmlString.replace("%elementvars%", elementvarString); 
    8994                        htmlString = htmlString.replace("%flashvars%", flashvarString); 
    90                         htmlString = htmlString.replace("%flashplayer%", model.flashplayer); 
     95                        htmlString = htmlString.replace("%flashplayer%", player.model.config.flashplayer); 
    9196                        htmlString = htmlString.replace("%style%", styleString); 
    92                         $(domElement).before(htmlString); 
    93                         var result = $(domElement).prev(); 
    94                         $(domElement).remove(); 
    95                         return result; 
     97                        player.model.domelement.before(htmlString); 
     98                        var oldDOMElement = player.model.domelement; 
     99                        player.model.domelement = player.model.domelement.prev(); 
     100                        oldDOMElement.remove(); 
    96101                } 
    97102        }; 
Note: See TracChangeset for help on using the changeset viewer.