Changeset 2173

Timestamp:

04/20/12 11:13:23 (13 months ago)

Author:

pablo

Message:

Additional video and controlbar functionality

Location:

branches/jw6

Files:

• bin-debug/jwplayer.js (modified) (36 diffs)
• build/build.xml (modified) (1 diff)
• jwplayer.min.js (modified) (1 diff)
• src/js/html5/jwplayer.html5.controlbar.js (modified) (27 diffs)
• src/js/html5/jwplayer.html5.controller.js (added)
• src/js/html5/jwplayer.html5.player.js (modified) (4 diffs)
• src/js/html5/jwplayer.html5.video.js (modified) (1 diff)
• src/js/utils/jwplayer.utils.js (modified) (1 diff)
• test/controller.html (added)

branches/jw6/bin-debug/jwplayer.js

@@ -237 +237 @@
         }
 
-
+        /** Format the elapsed / remaining text. **/
+        utils.timeFormat = function(sec) {
+                if (sec > 0) {
+                        str = Math.floor(sec / 60) < 10 ? "0" + Math.floor(sec / 60) + ":" : Math.floor(sec / 60) + ":";
+                        str += Math.floor(sec % 60) < 10 ? "0" + Math.floor(sec % 60) : Math.floor(sec % 60);
+                        return str;
+                } else {
+                        return "00:00";
+                }
+        }
+
+        /** Logger * */
+        jwplayer.utils.log = function(msg, obj) {
+                if (typeof console != "undefined" && typeof console.log != "undefined") {
+                        if (obj) {
+                                console.log(msg, obj);
+                        } else {
+                                console.log(msg);
+                        }
+                }
+        };
+
+        /** Replacement for getBoundingClientRect, which isn't supported in iOS 3.1.2 **/
+        jwplayer.utils.getBoundingClientRect = function(element) {
+                if (typeof element.getBoundingClientRect == "function") {
+                        return element.getBoundingClientRect();
+                } else {
+                        return { 
+                                left: element.offsetLeft + document.body.scrollLeft, 
+                                top: element.offsetTop + document.body.scrollTop, 
+                                width: element.offsetWidth, 
+                                height: element.offsetHeight
+                        };
+                }
+        }
+        
 })(jwplayer);
 /**
@@ -545 +580 @@
 })(jwplayer.utils);
 /**
+ * Event namespace defintion for the JW Player
+ * 
+ * @author pablo
+ * @version 6.0
+ */
+(function(jwplayer) {
+        jwplayer.events = {
+                // General Events
+                COMPLETE : 'COMPLETE',
+                ERROR : 'ERROR',
+
+                // API Events
+                API_READY : 'jwplayerAPIReady',
+                JWPLAYER_READY : 'jwplayerReady',
+                JWPLAYER_FULLSCREEN : 'jwplayerFullscreen',
+                JWPLAYER_RESIZE : 'jwplayerResize',
+                JWPLAYER_ERROR : 'jwplayerError',
+
+                // Media Events
+                JWPLAYER_MEDIA_BEFOREPLAY : 'jwplayerMediaBeforePlay',
+                JWPLAYER_MEDIA_BEFORECOMPLETE : 'jwplayerMediaBeforeComplete',
+                JWPLAYER_COMPONENT_SHOW : 'jwplayerComponentShow',
+                JWPLAYER_COMPONENT_HIDE : 'jwplayerComponentHide',
+                JWPLAYER_MEDIA_BUFFER : 'jwplayerMediaBuffer',
+                JWPLAYER_MEDIA_BUFFER_FULL : 'jwplayerMediaBufferFull',
+                JWPLAYER_MEDIA_ERROR : 'jwplayerMediaError',
+                JWPLAYER_MEDIA_LOADED : 'jwplayerMediaLoaded',
+                JWPLAYER_MEDIA_COMPLETE : 'jwplayerMediaComplete',
+                JWPLAYER_MEDIA_SEEK : 'jwplayerMediaSeek',
+                JWPLAYER_MEDIA_TIME : 'jwplayerMediaTime',
+                JWPLAYER_MEDIA_VOLUME : 'jwplayerMediaVolume',
+                JWPLAYER_MEDIA_META : 'jwplayerMediaMeta',
+                JWPLAYER_MEDIA_MUTE : 'jwplayerMediaMute',
+
+                // State events
+                JWPLAYER_PLAYER_STATE : 'jwplayerPlayerState',
+                state : {
+                        BUFFERING : 'BUFFERING',
+                        IDLE : 'IDLE',
+                        PAUSED : 'PAUSED',
+                        PLAYING : 'PLAYING',
+                        COMPLETED : 'COMPLETED'
+                },
+
+                // Playlist Events
+                JWPLAYER_PLAYLIST_LOADED : 'jwplayerPlaylistLoaded',
+                JWPLAYER_PLAYLIST_ITEM : 'jwplayerPlaylistItem',
+
+                // Instream events
+                JWPLAYER_INSTREAM_CLICK : 'jwplayerInstreamClicked',
+                JWPLAYER_INSTREAM_DESTROYED : 'jwplayerInstreamDestroyed'
+        };
+
+})(jwplayer);
+/**
+ * Event dispatcher for the JW Player
+ *
+ * @author zach
+ * @modified pablo
+ * @version 6.0
+ */
+(function(jwplayer) {
+        jwplayer.events.eventdispatcher = function(id, debug) {
+                var _id = id,
+                        _debug = debug,
+                        _listeners, _globallisteners;
+                
+                /** Clears all event listeners **/
+                this.resetEventListeners = function() {
+                        _listeners = {};
+                        _globallisteners = [];
+                };
+                
+                this.resetEventListeners();
+                
+                /** Add an event listener for a specific type of event. **/
+                this.addEventListener = function(type, listener, count) {
+                        try {
+                                if (!jwplayer.utils.exists(_listeners[type])) {
+                                        _listeners[type] = [];
+                                }
+                                
+                                if (typeof(listener) == "string") {
+                                        eval("listener = " + listener);
+                                }
+                                _listeners[type].push({
+                                        listener: listener,
+                                        count: count
+                                });
+                        } catch (err) {
+                                jwplayer.utils.log("error", err);
+                        }
+                        return false;
+                };
+                
+                
+                /** Remove an event listener for a specific type of event. **/
+                this.removeEventListener = function(type, listener) {
+                        if (!_listeners[type]) {
+                                return;
+                        }
+                        try {
+                                for (var listenerIndex = 0; listenerIndex < _listeners[type].length; listenerIndex++) {
+                                        if (_listeners[type][listenerIndex].listener.toString() == listener.toString()) {
+                                                _listeners[type].splice(listenerIndex, 1);
+                                                break;
+                                        }
+                                }
+                        } catch (err) {
+                                jwplayer.utils.log("error", err);
+                        }
+                        return false;
+                };
+                
+                /** Add an event listener for all events. **/
+                this.addGlobalListener = function(listener, count) {
+                        try {
+                                if (typeof(listener) == "string") {
+                                        eval("listener = " + listener);
+                                }
+                                _globallisteners.push({
+                                        listener: listener,
+                                        count: count
+                                });
+                        } catch (err) {
+                                jwplayer.utils.log("error", err);
+                        }
+                        return false;
+                };
+                
+                /** Add an event listener for all events. **/
+                this.removeGlobalListener = function(listener) {
+                        if (!listener) {
+                                return;
+                        }
+                        try {
+                                for (var globalListenerIndex = 0; globalListenerIndex < _globallisteners.length; globalListenerIndex++) {
+                                        if (_globallisteners[globalListenerIndex].listener.toString() == listener.toString()) {
+                                                _globallisteners.splice(globalListenerIndex, 1);
+                                                break;
+                                        }
+                                }
+                        } catch (err) {
+                                jwplayer.utils.log("error", err);
+                        }
+                        return false;
+                };
+                
+                
+                /** Send an event **/
+                this.sendEvent = function(type, data) {
+                        if (!jwplayer.utils.exists(data)) {
+                                data = {};
+                        }
+                        jwplayer.utils.extend(data, {
+                                id: _id,
+                                version: jwplayer.version,
+                                type: type
+                        });
+                        if (_debug) {
+                                jwplayer.utils.log(type, data);
+                        }
+                        if (typeof _listeners[type] != "undefined") {
+                                for (var listenerIndex = 0; listenerIndex < _listeners[type].length; listenerIndex++) {
+                                        try {
+                                                _listeners[type][listenerIndex].listener(data);
+                                        } catch (err) {
+                                                jwplayer.utils.log("There was an error while handling a listener: " + err.toString(), _listeners[type][listenerIndex].listener);
+                                        }
+                                        if (_listeners[type][listenerIndex]) {
+                                                if (_listeners[type][listenerIndex].count === 1) {
+                                                        delete _listeners[type][listenerIndex];
+                                                } else if (_listeners[type][listenerIndex].count > 0) {
+                                                        _listeners[type][listenerIndex].count = _listeners[type][listenerIndex].count - 1;
+                                                }
+                                        }
+                                }
+                        }
+                        for (var globalListenerIndex = 0; globalListenerIndex < _globallisteners.length; globalListenerIndex++) {
+                                try {
+                                        _globallisteners[globalListenerIndex].listener(data);
+                                } catch (err) {
+                                        jwplayer.utils.log("There was an error while handling a listener: " + err.toString(), _globallisteners[globalListenerIndex].listener);
+                                }
+                                if (_globallisteners[globalListenerIndex]) {
+                                        if (_globallisteners[globalListenerIndex].count === 1) {
+                                                delete _globallisteners[globalListenerIndex];
+                                        } else if (_globallisteners[globalListenerIndex].count > 0) {
+                                                _globallisteners[globalListenerIndex].count = _globallisteners[globalListenerIndex].count - 1;
+                                        }
+                                }
+                        }
+                };
+        };
+})(jwplayer);
+/**
  * jwplayer.html5 namespace
  *
@@ -581 +812 @@
                 JW_CSS_RIGHT = "right",
                 JW_CSS_100PCT = "100%",
+                JW_CSS_SMOOTH_EASE = "width .25s linear 0s, left .25s linear 0s, opacity .25s ease 0s"
                 
                 CB_CLASS = '.jwcontrolbar';
@@ -586 +818 @@
         /** HTML5 Controlbar class **/
         html5.controlbar = function(api, config) {
-                var _api;
-
-                var _defaults = {
-                        backgroundcolor : "",
-                        margin : 10,
-                        font : "Arial,sans-serif",
-                        fontsize : 10,
-                        fontcolor : parseInt("000000", 16),
-                        fontstyle : "normal",
-                        fontweight : "bold",
-                        buttoncolor : parseInt("ffffff", 16),
-                        // position : html5.view.positions.BOTTOM,
-                        position: "OVER",
-                        idlehide : false,
-                        hideplaylistcontrols : false,
-                        forcenextprev : false,
-                        layout : {
-                                "left" : {
-                                        "position" : "left",
-                                        "elements" : [ {
-                                                "name" : "play",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "prev",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "next",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "elapsed",
-                                                "type" : CB_TEXT
-                                        } ]
-                                },
-                                "center" : {
-                                        "position" : "center",
-                                        "elements" : [ {
-                                                "name" : "time",
-                                                "type" : CB_SLIDER
-                                        } ]
-                                },
-                                "right" : {
-                                        "position" : "right",
-                                        "elements" : [ {
-                                                "name" : "duration",
-                                                "type" : CB_TEXT
-                                        }, {
-                                                "name" : "blank",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "mute",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "volume",
-                                                "type" : CB_SLIDER
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "fullscreen",
-                                                "type" : CB_BUTTON
-                                        } ]
-                                }
-                        }
-                };
-                
-                var _settings, _layout, _elements;
-                
-                var _controlbar, _id;
-                
-                var _toggles = {
-                        play: "pause",
-                        mute: "unmute",
-                        fullscreen: "normalscreen"
-                }
-                
-                var _toggleStates = {
-                        play: false,
-                        mute: false,
-                        fullscreen: false
-                }
-                
-                var _buttonMapping = {
-                        play: _play,
-                        mute: _mute,
-                        fullscreen: _fullscreen
-                };
+                var _api,
+
+                        _defaults = {
+                                backgroundcolor : "",
+                                margin : 10,
+                                font : "Arial,sans-serif",
+                                fontsize : 10,
+                                fontcolor : parseInt("000000", 16),
+                                fontstyle : "normal",
+                                fontweight : "bold",
+                                buttoncolor : parseInt("ffffff", 16),
+                                // position : html5.view.positions.BOTTOM,
+                                position: "OVER",
+                                idlehide : false,
+                                hideplaylistcontrols : false,
+                                forcenextprev : false,
+                                layout : {
+                                        left: {
+                                                position: "left",
+                                                elements: [ {
+                                                        name: "play",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "prev",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "next",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "elapsed",
+                                                        type: CB_TEXT
+                                                } ]
+                                        },
+                                        center: {
+                                                position: "center",
+                                                elements: [ {
+                                                        name: "time",
+                                                        type: CB_SLIDER
+                                                } ]
+                                        },
+                                        right: {
+                                                position: "right",
+                                                elements: [ {
+                                                        name: "duration",
+                                                        type: CB_TEXT
+                                                }, {
+                                                        name: "blank",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "mute",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "volume",
+                                                        type: CB_SLIDER
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "fullscreen",
+                                                        type: CB_BUTTON
+                                                } ]
+                                        }
+                                }
+                        },
+                
+                        _settings, 
+                        _layout, 
+                        _elements, 
+                        _controlbar, 
+                        _id,
+                        _duration,
+                        
+                        _toggles = {
+                                play: "pause",
+                                mute: "unmute",
+                                fullscreen: "normalscreen"
+                        },
+                        
+                        _toggleStates = {
+                                play: false,
+                                mute: false,
+                                fullscreen: false
+                        },
+                        
+                        _buttonMapping = {
+                                play: _play,
+                                mute: _mute,
+                                fullscreen: _fullscreen,
+                                next: _next,
+                                prev: _prev
+                        },
+                        
+                        _sliderMapping = {
+                                time: _seek,
+                                volume: _volume
+                        }
+                
+                
 
                 function _init() {
@@ -690 +934 @@
                         _api = api;
                         
+
                         config = _utils.extend({}, config);
                         _id = _api.id + "_controlbar";
+                        _duration = 0;
 
                         _controlbar = _createSpan();
                         _controlbar.id = _id;
                         _controlbar.className = "jwcontrolbar";
+
+                        // Slider listeners
+                        window.addEventListener('mousemove', _sliderMouseEvent, false);
+                        window.addEventListener('mouseup', _sliderMouseEvent, false);
 
                         (new html5.skinloader(config.skin, function(skin) {
@@ -703 +953 @@
                                 _createStyles();
                                 _buildControlbar();
-                        }, function(err) { console.log(err); }));
-                        
-                        
-                }
+                                _addEventListeners();
+                        }, function(err) { _utils.log(err); }));
+                }
+                
+                function _addEventListeners() {
+                        _api.addEventListener(jwplayer.events.JWPLAYER_MEDIA_TIME, _timeUpdated);
+                        _api.addEventListener(jwplayer.events.JWPLAYER_PLAYER_STATE, _stateHandler);
+                        _api.addEventListener(jwplayer.events.JWPLAYER_MEDIA_MUTE, _muteHandler);
+                        _api.addEventListener(jwplayer.events.JWPLAYER_MEDIA_VOLUME, _volumeHandler);
+                        _api.addEventListener(jwplayer.events.JWPLAYER_MEDIA_BUFFER, _bufferHandler);
+                }
+                
+                function _timeUpdated(evt) {
+                        _duration = evt.duration;
+                        
+                        if (_elements.elapsed) {
+                                _elements.elapsed.innerHTML = _utils.timeFormat(evt.position);
+                        }
+                        if (_elements.duration) {
+                                _elements.duration.innerHTML = _utils.timeFormat(evt.duration);
+                        }
+                        if (evt.duration > 0) {
+                                _setProgress(evt.position / evt.duration);
+                        } else {
+                                _setProgress(0);
+                        }
+                }
+                
+                function _stateHandler(evt) {
+                        switch (evt.newstate) {
+                        case jwplayer.events.state.PLAYING:
+                        case jwplayer.events.state.BUFFERING:
+                                if (_elements['timeSliderThumb']) {
+                                        _elements['timeSliderThumb'].style.opacity = 1;
+                                }
+                                if (_elements["timeRail"]) {
+                                        _elements["timeRail"].className = "jwrail jwsmooth";
+                                }
+                                _toggleButton("play", true);
+                                break;
+                        case jwplayer.events.state.PAUSED:
+                                if (!_dragging) {
+                                        _toggleButton("play", false);
+                                }
+                                break;
+                        case jwplayer.events.state.IDLE:
+                        case jwplayer.events.state.COMPLETED:
+                                _toggleButton("play", false);
+                                if (_elements['timeSliderThumb']) {
+                                        _elements['timeSliderThumb'].style.opacity = 0;
+                                }
+                                _setBuffer(0);
+                                _timeUpdated({ position: 0, duration: 0});
+                                if (_elements["timeRail"]) {
+                                        _elements["timeRail"].className = "jwrail";
+                                }
+                                break;
+                        }
+                }
+                
+                function _muteHandler(evt) {
+                        _toggleButton("mute", evt.mute);
+                }
+
+                function _volumeHandler(evt) {
+                        _setVolume(evt.volume / 100);
+                }
+
+                function _bufferHandler(evt) {
+                        _setBuffer(evt.bufferPercent / 100);
+                }
+
 
                 /**
@@ -721 +1039 @@
                         });
                         
-                        _style(_internalSelector(".text"), {
+                        _style(_internalSelector(".jwtext"), {
                                 font: _settings.fontsize + "px/" + _getSkinElement("background").height + "px " + _settings.font,
                                 color: _settings.fontcolor,
@@ -747 +1065 @@
                                 left: _getSkinElement('capLeft').width,
                                 right: _getSkinElement('capRight').width,
-                                'backgroundRepeat': "repeat-x"
+                                'background-repeat': "repeat-x"
                         }, true);
 
@@ -784 +1102 @@
                         var element = _createSpan();
                         //element.id = _createElementId(name);
-                        element.className = name;
-                        
-                        var center = nocenter ? "" : "center";
+                        element.className = 'jw'+name;
+                        
+                        var center = nocenter ? " left center" : " center";
 
                         var skinElem = _getSkinElement(name);
@@ -798 +1116 @@
                         if (stretch) {
                                 newStyle = {
-                                        background: "url('" + skinElem.src + "') "+center+" repeat-x"
+                                        background: "url('" + skinElem.src + "') repeat-x " + center
                                 };
                         } else {
                                 newStyle = {
-                                        background: "url('" + skinElem.src + "') "+center+" no-repeat",
+                                        background: "url('" + skinElem.src + "') no-repeat" + center,
                                         width: skinElem.width
                                 };
                         }
                         
-                        _style(_internalSelector('.'+name), _utils.extend(newStyle, style));
+                        _style(_internalSelector('.jw'+name), _utils.extend(newStyle, style));
                         _elements[name] = element;
                         return element;
@@ -813 +1131 @@
 
                 function _buildButton(name) {
+                        if (!_getSkinElement(name + "Button").src) {
+                                return null;
+                        }
+                        
                         var element = document.createElement("button");
                         //element.id = _createElementId(name);
-                        element.className = name;
-                        element.addEventListener("click", (function(name) { return function() { _buttonClickHandler(name) } })(name));
+                        element.className = 'jw'+name;
+                        element.addEventListener("click", _buttonClickHandler(name), false);
 
                         var outSkin = _getSkinElement(name + "Button");
@@ -822 +1144 @@
                         
                         element.innerHTML = "&nbsp;";
-                        if (!_getSkinElement(name + "Button").src) {
-                                return element;
-                        }
-                        
-                        _buttonStyle(_internalSelector('.'+name), outSkin, overSkin);
+                        
+                        _buttonStyle(_internalSelector('.jw'+name), outSkin, overSkin);
                         var toggle = _toggles[name];
                         if (toggle) {
-                                _buttonStyle(_internalSelector('.'+name+'.toggle'), _getSkinElement(toggle+"Button"), _getSkinElement(toggle+"ButtonOver"));
+                                _buttonStyle(_internalSelector('.jw'+name+'.jwtoggle'), _getSkinElement(toggle+"Button"), _getSkinElement(toggle+"ButtonOver"));
                         }
 
@@ -855 +1174 @@
                 
                 function _buttonClickHandler(name) {
-                        if (_buttonMapping[name]) {
-                                _buttonMapping[name]();
+                        return function() {
+                                if (_buttonMapping[name]) {
+                                        _buttonMapping[name]();
+                                }
                         }
                 }
@@ -867 +1188 @@
                                 _api.jwPlay();
                         }
-                        _toggleButton("play");
                 }
                 
                 function _mute() {
-                        _toggleButton("mute");
+                        _api.jwSetMute();
+                }
+                
+                function _volume(pct) {
+                        if (pct < 0.1) pct = 0;
+                        if (pct > 0.9) pct = 1;
+                        _api.jwSetVolume(pct * 100)
+                }
+                
+                function _seek(pct) {
+                        if (!_dragging) {
+                                _api.jwPlay();
+                        }
+                        _api.jwSeek(pct * _duration);
                 }
                 
@@ -877 +1210 @@
                         _toggleButton("fullscreen");
                 }
-                
-                function _toggleButton(name) {
-                        _elements[name].className = name + (_toggleStates[name] ? "" : " toggle");
-                        _toggleStates[name] ^= true;
+
+                function _next() {
+                        _api.jwPlaylistNext();
+                }
+
+                function _prev() {
+                        _api.jwPlaylistNext();
+                }
+
+                function _toggleButton(name, state) {
+                        if (!_utils.exists(state)) {
+                                state = !_toggleStates[name];
+                        }
+                        if (_elements[name]) {
+                                _elements[name].className = 'jw' + name + (state ? " jwtoggle" : "");
+                        }
+                        _toggleStates[name] = state;
                 }
                 
                 function _createElementId(name) {
-                        //return (_id + "_" + name + Math.round(Math.random()*10000000));
                         return _id + "_" + name;
                 }
@@ -891 +1236 @@
                         var element = _createSpan();
                         element.id = _createElementId(name); 
-                        element.className = "text " + name;
+                        element.className = "jwtext jw" + name;
                         
                         var css = {};
@@ -901 +1246 @@
                         }
 
-                        _style(_internalSelector('.'+name), css);
+                        _style(_internalSelector('.jw'+name), css);
                         element.innerHTML = "00:00";
                         _elements[name] = element;
@@ -910 +1255 @@
                         if (divider.width) {
                                 var element = _createSpan();
-                                element.className = "blankDivider";
+                                element.className = "jwblankDivider";
                                 _style(element, {
                                         width: parseInt(divider.width)
@@ -924 +1269 @@
                 function _buildSlider(name) {
                         var slider = _createSpan();
-                        //slider.id = _createElementId(name);
-                        slider.className = "slider " + name;
-
-                        var rail = _createSpan();
-                        rail.className = "rail";
-
-                        var railElements = ['Rail', 'Buffer', 'Progress'];
-
-                        for (var i=0; i<railElements.length; i++) {
-                                var element = _buildImage(name + "Slider" + railElements[i], null, true, (name=="volume"));
-                                if (element) {
-                                        element.className += " stretch";
-                                        rail.appendChild(element);
-                                }
-                        }
-                        
-                        var thumb = _buildImage(name + "SliderThumb");
-                        if (thumb) {
-                                thumb.className += " thumb";
-                                rail.appendChild(thumb);
-                        }
+                        slider.className = "jwslider jw" + name;
+
 
                         var capLeft = _buildImage(name + "SliderCapLeft");
                         var capRight = _buildImage(name + "SliderCapRight");
-                        if (capRight) capRight.className += " capRight";
-
+                        if (capRight) capRight.className += " jwcapRight";
+
+                        var rail = _buildSliderRail(name);
+                        
                         if (capLeft) slider.appendChild(capLeft);
                         slider.appendChild(rail);
                         if (capLeft) slider.appendChild(capRight);
 
-                        _style(_internalSelector("." + name + " .rail"), {
+                        _style(_internalSelector(".jw" + name + " .jwrail"), {
                                 left: _getSkinElement(name+"SliderCapLeft").width,
                                 right: _getSkinElement(name+"SliderCapRight").width,
                         });
+
+                        _elements[name] = slider;
 
                         if (name == "time") {
@@ -967 +1297 @@
                         }
 
-                        _elements[name] = slider;
-                        
-                return slider;
-                }
+                        
+                        return slider;
+                }
+                
+                function _buildSliderRail(name) {
+                        var rail = _createSpan();
+                        rail.className = "jwrail jwsmooth";
+
+                        var railElements = ['Rail', 'Buffer', 'Progress'];
+
+                        for (var i=0; i<railElements.length; i++) {
+                                var element = _buildImage(name + "Slider" + railElements[i], null, true, (name=="volume"));
+                                if (element) {
+                                        element.className += " jwstretch";
+                                        rail.appendChild(element);
+                                }
+                        }
+                        
+                        var thumb = _buildImage(name + "SliderThumb");
+                        if (thumb) {
+                                thumb.className += " jwthumb";
+                                thumb.style.opacity = 0;
+                                rail.appendChild(thumb);
+                        }
+                        
+                        rail.addEventListener('mousedown', _sliderMouseDown(name), false);
+                        
+                        _elements[name+'Rail'] = rail;
+                        
+                        return rail;
+                }
+                
+                var _dragging;
+                
+                function _sliderMouseDown(name) {
+                        return (function(evt) {
+                                if (evt.button != 0)
+                                        return;
+                                
+                                _elements[name+'Rail'].className = "jwrail";
+                                
+                                if (name == "time") {
+                                        if (_api.jwGetState() != jwplayer.events.state.IDLE) {
+                                                _api.jwPause();
+                                                _dragging = name;
+                                        }
+                                } else {
+                                        _dragging = name;
+                                }
+                        });
+                }
+                
+                var _lastSeekTime = 0;
+                
+                function _sliderMouseEvent(evt) {
+                        if (!_dragging || evt.button != 0) {
+                                return;
+                        }
+                        
+                        var rail = _elements[_dragging].getElementsByClassName('jwrail')[0],
+                                railRect = _utils.getBoundingClientRect(rail),
+                                pct = (evt.clientX - railRect.left) / railRect.width;
+                        
+                        if (evt.type == 'mouseup') {
+                                var name = _dragging;
+                                _elements[name+'Rail'].className = "jwrail jwsmooth";
+                                _dragging = null;
+                                _sliderMapping[name](pct);
+                        } else {
+                                if (_dragging == "time") {
+                                        _setProgress(pct);
+                                } else {
+                                        _setVolume(pct);
+                                }
+                                var currentTime = (new Date()).getTime();
+                                if (currentTime - _lastSeekTime > 500) {
+                                        _lastSeekTime = currentTime;
+                                        _sliderMapping[_dragging](pct);
+                                }
+                        }
+                }
+
         
                 function _styleTimeSlider(slider) {
                         if (_elements['timeSliderThumb']) {
-                                _style(_internalSelector(".timeSliderThumb"), {
+                                _style(_internalSelector(".jwtimeSliderThumb"), {
                                         'margin-left': (_getSkinElement("timeSliderThumb").width/-2)
                                 });
@@ -989 +1397 @@
                                 railWidth = _getSkinElement("volumeSliderRail").width;
                         
-                        _style(_internalSelector(".volume"), {
+                        _style(_internalSelector(".jwvolume"), {
                                 width: (capLeftWidth + railWidth + capRightWidth)
                         });
@@ -1004 +1412 @@
                         _controlbar.appendChild(_groups.right);
                         
-                        _style(_internalSelector(".right"), {
+                        _style(_internalSelector(".jwright"), {
                                 right: _getSkinElement("capRight").width
                         });
@@ -1012 +1420 @@
                 function _buildGroup(pos) {
                         var elem = _createSpan();
-                        elem.className = "group " + pos;
+                        elem.className = "jwgroup jw" + pos;
                         _groups[pos] = elem;
                         if (_layout[pos]) {
@@ -1031 +1439 @@
 
                 var _resize = this.resize = function(width, height) {
-                        _style(_internalSelector('.group.center'), {
-                                left: _utils.parseDimension(_groups.left.offsetWidth) + _getSkinElement("capLeft").width,
-                                right: _utils.parseDimension(_groups.right.offsetWidth) + _getSkinElement("capRight").width
+                        _style(_internalSelector('.jwgroup.jwcenter'), {
+                                left: Math.round(_utils.parseDimension(_groups.left.offsetWidth) + _getSkinElement("capLeft").width),
+                                right: Math.round(_utils.parseDimension(_groups.right.offsetWidth) + _getSkinElement("capRight").width)
                         });
                 }
@@ -1043 +1451 @@
                 var _setBuffer = this.setBuffer = function(pct) {
                         pct = Math.min(Math.max(0, pct), 1);
-                        _elements['timeSliderBuffer'].style.width = 100 * pct + "%";
+                        _elements['timeSliderBuffer'].style.width = pct * _utils.getBoundingClientRect(_elements['timeSliderRail']).width + "px";
                 }
 
                 function _sliderPercent(name, pct, fixedWidth) {
+                        if (!_elements[name]) return;
+
                         pct = Math.min(Math.max(0, pct), 1);
                         
                         var progress = _elements[name+'SliderProgress'];
                         var thumb = _elements[name+'SliderThumb'];
-                        
+                        var width = pct * _utils.getBoundingClientRect(_elements[name+'SliderRail']).width + "px";
+                
                         if (progress) {
-                                progress.style.width = 100 * pct + "%";
+                                progress.style.width = width; 
                         }
                         if (thumb) {
-                                thumb.style.left = pct * _utils.parseDimension(_elements[name+'SliderRail'].clientWidth) + "px";
-                                //thumb.style.opacity = 0.5; //(pct <= 0 || pct >= 1) ? 0 : 1;
-                        }
-                }
-                
-                var _setVolume = this.setVolume = function(pct) {
+                                thumb.style.left = width;
+                        }
+                }
+                
+                function _setVolume (pct) {
                         _sliderPercent('volume', pct, true);
                 }
 
-                var _setProgress = this.setProgress = function(pct) {
+                function _setProgress(pct) {
                         _sliderPercent('time', pct);
                 }
@@ -1105 +1515 @@
                         'user-drag': JW_CSS_NONE
                 });
-            _style(CB_CLASS+' .group', {
+            _style(CB_CLASS+' .jwgroup', {
                 display: JW_CSS_INLINE
             });
-            _style(CB_CLASS+' span, '+CB_CLASS+' .group button,'+CB_CLASS+' .left', {
+            _style(CB_CLASS+' span, '+CB_CLASS+' .jwgroup button,'+CB_CLASS+' .jwleft', {
                 position: JW_CSS_RELATIVE,
                         'float': JW_CSS_LEFT
             });
-                _style(CB_CLASS+' .right', {
-                        position: JW_CSS_RELATIVE,
-                        'float': JW_CSS_RIGHT
+                _style(CB_CLASS+' .jwright', {
+                        position: JW_CSS_ABSOLUTE
                 });
-            _style(CB_CLASS+' .center', {
-                position: JW_CSS_ABSOLUTE,
-                        'float': JW_CSS_LEFT
+            _style(CB_CLASS+' .jwcenter', {
+                position: JW_CSS_ABSOLUTE
             });
             _style(CB_CLASS+' button', {
@@ -1125 +1533 @@
                 border: JW_CSS_NONE,
                 cursor: 'pointer',
-                '-webkit-transition': 'background .5s',
-                '-moz-transition': 'background .5s',
-                '-o-transition': 'background 1s'
+                '-webkit-transition': 'background-image .25s',
+                '-moz-transition': 'background-image .25s',
+                '-o-transition': 'background-image .25s'
             });
-            _style(CB_CLASS+' button:hover', {
-                '-webkit-transition': 'background 0s',
-                '-moz-transition': 'background 0s',
-                '-o-transition': 'background 0s'
-            });
-            _style(CB_CLASS+' .capRight', { 
+            _style(CB_CLASS+' .jwcapRight', { 
                         right: 0,
                         position: JW_CSS_ABSOLUTE
                 });
-            _style(CB_CLASS+' .time,' + CB_CLASS + ' .group span.stretch', {
+            _style(CB_CLASS+' .jwtime,' + CB_CLASS + ' .jwgroup span.jwstretch', {
                 position: JW_CSS_ABSOLUTE,
                 height: JW_CSS_100PCT,
@@ -1144 +1547 @@
                 left: 0
             });
-            _style(CB_CLASS+' .rail,' + CB_CLASS + ' .thumb', {
+            _style(CB_CLASS+' .jwrail,' + CB_CLASS + ' .jwthumb', {
                 position: JW_CSS_ABSOLUTE,
                 height: JW_CSS_100PCT,
                 cursor: 'pointer'
             });
-            _style(CB_CLASS + ' .timeSliderThumb', {
-                '-webkit-transition': 'left .5s linear 0s, opacity .5s ease .5s',
-                '-moz-transition': 'left .5s linear 0s, opacity .5s ease .5s'
-                //-o-transition: 'left .5s linear 0s, opacity .5s ease .5s' -- this produces console errors in Opera
-            });             
-            _style(CB_CLASS + ' .timeSliderProgress,' + CB_CLASS + ' .timeSliderBuffer', {
-                '-webkit-transition': 'width .5s linear',
-                '-moz-transition': 'width .5s linear',
-                '-o-transition': 'width .5s linear'
+            _style(CB_CLASS + ' .jwtime .jwsmooth span', {
+                '-webkit-transition': JW_CSS_SMOOTH_EASE,
+                '-moz-transition': JW_CSS_SMOOTH_EASE,
+                '-o-transition': JW_CSS_SMOOTH_EASE
             });
-            _style(CB_CLASS + ' .volume', {
-                display: JW_CSS_INLINE_BLOCK
-            });
-            _style(CB_CLASS + ' .divider+.divider', {
+            _style(CB_CLASS + ' .jwdivider+.jwdivider', {
                 display: JW_CSS_NONE
             });
-            _style(CB_CLASS + ' .text', {
+            _style(CB_CLASS + ' .jwtext', {
                         padding: '0 5px',
-                        textAlign: 'center'
+                        'text-align': 'center'
                 });
 
@@ -1173 +1568 @@
         
         _generalStyles();
+        
 })(jwplayer.html5);/**
  * jwplayer.html5 API
@@ -1180 +1576 @@
  */
 (function(html5) {
+        var _utils = jwplayer.utils;
+        
         html5.controller = function(model, view) {
-                var _model, 
+                var _model = model, 
                         _view = view,
-                        _video, _controlbar;
-                
+                        _video = model.video,
+                        _debug = 'console',
+                        _eventDispatcher = new jwplayer.events.eventdispatcher(_model.id, _debug);
+                
+                _utils.extend(this, _eventDispatcher);
+
                 function _init() {
-                        _model = model;
-                        _view = view;
-                        _video = model.video;
-                        _controlbar = view.controlbar;
+                        _model.addGlobalListener(_forward);
+                }
+                
+                function _forward(evt) {
+                        _eventDispatcher.sendEvent(evt.type, evt);
+                }
+
+                var file;
+                
+                this.load = function(item) {
+                        if (_video.getTag().canPlayType("video/mp4")) {
+                                file = "http://playertest.longtailvideo.com/bunny.mp4";         
+                        } else if (_video.getTag().canPlayType("video/webm")) {
+                                file = "http://playertest.longtailvideo.com/bunny.webm";                
+                        } else {
+                                file = "http://playertest.longtailvideo.com/bunny.ogv";         
+                        }
                 }
                 
                 this.play = function() {
-                        if (_video.getTag().canPlayType("video/mp4")) {
-                                _video.load("http://content.bitsontherun.com/videos/nPripu9l-1ahmry41.mp4");            
-                        } else {
-                                _video.load("http://content.bitsontherun.com/videos/nPripu9l-1Lq5Mnwq.webm");           
+                        if (_model.state == jwplayer.events.state.IDLE) {
+                                _video.load(file);
                         }
                         _video.play();
@@ -1206 +1619 @@
 
                 this.pause = function() {
-                        _video.pause();
-                }
+                        if (_model.state == jwplayer.events.state.PLAYING || _model.state == jwplayer.events.state.BUFFERING) {
+                                _video.pause();
+                        }
+                }
+
+                this.seek = function(pos) {
+                        _video.seek(pos);
+                }
+                
+                this.volume = function(vol) {
+                        _video.volume(vol);
+                }
+                
+                this.mute = function(state) {
+                        if (!_utils.exists(state)) state = !_model.mute;
+                        _video.mute(state);
+                }
+
+                this.prev = function() {
+                }
+
+                this.next = function() {
+                }
+                
+                this.item = function(item) {}
+                
+                this.fullscreen = function(state) {}
 
                 _init();
@@ -1251 +1689 @@
                 function _init() {
                         _model = {
+                                id: "player",
                                 video: new html5.video(document.createElement("video")),
-                                settings: config
+                                settings: config,
+                                volume: 0,
+                                state: jwplayer.events.state.IDLE,
+                                mute: false
                         };
-                
-                        _api.id = "player";
+                        
+                        jwplayer.utils.extend(_model, new jwplayer.events.eventdispatcher());
+                        _model.video.addGlobalListener(function(evt) {
+                                switch (evt.type) {
+                                case jwplayer.events.JWPLAYER_MEDIA_MUTE:
+                                        if (_model.mute == evt.mute) return;
+                                        _model.mute = evt.mute;
+                                        break;
+                                case jwplayer.events.JWPLAYER_MEDIA_VOLUME:
+                                        if (_model.volume == evt.volume) return;
+                                        _model.volume = evt.volume;
+                                        break;
+                                case jwplayer.events.JWPLAYER_PLAYER_STATE:
+                                        if (_model.state == evt.newstate) return;
+                                        _model.state = evt.newstate;
+                                }
+                                _model.sendEvent(evt.type, evt);
+                        });
+                
+                        _api.id = _model.id;
                         _api.settings = _model.settings;
-
-                        _view = {
-                                container: document.getElementById(_api.id),
-                                controlbar: new html5.controlbar(_api, _model.settings)
-                        };
+                        
+                        _view = {};
                         
                         _controller = new html5.controller(_model, _view);
+                        _api.addEventListener = _controller.addEventListener;
+                        _api.removeEventListener = _controller.removeEventListener;
+                        
+                        _view.container = document.getElementById(_api.id),
+                        _view.controlbar = new html5.controlbar(_api, _model.settings)
+
                 
                         jwplayer.utils.appendStylesheet("#"+_api.id+" video", {
@@ -1269 +1732 @@
                                 height: "100%",
                                 background: "#000",
-                                display: "none"
+                                opacity: 0,
+                                '-webkit-transition': 'opacity .15s ease'
                         });
                         
@@ -1275 +1739 @@
                         _view.container.appendChild(_view.controlbar.getDisplayElement());
                         
+                        _controller.load();
                 }
                 
@@ -1280 +1745 @@
                 this.jwPause = function(){ _controller.pause() };
                 this.jwStop = function(){ _controller.stop() };
+                this.jwSeek = function(pos){ _controller.seek(pos) };
+                this.jwSetVolume = function(vol){ _controller.volume(vol) };
+                this.jwSetMute = function(state){ _controller.mute(state) };
+                this.jwLoad = function(item) { _controller.load(item); }
+                this.jwPlaylistNext = function() { _controller.next(); }
+                this.jwPlaylistPrev = function() { _controller.prev(); }
+                this.jwPlaylistItem = function(item) { _controller.item(item); }
+                this.jwFullscreen = function(state) { _controller.fullscreen(state); }
+                
+                this.jwGetState = function(){ return _model.state };
+                this.jwGetVolume = function(){ return _model.volume };
+                this.jwGetMute = function(){ return _model.mute };
+                this.jwGetFullscreen = function(){ return false };
+
+
+                
                 
                 _init();
@@ -1541 +2022 @@
  */
 (function(jwplayerhtml5) {
-        
-  /** HTML5 video class * */
-  jwplayerhtml5.video = function(videotag) {
-          
-          var _mediaEvents = {
-                  "abort": _videoEventHandler,
-                  "canplay": _canPlayHandler,
-                  "canplaythrough": _videoEventHandler,
-                  "durationchange": _videoEventHandler,
-                  "emptied": _videoEventHandler,
-                  "ended": _videoEventHandler,
-                  "error": _errorHandler,
-                  "loadeddata": _videoEventHandler,
-                  "loadedmetadata": _videoEventHandler,
-                  "loadstart": _videoEventHandler,
-                  "pause": _videoEventHandler,
-                  "play": _videoEventHandler,
-                  "playing": _videoEventHandler,
-                  "progress": _videoEventHandler,
-                  "ratechange": _videoEventHandler,
-                  "readystatechange": _videoEventHandler,
-                  "seeked": _videoEventHandler,
-                  "seeking": _videoEventHandler,
-                  "stalled": _videoEventHandler,
-                  "suspend": _videoEventHandler,
-                  "timeupdate": _videoEventHandler,
-                  "volumechange": _videoEventHandler,
-                  "waiting": _videoEventHandler
-          };
-          
-          // Reference to the video tag
-          var _video;
-          // Whether seeking is ready yet
-          var _canSeek;
-          // If we should seek on canplay
-          var _delayedSeek;
-          
-          // Constructor
-          function _init(videotag) {
-                _video = videotag;
-                _setupListeners();
-          }
-          
-          function _setupListeners() {
-                  for (var evt in _mediaEvents) {
-                          _video.addEventListener(evt, _mediaEvents[evt]);
-                  }
-          }
-          
-          function _videoEventHandler(evt) {
-                  console.log("%s %o (%s,%s)", evt.type, evt, _bufferedStart(), _bufferedEnd());
-          }
-
-          function _canPlayHandler(evt) {
-                  _canSeek = true;
-                  _videoEventHandler(evt);
-                  if (_delayedSeek > 0) {
-                          _seek(_delayedSeek);
-                  }
-          }
-          
-          function _errorHandler(evt) {
-                  console.log("Error: %o", _video.error);
-                  _videoEventHandler(evt);
-          }
-
-          function _bufferedStart() {
-                 if (_video.buffered.length > 0)
-                         return _video.buffered.start(0);
-                 else
-                         return 0;
-          }
-          
-          function _bufferedEnd() {
-                  if (_video.buffered.length > 0)
-                         return Math.ceil(_video.buffered.end(_video.buffered.length-1));
-                  else
-                         return 0;
-          }
-
-          var _file;
-          
-          this.load = function(videoURL) {
-                  _canSeek = false;
-                  _delayedSeek = 0;
-                  _file = videoURL;
-                  _video.src = _file;
-                  _video.load();
-                  //_video.pause();
-          }
-          
-          this.stop = function() {
-                  //_video.src = "";
-                  _video.removeAttribute("src");
-                  _video.load();
-                  _video.style.display = "none";
-          }
-          
-          this.play = function() {
-                  _video.style.display = "block";
-                  _video.play();
-          }
-
-          this.pause = function() {
-                  _video.pause();
-          }
-
-          var _seek = this.seek = function(pos) {
-                  if (_canSeek) {
-                          _delayedSeek = 0;
-                          _video.play();
-                          _video.currentTime = pos;
-                  } else {
-                          _delayedSeek = pos;
-                  }
-          }
-
-          // Provide access to video tag
-          // TODO: remove
-          this.getTag = function() {
-                  return videotag;
-          }
-          
-          // Call constructor
-          _init(videotag);
-          
-  }
-  
+
+        var _utils = jwplayer.utils;
+
+        /** HTML5 video class * */
+        jwplayerhtml5.video = function(videotag) {
+
+                var _mediaEvents = {
+                        "abort" : _generalHandler,
+                        "canplay" : _canPlayHandler,
+                        "canplaythrough" : _generalHandler,
+                        "durationchange" : _durationUpdateHandler,
+                        "emptied" : _generalHandler,
+                        "ended" : _generalHandler,
+                        "error" : _errorHandler,
+                        "loadeddata" : _generalHandler,
+                        "loadedmetadata" : _generalHandler,
+                        "loadstart" : _generalHandler,
+                        "pause" : _playHandler,
+                        "play" : _playHandler,
+                        "playing" : _generalHandler,
+                        "progress" : _generalHandler,
+                        "ratechange" : _generalHandler,
+                        "readystatechange" : _generalHandler,
+                        "seeked" : _generalHandler,
+                        "seeking" : _generalHandler,
+                        "stalled" : _generalHandler,
+                        "suspend" : _generalHandler,
+                        "timeupdate" : _timeUpdateHandler,
+                        "volumechange" : _volumeHandler,
+                        "waiting" : _generalHandler
+                },
+
+                // Reference to the video tag
+                _video,
+                // Whether seeking is ready yet
+                _canSeek,
+                // If we should seek on canplay
+                _delayedSeek,
+                // Current media state
+                _state = jwplayer.events.state.IDLE,
+                // Save the volume state before muting
+                _lastVolume = 0,
+                // Using setInterval to check buffered ranges
+                _bufferInterval = -1,
+                // Last sent buffer amount
+                _bufferPercent = -1,
+                // Event dispatcher
+                _eventDispatcher = new jwplayer.events.eventdispatcher();
+
+                _utils.extend(this, _eventDispatcher);
+
+                // Constructor
+                function _init(videotag) {
+                        _video = videotag;
+                        _setupListeners();
+                }
+
+                function _setupListeners() {
+                        for (var evt in _mediaEvents) {
+                                _video.addEventListener(evt, _mediaEvents[evt], false);
+                        }
+                }
+
+                function _sendEvent(type, data) {
+                        _eventDispatcher.sendEvent(type, data);
+                }
+
+                
+                function _generalHandler(evt) {
+                        //console.log("%s %o (%s,%s)", evt.type, evt);
+                }
+
+                function _durationUpdateHandler(evt) {
+                        _duration = _video.duration;
+                        _timeUpdateHandler();
+                }
+
+                function _timeUpdateHandler(evt) {
+                        if (_state == jwplayer.events.state.PLAYING) {
+                                _sendEvent(jwplayer.events.JWPLAYER_MEDIA_TIME, {
+                                        position : _video.currentTime,
+                                        duration : _duration
+                                });
+                                if (_video.currentTime >= _duration) {
+                                        _complete();
+                                }
+                        }
+                }
+
+                function _canPlayHandler(evt) {
+                        _canSeek = true;
+                        _generalHandler(evt);
+                        if (_delayedSeek > 0) {
+                                _seek(_delayedSeek);
+                        }
+                }
+
+                function _playHandler(evt) {
+                        if (_video.paused) {
+                                _setState(jwplayer.events.state.PAUSED);
+                        } else {
+                                _setState(jwplayer.events.state.PLAYING);
+                        }
+                }
+
+                function _errorHandler(evt) {
+                        console.log("Error: %o", _video.error);
+                        _generalHandler(evt);
+                }
+
+                this.load = function(videoURL) {
+                        _canSeek = false;
+                        _delayedSeek = 0;
+                        _duration = 0;
+                        _video.src = videoURL;
+                        _video.load();
+                        
+                        _bufferInterval = setInterval(_sendBufferUpdate, 100);
+                        // _video.pause();
+                }
+
+                var _stop = this.stop = function() {
+                        // _video.src = "";
+                        _video.removeAttribute("src");
+                        _video.load();
+                        _video.style.opacity = 0;
+                        clearInterval(_bufferInterval);
+                        _setState(jwplayer.events.state.IDLE);
+                }
+
+                this.play = function() {
+                        _video.style.opacity = 1;
+                        _video.play();
+                }
+
+                this.pause = function() {
+                        _video.pause();
+                }
+
+                var _seek = this.seek = function(pos) {
+                        if (_canSeek) {
+                                _delayedSeek = 0;
+                                // _video.play();
+                                _video.currentTime = pos;
+                        } else {
+                                _delayedSeek = pos;
+                        }
+                }
+
+                var _volume = this.volume = function(vol) {
+                        if (_video.muted) _video.muted = false;
+                        _video.volume = vol / 100;
+
+                }
+                
+                function _volumeHandler(evt) {
+                        _sendEvent(jwplayer.events.JWPLAYER_MEDIA_VOLUME, {
+                                volume: Math.round(_video.volume * 100)
+                        });
+                        _sendEvent(jwplayer.events.JWPLAYER_MEDIA_MUTE, {
+                                mute: _video.muted
+                        });
+                }
+                
+                this.mute = function(state) {
+                        if (!_utils.exists(state)) state = !_video.mute;
+                        if (state) {
+                                _lastVolume = _video.volume * 100;
+                                _volume(0);
+                                _video.muted = true;
+                        } else {
+                                _volume(_lastVolume);
+                        }
+                }
+
+                /** Set the current player state * */
+                function _setState(newstate) {
+                        // Handles a FF 3.5 issue
+                        if (newstate == jwplayer.events.state.PAUSED && _state == jwplayer.events.state.IDLE) {
+                                return;
+                        }
+
+                        if (_state != newstate) {
+                                var oldstate = _state;
+                                _state = newstate;
+                                _sendEvent(jwplayer.events.JWPLAYER_PLAYER_STATE, {
+                                        oldstate : oldstate,
+                                        newstate : newstate
+                                });
+                        }
+                }
+                
+                function _sendBufferUpdate() {
+                        var newBuffer = _getBuffer();
+                        if (newBuffer != _bufferPercent) {
+                                _bufferPercent = newBuffer;
+                                _sendEvent(jwplayer.events.JWPLAYER_MEDIA_BUFFER, {
+                                        bufferPercent: Math.round(_bufferPercent * 100)
+                                });
+                        }
+                        if (newBuffer >= 1) {
+                                clearInterval(_bufferInterval);
+                        }
+                }
+                
+                function _getBuffer() {
+                        if (_video.buffered.length == 0 || _video.duration == 0)
+                                return 0;
+                        else
+                                return _video.buffered.end(_video.buffered.length-1) / _video.duration;
+                }
+                
+
+                function _complete() {
+                        _stop();
+                        _sendEvent(jwplayer.events.JWPLAYER_MEDIA_COMPLETE);
+                }
+                
+                // Provide access to video tag
+                // TODO: remove
+                this.getTag = function() {
+                        return videotag;
+                }
+
+                // Call constructor
+                _init(videotag);
+
+        }
+
 })(jwplayer.html5);/**
  * jwplayer.html5 namespace

branches/jw6/build/build.xml

@@ -10 +10 @@
                         <fileset dir="${basedir}/src/js/utils" includes="jwplayer.utils.js" excludes="" />
                         <fileset dir="${basedir}/src/js/utils" includes="jwplayer.utils.*.js" excludes="" />
+                        <fileset dir="${basedir}/src/js/events" includes="jwplayer.events.js" />
+                        <fileset dir="${basedir}/src/js/events" includes="jwplayer.events.*.js" excludes="jwplayer.events.js" />
                         <fileset dir="${basedir}/src/js/html5" includes="jwplayer.html5.js" />
                         <fileset dir="${basedir}/src/js/html5" includes="jwplayer.html5*.js" excludes="jwplayer.html5.js" />

branches/jw6/jwplayer.min.js

@@ -1 @@
-if(typeof jwplayer=="undefined"){jwplayer=function(a){if(jwplayer.api){return jwplayer.api.selectPlayer(a)}};var $jw=jwplayer;jwplayer.version="6.0";jwplayer.vid=document.createElement("video");jwplayer.audio=document.createElement("audio");jwplayer.source=document.createElement("source");(function(c){var b=c.utils=function(){};b.exists=function(h){switch(typeof(h)){case"string":return(h.length>0);break;case"object":return(h!==null);case"undefined":return false}return true};var e;var d={};b.css=function(h,k){if(b.exists(h)){for(var i in k){try{if(typeof k[i]==="undefined"){continue}else{if(typeof k[i]=="number"&&!(i=="zIndex"||i=="opacity")){if(isNaN(k[i])){continue}if(i.match(/color/i)){k[i]="#"+b.strings.pad(k[i].toString(16),6)}else{k[i]=Math.ceil(k[i])+"px"}}}if(k[i]){h.style[i]=k[i]}}catch(j){}}}};b.appendStylesheet=function(h,j){if(!e){e=document.createElement("style");e.type="text/css";document.getElementsByTagName("head")[0].appendChild(e)}if(!d[h]){d[h]={}}for(var i in j){var k=g(i,j[i]);if(b.exists(d[h][i])&&!b.exists(k)){delete d[h][i]}else{d[h][i]=k}}f()};function g(h,i){if(typeof i==="undefined"){return undefined}if(typeof i=="number"){if(isNaN(i)){return undefined}switch(h){case"z-index":case"opacity":return i;break;default:if(h.match(/color/i)){return"#"+b.strings.pad(i.toString(16),6)}else{return Math.ceil(i)+"px"}break}}else{return i}}function f(){if(e){var h="";for(var k in d){var j=d[k];h+=k+"{\n";for(var i in j){h+="  "+i+": "+j[i]+";\n"}h+="}\n"}e.innerHTML=h}}b.clearCss=function(h){for(var i in d){if(i.indexOf(h)>=0){delete d[i]}}f()};b.getAbsolutePath=function(o,n){if(!b.exists(n)){n=document.location.href}if(!b.exists(o)){return undefined}if(a(o)){return o}var p=n.substring(0,n.indexOf("://")+3);var m=n.substring(p.length,n.indexOf("/",p.length+1));var j;if(o.indexOf("/")===0){j=o.split("/")}else{var k=n.split("?")[0];k=k.substring(p.length+m.length+1,k.lastIndexOf("/"));j=k.split("/").concat(o.split("/"))}var h=[];for(var l=0;l<j.length;l++){if(!j[l]||!b.exists(j[l])||j[l]=="."){continue}else{if(j[l]==".."){h.pop()}else{h.push(j[l])}}}return p+m+"/"+h.join("/")};function a(i){if(!b.exists(i)){return}var j=i.indexOf("://");var h=i.indexOf("?");return(j>0&&(h<0||(h>j)))}b.extend=function(){var h=b.extend["arguments"];if(h.length>1){for(var k=1;k<h.length;k++){for(var j in h[k]){h[0][j]=h[k][j]}}return h[0]}return null};b.parseDimension=function(h){if(typeof h=="string"){if(h===""){return 0}else{if(h.lastIndexOf("%")>-1){return h}else{return parseInt(h.replace("px",""),10)}}}return h}})(jwplayer);(function(a){a.ajax=function(f,e,b){var d;if(window.XMLHttpRequest){d=new XMLHttpRequest()}else{d=new ActiveXObject("Microsoft.XMLHTTP")}d.onreadystatechange=function(){if(d.readyState===4){if(d.status===200){if(e){if(!jwplayer.utils.exists(d.responseXML)){try{if(window.DOMParser){var g=(new DOMParser()).parseFromString(d.responseText,"text/xml");if(g){d=jwplayer.utils.extend({},d,{responseXML:g})}}else{g=new ActiveXObject("Microsoft.XMLDOM");g.async="false";g.loadXML(d.responseText);d=jwplayer.utils.extend({},d,{responseXML:g})}}catch(h){if(b){b(f)}}}e(d)}}else{if(b){b(f)}}}};try{d.open("GET",f,true);d.send(null)}catch(c){if(b){b(f)}}return d}})(jwplayer.utils);(function(a){jwplayer.utils.strings=function(){};jwplayer.utils.strings.trim=function(b){return b.replace(/^\s*/,"").replace(/\s*$/,"")};jwplayer.utils.strings.pad=function(c,d,b){if(!b){b="0"}while(c.length<d){c=b+c}return c};jwplayer.utils.strings.serialize=function(b){if(b==null){return null}else{if(b=="true"){return true}else{if(b=="false"){return false}else{if(isNaN(Number(b))||b.length>5||b.length==0){return b}else{return Number(b)}}}}};jwplayer.utils.strings.seconds=function(d){d=d.replace(",",".");var b=d.split(":");var c=0;if(d.substr(-1)=="s"){c=Number(d.substr(0,d.length-1))}else{if(d.substr(-1)=="m"){c=Number(d.substr(0,d.length-1))*60}else{if(d.substr(-1)=="h"){c=Number(d.substr(0,d.length-1))*3600}else{if(b.length>1){c=Number(b[b.length-1]);c+=Number(b[b.length-2])*60;if(b.length==3){c+=Number(b[b.length-3])*3600}}else{c=Number(d)}}}}return c};jwplayer.utils.strings.xmlAttribute=function(b,c){for(var d=0;d<b.attributes.length;d++){if(b.attributes[d].name&&b.attributes[d].name.toLowerCase()==c.toLowerCase()){return b.attributes[d].value.toString()}}return""};jwplayer.utils.strings.jsonToString=function(f){var h=h||{};if(h&&h.stringify){return h.stringify(f)}var c=typeof(f);if(c!="object"||f===null){if(c=="string"){f='"'+f.replace(/"/g,'\\"')+'"'}else{return String(f)}}else{var g=[],b=(f&&f.constructor==Array);for(var d in f){var e=f[d];switch(typeof(e)){case"string":e='"'+e.replace(/"/g,'\\"')+'"';break;case"object":if(jwplayer.utils.exists(e)){e=jwplayer.utils.strings.jsonToString(e)}break}if(b){if(typeof(e)!="function"){g.push(String(e))}}else{if(typeof(e)!="function"){g.push('"'+d+'":'+String(e))}}}if(b){return"["+String(g)+"]"}else{return"{"+String(g)+"}"}}}})(jwplayer.utils);(function(b){var d=new RegExp(/^(#|0x)[0-9a-fA-F]{3,6}/);jwplayer.utils.typechecker=function(g,f){f=!jwplayer.utils.exists(f)?c(g):f;return e(g,f)};function c(f){var g=["true","false","t","f"];if(g.toString().indexOf(f.toLowerCase().replace(" ",""))>=0){return"boolean"}else{if(d.test(f)){return"color"}else{if(!isNaN(parseInt(f,10))&&parseInt(f,10).toString().length==f.length){return"integer"}else{if(!isNaN(parseFloat(f))&&parseFloat(f).toString().length==f.length){return"float"}}}}return"string"}function e(g,f){if(!jwplayer.utils.exists(f)){return g}switch(f){case"color":if(g.length>0){return a(g)}return null;case"integer":return parseInt(g,10);case"float":return parseFloat(g);case"boolean":if(g.toLowerCase()=="true"){return true}else{if(g=="1"){return true}}return false}return g}function a(f){switch(f.toLowerCase()){case"blue":return parseInt("0000FF",16);case"green":return parseInt("00FF00",16);case"red":return parseInt("FF0000",16);case"cyan":return parseInt("00FFFF",16);case"magenta":return parseInt("FF00FF",16);case"yellow":return parseInt("FFFF00",16);case"black":return parseInt("000000",16);case"white":return parseInt("FFFFFF",16);default:f=f.replace(/(#|0x)?([0-9A-F]{3,6})$/gi,"$2");if(f.length==3){f=f.charAt(0)+f.charAt(0)+f.charAt(1)+f.charAt(1)+f.charAt(2)+f.charAt(2)}return parseInt(f,16)}return parseInt("000000",16)}})(jwplayer.utils);(function(a){a.html5={}})(jwplayer);(function(h){var i=jwplayer.utils,g=i.appendStylesheet,b="button",m="text",d="divider",n="slider",e="relative",f="absolute",a="none",l="block",o="inline",k="inline-block",c="left",r="right",j="100%",q=".jwcontrolbar";h.controlbar=function(w,V){var u;var v={backgroundcolor:"",margin:10,font:"Arial,sans-serif",fontsize:10,fontcolor:parseInt("000000",16),fontstyle:"normal",fontweight:"bold",buttoncolor:parseInt("ffffff",16),position:"OVER",idlehide:false,hideplaylistcontrols:false,forcenextprev:false,layout:{left:{position:"left",elements:[{name:"play",type:b},{name:"divider",type:d},{name:"prev",type:b},{name:"divider",type:d},{name:"next",type:b},{name:"divider",type:d},{name:"elapsed",type:m}]},center:{position:"center",elements:[{name:"time",type:n}]},right:{position:"right",elements:[{name:"duration",type:m},{name:"blank",type:b},{name:"divider",type:d},{name:"mute",type:b},{name:"volume",type:n},{name:"divider",type:d},{name:"fullscreen",type:b}]}}};var D,ad,R;var ab,U;var G={play:"pause",mute:"unmute",fullscreen:"normalscreen"};var ac={play:false,mute:false,fullscreen:false};var t={play:L,mute:y,fullscreen:I};function af(){R={};u=w;V=i.extend({},V);U=u.id+"_controlbar";ab=z();ab.id=U;ab.className="jwcontrolbar";(new h.skinloader(V.skin,function(ai){u.skin=ai;D=i.extend({},v,u.skin.controlbar.settings,u.settings.controlbar);ad=(ai.controlbar.layout.left||ai.controlbar.layout.right||ai.controlbar.layout.center)?ai.controlbar.layout:v.layout;F();X()},function(ai){console.log(ai)}))}function F(){i.clearCss("#"+U);g("#"+U,{height:K("background").height,bottom:D.position=="OVER"?D.margin:0,left:D.position=="OVER"?D.margin:0,right:D.position=="OVER"?D.margin:0});g(W(".text"),{font:D.fontsize+"px/"+K("background").height+"px "+D.font,color:D.fontcolor,"font-weight":D.fontweight,"font-style":D.fontstyle,"text-align":"center",padding:"0 5px"})}function W(ai){return"#"+U+" "+ai}function z(){return document.createElement("span")}function X(){var ak=S("capLeft");var aj=S("capRight");var ai=S("background",{position:f,left:K("capLeft").width,right:K("capRight").width,backgroundRepeat:"repeat-x"},true);ab.style.opacity=0;if(ai){ab.appendChild(ai)}if(ak){ab.appendChild(ak)}Y();if(aj){ab.appendChild(aj)}setTimeout(function(){O();h.utils.animations.fadeIn(ab,250)},1000)}function A(ai){switch(ai.type){case d:return N(ai);break;case m:return T(ai.name);break;case b:if(ai.name!="blank"){return M(ai.name)}break;case n:return B(ai.name);break}}function S(ak,an,aj,ap){var am=z();am.className=ak;var ai=ap?"":"center";var al=K(ak);am.innerHTML="&nbsp;";if(!al||al.src==""){return}var ao;if(aj){ao={background:"url('"+al.src+"') "+ai+" repeat-x"}}else{ao={background:"url('"+al.src+"') "+ai+" no-repeat",width:al.width}}g(W("."+ak),i.extend(ao,an));R[ak]=am;return am}function M(ak){var al=document.createElement("button");al.className=ak;al.addEventListener("click",(function(an){return function(){P(an)}})(ak));var am=K(ak+"Button");var aj=K(ak+"ButtonOver");al.innerHTML="&nbsp;";if(!K(ak+"Button").src){return al}E(W("."+ak),am,aj);var ai=G[ak];if(ai){E(W("."+ak+".toggle"),K(ai+"Button"),K(ai+"ButtonOver"))}R[ak]=al;return al}function E(ai,aj,ak){if(!aj.src){return}g(ai,{width:aj.width,background:"url("+aj.src+") center no-repeat"});if(ak.src){g(ai+":hover",{background:"url("+ak.src+") center no-repeat"})}}function P(ai){if(t[ai]){t[ai]()}}function L(){if(ac.play){u.jwPause()}else{u.jwPlay()}C("play")}function y(){C("mute")}function I(){C("fullscreen")}function C(ai){R[ai].className=ai+(ac[ai]?"":" toggle");ac[ai]^=true}function x(ai){return U+"_"+ai}function T(ai,am){var ak=z();ak.id=x(ai);ak.className="text "+ai;var aj={};var al=K(ai+"Background");if(al.src){aj.background="url("+al.src+") no-repeat center";aj["background-size"]="100% "+K("background").height+"px"}g(W("."+ai),aj);ak.innerHTML="00:00";R[ai]=ak;return ak}function N(aj){if(aj.width){var ai=z();ai.className="blankDivider";g(ai,{width:parseInt(aj.width)});return ai}else{if(aj.element){return S(aj.element)}else{return S(aj.name)}}}function B(aj){var al=z();al.className="slider "+aj;var ak=z();ak.className="rail";var an=["Rail","Buffer","Progress"];for(var ao=0;ao<an.length;ao++){var ap=S(aj+"Slider"+an[ao],null,true,(aj=="volume"));if(ap){ap.className+=" stretch";ak.appendChild(ap)}}var ai=S(aj+"SliderThumb");if(ai){ai.className+=" thumb";ak.appendChild(ai)}var am=S(aj+"SliderCapLeft");var aq=S(aj+"SliderCapRight");if(aq){aq.className+=" capRight"}if(am){al.appendChild(am)}al.appendChild(ak);if(am){al.appendChild(aq)}g(W("."+aj+" .rail"),{left:K(aj+"SliderCapLeft").width,right:K(aj+"SliderCapRight").width,});if(aj=="time"){ag(al);aa(0);ae(0)}else{if(aj=="volume"){Z(al)}}R[aj]=al;return al}function ag(ai){if(R.timeSliderThumb){g(W(".timeSliderThumb"),{"margin-left":(K("timeSliderThumb").width/-2)})}ae(0);aa(0)}function Z(ak){var aj=K("volumeSliderCapLeft").width,ai=K("volumeSliderCapRight").width,al=K("volumeSliderRail").width;g(W(".volume"),{width:(aj+al+ai)})}var H={};function Y(){ah("left");ah("center");ah("right");ab.appendChild(H.left);ab.appendChild(H.center);ab.appendChild(H.right);g(W(".right"),{right:K("capRight").width})}function ah(aj){var ai=z();ai.className="group "+aj;H[aj]=ai;if(ad[aj]){J(ad[aj],H[aj])}}function J(al,ai){if(al&&al.elements.length>0){for(var ak=0;ak<al.elements.length;ak++){var aj=A(al.elements[ak]);if(aj){ai.appendChild(aj)}}}}var O=this.resize=function(aj,ai){g(W(".group.center"),{left:i.parseDimension(H.left.offsetWidth)+K("capLeft").width,right:i.parseDimension(H.right.offsetWidth)+K("capRight").width})};this.getDisplayElement=function(){return ab};var ae=this.setBuffer=function(ai){ai=Math.min(Math.max(0,ai),1);R.timeSliderBuffer.style.width=100*ai+"%"};function Q(ak,al,am){al=Math.min(Math.max(0,al),1);var aj=R[ak+"SliderProgress"];var ai=R[ak+"SliderThumb"];if(aj){aj.style.width=100*al+"%"}if(ai){ai.style.left=al*i.parseDimension(R[ak+"SliderRail"].clientWidth)+"px"}}var s=this.setVolume=function(ai){Q("volume",ai,true)};var aa=this.setProgress=function(ai){Q("time",ai)};this.getSkin=function(){return u.skin};function K(ai){if(u.skin.controlbar.elements[ai]){return u.skin.controlbar.elements[ai]}else{return{width:0,height:0,src:"",image:undefined,ready:false}}}af()};function p(){g(q,{position:f,overflow:"hidden"});g(q+" span",{height:j,"-webkit-user-select":a,"-webkit-user-drag":a,"user-select":a,"user-drag":a});g(q+" .group",{display:o});g(q+" span, "+q+" .group button,"+q+" .left",{position:e,"float":c});g(q+" .right",{position:e,"float":r});g(q+" .center",{position:f,"float":c});g(q+" button",{display:k,height:j,border:a,cursor:"pointer","-webkit-transition":"background .5s","-moz-transition":"background .5s","-o-transition":"background 1s"});g(q+" button:hover",{"-webkit-transition":"background 0s","-moz-transition":"background 0s","-o-transition":"background 0s"});g(q+" .capRight",{right:0,position:f});g(q+" .time,"+q+" .group span.stretch",{position:f,height:j,width:j,left:0});g(q+" .rail,"+q+" .thumb",{position:f,height:j,cursor:"pointer"});g(q+" .timeSliderThumb",{"-webkit-transition":"left .5s linear 0s, opacity .5s ease .5s","-moz-transition":"left .5s linear 0s, opacity .5s ease .5s"});g(q+" .timeSliderProgress,"+q+" .timeSliderBuffer",{"-webkit-transition":"width .5s linear","-moz-transition":"width .5s linear","-o-transition":"width .5s linear"});g(q+" .volume",{display:k});g(q+" .divider+.divider",{display:a});g(q+" .text",{padding:"0 5px",textAlign:"center"})}p()})(jwplayer.html5);(function(a){a.controller=function(d,c){var g,h=c,b,f;function e(){g=d;h=c;b=d.video;f=c.controlbar}this.play=function(){if(b.getTag().canPlayType("video/mp4")){b.load("http://content.bitsontherun.com/videos/nPripu9l-1ahmry41.mp4")}else{b.load("http://content.bitsontherun.com/videos/nPripu9l-1Lq5Mnwq.webm")}b.play()};this.stop=function(){b.stop()};this.pause=function(){b.pause()};e()}})(jwplayer.html5);(function(a){a.html5.defaultskin=function(){this.text='<?xml version="1.0" ?><skin author="LongTail Video" name="Five" version="1.1"><components><component name="controlbar"><settings><setting name="margin" value="20"/><setting name="fontsize" value="11"/><setting name="fontcolor" value="0x000000"/></settings><layout><group position="left"><button name="play"/><divider name="divider"/><button name="prev"/><divider name="divider"/><button name="next"/><divider name="divider"/><text name="elapsed"/></group><group position="center"><slider name="time"/></group><group position="right"><text name="duration"/><divider name="divider"/><button name="blank"/><divider name="divider"/><button name="mute"/><slider name="volume"/><divider name="divider"/><button name="fullscreen"/></group></layout><elements><element name="background" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAIAAABvFaqvAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAElJREFUOI3t1LERACAMQlFgGvcfxNIhHMK4gsUvUviOmgtNsiAZkBSEKxKEnCYkkQrJn/YwbUNiSDDYRZaQRDaShv+oX9GBZEIuK+8hXVLs+/YAAAAASUVORK5CYII="/><element name="blankButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAYCAYAAAAyJzegAAAAFElEQVQYV2P8//8/AzpgHBUc7oIAGZdH0RjKN8EAAAAASUVORK5CYII="/><element name="capLeft" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAYAAAA7zJfaAAAAQElEQVQIWz3LsRGAMADDQJ0XB5bMINABZ9GENGrszxhjT2WLSqxEJG2JQrTMdV2q5LpOAvyRaVmsi7WdeZ/7+AAaOTq7BVrfOQAAAABJRU5ErkJggg=="/><element name="capRight" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAYAAAA7zJfaAAAAQElEQVQIWz3LsRGAMADDQJ0XB5bMINABZ9GENGrszxhjT2WLSqxEJG2JQrTMdV2q5LpOAvyRaVmsi7WdeZ/7+AAaOTq7BVrfOQAAAABJRU5ErkJggg=="/><element name="divider" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAIAAAC0rgCNAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUCB0FwcENgEAAw7Aq+893g8APUILNOQcbFRktVGqUVFRkWNz3xTa2sUaLNUosKlRUvvf5AdbWOTtzmzyWAAAAAElFTkSuQmCC"/><element name="playButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAANUlEQVR42u2RsQkAAAjD/NTTPaW6dXLrINJA1kBpGPMAjDWmOgp1HFQXx+b1KOefO4oxY57R73YnVYCQUCQAAAAASUVORK5CYII="/><element name="pauseButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAAIUlEQVQ4jWNgGAWjYOiD/0gYG3/U0FFDB4Oho2AUDAYAAEwiL9HrpdMVAAAAAElFTkSuQmCC"/><element name="prevButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAAQklEQVQ4y2NgGAWjYOiD/1AMA/JAfB5NjCJD/YH4PRaLyDa0H4lNNUP/DxlD59PCUBCIp3ZEwYA+NZLUKBgFgwEAAN+HLX9sB8u8AAAAAElFTkSuQmCC"/><element name="nextButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAAQElEQVQ4y2NgGAWjYOiD/0B8Hojl0cT+U2ooCL8HYn9qGwrD/bQw9P+QMXQ+tSMqnpoRBUpS+tRMUqNgFAwGAADxZy1/mHvFnAAAAABJRU5ErkJggg=="/><element name="timeSliderRail" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAOElEQVRIDe3BwQkAIRADwAhhw/nU/kWwUK+KPITMABFh19Y+F0acY8CJvX9wYpXgRElwolSIiMf9ZWEDhtwurFsAAAAASUVORK5CYII="/><element name="timeSliderBuffer" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAN0lEQVRIDe3BwQkAMQwDMBcc55mRe9zi7RR+FCwBEWG39vcfGHFm4MTuhhMlwYlVBSdKhYh43AW/LQMKm1spzwAAAABJRU5ErkJggg=="/><element name="timeSliderProgress" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAIElEQVRIiWNgGAWjYBTQBfynMR61YCRYMApGwSigMQAAiVWPcbq6UkIAAAAASUVORK5CYII="/><element name="timeSliderThumb" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAYCAYAAAA/OUfnAAAAO0lEQVQYlWP4//8/Awwz0JgDBP/BeN6Cxf/hnI2btiI4u/fsQ3AOHjqK4Jw4eQbBOX/hEoKDYjSd/AMA4cS4mfLsorgAAAAASUVORK5CYII="/><element name="muteButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAYCAYAAADKx8xXAAAAJklEQVQ4y2NgGAUjDcwH4v/kaPxPikZkxcNVI9mBQ5XoGAWDFwAAsKAXKQQmfbUAAAAASUVORK5CYII="/><element name="unmuteButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAYCAYAAADKx8xXAAAAMklEQVQ4y2NgGAWDHPyntub5xBr6Hwv/Pzk2/yfVG/8psRFE25Oq8T+tQnsIaB4FVAcAi2YVysVY52AAAAAASUVORK5CYII="/><element name="volumeSliderRail" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYAgMAAACdGdVrAAAACVBMVEUAAACmpqampqbBXAu8AAAAAnRSTlMAgJsrThgAAAArSURBVAhbY2AgErBAyA4I2QEhOyBkB4TsYOhAoaCCUCUwDTDtMMNgRuMHAFB5FoGH5T0UAAAAAElFTkSuQmCC"/><element name="volumeSliderProgress" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYAgMAAACdGdVrAAAACVBMVEUAAAAAAAAAAACDY+nAAAAAAnRSTlMAgJsrThgAAAArSURBVAhbY2AgErBAyA4I2QEhOyBkB4TsYOhAoaCCUCUwDTDtMMNgRuMHAFB5FoGH5T0UAAAAAElFTkSuQmCC"/><element name="volumeSliderCapRight" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAYCAYAAAAyJzegAAAAFElEQVQYV2P8//8/AzpgHBUc7oIAGZdH0RjKN8EAAAAASUVORK5CYII="/><element name="fullscreenButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAQklEQVRIiWNgGAWjYMiD/0iYFDmSLbDHImdPLQtgBpEiR7Zl2NijAA5oEkT/0Whi5UiyAJ8BVMsHNMtoo2AUDAIAAGdcIN3IDNXoAAAAAElFTkSuQmCC"/><element name="normalscreenButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAP0lEQVRIx2NgGAWjYMiD/1RSQ5QB/wmIUWzJfzx8qhj+n4DYCAY0DyJ7PBbYU8sHMEvwiZFtODXUjIJRMJgBACpWIN2ZxdPTAAAAAElFTkSuQmCC"/></elements></component><component name="display"><elements><element name="background" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyAQMAAAAk8RryAAAABlBMVEUAAAAAAAClZ7nPAAAAAnRSTlOZpuml+rYAAAASSURBVBhXY2AYJuA/GBwY6jQAyDyoK8QcL4QAAAAASUVORK5CYII="/><element name="playIcon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAiUlEQVR42u3XSw2AMBREURwgAQlIQAISKgUpSEFKJeCg5b0E0kWBTVcD9ySTsL0Jn9IBAAAA+K2UUrBlW/Rr5ZDoIeeuoFkxJD9ss03aIXXQqB9SttoG7ZA6qNcOKdttiwcJh9RB+iFl4SshkRBuLR72+9cvH0SOKI2HRo7x/Fi1/uoCAAAAwLsD8ki99IlO2dQAAAAASUVORK5CYII="/><element name="muteIcon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAVUlEQVR42u3WMQrAIAxAUW/g/SdvGmvpoOBeSHgPsjj5QTANAACARCJilIhYM0tEvJM+Ik3Id9E957kQIb+F3OdCPC0hPkQriqWx9hp/x/QGAABQyAPLB22VGrpLDgAAAABJRU5ErkJggg=="/><element name="errorIcon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAA/0lEQVR42u2U0QmEMBAF7cASLMESUoIlpARLSCkpwRJSgiWkhOvAXD4WsgRkyaG5DbyB+Yvg8KITAAAAAAAYk+u61mwk15EjPtlEfihmqIiZR1Qx80ghjgdUuiHXGHSVsoag0x6x8DUoyjD5KovmEJ9NTDMRPIT0mtdIUkjlonuNohO+Ha99DTmkuGgKCTcvebAzx82ZoCWC3/3aIMWSRucaxcjORSFY4xpFdjYJGp1rFGcyCYZ/RVh6AUnfcNZ2zih3/mGj1jVCdiNDwyrq1rA/xMdeEXvDVdnYc1vDc3uPkDObXrlaxbNHSOohQhr/WOeLEWfWTgAAAAAAADzNF9sHJ7PJ57MlAAAAAElFTkSuQmCC"/><element name="bufferIcon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAACBklEQVR42u3Zv0sCYRzH8USTzOsHHEWGkC1HgaDgkktGDjUYtDQ01RDSljQ1BLU02+rk1NTm2NLq4Nx/0L/h9fnCd3j4cnZe1/U8xiO8h3uurufF0/3COd/3/0UWYiEWYiEWYiGJQ+J8xuPxKhXjEMZANinjIZhkGuVRNioE4wVURo4JkHm0xKWmhRAc1bh1EyCUw5BcBIjHiApKa4CErko6DEJwuRo6IRKzyJD8FJAyI3Zp2zRImiBcRhlfo5RtlxCcE3CcDNpGrhYIT2IhAJKilO0VRmzJ32fAMTpBTS0QMfGwlcuKMRftE0DJ0wCJdcOsCkBdXP3Mh9CEFUBTPS9mDZJBG6io4aqVzMdCokCw9H3kT6j/C/9iDdSeUMNC7DkyyxAs/Rk6Qss8FPWRZgdVtUH4DjxEn1zxh+/zj1wHlf4MQhNGrwqA6sY40U8JonRJwEQh+AO3AvCG6gHv4U7IY4krxkroWoAOkoQMGfCBrgIm+YBGqPENpIJ66CJg3x66Y0gnSUidAEEnNr9jjLiWMn5DiWP0OC/oAsCgkq43xBdGDMQr7YASP/vEkHvdl1+JOCcEV5sC4hGEOzTlPuKgd0b0xD4JkRcOgnRRTjdErkYhAsQVq6IdUuPJtmk7BCL3t/h88cx91pKQkI/pkDx6pmYTIjEoxiHsN1YWYiEWYiEWknhflZ5IErA5nr8AAAAASUVORK5CYII="/></elements></component><component name="dock"><settings><setting name="fontcolor" value="0xffffff"/></settings><elements><element name="button" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyAQMAAAAk8RryAAAABlBMVEUAAAAAAAClZ7nPAAAAAnRSTlOZpuml+rYAAAASSURBVBhXY2AYJuA/GBwY6jQAyDyoK8QcL4QAAAAASUVORK5CYII="/></elements></component><component name="playlist"><settings><setting name="backgroundcolor" value="0xe8e8e8"/></settings><elements><element name="item" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAIAAAC1nk4lAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHBJREFUaN7t2MENwCAMBEEe9N8wSKYC/D8YV7CyJoRkVtVImxkZPQInMxoP0XiIxkM0HsGbjjSNBx544IEHHnjggUe/6UQeey0PIh7XTftGxKPj4eXCtLsHHh+ZxkO0Iw8PR55Ni8ZD9Hu/EAoP0dc5RRg9qeRjVF8AAAAASUVORK5CYII="/><element name="sliderCapTop" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAHCAYAAADnCQYGAAAAFUlEQVQokWP8//8/A7UB46ihI9hQAKt6FPPXhVGHAAAAAElFTkSuQmCC"/><element name="sliderRail" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAUCAYAAABiS3YzAAAAKElEQVQ4y2P4//8/Az68bNmy/+iYkB6GUUNHDR01dNTQUUNHDaXcUABUDOKhcxnsSwAAAABJRU5ErkJggg=="/><element name="sliderThumb" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAUCAYAAABiS3YzAAAAJUlEQVQ4T2P4//8/Ay4MBP9xYbz6Rg0dNXTU0FFDRw0dNZRyQwHH4NBa7GJsXAAAAABJRU5ErkJggg=="/><element name="sliderCapBottom" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAHCAYAAADnCQYGAAAAFUlEQVQokWP8//8/A7UB46ihI9hQAKt6FPPXhVGHAAAAAElFTkSuQmCC"/></elements></component></components></skin>';this.xml=null;if(window.DOMParser){parser=new DOMParser();this.xml=parser.parseFromString(this.text,"text/xml")}else{this.xml=new ActiveXObject("Microsoft.XMLDOM");this.xml.async="false";this.xml.loadXML(this.text)}return this}})(jwplayer);(function(a){a.player=function(b){var f,g,e,c=this;function d(){f={video:new a.video(document.createElement("video")),settings:b};c.id="player";c.settings=f.settings;g={container:document.getElementById(c.id),controlbar:new a.controlbar(c,f.settings)};e=new a.controller(f,g);jwplayer.utils.appendStylesheet("#"+c.id+" video",{width:"100%",height:"100%",background:"#000",display:"none"});g.container.appendChild(f.video.getTag());g.container.appendChild(g.controlbar.getDisplayElement())}this.jwPlay=function(){e.play()};this.jwPause=function(){e.pause()};this.jwStop=function(){e.stop()};d()}})(jwplayer.html5);(function(a){a.html5.skin=function(){var b={};var c=false;this.load=function(d,e){new a.html5.skinloader(d,function(f){c=true;b=f;e()},function(){new a.html5.skinloader("",function(f){c=true;b=f;e()})})};this.getSkinElement=function(d,e){if(c){try{return b[d].elements[e]}catch(f){a.utils.log("No such skin component / element: ",[d,e])}}return null};this.getComponentSettings=function(d){if(c&&b&&b[d]){return b[d].settings}return null};this.getComponentLayout=function(d){if(c){var e=b[d].layout;if(e&&(e.left||e.right||e.center)){return b[d].layout}}return null}}})(jwplayer);(function(a){a.html5.skinloader=function(f,o,j){var n={};var c=o;var k=j;var e=true;var i;var m=f;var r=false;function l(){if(typeof m!="string"||m===""){d(a.html5.defaultskin().xml)}else{a.utils.ajax(a.utils.getAbsolutePath(m),function(s){try{if(a.utils.exists(s.responseXML)){d(s.responseXML);return}}catch(t){h()}d(a.html5.defaultskin().xml)},function(s){d(a.html5.defaultskin().xml)})}}function d(x){var D=x.getElementsByTagName("component");if(D.length===0){return}for(var G=0;G<D.length;G++){var B=D[G].getAttribute("name");var A={settings:{},elements:{},layout:{}};n[B]=A;var F=D[G].getElementsByTagName("elements")[0].getElementsByTagName("element");for(var E=0;E<F.length;E++){b(F[E],B)}var y=D[G].getElementsByTagName("settings")[0];if(y&&y.childNodes.length>0){var J=y.getElementsByTagName("setting");for(var O=0;O<J.length;O++){var P=J[O].getAttribute("name");var H=J[O].getAttribute("value");var w=/color$/.test(P)?"color":null;n[B].settings[P]=a.utils.typechecker(H,w)}}var K=D[G].getElementsByTagName("layout")[0];if(K&&K.childNodes.length>0){var L=K.getElementsByTagName("group");for(var v=0;v<L.length;v++){var z=L[v];n[B].layout[z.getAttribute("position")]={elements:[]};for(var N=0;N<z.attributes.length;N++){var C=z.attributes[N];n[B].layout[z.getAttribute("position")][C.name]=C.value}var M=z.getElementsByTagName("*");for(var u=0;u<M.length;u++){var s=M[u];n[B].layout[z.getAttribute("position")].elements.push({type:s.tagName});for(var t=0;t<s.attributes.length;t++){var I=s.attributes[t];n[B].layout[z.getAttribute("position")].elements[u][I.name]=I.value}if(!a.utils.exists(n[B].layout[z.getAttribute("position")].elements[u].name)){n[B].layout[z.getAttribute("position")].elements[u].name=s.tagName}}}}e=false;q()}}function q(){clearInterval(i);if(!r){i=setInterval(function(){p()},100)}}function b(x,w){var v=new Image();var s=x.getAttribute("name");var u=x.getAttribute("src");var z;if(u.indexOf("data:image/png;base64,")===0){z=u}else{var t=a.utils.getAbsolutePath(m);var y=t.substr(0,t.lastIndexOf("/"));z=[y,w,u].join("/")}n[w].elements[s]={height:0,width:0,src:"",ready:false,image:v};v.onload=function(A){g(v,s,w)};v.onerror=function(A){r=true;q();k()};v.src=z}function h(){for(var t in n){var v=n[t];for(var s in v.elements){var w=v.elements[s];var u=w.image;u.onload=null;u.onerror=null;delete w.image;delete v.elements[s]}delete n[t]}}function p(){for(var s in n){if(s!="properties"){for(var t in n[s].elements){if(!n[s].elements[t].ready){return}}}}if(e===false){clearInterval(i);c(n)}}function g(s,u,t){if(n[t]&&n[t].elements[u]){n[t].elements[u].height=s.height;n[t].elements[u].width=s.width;n[t].elements[u].src=s.src;n[t].elements[u].ready=true;q()}else{a.utils.log("Loaded an image for a missing element: "+t+"."+u)}}l()}})(jwplayer);(function(a){a.video=function(k){var b={abort:c,canplay:m,canplaythrough:c,durationchange:c,emptied:c,ended:c,error:h,loadeddata:c,loadedmetadata:c,loadstart:c,pause:c,play:c,playing:c,progress:c,ratechange:c,readystatechange:c,seeked:c,seeking:c,stalled:c,suspend:c,timeupdate:c,volumechange:c,waiting:c};var e;var g;var d;function l(p){e=p;i()}function i(){for(var p in b){e.addEventListener(p,b[p])}}function c(p){console.log("%s %o (%s,%s)",p.type,p,f(),j())}function m(p){g=true;c(p);if(d>0){n(d)}}function h(p){console.log("Error: %o",e.error);c(p)}function f(){if(e.buffered.length>0){return e.buffered.start(0)}else{return 0}}function j(){if(e.buffered.length>0){return Math.ceil(e.buffered.end(e.buffered.length-1))}else{return 0}}var o;this.load=function(p){g=false;d=0;o=p;e.src=o;e.load()};this.stop=function(){e.removeAttribute("src");e.load();e.style.display="none"};this.play=function(){e.style.display="block";e.play()};this.pause=function(){e.pause()};var n=this.seek=function(p){if(g){d=0;e.play();e.currentTime=p}else{d=p}};this.getTag=function(){return k};l(k)}})(jwplayer.html5);(function(a){a.utils={}})(jwplayer.html5);(function(a){a.animations=function(d,j,t,e,b,q){var p,o,l,r,h,k,i,g;var s,w,f,w,c;function m(){k=q?q:a.animations.easing.quint.easeOut;p=d;o=j;if(p.id&&!a.animations.active[p.id]){a.animations.active[p.id]={}}if(isNaN(t)){if(t.indexOf("%")>0){i="%"}else{if(t.indexOf("px")){i="px"}}l=parseFloat(t.replace(i,""));r=parseFloat(e.replace(i,""))}else{i="";l=parseFloat(t);r=parseFloat(e)}h=parseFloat(b);this.id=Math.random()}this.start=function(){if(p.id){if(a.animations.active[p.id][o]&&a.animations.active[p.id][o]!=g){a.animations.active[p.id][o].stop();newFrom=parseFloat(p.style[o].toString().replace(i,""));w=h*(l/newFrom)}a.animations.active[p.id][o]=g}if(c){clearInterval(c)}f=(new Date()).valueOf();n();c=setInterval(n,a.animations.INTERVAL_SPEED)};this.stop=function(){clearInterval(c);if(p.id){a.animations.active[p.id][o]=null}};function n(){w=(new Date()).valueOf();if(w-f>=h){u();return}value=k((w-f),0,1,h);v(value)}function u(){v(1);g.stop()}function v(x){var y=(l+(r-l)*x);p.style[o]=y+i}g=this;m()};a.animations.INTERVAL_SPEED=10;a.animations.easing={};a.animations.easing.quint={easeIn:function(f,e,h,g){return h*(f/=g)*f*f*f*f+e},easeOut:function(f,e,h,g){return h*((f=f/g-1)*f*f*f*f+1)+e},easeInOut:function(f,e,h,g){if((f/=g/2)<1){return h/2*f*f*f*f*f+e}return h/2*((f-=2)*f*f*f*f+2)+e}};a.animations.easing.linear={easeIn:function(f,e,h,g){return h*f/g+e},easeOut:function(f,e,h,g){return h*f/g+e},easeInOut:function(f,e,h,g){return h*f/g+e}};a.animations.active={};a.animations.fadeIn=function(b,d,e){var c=new a.animations(b,"opacity",0,1,d,e);c.start()};a.animations.fadeOut=function(b,d,e){var c=new a.animations(b,"opacity",1,0,d,e);c.start()};a.animations.transform=function(c,h,f,i,g,b,e){var j=new a.animations(c,"left",h,i,b,e);var d=new a.animations(c,"top",f,g,b,e);j.start();d.start()}})(jwplayer.html5.utils)};
+if(typeof jwplayer=="undefined"){jwplayer=function(a){if(jwplayer.api){return jwplayer.api.selectPlayer(a)}};var $jw=jwplayer;jwplayer.version="6.0";jwplayer.vid=document.createElement("video");jwplayer.audio=document.createElement("audio");jwplayer.source=document.createElement("source");(function(c){var b=c.utils=function(){};b.exists=function(h){switch(typeof(h)){case"string":return(h.length>0);break;case"object":return(h!==null);case"undefined":return false}return true};var e;var d={};b.css=function(h,k){if(b.exists(h)){for(var i in k){try{if(typeof k[i]==="undefined"){continue}else{if(typeof k[i]=="number"&&!(i=="zIndex"||i=="opacity")){if(isNaN(k[i])){continue}if(i.match(/color/i)){k[i]="#"+b.strings.pad(k[i].toString(16),6)}else{k[i]=Math.ceil(k[i])+"px"}}}if(k[i]){h.style[i]=k[i]}}catch(j){}}}};b.appendStylesheet=function(h,j){if(!e){e=document.createElement("style");e.type="text/css";document.getElementsByTagName("head")[0].appendChild(e)}if(!d[h]){d[h]={}}for(var i in j){var k=g(i,j[i]);if(b.exists(d[h][i])&&!b.exists(k)){delete d[h][i]}else{d[h][i]=k}}f()};function g(h,i){if(typeof i==="undefined"){return undefined}if(typeof i=="number"){if(isNaN(i)){return undefined}switch(h){case"z-index":case"opacity":return i;break;default:if(h.match(/color/i)){return"#"+b.strings.pad(i.toString(16),6)}else{return Math.ceil(i)+"px"}break}}else{return i}}function f(){if(e){var h="";for(var k in d){var j=d[k];h+=k+"{\n";for(var i in j){h+="  "+i+": "+j[i]+";\n"}h+="}\n"}e.innerHTML=h}}b.clearCss=function(h){for(var i in d){if(i.indexOf(h)>=0){delete d[i]}}f()};b.getAbsolutePath=function(o,n){if(!b.exists(n)){n=document.location.href}if(!b.exists(o)){return undefined}if(a(o)){return o}var p=n.substring(0,n.indexOf("://")+3);var m=n.substring(p.length,n.indexOf("/",p.length+1));var j;if(o.indexOf("/")===0){j=o.split("/")}else{var k=n.split("?")[0];k=k.substring(p.length+m.length+1,k.lastIndexOf("/"));j=k.split("/").concat(o.split("/"))}var h=[];for(var l=0;l<j.length;l++){if(!j[l]||!b.exists(j[l])||j[l]=="."){continue}else{if(j[l]==".."){h.pop()}else{h.push(j[l])}}}return p+m+"/"+h.join("/")};function a(i){if(!b.exists(i)){return}var j=i.indexOf("://");var h=i.indexOf("?");return(j>0&&(h<0||(h>j)))}b.extend=function(){var h=b.extend["arguments"];if(h.length>1){for(var k=1;k<h.length;k++){for(var j in h[k]){h[0][j]=h[k][j]}}return h[0]}return null};b.parseDimension=function(h){if(typeof h=="string"){if(h===""){return 0}else{if(h.lastIndexOf("%")>-1){return h}else{return parseInt(h.replace("px",""),10)}}}return h};b.timeFormat=function(h){if(h>0){str=Math.floor(h/60)<10?"0"+Math.floor(h/60)+":":Math.floor(h/60)+":";str+=Math.floor(h%60)<10?"0"+Math.floor(h%60):Math.floor(h%60);return str}else{return"00:00"}};c.utils.log=function(i,h){if(typeof console!="undefined"&&typeof console.log!="undefined"){if(h){console.log(i,h)}else{console.log(i)}}};c.utils.getBoundingClientRect=function(h){if(typeof h.getBoundingClientRect=="function"){return h.getBoundingClientRect()}else{return{left:h.offsetLeft+document.body.scrollLeft,top:h.offsetTop+document.body.scrollTop,width:h.offsetWidth,height:h.offsetHeight}}}})(jwplayer);(function(a){a.ajax=function(f,e,b){var d;if(window.XMLHttpRequest){d=new XMLHttpRequest()}else{d=new ActiveXObject("Microsoft.XMLHTTP")}d.onreadystatechange=function(){if(d.readyState===4){if(d.status===200){if(e){if(!jwplayer.utils.exists(d.responseXML)){try{if(window.DOMParser){var g=(new DOMParser()).parseFromString(d.responseText,"text/xml");if(g){d=jwplayer.utils.extend({},d,{responseXML:g})}}else{g=new ActiveXObject("Microsoft.XMLDOM");g.async="false";g.loadXML(d.responseText);d=jwplayer.utils.extend({},d,{responseXML:g})}}catch(h){if(b){b(f)}}}e(d)}}else{if(b){b(f)}}}};try{d.open("GET",f,true);d.send(null)}catch(c){if(b){b(f)}}return d}})(jwplayer.utils);(function(a){jwplayer.utils.strings=function(){};jwplayer.utils.strings.trim=function(b){return b.replace(/^\s*/,"").replace(/\s*$/,"")};jwplayer.utils.strings.pad=function(c,d,b){if(!b){b="0"}while(c.length<d){c=b+c}return c};jwplayer.utils.strings.serialize=function(b){if(b==null){return null}else{if(b=="true"){return true}else{if(b=="false"){return false}else{if(isNaN(Number(b))||b.length>5||b.length==0){return b}else{return Number(b)}}}}};jwplayer.utils.strings.seconds=function(d){d=d.replace(",",".");var b=d.split(":");var c=0;if(d.substr(-1)=="s"){c=Number(d.substr(0,d.length-1))}else{if(d.substr(-1)=="m"){c=Number(d.substr(0,d.length-1))*60}else{if(d.substr(-1)=="h"){c=Number(d.substr(0,d.length-1))*3600}else{if(b.length>1){c=Number(b[b.length-1]);c+=Number(b[b.length-2])*60;if(b.length==3){c+=Number(b[b.length-3])*3600}}else{c=Number(d)}}}}return c};jwplayer.utils.strings.xmlAttribute=function(b,c){for(var d=0;d<b.attributes.length;d++){if(b.attributes[d].name&&b.attributes[d].name.toLowerCase()==c.toLowerCase()){return b.attributes[d].value.toString()}}return""};jwplayer.utils.strings.jsonToString=function(f){var h=h||{};if(h&&h.stringify){return h.stringify(f)}var c=typeof(f);if(c!="object"||f===null){if(c=="string"){f='"'+f.replace(/"/g,'\\"')+'"'}else{return String(f)}}else{var g=[],b=(f&&f.constructor==Array);for(var d in f){var e=f[d];switch(typeof(e)){case"string":e='"'+e.replace(/"/g,'\\"')+'"';break;case"object":if(jwplayer.utils.exists(e)){e=jwplayer.utils.strings.jsonToString(e)}break}if(b){if(typeof(e)!="function"){g.push(String(e))}}else{if(typeof(e)!="function"){g.push('"'+d+'":'+String(e))}}}if(b){return"["+String(g)+"]"}else{return"{"+String(g)+"}"}}}})(jwplayer.utils);(function(b){var d=new RegExp(/^(#|0x)[0-9a-fA-F]{3,6}/);jwplayer.utils.typechecker=function(g,f){f=!jwplayer.utils.exists(f)?c(g):f;return e(g,f)};function c(f){var g=["true","false","t","f"];if(g.toString().indexOf(f.toLowerCase().replace(" ",""))>=0){return"boolean"}else{if(d.test(f)){return"color"}else{if(!isNaN(parseInt(f,10))&&parseInt(f,10).toString().length==f.length){return"integer"}else{if(!isNaN(parseFloat(f))&&parseFloat(f).toString().length==f.length){return"float"}}}}return"string"}function e(g,f){if(!jwplayer.utils.exists(f)){return g}switch(f){case"color":if(g.length>0){return a(g)}return null;case"integer":return parseInt(g,10);case"float":return parseFloat(g);case"boolean":if(g.toLowerCase()=="true"){return true}else{if(g=="1"){return true}}return false}return g}function a(f){switch(f.toLowerCase()){case"blue":return parseInt("0000FF",16);case"green":return parseInt("00FF00",16);case"red":return parseInt("FF0000",16);case"cyan":return parseInt("00FFFF",16);case"magenta":return parseInt("FF00FF",16);case"yellow":return parseInt("FFFF00",16);case"black":return parseInt("000000",16);case"white":return parseInt("FFFFFF",16);default:f=f.replace(/(#|0x)?([0-9A-F]{3,6})$/gi,"$2");if(f.length==3){f=f.charAt(0)+f.charAt(0)+f.charAt(1)+f.charAt(1)+f.charAt(2)+f.charAt(2)}return parseInt(f,16)}return parseInt("000000",16)}})(jwplayer.utils);(function(a){a.events={COMPLETE:"COMPLETE",ERROR:"ERROR",API_READY:"jwplayerAPIReady",JWPLAYER_READY:"jwplayerReady",JWPLAYER_FULLSCREEN:"jwplayerFullscreen",JWPLAYER_RESIZE:"jwplayerResize",JWPLAYER_ERROR:"jwplayerError",JWPLAYER_MEDIA_BEFOREPLAY:"jwplayerMediaBeforePlay",JWPLAYER_MEDIA_BEFORECOMPLETE:"jwplayerMediaBeforeComplete",JWPLAYER_COMPONENT_SHOW:"jwplayerComponentShow",JWPLAYER_COMPONENT_HIDE:"jwplayerComponentHide",JWPLAYER_MEDIA_BUFFER:"jwplayerMediaBuffer",JWPLAYER_MEDIA_BUFFER_FULL:"jwplayerMediaBufferFull",JWPLAYER_MEDIA_ERROR:"jwplayerMediaError",JWPLAYER_MEDIA_LOADED:"jwplayerMediaLoaded",JWPLAYER_MEDIA_COMPLETE:"jwplayerMediaComplete",JWPLAYER_MEDIA_SEEK:"jwplayerMediaSeek",JWPLAYER_MEDIA_TIME:"jwplayerMediaTime",JWPLAYER_MEDIA_VOLUME:"jwplayerMediaVolume",JWPLAYER_MEDIA_META:"jwplayerMediaMeta",JWPLAYER_MEDIA_MUTE:"jwplayerMediaMute",JWPLAYER_PLAYER_STATE:"jwplayerPlayerState",state:{BUFFERING:"BUFFERING",IDLE:"IDLE",PAUSED:"PAUSED",PLAYING:"PLAYING",COMPLETED:"COMPLETED"},JWPLAYER_PLAYLIST_LOADED:"jwplayerPlaylistLoaded",JWPLAYER_PLAYLIST_ITEM:"jwplayerPlaylistItem",JWPLAYER_INSTREAM_CLICK:"jwplayerInstreamClicked",JWPLAYER_INSTREAM_DESTROYED:"jwplayerInstreamDestroyed"}})(jwplayer);(function(jwplayer){jwplayer.events.eventdispatcher=function(id,debug){var _id=id,_debug=debug,_listeners,_globallisteners;this.resetEventListeners=function(){_listeners={};_globallisteners=[]};this.resetEventListeners();this.addEventListener=function(type,listener,count){try{if(!jwplayer.utils.exists(_listeners[type])){_listeners[type]=[]}if(typeof(listener)=="string"){eval("listener = "+listener)}_listeners[type].push({listener:listener,count:count})}catch(err){jwplayer.utils.log("error",err)}return false};this.removeEventListener=function(type,listener){if(!_listeners[type]){return}try{for(var listenerIndex=0;listenerIndex<_listeners[type].length;listenerIndex++){if(_listeners[type][listenerIndex].listener.toString()==listener.toString()){_listeners[type].splice(listenerIndex,1);break}}}catch(err){jwplayer.utils.log("error",err)}return false};this.addGlobalListener=function(listener,count){try{if(typeof(listener)=="string"){eval("listener = "+listener)}_globallisteners.push({listener:listener,count:count})}catch(err){jwplayer.utils.log("error",err)}return false};this.removeGlobalListener=function(listener){if(!listener){return}try{for(var globalListenerIndex=0;globalListenerIndex<_globallisteners.length;globalListenerIndex++){if(_globallisteners[globalListenerIndex].listener.toString()==listener.toString()){_globallisteners.splice(globalListenerIndex,1);break}}}catch(err){jwplayer.utils.log("error",err)}return false};this.sendEvent=function(type,data){if(!jwplayer.utils.exists(data)){data={}}jwplayer.utils.extend(data,{id:_id,version:jwplayer.version,type:type});if(_debug){jwplayer.utils.log(type,data)}if(typeof _listeners[type]!="undefined"){for(var listenerIndex=0;listenerIndex<_listeners[type].length;listenerIndex++){try{_listeners[type][listenerIndex].listener(data)}catch(err){jwplayer.utils.log("There was an error while handling a listener: "+err.toString(),_listeners[type][listenerIndex].listener)}if(_listeners[type][listenerIndex]){if(_listeners[type][listenerIndex].count===1){delete _listeners[type][listenerIndex]}else{if(_listeners[type][listenerIndex].count>0){_listeners[type][listenerIndex].count=_listeners[type][listenerIndex].count-1}}}}}for(var globalListenerIndex=0;globalListenerIndex<_globallisteners.length;globalListenerIndex++){try{_globallisteners[globalListenerIndex].listener(data)}catch(err){jwplayer.utils.log("There was an error while handling a listener: "+err.toString(),_globallisteners[globalListenerIndex].listener)}if(_globallisteners[globalListenerIndex]){if(_globallisteners[globalListenerIndex].count===1){delete _globallisteners[globalListenerIndex]}else{if(_globallisteners[globalListenerIndex].count>0){_globallisteners[globalListenerIndex].count=_globallisteners[globalListenerIndex].count-1}}}}}}})(jwplayer);(function(a){a.html5={}})(jwplayer);(function(h){var i=jwplayer.utils,g=i.appendStylesheet,b="button",m="text",d="divider",n="slider",e="relative",f="absolute",a="none",l="block",p="inline",k="inline-block",c="left",r="right",j="100%",o="width .25s linear 0s, left .25s linear 0s, opacity .25s ease 0s";CB_CLASS=".jwcontrolbar";h.controlbar=function(y,ah){var w,x={backgroundcolor:"",margin:10,font:"Arial,sans-serif",fontsize:10,fontcolor:parseInt("000000",16),fontstyle:"normal",fontweight:"bold",buttoncolor:parseInt("ffffff",16),position:"OVER",idlehide:false,hideplaylistcontrols:false,forcenextprev:false,layout:{left:{position:"left",elements:[{name:"play",type:b},{name:"divider",type:d},{name:"prev",type:b},{name:"divider",type:d},{name:"next",type:b},{name:"divider",type:d},{name:"elapsed",type:m}]},center:{position:"center",elements:[{name:"time",type:n}]},right:{position:"right",elements:[{name:"duration",type:m},{name:"blank",type:b},{name:"divider",type:d},{name:"mute",type:b},{name:"volume",type:n},{name:"divider",type:d},{name:"fullscreen",type:b}]}}},K,ap,ab,an,ae,ay,O={play:"pause",mute:"unmute",fullscreen:"normalscreen"},ao={play:false,mute:false,fullscreen:false},v={play:T,mute:F,fullscreen:Q,next:u,prev:W},z={time:N,volume:at};function ar(){ab={};w=y;ah=i.extend({},ah);ae=w.id+"_controlbar";ay=0;an=G();an.id=ae;an.className="jwcontrolbar";window.addEventListener("mousemove",ax,false);window.addEventListener("mouseup",ax,false);(new h.skinloader(ah.skin,function(aA){w.skin=aA;K=i.extend({},x,w.skin.controlbar.settings,w.settings.controlbar);ap=(aA.controlbar.layout.left||aA.controlbar.layout.right||aA.controlbar.layout.center)?aA.controlbar.layout:x.layout;M();aj();s()},function(aA){i.log(aA)}))}function s(){w.addEventListener(jwplayer.events.JWPLAYER_MEDIA_TIME,az);w.addEventListener(jwplayer.events.JWPLAYER_PLAYER_STATE,B);w.addEventListener(jwplayer.events.JWPLAYER_MEDIA_MUTE,au);w.addEventListener(jwplayer.events.JWPLAYER_MEDIA_VOLUME,A);w.addEventListener(jwplayer.events.JWPLAYER_MEDIA_BUFFER,D)}function az(aA){ay=aA.duration;if(ab.elapsed){ab.elapsed.innerHTML=i.timeFormat(aA.position)}if(ab.duration){ab.duration.innerHTML=i.timeFormat(aA.duration)}if(aA.duration>0){am(aA.position/aA.duration)}else{am(0)}}function B(aA){switch(aA.newstate){case jwplayer.events.state.PLAYING:case jwplayer.events.state.BUFFERING:if(ab.timeSliderThumb){ab.timeSliderThumb.style.opacity=1}if(ab.timeRail){ab.timeRail.className="jwrail jwsmooth"}J("play",true);break;case jwplayer.events.state.PAUSED:if(!Y){J("play",false)}break;case jwplayer.events.state.IDLE:case jwplayer.events.state.COMPLETED:J("play",false);if(ab.timeSliderThumb){ab.timeSliderThumb.style.opacity=0}aq(0);az({position:0,duration:0});if(ab.timeRail){ab.timeRail.className="jwrail"}break}}function au(aA){J("mute",aA.mute)}function A(aA){t(aA.volume/100)}function D(aA){aq(aA.bufferPercent/100)}function M(){i.clearCss("#"+ae);g("#"+ae,{height:S("background").height,bottom:K.position=="OVER"?K.margin:0,left:K.position=="OVER"?K.margin:0,right:K.position=="OVER"?K.margin:0});g(ai(".jwtext"),{font:K.fontsize+"px/"+S("background").height+"px "+K.font,color:K.fontcolor,"font-weight":K.fontweight,"font-style":K.fontstyle,"text-align":"center",padding:"0 5px"})}function ai(aA){return"#"+ae+" "+aA}function G(){return document.createElement("span")}function aj(){var aC=ac("capLeft");var aB=ac("capRight");var aA=ac("background",{position:f,left:S("capLeft").width,right:S("capRight").width,"background-repeat":"repeat-x"},true);an.style.opacity=0;if(aA){an.appendChild(aA)}if(aC){an.appendChild(aC)}ak();if(aB){an.appendChild(aB)}setTimeout(function(){X();h.utils.animations.fadeIn(an,250)},1000)}function H(aA){switch(aA.type){case d:return V(aA);break;case m:return ad(aA.name);break;case b:if(aA.name!="blank"){return U(aA.name)}break;case n:return I(aA.name);break}}function ac(aC,aF,aB,aH){var aE=G();aE.className="jw"+aC;var aA=aH?" left center":" center";var aD=S(aC);aE.innerHTML="&nbsp;";if(!aD||aD.src==""){return}var aG;if(aB){aG={background:"url('"+aD.src+"') repeat-x "+aA}}else{aG={background:"url('"+aD.src+"') no-repeat"+aA,width:aD.width}}g(ai(".jw"+aC),i.extend(aG,aF));ab[aC]=aE;return aE}function U(aC){if(!S(aC+"Button").src){return null}var aD=document.createElement("button");aD.className="jw"+aC;aD.addEventListener("click",Z(aC),false);var aE=S(aC+"Button");var aB=S(aC+"ButtonOver");aD.innerHTML="&nbsp;";L(ai(".jw"+aC),aE,aB);var aA=O[aC];if(aA){L(ai(".jw"+aC+".jwtoggle"),S(aA+"Button"),S(aA+"ButtonOver"))}ab[aC]=aD;return aD}function L(aA,aB,aC){if(!aB.src){return}g(aA,{width:aB.width,background:"url("+aB.src+") center no-repeat"});if(aC.src){g(aA+":hover",{background:"url("+aC.src+") center no-repeat"})}}function Z(aA){return function(){if(v[aA]){v[aA]()}}}function T(){if(ao.play){w.jwPause()}else{w.jwPlay()}}function F(){w.jwSetMute()}function at(aA){if(aA<0.1){aA=0}if(aA>0.9){aA=1}w.jwSetVolume(aA*100)}function N(aA){if(!Y){w.jwPlay()}w.jwSeek(aA*ay)}function Q(){J("fullscreen")}function u(){w.jwPlaylistNext()}function W(){w.jwPlaylistNext()}function J(aA,aB){if(!i.exists(aB)){aB=!ao[aA]}if(ab[aA]){ab[aA].className="jw"+aA+(aB?" jwtoggle":"")}ao[aA]=aB}function E(aA){return ae+"_"+aA}function ad(aA,aE){var aC=G();aC.id=E(aA);aC.className="jwtext jw"+aA;var aB={};var aD=S(aA+"Background");if(aD.src){aB.background="url("+aD.src+") no-repeat center";aB["background-size"]="100% "+S("background").height+"px"}g(ai(".jw"+aA),aB);aC.innerHTML="00:00";ab[aA]=aC;return aC}function V(aB){if(aB.width){var aA=G();aA.className="jwblankDivider";g(aA,{width:parseInt(aB.width)});return aA}else{if(aB.element){return ac(aB.element)}else{return ac(aB.name)}}}function I(aA){var aD=G();aD.className="jwslider jw"+aA;var aC=ac(aA+"SliderCapLeft");var aB=ac(aA+"SliderCapRight");if(aB){aB.className+=" jwcapRight"}var aE=af(aA);if(aC){aD.appendChild(aC)}aD.appendChild(aE);if(aC){aD.appendChild(aB)}g(ai(".jw"+aA+" .jwrail"),{left:S(aA+"SliderCapLeft").width,right:S(aA+"SliderCapRight").width,});ab[aA]=aD;if(aA=="time"){aw(aD);am(0);aq(0)}else{if(aA=="volume"){al(aD)}}return aD}function af(aC){var aF=G();aF.className="jwrail jwsmooth";var aA=["Rail","Buffer","Progress"];for(var aE=0;aE<aA.length;aE++){var aD=ac(aC+"Slider"+aA[aE],null,true,(aC=="volume"));if(aD){aD.className+=" jwstretch";aF.appendChild(aD)}}var aB=ac(aC+"SliderThumb");if(aB){aB.className+=" jwthumb";aB.style.opacity=0;aF.appendChild(aB)}aF.addEventListener("mousedown",C(aC),false);ab[aC+"Rail"]=aF;return aF}var Y;function C(aA){return(function(aB){if(aB.button!=0){return}ab[aA+"Rail"].className="jwrail";if(aA=="time"){if(w.jwGetState()!=jwplayer.events.state.IDLE){w.jwPause();Y=aA}}else{Y=aA}})}var ag=0;function ax(aA){if(!Y||aA.button!=0){return}var aE=ab[Y].getElementsByClassName("jwrail")[0],aF=i.getBoundingClientRect(aE),aD=(aA.clientX-aF.left)/aF.width;if(aA.type=="mouseup"){var aB=Y;ab[aB+"Rail"].className="jwrail jwsmooth";Y=null;z[aB](aD)}else{if(Y=="time"){am(aD)}else{t(aD)}var aC=(new Date()).getTime();if(aC-ag>500){ag=aC;z[Y](aD)}}}function aw(aA){if(ab.timeSliderThumb){g(ai(".jwtimeSliderThumb"),{"margin-left":(S("timeSliderThumb").width/-2)})}aq(0);am(0)}function al(aC){var aB=S("volumeSliderCapLeft").width,aA=S("volumeSliderCapRight").width,aD=S("volumeSliderRail").width;g(ai(".jwvolume"),{width:(aB+aD+aA)})}var P={};function ak(){av("left");av("center");av("right");an.appendChild(P.left);an.appendChild(P.center);an.appendChild(P.right);g(ai(".jwright"),{right:S("capRight").width})}function av(aB){var aA=G();aA.className="jwgroup jw"+aB;P[aB]=aA;if(ap[aB]){R(ap[aB],P[aB])}}function R(aD,aA){if(aD&&aD.elements.length>0){for(var aC=0;aC<aD.elements.length;aC++){var aB=H(aD.elements[aC]);if(aB){aA.appendChild(aB)}}}}var X=this.resize=function(aB,aA){g(ai(".jwgroup.jwcenter"),{left:Math.round(i.parseDimension(P.left.offsetWidth)+S("capLeft").width),right:Math.round(i.parseDimension(P.right.offsetWidth)+S("capRight").width)})};this.getDisplayElement=function(){return an};var aq=this.setBuffer=function(aA){aA=Math.min(Math.max(0,aA),1);ab.timeSliderBuffer.style.width=aA*i.getBoundingClientRect(ab.timeSliderRail).width+"px"};function aa(aC,aE,aF){if(!ab[aC]){return}aE=Math.min(Math.max(0,aE),1);var aB=ab[aC+"SliderProgress"];var aA=ab[aC+"SliderThumb"];var aD=aE*i.getBoundingClientRect(ab[aC+"SliderRail"]).width+"px";if(aB){aB.style.width=aD}if(aA){aA.style.left=aD}}function t(aA){aa("volume",aA,true)}function am(aA){aa("time",aA)}this.getSkin=function(){return w.skin};function S(aA){if(w.skin.controlbar.elements[aA]){return w.skin.controlbar.elements[aA]}else{return{width:0,height:0,src:"",image:undefined,ready:false}}}ar()};function q(){g(CB_CLASS,{position:f,overflow:"hidden"});g(CB_CLASS+" span",{height:j,"-webkit-user-select":a,"-webkit-user-drag":a,"user-select":a,"user-drag":a});g(CB_CLASS+" .jwgroup",{display:p});g(CB_CLASS+" span, "+CB_CLASS+" .jwgroup button,"+CB_CLASS+" .jwleft",{position:e,"float":c});g(CB_CLASS+" .jwright",{position:f});g(CB_CLASS+" .jwcenter",{position:f});g(CB_CLASS+" button",{display:k,height:j,border:a,cursor:"pointer","-webkit-transition":"background-image .25s","-moz-transition":"background-image .25s","-o-transition":"background-image .25s"});g(CB_CLASS+" .jwcapRight",{right:0,position:f});g(CB_CLASS+" .jwtime,"+CB_CLASS+" .jwgroup span.jwstretch",{position:f,height:j,width:j,left:0});g(CB_CLASS+" .jwrail,"+CB_CLASS+" .jwthumb",{position:f,height:j,cursor:"pointer"});g(CB_CLASS+" .jwtime .jwsmooth span",{"-webkit-transition":o,"-moz-transition":o,"-o-transition":o});g(CB_CLASS+" .jwdivider+.jwdivider",{display:a});g(CB_CLASS+" .jwtext",{padding:"0 5px","text-align":"center"})}q()})(jwplayer.html5);(function(a){var b=jwplayer.utils;a.controller=function(i,l){var j=i,h=l,f=i.video,e="console",c=new jwplayer.events.eventdispatcher(j.id,e);b.extend(this,c);function k(){j.addGlobalListener(g)}function g(m){c.sendEvent(m.type,m)}var d;this.load=function(m){if(f.getTag().canPlayType("video/mp4")){d="http://playertest.longtailvideo.com/bunny.mp4"}else{if(f.getTag().canPlayType("video/webm")){d="http://playertest.longtailvideo.com/bunny.webm"}else{d="http://playertest.longtailvideo.com/bunny.ogv"}}};this.play=function(){if(j.state==jwplayer.events.state.IDLE){f.load(d)}f.play()};this.stop=function(){f.stop()};this.pause=function(){if(j.state==jwplayer.events.state.PLAYING||j.state==jwplayer.events.state.BUFFERING){f.pause()}};this.seek=function(m){f.seek(m)};this.volume=function(m){f.volume(m)};this.mute=function(m){if(!b.exists(m)){m=!j.mute}f.mute(m)};this.prev=function(){};this.next=function(){};this.item=function(m){};this.fullscreen=function(m){};k()}})(jwplayer.html5);(function(a){a.html5.defaultskin=function(){this.text='<?xml version="1.0" ?><skin author="LongTail Video" name="Five" version="1.1"><components><component name="controlbar"><settings><setting name="margin" value="20"/><setting name="fontsize" value="11"/><setting name="fontcolor" value="0x000000"/></settings><layout><group position="left"><button name="play"/><divider name="divider"/><button name="prev"/><divider name="divider"/><button name="next"/><divider name="divider"/><text name="elapsed"/></group><group position="center"><slider name="time"/></group><group position="right"><text name="duration"/><divider name="divider"/><button name="blank"/><divider name="divider"/><button name="mute"/><slider name="volume"/><divider name="divider"/><button name="fullscreen"/></group></layout><elements><element name="background" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAIAAABvFaqvAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAElJREFUOI3t1LERACAMQlFgGvcfxNIhHMK4gsUvUviOmgtNsiAZkBSEKxKEnCYkkQrJn/YwbUNiSDDYRZaQRDaShv+oX9GBZEIuK+8hXVLs+/YAAAAASUVORK5CYII="/><element name="blankButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAYCAYAAAAyJzegAAAAFElEQVQYV2P8//8/AzpgHBUc7oIAGZdH0RjKN8EAAAAASUVORK5CYII="/><element name="capLeft" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAYAAAA7zJfaAAAAQElEQVQIWz3LsRGAMADDQJ0XB5bMINABZ9GENGrszxhjT2WLSqxEJG2JQrTMdV2q5LpOAvyRaVmsi7WdeZ/7+AAaOTq7BVrfOQAAAABJRU5ErkJggg=="/><element name="capRight" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAYAAAA7zJfaAAAAQElEQVQIWz3LsRGAMADDQJ0XB5bMINABZ9GENGrszxhjT2WLSqxEJG2JQrTMdV2q5LpOAvyRaVmsi7WdeZ/7+AAaOTq7BVrfOQAAAABJRU5ErkJggg=="/><element name="divider" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAIAAAC0rgCNAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUCB0FwcENgEAAw7Aq+893g8APUILNOQcbFRktVGqUVFRkWNz3xTa2sUaLNUosKlRUvvf5AdbWOTtzmzyWAAAAAElFTkSuQmCC"/><element name="playButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAANUlEQVR42u2RsQkAAAjD/NTTPaW6dXLrINJA1kBpGPMAjDWmOgp1HFQXx+b1KOefO4oxY57R73YnVYCQUCQAAAAASUVORK5CYII="/><element name="pauseButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAAIUlEQVQ4jWNgGAWjYOiD/0gYG3/U0FFDB4Oho2AUDAYAAEwiL9HrpdMVAAAAAElFTkSuQmCC"/><element name="prevButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAAQklEQVQ4y2NgGAWjYOiD/1AMA/JAfB5NjCJD/YH4PRaLyDa0H4lNNUP/DxlD59PCUBCIp3ZEwYA+NZLUKBgFgwEAAN+HLX9sB8u8AAAAAElFTkSuQmCC"/><element name="nextButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAAQElEQVQ4y2NgGAWjYOiD/0B8Hojl0cT+U2ooCL8HYn9qGwrD/bQw9P+QMXQ+tSMqnpoRBUpS+tRMUqNgFAwGAADxZy1/mHvFnAAAAABJRU5ErkJggg=="/><element name="timeSliderRail" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAOElEQVRIDe3BwQkAIRADwAhhw/nU/kWwUK+KPITMABFh19Y+F0acY8CJvX9wYpXgRElwolSIiMf9ZWEDhtwurFsAAAAASUVORK5CYII="/><element name="timeSliderBuffer" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAN0lEQVRIDe3BwQkAMQwDMBcc55mRe9zi7RR+FCwBEWG39vcfGHFm4MTuhhMlwYlVBSdKhYh43AW/LQMKm1spzwAAAABJRU5ErkJggg=="/><element name="timeSliderProgress" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAIElEQVRIiWNgGAWjYBTQBfynMR61YCRYMApGwSigMQAAiVWPcbq6UkIAAAAASUVORK5CYII="/><element name="timeSliderThumb" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAYCAYAAAA/OUfnAAAAO0lEQVQYlWP4//8/Awwz0JgDBP/BeN6Cxf/hnI2btiI4u/fsQ3AOHjqK4Jw4eQbBOX/hEoKDYjSd/AMA4cS4mfLsorgAAAAASUVORK5CYII="/><element name="muteButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAYCAYAAADKx8xXAAAAJklEQVQ4y2NgGAUjDcwH4v/kaPxPikZkxcNVI9mBQ5XoGAWDFwAAsKAXKQQmfbUAAAAASUVORK5CYII="/><element name="unmuteButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAYCAYAAADKx8xXAAAAMklEQVQ4y2NgGAWDHPyntub5xBr6Hwv/Pzk2/yfVG/8psRFE25Oq8T+tQnsIaB4FVAcAi2YVysVY52AAAAAASUVORK5CYII="/><element name="volumeSliderRail" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYAgMAAACdGdVrAAAACVBMVEUAAACmpqampqbBXAu8AAAAAnRSTlMAgJsrThgAAAArSURBVAhbY2AgErBAyA4I2QEhOyBkB4TsYOhAoaCCUCUwDTDtMMNgRuMHAFB5FoGH5T0UAAAAAElFTkSuQmCC"/><element name="volumeSliderProgress" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYAgMAAACdGdVrAAAACVBMVEUAAAAAAAAAAACDY+nAAAAAAnRSTlMAgJsrThgAAAArSURBVAhbY2AgErBAyA4I2QEhOyBkB4TsYOhAoaCCUCUwDTDtMMNgRuMHAFB5FoGH5T0UAAAAAElFTkSuQmCC"/><element name="volumeSliderCapRight" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAYCAYAAAAyJzegAAAAFElEQVQYV2P8//8/AzpgHBUc7oIAGZdH0RjKN8EAAAAASUVORK5CYII="/><element name="fullscreenButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAQklEQVRIiWNgGAWjYMiD/0iYFDmSLbDHImdPLQtgBpEiR7Zl2NijAA5oEkT/0Whi5UiyAJ8BVMsHNMtoo2AUDAIAAGdcIN3IDNXoAAAAAElFTkSuQmCC"/><element name="normalscreenButton" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAP0lEQVRIx2NgGAWjYMiD/1RSQ5QB/wmIUWzJfzx8qhj+n4DYCAY0DyJ7PBbYU8sHMEvwiZFtODXUjIJRMJgBACpWIN2ZxdPTAAAAAElFTkSuQmCC"/></elements></component><component name="display"><elements><element name="background" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyAQMAAAAk8RryAAAABlBMVEUAAAAAAAClZ7nPAAAAAnRSTlOZpuml+rYAAAASSURBVBhXY2AYJuA/GBwY6jQAyDyoK8QcL4QAAAAASUVORK5CYII="/><element name="playIcon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAiUlEQVR42u3XSw2AMBREURwgAQlIQAISKgUpSEFKJeCg5b0E0kWBTVcD9ySTsL0Jn9IBAAAA+K2UUrBlW/Rr5ZDoIeeuoFkxJD9ss03aIXXQqB9SttoG7ZA6qNcOKdttiwcJh9RB+iFl4SshkRBuLR72+9cvH0SOKI2HRo7x/Fi1/uoCAAAAwLsD8ki99IlO2dQAAAAASUVORK5CYII="/><element name="muteIcon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAVUlEQVR42u3WMQrAIAxAUW/g/SdvGmvpoOBeSHgPsjj5QTANAACARCJilIhYM0tEvJM+Ik3Id9E957kQIb+F3OdCPC0hPkQriqWx9hp/x/QGAABQyAPLB22VGrpLDgAAAABJRU5ErkJggg=="/><element name="errorIcon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAA/0lEQVR42u2U0QmEMBAF7cASLMESUoIlpARLSCkpwRJSgiWkhOvAXD4WsgRkyaG5DbyB+Yvg8KITAAAAAAAYk+u61mwk15EjPtlEfihmqIiZR1Qx80ghjgdUuiHXGHSVsoag0x6x8DUoyjD5KovmEJ9NTDMRPIT0mtdIUkjlonuNohO+Ha99DTmkuGgKCTcvebAzx82ZoCWC3/3aIMWSRucaxcjORSFY4xpFdjYJGp1rFGcyCYZ/RVh6AUnfcNZ2zih3/mGj1jVCdiNDwyrq1rA/xMdeEXvDVdnYc1vDc3uPkDObXrlaxbNHSOohQhr/WOeLEWfWTgAAAAAAADzNF9sHJ7PJ57MlAAAAAElFTkSuQmCC"/><element name="bufferIcon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAACBklEQVR42u3Zv0sCYRzH8USTzOsHHEWGkC1HgaDgkktGDjUYtDQ01RDSljQ1BLU02+rk1NTm2NLq4Nx/0L/h9fnCd3j4cnZe1/U8xiO8h3uurufF0/3COd/3/0UWYiEWYiEWYiGJQ+J8xuPxKhXjEMZANinjIZhkGuVRNioE4wVURo4JkHm0xKWmhRAc1bh1EyCUw5BcBIjHiApKa4CErko6DEJwuRo6IRKzyJD8FJAyI3Zp2zRImiBcRhlfo5RtlxCcE3CcDNpGrhYIT2IhAJKilO0VRmzJ32fAMTpBTS0QMfGwlcuKMRftE0DJ0wCJdcOsCkBdXP3Mh9CEFUBTPS9mDZJBG6io4aqVzMdCokCw9H3kT6j/C/9iDdSeUMNC7DkyyxAs/Rk6Qss8FPWRZgdVtUH4DjxEn1zxh+/zj1wHlf4MQhNGrwqA6sY40U8JonRJwEQh+AO3AvCG6gHv4U7IY4krxkroWoAOkoQMGfCBrgIm+YBGqPENpIJ66CJg3x66Y0gnSUidAEEnNr9jjLiWMn5DiWP0OC/oAsCgkq43xBdGDMQr7YASP/vEkHvdl1+JOCcEV5sC4hGEOzTlPuKgd0b0xD4JkRcOgnRRTjdErkYhAsQVq6IdUuPJtmk7BCL3t/h88cx91pKQkI/pkDx6pmYTIjEoxiHsN1YWYiEWYiEWknhflZ5IErA5nr8AAAAASUVORK5CYII="/></elements></component><component name="dock"><settings><setting name="fontcolor" value="0xffffff"/></settings><elements><element name="button" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyAQMAAAAk8RryAAAABlBMVEUAAAAAAAClZ7nPAAAAAnRSTlOZpuml+rYAAAASSURBVBhXY2AYJuA/GBwY6jQAyDyoK8QcL4QAAAAASUVORK5CYII="/></elements></component><component name="playlist"><settings><setting name="backgroundcolor" value="0xe8e8e8"/></settings><elements><element name="item" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAIAAAC1nk4lAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHBJREFUaN7t2MENwCAMBEEe9N8wSKYC/D8YV7CyJoRkVtVImxkZPQInMxoP0XiIxkM0HsGbjjSNBx544IEHHnjggUe/6UQeey0PIh7XTftGxKPj4eXCtLsHHh+ZxkO0Iw8PR55Ni8ZD9Hu/EAoP0dc5RRg9qeRjVF8AAAAASUVORK5CYII="/><element name="sliderCapTop" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAHCAYAAADnCQYGAAAAFUlEQVQokWP8//8/A7UB46ihI9hQAKt6FPPXhVGHAAAAAElFTkSuQmCC"/><element name="sliderRail" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAUCAYAAABiS3YzAAAAKElEQVQ4y2P4//8/Az68bNmy/+iYkB6GUUNHDR01dNTQUUNHDaXcUABUDOKhcxnsSwAAAABJRU5ErkJggg=="/><element name="sliderThumb" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAUCAYAAABiS3YzAAAAJUlEQVQ4T2P4//8/Ay4MBP9xYbz6Rg0dNXTU0FFDRw0dNZRyQwHH4NBa7GJsXAAAAABJRU5ErkJggg=="/><element name="sliderCapBottom" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAHCAYAAADnCQYGAAAAFUlEQVQokWP8//8/A7UB46ihI9hQAKt6FPPXhVGHAAAAAElFTkSuQmCC"/></elements></component></components></skin>';this.xml=null;if(window.DOMParser){parser=new DOMParser();this.xml=parser.parseFromString(this.text,"text/xml")}else{this.xml=new ActiveXObject("Microsoft.XMLDOM");this.xml.async="false";this.xml.loadXML(this.text)}return this}})(jwplayer);(function(a){a.player=function(b){var f,g,e,c=this;function d(){f={id:"player",video:new a.video(document.createElement("video")),settings:b,volume:0,state:jwplayer.events.state.IDLE,mute:false};jwplayer.utils.extend(f,new jwplayer.events.eventdispatcher());f.video.addGlobalListener(function(h){switch(h.type){case jwplayer.events.JWPLAYER_MEDIA_MUTE:if(f.mute==h.mute){return}f.mute=h.mute;break;case jwplayer.events.JWPLAYER_MEDIA_VOLUME:if(f.volume==h.volume){return}f.volume=h.volume;break;case jwplayer.events.JWPLAYER_PLAYER_STATE:if(f.state==h.newstate){return}f.state=h.newstate}f.sendEvent(h.type,h)});c.id=f.id;c.settings=f.settings;g={};e=new a.controller(f,g);c.addEventListener=e.addEventListener;c.removeEventListener=e.removeEventListener;g.container=document.getElementById(c.id),g.controlbar=new a.controlbar(c,f.settings);jwplayer.utils.appendStylesheet("#"+c.id+" video",{width:"100%",height:"100%",background:"#000",opacity:0,"-webkit-transition":"opacity .15s ease"});g.container.appendChild(f.video.getTag());g.container.appendChild(g.controlbar.getDisplayElement());e.load()}this.jwPlay=function(){e.play()};this.jwPause=function(){e.pause()};this.jwStop=function(){e.stop()};this.jwSeek=function(h){e.seek(h)};this.jwSetVolume=function(h){e.volume(h)};this.jwSetMute=function(h){e.mute(h)};this.jwLoad=function(h){e.load(h)};this.jwPlaylistNext=function(){e.next()};this.jwPlaylistPrev=function(){e.prev()};this.jwPlaylistItem=function(h){e.item(h)};this.jwFullscreen=function(h){e.fullscreen(h)};this.jwGetState=function(){return f.state};this.jwGetVolume=function(){return f.volume};this.jwGetMute=function(){return f.mute};this.jwGetFullscreen=function(){return false};d()}})(jwplayer.html5);(function(a){a.html5.skin=function(){var b={};var c=false;this.load=function(d,e){new a.html5.skinloader(d,function(f){c=true;b=f;e()},function(){new a.html5.skinloader("",function(f){c=true;b=f;e()})})};this.getSkinElement=function(d,e){if(c){try{return b[d].elements[e]}catch(f){a.utils.log("No such skin component / element: ",[d,e])}}return null};this.getComponentSettings=function(d){if(c&&b&&b[d]){return b[d].settings}return null};this.getComponentLayout=function(d){if(c){var e=b[d].layout;if(e&&(e.left||e.right||e.center)){return b[d].layout}}return null}}})(jwplayer);(function(a){a.html5.skinloader=function(f,o,j){var n={};var c=o;var k=j;var e=true;var i;var m=f;var r=false;function l(){if(typeof m!="string"||m===""){d(a.html5.defaultskin().xml)}else{a.utils.ajax(a.utils.getAbsolutePath(m),function(s){try{if(a.utils.exists(s.responseXML)){d(s.responseXML);return}}catch(t){h()}d(a.html5.defaultskin().xml)},function(s){d(a.html5.defaultskin().xml)})}}function d(x){var D=x.getElementsByTagName("component");if(D.length===0){return}for(var G=0;G<D.length;G++){var B=D[G].getAttribute("name");var A={settings:{},elements:{},layout:{}};n[B]=A;var F=D[G].getElementsByTagName("elements")[0].getElementsByTagName("element");for(var E=0;E<F.length;E++){b(F[E],B)}var y=D[G].getElementsByTagName("settings")[0];if(y&&y.childNodes.length>0){var J=y.getElementsByTagName("setting");for(var O=0;O<J.length;O++){var P=J[O].getAttribute("name");var H=J[O].getAttribute("value");var w=/color$/.test(P)?"color":null;n[B].settings[P]=a.utils.typechecker(H,w)}}var K=D[G].getElementsByTagName("layout")[0];if(K&&K.childNodes.length>0){var L=K.getElementsByTagName("group");for(var v=0;v<L.length;v++){var z=L[v];n[B].layout[z.getAttribute("position")]={elements:[]};for(var N=0;N<z.attributes.length;N++){var C=z.attributes[N];n[B].layout[z.getAttribute("position")][C.name]=C.value}var M=z.getElementsByTagName("*");for(var u=0;u<M.length;u++){var s=M[u];n[B].layout[z.getAttribute("position")].elements.push({type:s.tagName});for(var t=0;t<s.attributes.length;t++){var I=s.attributes[t];n[B].layout[z.getAttribute("position")].elements[u][I.name]=I.value}if(!a.utils.exists(n[B].layout[z.getAttribute("position")].elements[u].name)){n[B].layout[z.getAttribute("position")].elements[u].name=s.tagName}}}}e=false;q()}}function q(){clearInterval(i);if(!r){i=setInterval(function(){p()},100)}}function b(x,w){var v=new Image();var s=x.getAttribute("name");var u=x.getAttribute("src");var z;if(u.indexOf("data:image/png;base64,")===0){z=u}else{var t=a.utils.getAbsolutePath(m);var y=t.substr(0,t.lastIndexOf("/"));z=[y,w,u].join("/")}n[w].elements[s]={height:0,width:0,src:"",ready:false,image:v};v.onload=function(A){g(v,s,w)};v.onerror=function(A){r=true;q();k()};v.src=z}function h(){for(var t in n){var v=n[t];for(var s in v.elements){var w=v.elements[s];var u=w.image;u.onload=null;u.onerror=null;delete w.image;delete v.elements[s]}delete n[t]}}function p(){for(var s in n){if(s!="properties"){for(var t in n[s].elements){if(!n[s].elements[t].ready){return}}}}if(e===false){clearInterval(i);c(n)}}function g(s,u,t){if(n[t]&&n[t].elements[u]){n[t].elements[u].height=s.height;n[t].elements[u].width=s.width;n[t].elements[u].src=s.src;n[t].elements[u].ready=true;q()}else{a.utils.log("Loaded an image for a missing element: "+t+"."+u)}}l()}})(jwplayer);(function(a){var b=jwplayer.utils;a.video=function(w){var q={abort:n,canplay:B,canplaythrough:n,durationchange:d,emptied:n,ended:n,error:t,loadeddata:n,loadedmetadata:n,loadstart:n,pause:i,play:i,playing:n,progress:n,ratechange:n,readystatechange:n,seeked:n,seeking:n,stalled:n,suspend:n,timeupdate:g,volumechange:y,waiting:n},m,r,p,z=jwplayer.events.state.IDLE,l=0,h=-1,s=-1,j=new jwplayer.events.eventdispatcher();b.extend(this,j);function o(D){m=D;C()}function C(){for(var D in q){m.addEventListener(D,q[D],false)}}function v(D,E){j.sendEvent(D,E)}function n(D){}function d(D){_duration=m.duration;g()}function g(D){if(z==jwplayer.events.state.PLAYING){v(jwplayer.events.JWPLAYER_MEDIA_TIME,{position:m.currentTime,duration:_duration});if(m.currentTime>=_duration){x()}}}function B(D){r=true;n(D);if(p>0){u(p)}}function i(D){if(m.paused){A(jwplayer.events.state.PAUSED)}else{A(jwplayer.events.state.PLAYING)}}function t(D){console.log("Error: %o",m.error);n(D)}this.load=function(D){r=false;p=0;_duration=0;m.src=D;m.load();h=setInterval(e,100)};var k=this.stop=function(){m.removeAttribute("src");m.load();m.style.opacity=0;clearInterval(h);A(jwplayer.events.state.IDLE)};this.play=function(){m.style.opacity=1;m.play()};this.pause=function(){m.pause()};var u=this.seek=function(D){if(r){p=0;m.currentTime=D}else{p=D}};var f=this.volume=function(D){if(m.muted){m.muted=false}m.volume=D/100};function y(D){v(jwplayer.events.JWPLAYER_MEDIA_VOLUME,{volume:Math.round(m.volume*100)});v(jwplayer.events.JWPLAYER_MEDIA_MUTE,{mute:m.muted})}this.mute=function(D){if(!b.exists(D)){D=!m.mute}if(D){l=m.volume*100;f(0);m.muted=true}else{f(l)}};function A(D){if(D==jwplayer.events.state.PAUSED&&z==jwplayer.events.state.IDLE){return}if(z!=D){var E=z;z=D;v(jwplayer.events.JWPLAYER_PLAYER_STATE,{oldstate:E,newstate:D})}}function e(){var D=c();if(D!=s){s=D;v(jwplayer.events.JWPLAYER_MEDIA_BUFFER,{bufferPercent:Math.round(s*100)})}if(D>=1){clearInterval(h)}}function c(){if(m.buffered.length==0||m.duration==0){return 0}else{return m.buffered.end(m.buffered.length-1)/m.duration}}function x(){k();v(jwplayer.events.JWPLAYER_MEDIA_COMPLETE)}this.getTag=function(){return w};o(w)}})(jwplayer.html5);(function(a){a.utils={}})(jwplayer.html5);(function(a){a.animations=function(d,j,t,e,b,q){var p,o,l,r,h,k,i,g;var s,w,f,w,c;function m(){k=q?q:a.animations.easing.quint.easeOut;p=d;o=j;if(p.id&&!a.animations.active[p.id]){a.animations.active[p.id]={}}if(isNaN(t)){if(t.indexOf("%")>0){i="%"}else{if(t.indexOf("px")){i="px"}}l=parseFloat(t.replace(i,""));r=parseFloat(e.replace(i,""))}else{i="";l=parseFloat(t);r=parseFloat(e)}h=parseFloat(b);this.id=Math.random()}this.start=function(){if(p.id){if(a.animations.active[p.id][o]&&a.animations.active[p.id][o]!=g){a.animations.active[p.id][o].stop();newFrom=parseFloat(p.style[o].toString().replace(i,""));w=h*(l/newFrom)}a.animations.active[p.id][o]=g}if(c){clearInterval(c)}f=(new Date()).valueOf();n();c=setInterval(n,a.animations.INTERVAL_SPEED)};this.stop=function(){clearInterval(c);if(p.id){a.animations.active[p.id][o]=null}};function n(){w=(new Date()).valueOf();if(w-f>=h){u();return}value=k((w-f),0,1,h);v(value)}function u(){v(1);g.stop()}function v(x){var y=(l+(r-l)*x);p.style[o]=y+i}g=this;m()};a.animations.INTERVAL_SPEED=10;a.animations.easing={};a.animations.easing.quint={easeIn:function(f,e,h,g){return h*(f/=g)*f*f*f*f+e},easeOut:function(f,e,h,g){return h*((f=f/g-1)*f*f*f*f+1)+e},easeInOut:function(f,e,h,g){if((f/=g/2)<1){return h/2*f*f*f*f*f+e}return h/2*((f-=2)*f*f*f*f+2)+e}};a.animations.easing.linear={easeIn:function(f,e,h,g){return h*f/g+e},easeOut:function(f,e,h,g){return h*f/g+e},easeInOut:function(f,e,h,g){return h*f/g+e}};a.animations.active={};a.animations.fadeIn=function(b,d,e){var c=new a.animations(b,"opacity",0,1,d,e);c.start()};a.animations.fadeOut=function(b,d,e){var c=new a.animations(b,"opacity",1,0,d,e);c.start()};a.animations.transform=function(c,h,f,i,g,b,e){var j=new a.animations(c,"left",h,i,b,e);var d=new a.animations(c,"top",f,g,b,e);j.start();d.start()}})(jwplayer.html5.utils)};

branches/jw6/src/js/html5/jwplayer.html5.controlbar.js

@@ -26 +26 @@
                 JW_CSS_RIGHT = "right",
                 JW_CSS_100PCT = "100%",
+                JW_CSS_SMOOTH_EASE = "width .25s linear 0s, left .25s linear 0s, opacity .25s ease 0s"
                 
                 CB_CLASS = '.jwcontrolbar';
@@ -31 +32 @@
         /** HTML5 Controlbar class **/
         html5.controlbar = function(api, config) {
-                var _api;
-
-                var _defaults = {
-                        backgroundcolor : "",
-                        margin : 10,
-                        font : "Arial,sans-serif",
-                        fontsize : 10,
-                        fontcolor : parseInt("000000", 16),
-                        fontstyle : "normal",
-                        fontweight : "bold",
-                        buttoncolor : parseInt("ffffff", 16),
-                        // position : html5.view.positions.BOTTOM,
-                        position: "OVER",
-                        idlehide : false,
-                        hideplaylistcontrols : false,
-                        forcenextprev : false,
-                        layout : {
-                                "left" : {
-                                        "position" : "left",
-                                        "elements" : [ {
-                                                "name" : "play",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "prev",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "next",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "elapsed",
-                                                "type" : CB_TEXT
-                                        } ]
-                                },
-                                "center" : {
-                                        "position" : "center",
-                                        "elements" : [ {
-                                                "name" : "time",
-                                                "type" : CB_SLIDER
-                                        } ]
-                                },
-                                "right" : {
-                                        "position" : "right",
-                                        "elements" : [ {
-                                                "name" : "duration",
-                                                "type" : CB_TEXT
-                                        }, {
-                                                "name" : "blank",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "mute",
-                                                "type" : CB_BUTTON
-                                        }, {
-                                                "name" : "volume",
-                                                "type" : CB_SLIDER
-                                        }, {
-                                                "name" : "divider",
-                                                "type" : CB_DIVIDER
-                                        }, {
-                                                "name" : "fullscreen",
-                                                "type" : CB_BUTTON
-                                        } ]
-                                }
-                        }
-                };
-                
-                var _settings, _layout, _elements;
-                
-                var _controlbar, _id;
-                
-                var _toggles = {
-                        play: "pause",
-                        mute: "unmute",
-                        fullscreen: "normalscreen"
-                }
-                
-                var _toggleStates = {
-                        play: false,
-                        mute: false,
-                        fullscreen: false
-                }
-                
-                var _buttonMapping = {
-                        play: _play,
-                        mute: _mute,
-                        fullscreen: _fullscreen
-                };
+                var _api,
+
+                        _defaults = {
+                                backgroundcolor : "",
+                                margin : 10,
+                                font : "Arial,sans-serif",
+                                fontsize : 10,
+                                fontcolor : parseInt("000000", 16),
+                                fontstyle : "normal",
+                                fontweight : "bold",
+                                buttoncolor : parseInt("ffffff", 16),
+                                // position : html5.view.positions.BOTTOM,
+                                position: "OVER",
+                                idlehide : false,
+                                hideplaylistcontrols : false,
+                                forcenextprev : false,
+                                layout : {
+                                        left: {
+                                                position: "left",
+                                                elements: [ {
+                                                        name: "play",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "prev",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "next",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "elapsed",
+                                                        type: CB_TEXT
+                                                } ]
+                                        },
+                                        center: {
+                                                position: "center",
+                                                elements: [ {
+                                                        name: "time",
+                                                        type: CB_SLIDER
+                                                } ]
+                                        },
+                                        right: {
+                                                position: "right",
+                                                elements: [ {
+                                                        name: "duration",
+                                                        type: CB_TEXT
+                                                }, {
+                                                        name: "blank",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "mute",
+                                                        type: CB_BUTTON
+                                                }, {
+                                                        name: "volume",
+                                                        type: CB_SLIDER
+                                                }, {
+                                                        name: "divider",
+                                                        type: CB_DIVIDER
+                                                }, {
+                                                        name: "fullscreen",
+                                                        type: CB_BUTTON
+                                                } ]
+                                        }
+                                }
+                        },
+                
+                        _settings, 
+                        _layout, 
+                        _elements, 
+                        _controlbar, 
+                        _id,
+                        _duration,
+                        
+                        _toggles = {
+                                play: "pause",
+                                mute: "unmute",
+                                fullscreen: "normalscreen"
+                        },
+                        
+                        _toggleStates = {
+                                play: false,
+                                mute: false,
+                                fullscreen: false
+                        },
+                        
+                        _buttonMapping = {
+                                play: _play,
+                                mute: _mute,
+                                fullscreen: _fullscreen,
+                                next: _next,
+                                prev: _prev
+                        },
+                        
+                        _sliderMapping = {
+                                time: _seek,
+                                volume: _volume
+                        }
+                
+                
 
                 function _init() {
@@ -135 +148 @@
                         _api = api;
                         
+
                         config = _utils.extend({}, config);
                         _id = _api.id + "_controlbar";
+                        _duration = 0;
 
                         _controlbar = _createSpan();
                         _controlbar.id = _id;
                         _controlbar.className = "jwcontrolbar";
+
+                        // Slider listeners
+                        window.addEventListener('mousemove', _sliderMouseEvent, false);
+                        window.addEventListener('mouseup', _sliderMouseEvent, false);
 
                         (new html5.skinloader(config.skin, function(skin) {
@@ -148 +167 @@
                                 _createStyles();
                                 _buildControlbar();
-                        }, function(err) { console.log(err); }));
-                        
-                        
-                }
+                                _addEventListeners();
+                        }, function(err) { _utils.log(err); }));
+                }
+                
+                function _addEventListeners() {
+                        _api.addEventListener(jwplayer.events.JWPLAYER_MEDIA_TIME, _timeUpdated);
+                        _api.addEventListener(jwplayer.events.JWPLAYER_PLAYER_STATE, _stateHandler);
+                        _api.addEventListener(jwplayer.events.JWPLAYER_MEDIA_MUTE, _muteHandler);
+                        _api.addEventListener(jwplayer.events.JWPLAYER_MEDIA_VOLUME, _volumeHandler);
+                        _api.addEventListener(jwplayer.events.JWPLAYER_MEDIA_BUFFER, _bufferHandler);
+                }
+                
+                function _timeUpdated(evt) {
+                        _duration = evt.duration;
+                        
+                        if (_elements.elapsed) {
+                                _elements.elapsed.innerHTML = _utils.timeFormat(evt.position);
+                        }
+                        if (_elements.duration) {
+                                _elements.duration.innerHTML = _utils.timeFormat(evt.duration);
+                        }
+                        if (evt.duration > 0) {
+                                _setProgress(evt.position / evt.duration);
+                        } else {
+                                _setProgress(0);
+                        }
+                }
+                
+                function _stateHandler(evt) {
+                        switch (evt.newstate) {
+                        case jwplayer.events.state.PLAYING:
+                        case jwplayer.events.state.BUFFERING:
+                                if (_elements['timeSliderThumb']) {
+                                        _elements['timeSliderThumb'].style.opacity = 1;
+                                }
+                                if (_elements["timeRail"]) {
+                                        _elements["timeRail"].className = "jwrail jwsmooth";
+                                }
+                                _toggleButton("play", true);
+                                break;
+                        case jwplayer.events.state.PAUSED:
+                                if (!_dragging) {
+                                        _toggleButton("play", false);
+                                }
+                                break;
+                        case jwplayer.events.state.IDLE:
+                        case jwplayer.events.state.COMPLETED:
+                                _toggleButton("play", false);
+                                if (_elements['timeSliderThumb']) {
+                                        _elements['timeSliderThumb'].style.opacity = 0;
+                                }
+                                _setBuffer(0);
+                                _timeUpdated({ position: 0, duration: 0});
+                                if (_elements["timeRail"]) {
+                                        _elements["timeRail"].className = "jwrail";
+                                }
+                                break;
+                        }
+                }
+                
+                function _muteHandler(evt) {
+                        _toggleButton("mute", evt.mute);
+                }
+
+                function _volumeHandler(evt) {
+                        _setVolume(evt.volume / 100);
+                }
+
+                function _bufferHandler(evt) {
+                        _setBuffer(evt.bufferPercent / 100);
+                }
+
 
                 /**
@@ -166 +253 @@
                         });
                         
-                        _style(_internalSelector(".text"), {
+                        _style(_internalSelector(".jwtext"), {
                                 font: _settings.fontsize + "px/" + _getSkinElement("background").height + "px " + _settings.font,
                                 color: _settings.fontcolor,
@@ -192 +279 @@
                                 left: _getSkinElement('capLeft').width,
                                 right: _getSkinElement('capRight').width,
-                                'backgroundRepeat': "repeat-x"
+                                'background-repeat': "repeat-x"
                         }, true);
 
@@ -229 +316 @@
                         var element = _createSpan();
                         //element.id = _createElementId(name);
-                        element.className = name;
-                        
-                        var center = nocenter ? "" : "center";
+                        element.className = 'jw'+name;
+                        
+                        var center = nocenter ? " left center" : " center";
 
                         var skinElem = _getSkinElement(name);
@@ -243 +330 @@
                         if (stretch) {
                                 newStyle = {
-                                        background: "url('" + skinElem.src + "') "+center+" repeat-x"
+                                        background: "url('" + skinElem.src + "') repeat-x " + center
                                 };
                         } else {
                                 newStyle = {
-                                        background: "url('" + skinElem.src + "') "+center+" no-repeat",
+                                        background: "url('" + skinElem.src + "') no-repeat" + center,
                                         width: skinElem.width
                                 };
                         }
                         
-                        _style(_internalSelector('.'+name), _utils.extend(newStyle, style));
+                        _style(_internalSelector('.jw'+name), _utils.extend(newStyle, style));
                         _elements[name] = element;
                         return element;
@@ -258 +345 @@
 
                 function _buildButton(name) {
+                        if (!_getSkinElement(name + "Button").src) {
+                                return null;
+                        }
+                        
                         var element = document.createElement("button");
                         //element.id = _createElementId(name);
-                        element.className = name;
-                        element.addEventListener("click", (function(name) { return function() { _buttonClickHandler(name) } })(name));
+                        element.className = 'jw'+name;
+                        element.addEventListener("click", _buttonClickHandler(name), false);
 
                         var outSkin = _getSkinElement(name + "Button");
@@ -267 +358 @@
                         
                         element.innerHTML = " ";
-                        if (!_getSkinElement(name + "Button").src) {
-                                return element;
-                        }
-                        
-                        _buttonStyle(_internalSelector('.'+name), outSkin, overSkin);
+                        
+                        _buttonStyle(_internalSelector('.jw'+name), outSkin, overSkin);
                         var toggle = _toggles[name];
                         if (toggle) {
-                                _buttonStyle(_internalSelector('.'+name+'.toggle'), _getSkinElement(toggle+"Button"), _getSkinElement(toggle+"ButtonOver"));
+                                _buttonStyle(_internalSelector('.jw'+name+'.jwtoggle'), _getSkinElement(toggle+"Button"), _getSkinElement(toggle+"ButtonOver"));
                         }
 
@@ -300 +388 @@
                 
                 function _buttonClickHandler(name) {
-                        if (_buttonMapping[name]) {
-                                _buttonMapping[name]();
+                        return function() {
+                                if (_buttonMapping[name]) {
+                                        _buttonMapping[name]();
+                                }
                         }
                 }
@@ -312 +402 @@
                                 _api.jwPlay();
                         }
-                        _toggleButton("play");
                 }
                 
                 function _mute() {
-                        _toggleButton("mute");
+                        _api.jwSetMute();
+                }
+                
+                function _volume(pct) {
+                        if (pct < 0.1) pct = 0;
+                        if (pct > 0.9) pct = 1;
+                        _api.jwSetVolume(pct * 100)
+                }
+                
+                function _seek(pct) {
+                        if (!_dragging) {
+                                _api.jwPlay();
+                        }
+                        _api.jwSeek(pct * _duration);
                 }
                 
@@ -322 +424 @@
                         _toggleButton("fullscreen");
                 }
-                
-                function _toggleButton(name) {
-                        _elements[name].className = name + (_toggleStates[name] ? "" : " toggle");
-                        _toggleStates[name] ^= true;
+
+                function _next() {
+                        _api.jwPlaylistNext();
+                }
+
+                function _prev() {
+                        _api.jwPlaylistNext();
+                }
+
+                function _toggleButton(name, state) {
+                        if (!_utils.exists(state)) {
+                                state = !_toggleStates[name];
+                        }
+                        if (_elements[name]) {
+                                _elements[name].className = 'jw' + name + (state ? " jwtoggle" : "");
+                        }
+                        _toggleStates[name] = state;
                 }
                 
                 function _createElementId(name) {
-                        //return (_id + "_" + name + Math.round(Math.random()*10000000));
                         return _id + "_" + name;
                 }
@@ -336 +450 @@
                         var element = _createSpan();
                         element.id = _createElementId(name); 
-                        element.className = "text " + name;
+                        element.className = "jwtext jw" + name;
                         
                         var css = {};
@@ -346 +460 @@
                         }
 
-                        _style(_internalSelector('.'+name), css);
+                        _style(_internalSelector('.jw'+name), css);
                         element.innerHTML = "00:00";
                         _elements[name] = element;
@@ -355 +469 @@
                         if (divider.width) {
                                 var element = _createSpan();
-                                element.className = "blankDivider";
+                                element.className = "jwblankDivider";
                                 _style(element, {
                                         width: parseInt(divider.width)
@@ -369 +483 @@
                 function _buildSlider(name) {
                         var slider = _createSpan();
-                        //slider.id = _createElementId(name);
-                        slider.className = "slider " + name;
-
-                        var rail = _createSpan();
-                        rail.className = "rail";
-
-                        var railElements = ['Rail', 'Buffer', 'Progress'];
-
-                        for (var i=0; i<railElements.length; i++) {
-                                var element = _buildImage(name + "Slider" + railElements[i], null, true, (name=="volume"));
-                                if (element) {
-                                        element.className += " stretch";
-                                        rail.appendChild(element);
-                                }
-                        }
-                        
-                        var thumb = _buildImage(name + "SliderThumb");
-                        if (thumb) {
-                                thumb.className += " thumb";
-                                rail.appendChild(thumb);
-                        }
+                        slider.className = "jwslider jw" + name;
+
 
                         var capLeft = _buildImage(name + "SliderCapLeft");
                         var capRight = _buildImage(name + "SliderCapRight");
-                        if (capRight) capRight.className += " capRight";
-
+                        if (capRight) capRight.className += " jwcapRight";
+
+                        var rail = _buildSliderRail(name);
+                        
                         if (capLeft) slider.appendChild(capLeft);
                         slider.appendChild(rail);
                         if (capLeft) slider.appendChild(capRight);
 
-                        _style(_internalSelector("." + name + " .rail"), {
+                        _style(_internalSelector(".jw" + name + " .jwrail"), {
                                 left: _getSkinElement(name+"SliderCapLeft").width,
                                 right: _getSkinElement(name+"SliderCapRight").width,
                         });
+
+                        _elements[name] = slider;
 
                         if (name == "time") {
@@ -412 +511 @@
                         }
 
-                        _elements[name] = slider;
-                        
-                return slider;
-                }
+                        
+                        return slider;
+                }
+                
+                function _buildSliderRail(name) {
+                        var rail = _createSpan();
+                        rail.className = "jwrail jwsmooth";
+
+                        var railElements = ['Rail', 'Buffer', 'Progress'];
+
+                        for (var i=0; i<railElements.length; i++) {
+                                var element = _buildImage(name + "Slider" + railElements[i], null, true, (name=="volume"));
+                                if (element) {
+                                        element.className += " jwstretch";
+                                        rail.appendChild(element);
+                                }
+                        }
+                        
+                        var thumb = _buildImage(name + "SliderThumb");
+                        if (thumb) {
+                                thumb.className += " jwthumb";
+                                thumb.style.opacity = 0;
+                                rail.appendChild(thumb);
+                        }
+                        
+                        rail.addEventListener('mousedown', _sliderMouseDown(name), false);
+                        
+                        _elements[name+'Rail'] = rail;
+                        
+                        return rail;
+                }
+                
+                var _dragging;
+                
+                function _sliderMouseDown(name) {
+                        return (function(evt) {
+                                if (evt.button != 0)
+                                        return;
+                                
+                                _elements[name+'Rail'].className = "jwrail";
+                                
+                                if (name == "time") {
+                                        if (_api.jwGetState() != jwplayer.events.state.IDLE) {
+                                                _api.jwPause();
+                                                _dragging = name;
+                                        }
+                                } else {
+                                        _dragging = name;
+                                }
+                        });
+                }
+                
+                var _lastSeekTime = 0;
+                
+                function _sliderMouseEvent(evt) {
+                        if (!_dragging || evt.button != 0) {
+                                return;
+                        }
+                        
+                        var rail = _elements[_dragging].getElementsByClassName('jwrail')[0],
+                                railRect = _utils.getBoundingClientRect(rail),
+                                pct = (evt.clientX - railRect.left) / railRect.width;
+                        
+                        if (evt.type == 'mouseup') {
+                                var name = _dragging;
+                                _elements[name+'Rail'].className = "jwrail jwsmooth";
+                                _dragging = null;
+                                _sliderMapping[name](pct);
+                        } else {
+                                if (_dragging == "time") {
+                                        _setProgress(pct);
+                                } else {
+                                        _setVolume(pct);
+                                }
+                                var currentTime = (new Date()).getTime();
+                                if (currentTime - _lastSeekTime > 500) {
+                                        _lastSeekTime = currentTime;
+                                        _sliderMapping[_dragging](pct);
+                                }
+                        }
+                }
+
         
                 function _styleTimeSlider(slider) {
                         if (_elements['timeSliderThumb']) {
-                                _style(_internalSelector(".timeSliderThumb"), {
+                                _style(_internalSelector(".jwtimeSliderThumb"), {
                                         'margin-left': (_getSkinElement("timeSliderThumb").width/-2)
                                 });
@@ -434 +611 @@
                                 railWidth = _getSkinElement("volumeSliderRail").width;
                         
-                        _style(_internalSelector(".volume"), {
+                        _style(_internalSelector(".jwvolume"), {
                                 width: (capLeftWidth + railWidth + capRightWidth)
                         });
@@ -449 +626 @@
                         _controlbar.appendChild(_groups.right);
                         
-                        _style(_internalSelector(".right"), {
+                        _style(_internalSelector(".jwright"), {
                                 right: _getSkinElement("capRight").width
                         });
@@ -457 +634 @@
                 function _buildGroup(pos) {
                         var elem = _createSpan();
-                        elem.className = "group " + pos;
+                        elem.className = "jwgroup jw" + pos;
                         _groups[pos] = elem;
                         if (_layout[pos]) {
@@ -476 +653 @@
 
                 var _resize = this.resize = function(width, height) {
-                        _style(_internalSelector('.group.center'), {
-                                left: _utils.parseDimension(_groups.left.offsetWidth) + _getSkinElement("capLeft").width,
-                                right: _utils.parseDimension(_groups.right.offsetWidth) + _getSkinElement("capRight").width
+                        _style(_internalSelector('.jwgroup.jwcenter'), {
+                                left: Math.round(_utils.parseDimension(_groups.left.offsetWidth) + _getSkinElement("capLeft").width),
+                                right: Math.round(_utils.parseDimension(_groups.right.offsetWidth) + _getSkinElement("capRight").width)
                         });
                 }
@@ -488 +665 @@
                 var _setBuffer = this.setBuffer = function(pct) {
                         pct = Math.min(Math.max(0, pct), 1);
-                        _elements['timeSliderBuffer'].style.width = 100 * pct + "%";
+                        _elements['timeSliderBuffer'].style.width = pct * _utils.getBoundingClientRect(_elements['timeSliderRail']).width + "px";
                 }
 
                 function _sliderPercent(name, pct, fixedWidth) {
+                        if (!_elements[name]) return;
+
                         pct = Math.min(Math.max(0, pct), 1);
                         
                         var progress = _elements[name+'SliderProgress'];
                         var thumb = _elements[name+'SliderThumb'];
-                        
+                        var width = pct * _utils.getBoundingClientRect(_elements[name+'SliderRail']).width + "px";
+                
                         if (progress) {
-                                progress.style.width = 100 * pct + "%";
+                                progress.style.width = width; 
                         }
                         if (thumb) {
-                                thumb.style.left = pct * _utils.parseDimension(_elements[name+'SliderRail'].clientWidth) + "px";
-                                //thumb.style.opacity = 0.5; //(pct <= 0 || pct >= 1) ? 0 : 1;
-                        }
-                }
-                
-                var _setVolume = this.setVolume = function(pct) {
+                                thumb.style.left = width;
+                        }
+                }
+                
+                function _setVolume (pct) {
                         _sliderPercent('volume', pct, true);
                 }
 
-                var _setProgress = this.setProgress = function(pct) {
+                function _setProgress(pct) {
                         _sliderPercent('time', pct);
                 }
@@ -550 +729 @@
                         'user-drag': JW_CSS_NONE
                 });
-            _style(CB_CLASS+' .group', {
+            _style(CB_CLASS+' .jwgroup', {
                 display: JW_CSS_INLINE
             });
-            _style(CB_CLASS+' span, '+CB_CLASS+' .group button,'+CB_CLASS+' .left', {
+            _style(CB_CLASS+' span, '+CB_CLASS+' .jwgroup button,'+CB_CLASS+' .jwleft', {
                 position: JW_CSS_RELATIVE,
                         'float': JW_CSS_LEFT
             });
-                _style(CB_CLASS+' .right', {
-                        position: JW_CSS_RELATIVE,
-                        'float': JW_CSS_RIGHT
+                _style(CB_CLASS+' .jwright', {
+                        position: JW_CSS_ABSOLUTE
                 });
-            _style(CB_CLASS+' .center', {
-                position: JW_CSS_ABSOLUTE,
-                        'float': JW_CSS_LEFT
+            _style(CB_CLASS+' .jwcenter', {
+                position: JW_CSS_ABSOLUTE
             });
             _style(CB_CLASS+' button', {
@@ -570 +747 @@
                 border: JW_CSS_NONE,
                 cursor: 'pointer',
-                '-webkit-transition': 'background .5s',
-                '-moz-transition': 'background .5s',
-                '-o-transition': 'background 1s'
+                '-webkit-transition': 'background-image .25s',
+                '-moz-transition': 'background-image .25s',
+                '-o-transition': 'background-image .25s'
             });
-            _style(CB_CLASS+' button:hover', {
-                '-webkit-transition': 'background 0s',
-                '-moz-transition': 'background 0s',
-                '-o-transition': 'background 0s'
-            });
-            _style(CB_CLASS+' .capRight', { 
+            _style(CB_CLASS+' .jwcapRight', { 
                         right: 0,
                         position: JW_CSS_ABSOLUTE
                 });
-            _style(CB_CLASS+' .time,' + CB_CLASS + ' .group span.stretch', {
+            _style(CB_CLASS+' .jwtime,' + CB_CLASS + ' .jwgroup span.jwstretch', {
                 position: JW_CSS_ABSOLUTE,
                 height: JW_CSS_100PCT,
@@ -589 +761 @@
                 left: 0
             });
-            _style(CB_CLASS+' .rail,' + CB_CLASS + ' .thumb', {
+            _style(CB_CLASS+' .jwrail,' + CB_CLASS + ' .jwthumb', {
                 position: JW_CSS_ABSOLUTE,
                 height: JW_CSS_100PCT,
                 cursor: 'pointer'
             });
-            _style(CB_CLASS + ' .timeSliderThumb', {
-                '-webkit-transition': 'left .5s linear 0s, opacity .5s ease .5s',
-                '-moz-transition': 'left .5s linear 0s, opacity .5s ease .5s'
-                //-o-transition: 'left .5s linear 0s, opacity .5s ease .5s' -- this produces console errors in Opera
-            });             
-            _style(CB_CLASS + ' .timeSliderProgress,' + CB_CLASS + ' .timeSliderBuffer', {
-                '-webkit-transition': 'width .5s linear',
-                '-moz-transition': 'width .5s linear',
-                '-o-transition': 'width .5s linear'
+            _style(CB_CLASS + ' .jwtime .jwsmooth span', {
+                '-webkit-transition': JW_CSS_SMOOTH_EASE,
+                '-moz-transition': JW_CSS_SMOOTH_EASE,
+                '-o-transition': JW_CSS_SMOOTH_EASE
             });
-            _style(CB_CLASS + ' .volume', {
-                display: JW_CSS_INLINE_BLOCK
-            });
-            _style(CB_CLASS + ' .divider+.divider', {
+            _style(CB_CLASS + ' .jwdivider+.jwdivider', {
                 display: JW_CSS_NONE
             });
-            _style(CB_CLASS + ' .text', {
+            _style(CB_CLASS + ' .jwtext', {
                         padding: '0 5px',
-                        textAlign: 'center'
+                        'text-align': 'center'
                 });
 
@@ -618 +782 @@
         
         _generalStyles();
+        
 })(jwplayer.html5);

branches/jw6/src/js/html5/jwplayer.html5.player.js

@@ -12 +12 @@
                 function _init() {
                         _model = {
+                                id: "player",
                                 video: new html5.video(document.createElement("video")),
-                                settings: config
-                        };
-                
-                        _api.id = "player";
-                        _api.settings = _model.settings;
-
-                        _view = {
-                                container: document.getElementById(_api.id),
-                                controlbar: new html5.controlbar(_api, _model.settings)
+                                settings: config,
+                                volume: 0,
+                                state: jwplayer.events.state.IDLE,
+                                mute: false
                         };
                         
+                        jwplayer.utils.extend(_model, new jwplayer.events.eventdispatcher());
+                        _model.video.addGlobalListener(function(evt) {
+                                switch (evt.type) {
+                                case jwplayer.events.JWPLAYER_MEDIA_MUTE:
+                                        if (_model.mute == evt.mute) return;
+                                        _model.mute = evt.mute;
+                                        break;
+                                case jwplayer.events.JWPLAYER_MEDIA_VOLUME:
+                                        if (_model.volume == evt.volume) return;
+                                        _model.volume = evt.volume;
+                                        break;
+                                case jwplayer.events.JWPLAYER_PLAYER_STATE:
+                                        if (_model.state == evt.newstate) return;
+                                        _model.state = evt.newstate;
+                                }
+                                _model.sendEvent(evt.type, evt);
+                        });
+                
+                        _api.id = _model.id;
+                        _api.settings = _model.settings;
+                        
+                        _view = {};
+                        
                         _controller = new html5.controller(_model, _view);
+                        _api.addEventListener = _controller.addEventListener;
+                        _api.removeEventListener = _controller.removeEventListener;
+                        
+                        _view.container = document.getElementById(_api.id),
+                        _view.controlbar = new html5.controlbar(_api, _model.settings)
+
                 
                         jwplayer.utils.appendStylesheet("#"+_api.id+" video", {
@@ -30 +55 @@
                                 height: "100%",
                                 background: "#000",
-                                display: "none"
+                                opacity: 0,
+                                '-webkit-transition': 'opacity .15s ease'
                         });
                         
@@ -36 +62 @@
                         _view.container.appendChild(_view.controlbar.getDisplayElement());
                         
+                        _controller.load();
                 }
                 
@@ -41 +68 @@
                 this.jwPause = function(){ _controller.pause() };
                 this.jwStop = function(){ _controller.stop() };
+                this.jwSeek = function(pos){ _controller.seek(pos) };
+                this.jwSetVolume = function(vol){ _controller.volume(vol) };
+                this.jwSetMute = function(state){ _controller.mute(state) };
+                this.jwLoad = function(item) { _controller.load(item); }
+                this.jwPlaylistNext = function() { _controller.next(); }
+                this.jwPlaylistPrev = function() { _controller.prev(); }
+                this.jwPlaylistItem = function(item) { _controller.item(item); }
+                this.jwFullscreen = function(state) { _controller.fullscreen(state); }
+                
+                this.jwGetState = function(){ return _model.state };
+                this.jwGetVolume = function(){ return _model.volume };
+                this.jwGetMute = function(){ return _model.mute };
+                this.jwGetFullscreen = function(){ return false };
+
+
+                
                 
                 _init();

branches/jw6/src/js/html5/jwplayer.html5.video.js

@@ -6 +6 @@
  */
 (function(jwplayerhtml5) {
-        
-  /** HTML5 video class * */
-  jwplayerhtml5.video = function(videotag) {
-          
-          var _mediaEvents = {
-                  "abort": _videoEventHandler,
-                  "canplay": _canPlayHandler,
-                  "canplaythrough": _videoEventHandler,
-                  "durationchange": _videoEventHandler,
-                  "emptied": _videoEventHandler,
-                  "ended": _videoEventHandler,
-                  "error": _errorHandler,
-                  "loadeddata": _videoEventHandler,
-                  "loadedmetadata": _videoEventHandler,
-                  "loadstart": _videoEventHandler,
-                  "pause": _videoEventHandler,
-                  "play": _videoEventHandler,
-                  "playing": _videoEventHandler,
-                  "progress": _videoEventHandler,
-                  "ratechange": _videoEventHandler,
-                  "readystatechange": _videoEventHandler,
-                  "seeked": _videoEventHandler,
-                  "seeking": _videoEventHandler,
-                  "stalled": _videoEventHandler,
-                  "suspend": _videoEventHandler,
-                  "timeupdate": _videoEventHandler,
-                  "volumechange": _videoEventHandler,
-                  "waiting": _videoEventHandler
-          };
-          
-          // Reference to the video tag
-          var _video;
-          // Whether seeking is ready yet
-          var _canSeek;
-          // If we should seek on canplay
-          var _delayedSeek;
-          
-          // Constructor
-          function _init(videotag) {
-                _video = videotag;
-                _setupListeners();
-          }
-          
-          function _setupListeners() {
-                  for (var evt in _mediaEvents) {
-                          _video.addEventListener(evt, _mediaEvents[evt]);
-                  }
-          }
-          
-          function _videoEventHandler(evt) {
-                  console.log("%s %o (%s,%s)", evt.type, evt, _bufferedStart(), _bufferedEnd());
-          }
-
-          function _canPlayHandler(evt) {
-                  _canSeek = true;
-                  _videoEventHandler(evt);
-                  if (_delayedSeek > 0) {
-                          _seek(_delayedSeek);
-                  }
-          }
-          
-          function _errorHandler(evt) {
-                  console.log("Error: %o", _video.error);
-                  _videoEventHandler(evt);
-          }
-
-          function _bufferedStart() {
-                 if (_video.buffered.length > 0)
-                         return _video.buffered.start(0);
-                 else
-                         return 0;
-          }
-          
-          function _bufferedEnd() {
-                  if (_video.buffered.length > 0)
-                         return Math.ceil(_video.buffered.end(_video.buffered.length-1));
-                  else
-                         return 0;
-          }
-
-          var _file;
-          
-          this.load = function(videoURL) {
-                  _canSeek = false;
-                  _delayedSeek = 0;
-                  _file = videoURL;
-                  _video.src = _file;
-                  _video.load();
-                  //_video.pause();
-          }
-          
-          this.stop = function() {
-                  //_video.src = "";
-                  _video.removeAttribute("src");
-                  _video.load();
-                  _video.style.display = "none";
-          }
-          
-          this.play = function() {
-                  _video.style.display = "block";
-                  _video.play();
-          }
-
-          this.pause = function() {
-                  _video.pause();
-          }
-
-          var _seek = this.seek = function(pos) {
-                  if (_canSeek) {
-                          _delayedSeek = 0;
-                          _video.play();
-                          _video.currentTime = pos;
-                  } else {
-                          _delayedSeek = pos;
-                  }
-          }
-
-          // Provide access to video tag
-          // TODO: remove
-          this.getTag = function() {
-                  return videotag;
-          }
-          
-          // Call constructor
-          _init(videotag);
-          
-  }
-  
+
+        var _utils = jwplayer.utils;
+
+        /** HTML5 video class * */
+        jwplayerhtml5.video = function(videotag) {
+
+                var _mediaEvents = {
+                        "abort" : _generalHandler,
+                        "canplay" : _canPlayHandler,
+                        "canplaythrough" : _generalHandler,
+                        "durationchange" : _durationUpdateHandler,
+                        "emptied" : _generalHandler,
+                        "ended" : _generalHandler,
+                        "error" : _errorHandler,
+                        "loadeddata" : _generalHandler,
+                        "loadedmetadata" : _generalHandler,
+                        "loadstart" : _generalHandler,
+                        "pause" : _playHandler,
+                        "play" : _playHandler,
+                        "playing" : _generalHandler,
+                        "progress" : _generalHandler,
+                        "ratechange" : _generalHandler,
+                        "readystatechange" : _generalHandler,
+                        "seeked" : _generalHandler,
+                        "seeking" : _generalHandler,
+                        "stalled" : _generalHandler,
+                        "suspend" : _generalHandler,
+                        "timeupdate" : _timeUpdateHandler,
+                        "volumechange" : _volumeHandler,
+                        "waiting" : _generalHandler
+                },
+
+                // Reference to the video tag
+                _video,
+                // Whether seeking is ready yet
+                _canSeek,
+                // If we should seek on canplay
+                _delayedSeek,
+                // Current media state
+                _state = jwplayer.events.state.IDLE,
+                // Save the volume state before muting
+                _lastVolume = 0,
+                // Using setInterval to check buffered ranges
+                _bufferInterval = -1,
+                // Last sent buffer amount
+                _bufferPercent = -1,
+                // Event dispatcher
+                _eventDispatcher = new jwplayer.events.eventdispatcher();
+
+                _utils.extend(this, _eventDispatcher);
+
+                // Constructor
+                function _init(videotag) {
+                        _video = videotag;
+                        _setupListeners();
+                }
+
+                function _setupListeners() {
+                        for (var evt in _mediaEvents) {
+                                _video.addEventListener(evt, _mediaEvents[evt], false);
+                        }
+                }
+
+                function _sendEvent(type, data) {
+                        _eventDispatcher.sendEvent(type, data);
+                }
+
+                
+                function _generalHandler(evt) {
+                        //console.log("%s %o (%s,%s)", evt.type, evt);
+                }
+
+                function _durationUpdateHandler(evt) {
+                        _duration = _video.duration;
+                        _timeUpdateHandler();
+                }
+
+                function _timeUpdateHandler(evt) {
+                        if (_state == jwplayer.events.state.PLAYING) {
+                                _sendEvent(jwplayer.events.JWPLAYER_MEDIA_TIME, {
+                                        position : _video.currentTime,
+                                        duration : _duration
+                                });
+                                if (_video.currentTime >= _duration) {
+                                        _complete();
+                                }
+                        }
+                }
+
+                function _canPlayHandler(evt) {
+                        _canSeek = true;
+                        _generalHandler(evt);
+                        if (_delayedSeek > 0) {
+                                _seek(_delayedSeek);
+                        }
+                }
+
+                function _playHandler(evt) {
+                        if (_video.paused) {
+                                _setState(jwplayer.events.state.PAUSED);
+                        } else {
+                                _setState(jwplayer.events.state.PLAYING);
+                        }
+                }
+
+                function _errorHandler(evt) {
+                        console.log("Error: %o", _video.error);
+                        _generalHandler(evt);
+                }
+
+                this.load = function(videoURL) {
+                        _canSeek = false;
+                        _delayedSeek = 0;
+                        _duration = 0;
+                        _video.src = videoURL;
+                        _video.load();
+                        
+                        _bufferInterval = setInterval(_sendBufferUpdate, 100);
+                        // _video.pause();
+                }
+
+                var _stop = this.stop = function() {
+                        // _video.src = "";
+                        _video.removeAttribute("src");
+                        _video.load();
+                        _video.style.opacity = 0;
+                        clearInterval(_bufferInterval);
+                        _setState(jwplayer.events.state.IDLE);
+                }
+
+                this.play = function() {
+                        _video.style.opacity = 1;
+                        _video.play();
+                }
+
+                this.pause = function() {
+                        _video.pause();
+                }
+
+                var _seek = this.seek = function(pos) {
+                        if (_canSeek) {
+                                _delayedSeek = 0;
+                                // _video.play();
+                                _video.currentTime = pos;
+                        } else {
+                                _delayedSeek = pos;
+                        }
+                }
+
+                var _volume = this.volume = function(vol) {
+                        if (_video.muted) _video.muted = false;
+                        _video.volume = vol / 100;
+
+                }
+                
+                function _volumeHandler(evt) {
+                        _sendEvent(jwplayer.events.JWPLAYER_MEDIA_VOLUME, {
+                                volume: Math.round(_video.volume * 100)
+                        });
+                        _sendEvent(jwplayer.events.JWPLAYER_MEDIA_MUTE, {
+                                mute: _video.muted
+                        });
+                }
+                
+                this.mute = function(state) {
+                        if (!_utils.exists(state)) state = !_video.mute;
+                        if (state) {
+                                _lastVolume = _video.volume * 100;
+                                _volume(0);
+                                _video.muted = true;
+                        } else {
+                                _volume(_lastVolume);
+                        }
+                }
+
+                /** Set the current player state * */
+                function _setState(newstate) {
+                        // Handles a FF 3.5 issue
+                        if (newstate == jwplayer.events.state.PAUSED && _state == jwplayer.events.state.IDLE) {
+                                return;
+                        }
+
+                        if (_state != newstate) {
+                                var oldstate = _state;
+                                _state = newstate;
+                                _sendEvent(jwplayer.events.JWPLAYER_PLAYER_STATE, {
+                                        oldstate : oldstate,
+                                        newstate : newstate
+                                });
+                        }
+                }
+                
+                function _sendBufferUpdate() {
+                        var newBuffer = _getBuffer();
+                        if (newBuffer != _bufferPercent) {
+                                _bufferPercent = newBuffer;
+                                _sendEvent(jwplayer.events.JWPLAYER_MEDIA_BUFFER, {
+                                        bufferPercent: Math.round(_bufferPercent * 100)
+                                });
+                        }
+                        if (newBuffer >= 1) {
+                                clearInterval(_bufferInterval);
+                        }
+                }
+                
+                function _getBuffer() {
+                        if (_video.buffered.length == 0 || _video.duration == 0)
+                                return 0;
+                        else
+                                return _video.buffered.end(_video.buffered.length-1) / _video.duration;
+                }
+                
+
+                function _complete() {
+                        _stop();
+                        _sendEvent(jwplayer.events.JWPLAYER_MEDIA_COMPLETE);
+                }
+                
+                // Provide access to video tag
+                // TODO: remove
+                this.getTag = function() {
+                        return videotag;
+                }
+
+                // Call constructor
+                _init(videotag);
+
+        }
+
 })(jwplayer.html5);

branches/jw6/src/js/utils/jwplayer.utils.js

@@ -212 +212 @@
         }
 
-
+        /** Format the elapsed / remaining text. **/
+        utils.timeFormat = function(sec) {
+                if (sec > 0) {
+                        str = Math.floor(sec / 60) < 10 ? "0" + Math.floor(sec / 60) + ":" : Math.floor(sec / 60) + ":";
+                        str += Math.floor(sec % 60) < 10 ? "0" + Math.floor(sec % 60) : Math.floor(sec % 60);
+                        return str;
+                } else {
+                        return "00:00";
+                }
+        }
+
+        /** Logger * */
+        jwplayer.utils.log = function(msg, obj) {
+                if (typeof console != "undefined" && typeof console.log != "undefined") {
+                        if (obj) {
+                                console.log(msg, obj);
+                        } else {
+                                console.log(msg);
+                        }
+                }
+        };
+
+        /** Replacement for getBoundingClientRect, which isn't supported in iOS 3.1.2 **/
+        jwplayer.utils.getBoundingClientRect = function(element) {
+                if (typeof element.getBoundingClientRect == "function") {
+                        return element.getBoundingClientRect();
+                } else {
+                        return { 
+                                left: element.offsetLeft + document.body.scrollLeft, 
+                                top: element.offsetTop + document.body.scrollTop, 
+                                width: element.offsetWidth, 
+                                height: element.offsetHeight
+                        };
+                }
+        }
+        
 })(jwplayer);