Update MediaElement.js to 2.11.0.
Props wonderboymusic see #24015 git-svn-id: http://core.svn.wordpress.org/trunk@23958 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
parent
3bcdb3fa1a
commit
338c2afd86
Binary file not shown.
|
@ -8,14 +8,14 @@
|
|||
* Can play MP4 (H.264), Ogg, WebM, FLV, WMV, WMA, ACC, and MP3
|
||||
*
|
||||
* Copyright 2010-2012, John Dyer (http://j.hn)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* License: MIT
|
||||
*
|
||||
*/
|
||||
// Namespace
|
||||
var mejs = mejs || {};
|
||||
|
||||
// version number
|
||||
mejs.version = '2.10.1';
|
||||
mejs.version = '2.11.0';
|
||||
|
||||
// player number (for missing, same id attr)
|
||||
mejs.meIndex = 0;
|
||||
|
@ -30,13 +30,14 @@ mejs.plugins = {
|
|||
//,{version: [12,0], types: ['video/webm']} // for future reference (hopefully!)
|
||||
],
|
||||
youtube: [
|
||||
{version: null, types: ['video/youtube', 'video/x-youtube']}
|
||||
{version: null, types: ['video/youtube', 'video/x-youtube', 'audio/youtube', 'audio/x-youtube']}
|
||||
],
|
||||
vimeo: [
|
||||
{version: null, types: ['video/vimeo', 'video/x-vimeo']}
|
||||
]
|
||||
};
|
||||
|
||||
|
||||
/*
|
||||
Utility methods
|
||||
*/
|
||||
|
@ -148,7 +149,7 @@ mejs.Utility = {
|
|||
/* borrowed from SWFObject: http://code.google.com/p/swfobject/source/browse/trunk/swfobject/src/swfobject.js#474 */
|
||||
removeSwf: function(id) {
|
||||
var obj = document.getElementById(id);
|
||||
if (obj && obj.nodeName == "OBJECT") {
|
||||
if (obj && /object|embed/i.test(obj.nodeName)) {
|
||||
if (mejs.MediaFeatures.isIE) {
|
||||
obj.style.display = "none";
|
||||
(function(){
|
||||
|
@ -377,7 +378,6 @@ mejs.MediaFeatures = {
|
|||
};
|
||||
mejs.MediaFeatures.init();
|
||||
|
||||
|
||||
/*
|
||||
extension methods to <video> or <audio> object to bring it into parity with PluginMediaElement (see below)
|
||||
*/
|
||||
|
@ -442,6 +442,7 @@ mejs.PluginMediaElement = function (pluginid, pluginType, mediaUrl) {
|
|||
this.pluginType = pluginType;
|
||||
this.src = mediaUrl;
|
||||
this.events = {};
|
||||
this.attributes = {};
|
||||
};
|
||||
|
||||
// JavaScript values and ExternalInterface methods that match HTML5 video properties methods
|
||||
|
@ -532,13 +533,13 @@ mejs.PluginMediaElement.prototype = {
|
|||
for (j=0; j<pluginInfo.types.length; j++) {
|
||||
// find plugin that can play the type
|
||||
if (type == pluginInfo.types[j]) {
|
||||
return true;
|
||||
return 'probably';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
return '';
|
||||
},
|
||||
|
||||
positionFullscreenButton: function(x,y,visibleAndAbove) {
|
||||
|
@ -683,7 +684,6 @@ mejs.PluginMediaElement.prototype = {
|
|||
// end: fake events
|
||||
|
||||
// fake DOM attribute methods
|
||||
attributes: {},
|
||||
hasAttribute: function(name){
|
||||
return (name in this.attributes);
|
||||
},
|
||||
|
@ -702,6 +702,7 @@ mejs.PluginMediaElement.prototype = {
|
|||
|
||||
remove: function() {
|
||||
mejs.Utility.removeSwf(this.pluginElement.id);
|
||||
mejs.MediaPluginBridge.unregisterPluginElement(this.pluginElement.id);
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -716,6 +717,11 @@ mejs.MediaPluginBridge = {
|
|||
this.htmlMediaElements[id] = htmlMediaElement;
|
||||
},
|
||||
|
||||
unregisterPluginElement: function (id) {
|
||||
delete this.pluginMediaElements[id];
|
||||
delete this.htmlMediaElements[id];
|
||||
},
|
||||
|
||||
// when Flash/Silverlight is ready, it calls out to this method
|
||||
initPlugin: function (id) {
|
||||
|
||||
|
@ -1211,7 +1217,7 @@ mejs.HtmlMediaElementShim = {
|
|||
switch (playback.method) {
|
||||
case 'silverlight':
|
||||
container.innerHTML =
|
||||
'<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" id="' + pluginid + '" name="' + pluginid + '" width="' + width + '" height="' + height + '">' +
|
||||
'<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" id="' + pluginid + '" name="' + pluginid + '" width="' + width + '" height="' + height + '" class="mejs-shim">' +
|
||||
'<param name="initParams" value="' + initVars.join(',') + '" />' +
|
||||
'<param name="windowless" value="true" />' +
|
||||
'<param name="background" value="black" />' +
|
||||
|
@ -1228,7 +1234,7 @@ mejs.HtmlMediaElementShim = {
|
|||
container.appendChild(specialIEContainer);
|
||||
specialIEContainer.outerHTML =
|
||||
'<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="//download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab" ' +
|
||||
'id="' + pluginid + '" width="' + width + '" height="' + height + '">' +
|
||||
'id="' + pluginid + '" width="' + width + '" height="' + height + '" class="mejs-shim">' +
|
||||
'<param name="movie" value="' + options.pluginPath + options.flashName + '?x=' + (new Date()) + '" />' +
|
||||
'<param name="flashvars" value="' + initVars.join('&') + '" />' +
|
||||
'<param name="quality" value="high" />' +
|
||||
|
@ -1253,7 +1259,8 @@ mejs.HtmlMediaElementShim = {
|
|||
'src="' + options.pluginPath + options.flashName + '" ' +
|
||||
'flashvars="' + initVars.join('&') + '" ' +
|
||||
'width="' + width + '" ' +
|
||||
'height="' + height + '"></embed>';
|
||||
'height="' + height + '" ' +
|
||||
'class="mejs-shim"></embed>';
|
||||
}
|
||||
break;
|
||||
|
||||
|
@ -1286,16 +1293,16 @@ mejs.HtmlMediaElementShim = {
|
|||
|
||||
pluginMediaElement.vimeoid = playback.url.substr(playback.url.lastIndexOf('/')+1);
|
||||
|
||||
container.innerHTML ='<iframe src="http://player.vimeo.com/video/' + pluginMediaElement.vimeoid + '?portrait=0&byline=0&title=0" width="' + width +'" height="' + height +'" frameborder="0"></iframe>';
|
||||
container.innerHTML ='<iframe src="http://player.vimeo.com/video/' + pluginMediaElement.vimeoid + '?portrait=0&byline=0&title=0" width="' + width +'" height="' + height +'" frameborder="0" class="mejs-shim"></iframe>';
|
||||
|
||||
/*
|
||||
container.innerHTML =
|
||||
'<object width="' + width + '" height="' + height + '">' +
|
||||
'<object width="' + width + '" height="' + height + '" class="mejs-shim">' +
|
||||
'<param name="allowfullscreen" value="true" />' +
|
||||
'<param name="allowscriptaccess" value="always" />' +
|
||||
'<param name="flashvars" value="api=1" />' +
|
||||
'<param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=' + pluginMediaElement.vimeoid + '&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=00adef&fullscreen=1&autoplay=0&loop=0" />' +
|
||||
'<embed src="//vimeo.com/moogaloop.swf?api=1&clip_id=' + pluginMediaElement.vimeoid + '&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=00adef&fullscreen=1&autoplay=0&loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="' + width + '" height="' + height + '"></embed>' +
|
||||
'<embed src="//vimeo.com/moogaloop.swf?api=1&clip_id=' + pluginMediaElement.vimeoid + '&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=00adef&fullscreen=1&autoplay=0&loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="' + width + '" height="' + height + '" class="mejs-shim"></embed>' +
|
||||
'</object>';
|
||||
*/
|
||||
|
||||
|
@ -1479,7 +1486,7 @@ mejs.YouTubeApi = {
|
|||
/*
|
||||
settings.container.innerHTML =
|
||||
'<object type="application/x-shockwave-flash" id="' + settings.pluginId + '" data="//www.youtube.com/apiplayer?enablejsapi=1&playerapiid=' + settings.pluginId + '&version=3&autoplay=0&controls=0&modestbranding=1&loop=0" ' +
|
||||
'width="' + settings.width + '" height="' + settings.height + '" style="visibility: visible; ">' +
|
||||
'width="' + settings.width + '" height="' + settings.height + '" style="visibility: visible; " class="mejs-shim">' +
|
||||
'<param name="allowScriptAccess" value="always">' +
|
||||
'<param name="wmode" value="transparent">' +
|
||||
'</object>';
|
||||
|
@ -1493,7 +1500,7 @@ mejs.YouTubeApi = {
|
|||
specialIEContainer = document.createElement('div');
|
||||
settings.container.appendChild(specialIEContainer);
|
||||
specialIEContainer.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="//download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab" ' +
|
||||
'id="' + settings.pluginId + '" width="' + settings.width + '" height="' + settings.height + '">' +
|
||||
'id="' + settings.pluginId + '" width="' + settings.width + '" height="' + settings.height + '" class="mejs-shim">' +
|
||||
'<param name="movie" value="' + youtubeUrl + '" />' +
|
||||
'<param name="wmode" value="transparent" />' +
|
||||
'<param name="allowScriptAccess" value="always" />' +
|
||||
|
@ -1502,7 +1509,7 @@ mejs.YouTubeApi = {
|
|||
} else {
|
||||
settings.container.innerHTML =
|
||||
'<object type="application/x-shockwave-flash" id="' + settings.pluginId + '" data="' + youtubeUrl + '" ' +
|
||||
'width="' + settings.width + '" height="' + settings.height + '" style="visibility: visible; ">' +
|
||||
'width="' + settings.width + '" height="' + settings.height + '" style="visibility: visible; " class="mejs-shim">' +
|
||||
'<param name="allowScriptAccess" value="always">' +
|
||||
'<param name="wmode" value="transparent">' +
|
||||
'</object>';
|
||||
|
@ -1524,7 +1531,7 @@ mejs.YouTubeApi = {
|
|||
// load the youtube video
|
||||
player.cueVideoById(settings.videoId);
|
||||
|
||||
var callbackName = settings.containerId + '_callback'
|
||||
var callbackName = settings.containerId + '_callback';
|
||||
|
||||
window[callbackName] = function(e) {
|
||||
mejs.YouTubeApi.handleStateChange(e, player, pluginMediaElement);
|
||||
|
@ -1814,7 +1821,7 @@ window.MediaElement = mejs.MediaElement;
|
|||
* using jQuery and MediaElement.js (HTML5 Flash/Silverlight wrapper)
|
||||
*
|
||||
* Copyright 2010-2012, John Dyer (http://j.hn/)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* License: MIT
|
||||
*
|
||||
*/
|
||||
if (typeof jQuery != 'undefined') {
|
||||
|
@ -1858,6 +1865,8 @@ if (typeof jQuery != 'undefined') {
|
|||
startVolume: 0.8,
|
||||
// useful for <audio> player loops
|
||||
loop: false,
|
||||
// rewind to beginning when media ends
|
||||
autoRewind: true,
|
||||
// resize to media dimensions
|
||||
enableAutosize: true,
|
||||
// forces the hour marker (##:00:00)
|
||||
|
@ -1872,6 +1881,10 @@ if (typeof jQuery != 'undefined') {
|
|||
autosizeProgress : true,
|
||||
// Hide controls when playing and mouse is not over the video
|
||||
alwaysShowControls: false,
|
||||
// Display the video control
|
||||
hideVideoControlsOnLoad: false,
|
||||
// Enable click video element to toggle play/pause
|
||||
clickToPlayPause: true,
|
||||
// force iPad's native controls
|
||||
iPadUseNativeControls: false,
|
||||
// force iPhone's native controls
|
||||
|
@ -1971,7 +1984,7 @@ if (typeof jQuery != 'undefined') {
|
|||
|
||||
mejs.mepIndex = 0;
|
||||
|
||||
mejs.players = [];
|
||||
mejs.players = {};
|
||||
|
||||
// wraps a MediaElement object in player controls
|
||||
mejs.MediaElementPlayer = function(node, o) {
|
||||
|
@ -2003,8 +2016,11 @@ if (typeof jQuery != 'undefined') {
|
|||
// extend default options
|
||||
t.options = $.extend({},mejs.MepDefaults,o);
|
||||
|
||||
// unique ID
|
||||
t.id = 'mep_' + mejs.mepIndex++;
|
||||
|
||||
// add to player array (for focus events)
|
||||
mejs.players.push(t);
|
||||
mejs.players[t.id] = t;
|
||||
|
||||
// start up
|
||||
t.init();
|
||||
|
@ -2056,7 +2072,7 @@ if (typeof jQuery != 'undefined') {
|
|||
t.media.play();
|
||||
}
|
||||
|
||||
} else if (mf.isAndroid && t.AndroidUseNativeControls) {
|
||||
} else if (mf.isAndroid && t.options.AndroidUseNativeControls) {
|
||||
|
||||
// leave default player
|
||||
|
||||
|
@ -2067,9 +2083,6 @@ if (typeof jQuery != 'undefined') {
|
|||
// remove native controls
|
||||
t.$media.removeAttr('controls');
|
||||
|
||||
// unique ID
|
||||
t.id = 'mep_' + mejs.mepIndex++;
|
||||
|
||||
// build container
|
||||
t.container =
|
||||
$('<div id="' + t.id + '" class="mejs-container ' + (mejs.MediaFeatures.svg ? 'svg' : 'no-svg') + '">'+
|
||||
|
@ -2160,6 +2173,9 @@ if (typeof jQuery != 'undefined') {
|
|||
|
||||
// create MediaElement shim
|
||||
mejs.MediaElement(t.$media[0], meOptions);
|
||||
|
||||
// controls are shown when loaded
|
||||
t.container.trigger('controlsshown');
|
||||
},
|
||||
|
||||
showControls: function(doAnimation) {
|
||||
|
@ -2173,7 +2189,10 @@ if (typeof jQuery != 'undefined') {
|
|||
if (doAnimation) {
|
||||
t.controls
|
||||
.css('visibility','visible')
|
||||
.stop(true, true).fadeIn(200, function() {t.controlsAreVisible = true;});
|
||||
.stop(true, true).fadeIn(200, function() {
|
||||
t.controlsAreVisible = true;
|
||||
t.container.trigger('controlsshown');
|
||||
});
|
||||
|
||||
// any additional controls people might add and want to hide
|
||||
t.container.find('.mejs-control')
|
||||
|
@ -2191,6 +2210,7 @@ if (typeof jQuery != 'undefined') {
|
|||
.css('display','block');
|
||||
|
||||
t.controlsAreVisible = true;
|
||||
t.container.trigger('controlsshown');
|
||||
}
|
||||
|
||||
t.setControlsSize();
|
||||
|
@ -2213,6 +2233,7 @@ if (typeof jQuery != 'undefined') {
|
|||
.css('display','block');
|
||||
|
||||
t.controlsAreVisible = false;
|
||||
t.container.trigger('controlshidden');
|
||||
});
|
||||
|
||||
// any additional controls people might add and want to hide
|
||||
|
@ -2234,6 +2255,7 @@ if (typeof jQuery != 'undefined') {
|
|||
.css('display','block');
|
||||
|
||||
t.controlsAreVisible = false;
|
||||
t.container.trigger('controlshidden');
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -2360,11 +2382,13 @@ if (typeof jQuery != 'undefined') {
|
|||
} else {
|
||||
// click to play/pause
|
||||
t.media.addEventListener('click', function() {
|
||||
if (t.options.clickToPlayPause) {
|
||||
if (t.media.paused) {
|
||||
t.media.play();
|
||||
} else {
|
||||
t.media.pause();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// show/hide controls
|
||||
|
@ -2398,6 +2422,10 @@ if (typeof jQuery != 'undefined') {
|
|||
});
|
||||
}
|
||||
|
||||
if(t.options.hideVideoControlsOnLoad) {
|
||||
t.hideControls(false);
|
||||
}
|
||||
|
||||
// check for autoplay
|
||||
if (autoplay && !t.options.alwaysShowControls) {
|
||||
t.hideControls();
|
||||
|
@ -2421,10 +2449,11 @@ if (typeof jQuery != 'undefined') {
|
|||
|
||||
// FOCUS: when a video starts playing, it takes focus from other players (possibily pausing them)
|
||||
media.addEventListener('play', function() {
|
||||
var playerIndex;
|
||||
|
||||
// go through all other players
|
||||
for (var i=0, il=mejs.players.length; i<il; i++) {
|
||||
var p = mejs.players[i];
|
||||
for (playerIndex in mejs.players) {
|
||||
var p = mejs.players[playerIndex];
|
||||
if (p.id != t.id && t.options.pauseOtherPlayers && !p.paused && !p.ended) {
|
||||
p.pause();
|
||||
}
|
||||
|
@ -2437,11 +2466,13 @@ if (typeof jQuery != 'undefined') {
|
|||
|
||||
// ended for all
|
||||
t.media.addEventListener('ended', function (e) {
|
||||
if(t.options.autoRewind) {
|
||||
try{
|
||||
t.media.setCurrentTime(0);
|
||||
} catch (exp) {
|
||||
|
||||
}
|
||||
}
|
||||
t.media.pause();
|
||||
|
||||
if (t.setProgressRail)
|
||||
|
@ -2479,7 +2510,7 @@ if (typeof jQuery != 'undefined') {
|
|||
}, 50);
|
||||
|
||||
// adjust controls whenever window sizes (used to be in fullscreen only)
|
||||
$(window).resize(function() {
|
||||
t.globalBind('resize', function() {
|
||||
|
||||
// don't resize for fullscreen mode
|
||||
if ( !(t.isFullScreen || (mejs.MediaFeatures.hasTrueNativeFullScreen && document.webkitIsFullScreen)) ) {
|
||||
|
@ -2541,26 +2572,21 @@ if (typeof jQuery != 'undefined') {
|
|||
nativeWidth = t.isVideo ? ((t.media.videoWidth && t.media.videoWidth > 0) ? t.media.videoWidth : t.options.defaultVideoWidth) : t.options.defaultAudioWidth,
|
||||
nativeHeight = t.isVideo ? ((t.media.videoHeight && t.media.videoHeight > 0) ? t.media.videoHeight : t.options.defaultVideoHeight) : t.options.defaultAudioHeight,
|
||||
parentWidth = t.container.parent().closest(':visible').width(),
|
||||
newHeight = parseInt(parentWidth * nativeHeight/nativeWidth, 10);
|
||||
newHeight = t.isVideo || !t.options.autosizeProgress ? parseInt(parentWidth * nativeHeight/nativeWidth, 10) : nativeHeight;
|
||||
|
||||
if (t.container.parent()[0].tagName.toLowerCase() === 'body') { // && t.container.siblings().count == 0) {
|
||||
parentWidth = $(window).width();
|
||||
newHeight = $(window).height();
|
||||
}
|
||||
|
||||
if ( newHeight != 0 ) {
|
||||
if ( newHeight != 0 && parentWidth != 0 ) {
|
||||
// set outer container size
|
||||
t.container
|
||||
.width(parentWidth)
|
||||
.height(newHeight);
|
||||
|
||||
// set native <video> or <audio>
|
||||
t.$media
|
||||
.width('100%')
|
||||
.height('100%');
|
||||
|
||||
// set shims
|
||||
t.container.find('object, embed, iframe')
|
||||
// set native <video> or <audio> and shims
|
||||
t.$media.add(t.container.find('.mejs-shim'))
|
||||
.width('100%')
|
||||
.height('100%');
|
||||
|
||||
|
@ -2614,7 +2640,8 @@ if (typeof jQuery != 'undefined') {
|
|||
|
||||
// find the size of all the other controls besides the rail
|
||||
others.each(function() {
|
||||
if ($(this).css('position') != 'absolute') {
|
||||
var $this = $(this);
|
||||
if ($this.css('position') != 'absolute' && $this.is(':visible')) {
|
||||
usedWidth += $(this).outerWidth(true);
|
||||
}
|
||||
});
|
||||
|
@ -2673,6 +2700,7 @@ if (typeof jQuery != 'undefined') {
|
|||
},
|
||||
|
||||
buildoverlays: function(player, controls, layers, media) {
|
||||
var t = this;
|
||||
if (!player.isVideo)
|
||||
return;
|
||||
|
||||
|
@ -2696,10 +2724,12 @@ if (typeof jQuery != 'undefined') {
|
|||
'</div>')
|
||||
.appendTo(layers)
|
||||
.click(function() {
|
||||
if (t.options.clickToPlayPause) {
|
||||
if (media.paused) {
|
||||
media.play();
|
||||
} else {
|
||||
media.pause();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -2776,7 +2806,7 @@ if (typeof jQuery != 'undefined') {
|
|||
var t = this;
|
||||
|
||||
// listen for key presses
|
||||
$(document).keydown(function(e) {
|
||||
t.globalBind('keydown', function(e) {
|
||||
|
||||
if (player.hasFocus && player.options.enableKeyboard) {
|
||||
|
||||
|
@ -2798,7 +2828,7 @@ if (typeof jQuery != 'undefined') {
|
|||
});
|
||||
|
||||
// check if someone clicked outside a player region, then kill its focus
|
||||
$(document).click(function(event) {
|
||||
t.globalBind('click', function(event) {
|
||||
if ($(event.target).closest('.mejs-container').length == 0) {
|
||||
player.hasFocus = false;
|
||||
}
|
||||
|
@ -2817,7 +2847,7 @@ if (typeof jQuery != 'undefined') {
|
|||
track = $(track);
|
||||
|
||||
t.tracks.push({
|
||||
srclang: track.attr('srclang').toLowerCase(),
|
||||
srclang: (track.attr('srclang')) ? track.attr('srclang').toLowerCase() : '',
|
||||
src: track.attr('src'),
|
||||
kind: track.attr('kind'),
|
||||
label: track.attr('label') || '',
|
||||
|
@ -2859,29 +2889,98 @@ if (typeof jQuery != 'undefined') {
|
|||
this.media.setSrc(src);
|
||||
},
|
||||
remove: function() {
|
||||
var t = this;
|
||||
var t = this, featureIndex, feature;
|
||||
|
||||
if (t.media.pluginType === 'flash') {
|
||||
t.media.remove();
|
||||
} else if (t.media.pluginType === 'native') {
|
||||
// invoke features cleanup
|
||||
for (featureIndex in t.options.features) {
|
||||
feature = t.options.features[featureIndex];
|
||||
if (t['clean' + feature]) {
|
||||
try {
|
||||
t['clean' + feature](t);
|
||||
} catch (e) {
|
||||
// TODO: report control error
|
||||
//throw e;
|
||||
//console.log('error building ' + feature);
|
||||
//console.log(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (t.media.pluginType === 'native') {
|
||||
t.$media.prop('controls', true);
|
||||
} else {
|
||||
t.media.remove();
|
||||
}
|
||||
|
||||
// grab video and put it back in place
|
||||
if (!t.isDynamic) {
|
||||
t.$node.insertBefore(t.container)
|
||||
if (t.media.pluginType === 'native') {
|
||||
// detach events from the video
|
||||
// TODO: detach event listeners better than this;
|
||||
// also detach ONLY the events attached by this plugin!
|
||||
//t.$node.clone().insertBefore(t.container);
|
||||
//t.$node.remove();
|
||||
}
|
||||
/*else*/ t.$node.insertBefore(t.container)
|
||||
}
|
||||
|
||||
// Remove the player from the mejs.players array so that pauseOtherPlayers doesn't blow up when trying to pause a non existance flash api.
|
||||
mejs.players.splice( $.inArray( t, mejs.players ), 1);
|
||||
|
||||
t.container.remove();
|
||||
t.globalUnbind();
|
||||
delete t.node.player;
|
||||
delete mejs.players[t.id];
|
||||
}
|
||||
};
|
||||
|
||||
(function(){
|
||||
var rwindow = /^((after|before)print|(before)?unload|hashchange|message|o(ff|n)line|page(hide|show)|popstate|resize|storage)\b/;
|
||||
|
||||
function splitEvents(events, id) {
|
||||
// add player ID as an event namespace so it's easier to unbind them all later
|
||||
var ret = {d: [], w: []};
|
||||
$.each((events || '').split(' '), function(k, v){
|
||||
ret[rwindow.test(v) ? 'w' : 'd'].push(v + '.' + id);
|
||||
});
|
||||
ret.d = ret.d.join(' ');
|
||||
ret.w = ret.w.join(' ');
|
||||
return ret;
|
||||
}
|
||||
|
||||
mejs.MediaElementPlayer.prototype.globalBind = function(events, data, callback) {
|
||||
var t = this;
|
||||
events = splitEvents(events, t.id);
|
||||
if (events.d) $(document).bind(events.d, data, callback);
|
||||
if (events.w) $(window).bind(events.w, data, callback);
|
||||
};
|
||||
|
||||
mejs.MediaElementPlayer.prototype.globalUnbind = function(events, callback) {
|
||||
var t = this;
|
||||
events = splitEvents(events, t.id);
|
||||
if (events.d) $(document).unbind(events.d, callback);
|
||||
if (events.w) $(window).unbind(events.w, callback);
|
||||
};
|
||||
})();
|
||||
|
||||
// turn into jQuery plugin
|
||||
if (typeof jQuery != 'undefined') {
|
||||
jQuery.fn.mediaelementplayer = function (options) {
|
||||
return this.each(function () {
|
||||
new mejs.MediaElementPlayer(this, options);
|
||||
if (options === false) {
|
||||
this.each(function () {
|
||||
var player = jQuery(this).data('mediaelementplayer');
|
||||
if (player) {
|
||||
player.remove();
|
||||
}
|
||||
jQuery(this).removeData('mediaelementplayer');
|
||||
});
|
||||
}
|
||||
else {
|
||||
this.each(function () {
|
||||
jQuery(this).data('mediaelementplayer', new mejs.MediaElementPlayer(this, options));
|
||||
});
|
||||
}
|
||||
return this;
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -3009,15 +3108,22 @@ if (typeof jQuery != 'undefined') {
|
|||
width = total.outerWidth(true),
|
||||
percentage = 0,
|
||||
newTime = 0,
|
||||
pos = 0;
|
||||
|
||||
|
||||
if (media.duration) {
|
||||
if (x < offset.left) {
|
||||
x = offset.left;
|
||||
} else if (x > width + offset.left) {
|
||||
x = width + offset.left;
|
||||
}
|
||||
|
||||
pos = x - offset.left;
|
||||
|
||||
|
||||
if (x > offset.left && x <= width + offset.left && media.duration) {
|
||||
percentage = ((x - offset.left) / width);
|
||||
percentage = (pos / width);
|
||||
newTime = (percentage <= 0.02) ? 0 : percentage * media.duration;
|
||||
|
||||
// seek to where the mouse is
|
||||
if (mouseIsDown) {
|
||||
if (mouseIsDown && newTime !== media.currentTime) {
|
||||
media.setCurrentTime(newTime);
|
||||
}
|
||||
|
||||
|
@ -3040,21 +3146,20 @@ if (typeof jQuery != 'undefined') {
|
|||
if (e.which === 1) {
|
||||
mouseIsDown = true;
|
||||
handleMouseMove(e);
|
||||
$(document)
|
||||
.bind('mousemove.dur', function(e) {
|
||||
t.globalBind('mousemove.dur', function(e) {
|
||||
handleMouseMove(e);
|
||||
})
|
||||
.bind('mouseup.dur', function (e) {
|
||||
});
|
||||
t.globalBind('mouseup.dur', function (e) {
|
||||
mouseIsDown = false;
|
||||
timefloat.hide();
|
||||
$(document).unbind('.dur');
|
||||
t.globalUnbind('.dur');
|
||||
});
|
||||
return false;
|
||||
}
|
||||
})
|
||||
.bind('mouseenter', function(e) {
|
||||
mouseIsOver = true;
|
||||
$(document).bind('mousemove.dur', function(e) {
|
||||
t.globalBind('mousemove.dur', function(e) {
|
||||
handleMouseMove(e);
|
||||
});
|
||||
if (!mejs.MediaFeatures.hasTouch) {
|
||||
|
@ -3064,7 +3169,7 @@ if (typeof jQuery != 'undefined') {
|
|||
.bind('mouseleave',function(e) {
|
||||
mouseIsOver = false;
|
||||
if (!mouseIsDown) {
|
||||
$(document).unbind('.dur');
|
||||
t.globalUnbind('.dur');
|
||||
timefloat.hide();
|
||||
}
|
||||
});
|
||||
|
@ -3130,8 +3235,8 @@ if (typeof jQuery != 'undefined') {
|
|||
// update bar and handle
|
||||
if (t.total && t.handle) {
|
||||
var
|
||||
newWidth = t.total.width() * t.media.currentTime / t.media.duration,
|
||||
handlePos = newWidth - (t.handle.outerWidth(true) / 2);
|
||||
newWidth = Math.round(t.total.width() * t.media.currentTime / t.media.duration),
|
||||
handlePos = newWidth - Math.round(t.handle.outerWidth(true) / 2);
|
||||
|
||||
t.current.width(newWidth);
|
||||
t.handle.css('left', handlePos);
|
||||
|
@ -3141,6 +3246,7 @@ if (typeof jQuery != 'undefined') {
|
|||
}
|
||||
});
|
||||
})(mejs.$);
|
||||
|
||||
(function($) {
|
||||
|
||||
// options
|
||||
|
@ -3215,8 +3321,11 @@ if (typeof jQuery != 'undefined') {
|
|||
updateDuration: function() {
|
||||
var t = this;
|
||||
|
||||
if (t.media.duration && t.durationD) {
|
||||
t.durationD.html(mejs.Utility.secondsToTimeCode(t.media.duration, t.options.alwaysShowHours, t.options.showTimecodeFrameCount, t.options.framesPerSecond || 25));
|
||||
//Toggle the long video class if the video is longer than an hour.
|
||||
t.container.toggleClass("mejs-long-video", t.media.duration > 3600);
|
||||
|
||||
if (t.durationD && (t.options.duration > 0 || t.media.duration)) {
|
||||
t.durationD.html(mejs.Utility.secondsToTimeCode(t.options.duration > 0 ? t.options.duration : t.media.duration, t.options.alwaysShowHours, t.options.showTimecodeFrameCount, t.options.framesPerSecond || 25));
|
||||
}
|
||||
}
|
||||
});
|
||||
|
@ -3394,13 +3503,12 @@ if (typeof jQuery != 'undefined') {
|
|||
})
|
||||
.bind('mousedown', function (e) {
|
||||
handleVolumeMove(e);
|
||||
$(document)
|
||||
.bind('mousemove.vol', function(e) {
|
||||
t.globalBind('mousemove.vol', function(e) {
|
||||
handleVolumeMove(e);
|
||||
})
|
||||
.bind('mouseup.vol', function () {
|
||||
});
|
||||
t.globalBind('mouseup.vol', function () {
|
||||
mouseIsDown = false;
|
||||
$(document).unbind('.vol');
|
||||
t.globalUnbind('.vol');
|
||||
|
||||
if (!mouseIsOver && mode == 'vertical') {
|
||||
volumeSlider.hide();
|
||||
|
@ -3434,6 +3542,11 @@ if (typeof jQuery != 'undefined') {
|
|||
// set initial volume
|
||||
positionVolumeHandle(player.options.startVolume);
|
||||
|
||||
// mutes the media and sets the volume icon muted if the initial volume is set to 0
|
||||
if (player.options.startVolume === 0) {
|
||||
media.setMuted(true);
|
||||
}
|
||||
|
||||
// shim gets the startvolume as a parameter, but we have to set it on the native <video> and <audio> elements
|
||||
if (media.pluginType === 'native') {
|
||||
media.setVolume(player.options.startVolume);
|
||||
|
@ -3473,15 +3586,7 @@ if (typeof jQuery != 'undefined') {
|
|||
if (mejs.MediaFeatures.hasTrueNativeFullScreen) {
|
||||
|
||||
// chrome doesn't alays fire this in an iframe
|
||||
var target = null;
|
||||
|
||||
if (mejs.MediaFeatures.hasMozNativeFullScreen) {
|
||||
target = $(document);
|
||||
} else {
|
||||
target = player.container;
|
||||
}
|
||||
|
||||
target.bind(mejs.MediaFeatures.fullScreenEventName, function(e) {
|
||||
var func = function(e) {
|
||||
|
||||
if (mejs.MediaFeatures.isFullScreen()) {
|
||||
player.isNativeFullScreen = true;
|
||||
|
@ -3493,7 +3598,13 @@ if (typeof jQuery != 'undefined') {
|
|||
// make sure to put the player back into place
|
||||
player.exitFullScreen();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
if (mejs.MediaFeatures.hasMozNativeFullScreen) {
|
||||
player.globalBind(mejs.MediaFeatures.fullScreenEventName, func);
|
||||
} else {
|
||||
player.container.bind(mejs.MediaFeatures.fullScreenEventName, func);
|
||||
}
|
||||
}
|
||||
|
||||
var t = this,
|
||||
|
@ -3599,7 +3710,7 @@ if (typeof jQuery != 'undefined') {
|
|||
left: fullScreenBtnOffset + fullScreenBtnWidth});
|
||||
};
|
||||
|
||||
$(document).resize(function() {
|
||||
t.globalBind('resize', function() {
|
||||
positionHoverDivs();
|
||||
});
|
||||
|
||||
|
@ -3639,7 +3750,7 @@ if (typeof jQuery != 'undefined') {
|
|||
// the mouseout event doesn't work on the fullscren button, because we already killed the pointer-events
|
||||
// so we use the document.mousemove event to restore controls when the mouse moves outside the fullscreen button
|
||||
/*
|
||||
$(document).mousemove(function(e) {
|
||||
t.globalBind('mousemove', function(e) {
|
||||
|
||||
// if the mouse is anywhere but the fullsceen button, then restore it all
|
||||
if (fullscreenIsDisabled) {
|
||||
|
@ -3697,13 +3808,18 @@ if (typeof jQuery != 'undefined') {
|
|||
|
||||
player.fullscreenBtn = fullscreenBtn;
|
||||
|
||||
$(document).bind('keydown',function (e) {
|
||||
t.globalBind('keydown',function (e) {
|
||||
if (((mejs.MediaFeatures.hasTrueNativeFullScreen && mejs.MediaFeatures.isFullScreen()) || t.isFullScreen) && e.keyCode == 27) {
|
||||
player.exitFullScreen();
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
cleanfullscreen: function(player) {
|
||||
player.exitFullScreen();
|
||||
},
|
||||
|
||||
enterFullScreen: function() {
|
||||
|
||||
var t = this;
|
||||
|
@ -3807,7 +3923,7 @@ if (typeof jQuery != 'undefined') {
|
|||
.width('100%')
|
||||
.height('100%');
|
||||
} else {
|
||||
t.container.find('object, embed, iframe')
|
||||
t.container.find('.mejs-shim')
|
||||
.width('100%')
|
||||
.height('100%');
|
||||
|
||||
|
@ -3889,7 +4005,16 @@ if (typeof jQuery != 'undefined') {
|
|||
// this will automatically turn on a <track>
|
||||
startLanguage: '',
|
||||
|
||||
tracksText: 'Captions/Subtitles'
|
||||
tracksText: 'Captions/Subtitles',
|
||||
|
||||
// option to remove the [cc] button when no <track kind="subtitles"> are present
|
||||
hideCaptionsButtonWhenEmpty: true,
|
||||
|
||||
// If true and we only have one track, change captions to popup
|
||||
toggleCaptionsButtonWhenOnlyOne: false,
|
||||
|
||||
// #id or .class
|
||||
slidesSelector: ''
|
||||
});
|
||||
|
||||
$.extend(MediaElementPlayer.prototype, {
|
||||
|
@ -3903,13 +4028,15 @@ if (typeof jQuery != 'undefined') {
|
|||
if (player.tracks.length == 0)
|
||||
return;
|
||||
|
||||
var t= this, i, options = '';
|
||||
var t = this,
|
||||
i,
|
||||
options = '';
|
||||
|
||||
player.chapters =
|
||||
$('<div class="mejs-chapters mejs-layer"></div>')
|
||||
.prependTo(layers).hide();
|
||||
player.captions =
|
||||
$('<div class="mejs-captions-layer mejs-layer"><div class="mejs-captions-position"><span class="mejs-captions-text"></span></div></div>')
|
||||
$('<div class="mejs-captions-layer mejs-layer"><div class="mejs-captions-position mejs-captions-position-hover"><span class="mejs-captions-text"></span></div></div>')
|
||||
.prependTo(layers).hide();
|
||||
player.captionsText = player.captions.find('.mejs-captions-text');
|
||||
player.captionsButton =
|
||||
|
@ -3924,45 +4051,52 @@ if (typeof jQuery != 'undefined') {
|
|||
'</ul>'+
|
||||
'</div>'+
|
||||
'</div>')
|
||||
.appendTo(controls)
|
||||
.appendTo(controls);
|
||||
|
||||
|
||||
var subtitleCount = 0;
|
||||
for (i=0; i<player.tracks.length; i++) {
|
||||
if (player.tracks[i].kind == 'subtitles') {
|
||||
subtitleCount++;
|
||||
}
|
||||
}
|
||||
|
||||
// if only one language then just make the button a toggle
|
||||
if (t.options.toggleCaptionsButtonWhenOnlyOne && subtitleCount == 1){
|
||||
// click
|
||||
player.captionsButton.on('click',function() {
|
||||
if (player.selectedTrack == null) {
|
||||
var lang = player.tracks[0].srclang;
|
||||
} else {
|
||||
var lang = 'none';
|
||||
}
|
||||
player.setTrack(lang);
|
||||
});
|
||||
} else {
|
||||
// hover
|
||||
.hover(function() {
|
||||
player.captionsButton.hover(function() {
|
||||
$(this).find('.mejs-captions-selector').css('visibility','visible');
|
||||
}, function() {
|
||||
$(this).find('.mejs-captions-selector').css('visibility','hidden');
|
||||
})
|
||||
|
||||
// handle clicks to the language radio buttons
|
||||
.delegate('input[type=radio]','click',function() {
|
||||
.on('click','input[type=radio]',function() {
|
||||
lang = this.value;
|
||||
|
||||
if (lang == 'none') {
|
||||
player.selectedTrack = null;
|
||||
} else {
|
||||
for (i=0; i<player.tracks.length; i++) {
|
||||
if (player.tracks[i].srclang == lang) {
|
||||
player.selectedTrack = player.tracks[i];
|
||||
player.captions.attr('lang', player.selectedTrack.srclang);
|
||||
player.displayCaptions();
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
player.setTrack(lang);
|
||||
});
|
||||
//.bind('mouseenter', function() {
|
||||
// player.captionsButton.find('.mejs-captions-selector').css('visibility','visible')
|
||||
//});
|
||||
|
||||
}
|
||||
|
||||
if (!player.options.alwaysShowControls) {
|
||||
// move with controls
|
||||
player.container
|
||||
.bind('mouseenter', function () {
|
||||
.bind('controlsshown', function () {
|
||||
// push captions above controls
|
||||
player.container.find('.mejs-captions-position').addClass('mejs-captions-position-hover');
|
||||
|
||||
})
|
||||
.bind('mouseleave', function () {
|
||||
.bind('controlshidden', function () {
|
||||
if (!media.paused) {
|
||||
// move back to normal place
|
||||
player.container.find('.mejs-captions-position').removeClass('mejs-captions-position-hover');
|
||||
|
@ -3985,6 +4119,7 @@ if (typeof jQuery != 'undefined') {
|
|||
}
|
||||
}
|
||||
|
||||
// start loading tracks
|
||||
player.loadNextTrack();
|
||||
|
||||
|
||||
|
@ -3992,6 +4127,15 @@ if (typeof jQuery != 'undefined') {
|
|||
player.displayCaptions();
|
||||
}, false);
|
||||
|
||||
if (player.options.slidesSelector != '') {
|
||||
player.slidesContainer = $(player.options.slidesSelector);
|
||||
|
||||
media.addEventListener('timeupdate',function(e) {
|
||||
player.displaySlides();
|
||||
}, false);
|
||||
|
||||
}
|
||||
|
||||
media.addEventListener('loadedmetadata', function(e) {
|
||||
player.displayChapters();
|
||||
}, false);
|
||||
|
@ -4019,6 +4163,28 @@ if (typeof jQuery != 'undefined') {
|
|||
}
|
||||
},
|
||||
|
||||
setTrack: function(lang){
|
||||
|
||||
var t = this,
|
||||
i;
|
||||
|
||||
if (lang == 'none') {
|
||||
t.selectedTrack = null;
|
||||
t.captionsButton.removeClass('mejs-captions-enabled');
|
||||
} else {
|
||||
for (i=0; i<t.tracks.length; i++) {
|
||||
if (t.tracks[i].srclang == lang) {
|
||||
if (t.selectedTrack == null)
|
||||
t.captionsButton.addClass('mejs-captions-enabled');
|
||||
t.selectedTrack = t.tracks[i];
|
||||
t.captions.attr('lang', t.selectedTrack.srclang);
|
||||
t.displayCaptions();
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
loadNextTrack: function() {
|
||||
var t = this;
|
||||
|
||||
|
@ -4029,6 +4195,8 @@ if (typeof jQuery != 'undefined') {
|
|||
} else {
|
||||
// add done?
|
||||
t.isLoadingTrack = false;
|
||||
|
||||
t.checkForTracks();
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -4070,6 +4238,10 @@ if (typeof jQuery != 'undefined') {
|
|||
}
|
||||
}, false);
|
||||
}
|
||||
|
||||
if (track.kind == 'slides') {
|
||||
t.setupSlides(track);
|
||||
}
|
||||
},
|
||||
error: function() {
|
||||
t.loadNextTrack();
|
||||
|
@ -4126,6 +4298,27 @@ if (typeof jQuery != 'undefined') {
|
|||
);
|
||||
},
|
||||
|
||||
checkForTracks: function() {
|
||||
var
|
||||
t = this,
|
||||
hasSubtitles = false;
|
||||
|
||||
// check if any subtitles
|
||||
if (t.options.hideCaptionsButtonWhenEmpty) {
|
||||
for (i=0; i<t.tracks.length; i++) {
|
||||
if (t.tracks[i].kind == 'subtitles') {
|
||||
hasSubtitles = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (!hasSubtitles) {
|
||||
t.captionsButton.hide();
|
||||
t.setControlsSize();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
displayCaptions: function() {
|
||||
|
||||
if (typeof this.tracks == 'undefined')
|
||||
|
@ -4150,6 +4343,70 @@ if (typeof jQuery != 'undefined') {
|
|||
}
|
||||
},
|
||||
|
||||
setupSlides: function(track) {
|
||||
var t = this;
|
||||
|
||||
t.slides = track;
|
||||
t.slides.entries.imgs = [t.slides.entries.text.length];
|
||||
t.showSlide(0);
|
||||
|
||||
},
|
||||
|
||||
showSlide: function(index) {
|
||||
if (typeof this.tracks == 'undefined' || typeof this.slidesContainer == 'undefined') {
|
||||
return;
|
||||
}
|
||||
|
||||
var t = this,
|
||||
url = t.slides.entries.text[index],
|
||||
img = t.slides.entries.imgs[index];
|
||||
|
||||
if (typeof img == 'undefined' || typeof img.fadeIn == 'undefined') {
|
||||
|
||||
t.slides.entries.imgs[index] = img = $('<img src="' + url + '">')
|
||||
.on('load', function() {
|
||||
img.appendTo(t.slidesContainer)
|
||||
.hide()
|
||||
.fadeIn()
|
||||
.siblings(':visible')
|
||||
.fadeOut();
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
if (!img.is(':visible') && !img.is(':animated')) {
|
||||
|
||||
console.log('showing existing slide');
|
||||
|
||||
img.fadeIn()
|
||||
.siblings(':visible')
|
||||
.fadeOut();
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
displaySlides: function() {
|
||||
|
||||
if (typeof this.slides == 'undefined')
|
||||
return;
|
||||
|
||||
var
|
||||
t = this,
|
||||
slides = t.slides,
|
||||
i;
|
||||
|
||||
for (i=0; i<slides.entries.times.length; i++) {
|
||||
if (t.media.currentTime >= slides.entries.times[i].start && t.media.currentTime <= slides.entries.times[i].stop){
|
||||
|
||||
t.showSlide(i);
|
||||
|
||||
return; // exit out if one is visible;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
displayChapters: function() {
|
||||
var
|
||||
t = this,
|
||||
|
@ -4513,6 +4770,10 @@ $.extend(mejs.MepDefaults,
|
|||
});
|
||||
},
|
||||
|
||||
cleancontextmenu: function(player) {
|
||||
player.contextMenu.remove();
|
||||
},
|
||||
|
||||
isContextMenuEnabled: true,
|
||||
enableContextMenu: function() {
|
||||
this.isContextMenuEnabled = true;
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -321,6 +321,7 @@
|
|||
text-align: center;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.mejs-controls .mejs-time-rail .mejs-time-float-corner {
|
||||
position: absolute;
|
||||
display: block;
|
||||
|
@ -334,9 +335,19 @@
|
|||
border-radius: 0;
|
||||
top: 15px;
|
||||
left: 13px;
|
||||
|
||||
}
|
||||
|
||||
.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float {
|
||||
width: 48px;
|
||||
}
|
||||
|
||||
.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float-current {
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float-corner {
|
||||
left: 18px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue