Browse Source

Retablir l'initialisation JS de mediaelement.js via le script mejs-init.js qui prend en charge les attributs data- et ajoute les class paused/playing selon l'etat du player. Retrait de la class mejs__player qui avait ete ajoutee pour declencher l'init automatique au lieu de reparer le script mejs-init.js

3.2
cedric@yterium.com 5 years ago
parent
commit
7892dfeccb
  1. 43
      javascript/mejs-init.js
  2. 5
      javascript/mejs-init.min.js
  3. 2
      modeles/audio.html
  4. 4
      paquet.xml

43
javascript/mejs-init.js

@ -19,7 +19,6 @@ var mejsloader;
(function ($){
jQuery("audio.mejs,video.mejs").not('.done').each(function (){
var me = jQuery(this).addClass('done');
//console.log(this);
var id;
if (!(id = me.attr('id'))){
id = "mejs-"+(me.attr('data-id'))+"-"+(L.c++);
@ -31,16 +30,12 @@ var mejsloader;
}
function runthisplayer(){
var run = true;
//console.log(css);
for (var c in opt.css){
L.cssload(opt.css[c]);
}
for (var p in opt.plugins){
//console.log(p);
//console.log(L.plug[p]);
// load this plugin
if (typeof L.plug[p]=="undefined"){
//console.log("Load Plugin "+p);
run = false;
L.plug[p] = false;
jQuery.getScript(opt.plugins[p], function (){
@ -50,31 +45,33 @@ var mejsloader;
}
// this plugin is loading
else if (L.plug[p]==false){
//console.log("Plugin "+p+" loading...");
run = false;
}
else {
//console.log("Plugin "+p+" loaded");
}
}
if (run){
new MediaElementPlayer('#'+id, jQuery.extend(opt.options, {
"success": function (media){
function togglePlayingState(){
jQuery(media).closest('.mejs-inner').removeClass(media.paused ? 'playing' : 'paused').addClass(media.paused ? 'paused' : 'playing');
jQuery('#'+id).mediaelementplayer(jQuery.extend(opt.options, {
"success": function (media, node){
function togglePlayingState(){
var inner = jQuery(media).closest('.mejs__inner');
if (!media.paused) {
inner.removeClass('paused').removeClass('pausing').addClass('playing');
}
else {
inner.addClass('pausing');
setTimeout(function(){inner.filter('.pausing').removeClass('playing').removeClass('pausing').addClass('paused');},100);
}
}
togglePlayingState();
media.addEventListener('play', togglePlayingState, false);
media.addEventListener('playing', togglePlayingState, false);
media.addEventListener('pause', togglePlayingState, false);
media.addEventListener('paused', togglePlayingState, false);
if (me.attr('autoplay')) media.play();
}
togglePlayingState();
media.addEventListener('play', togglePlayingState, false);
media.addEventListener('playing', togglePlayingState, false);
media.addEventListener('pause', togglePlayingState, false);
media.addEventListener('paused', togglePlayingState, false);
if (me.attr('autoplay')) media.play();
}
}));
})
);
}
}
runthisplayer();
})
})(jQuery);

5
javascript/mejs-init.min.js vendored

@ -1 +1,4 @@
var mejsloader; (function(){var a=mejsloader;"undefined"==typeof a&&(mejsloader=a={gs:null,plug:{},css:{},init:null,c:0,cssload:null});a.init||(a.cssload=function(b){if("undefined"==typeof a.css[b]){a.css[b]=!0;var c=document.createElement("link");c.href=b;c.rel="stylesheet";c.type="text/css";document.getElementsByTagName("head")[0].appendChild(c)}},a.init=function(){!0===a.gs&&function(b){jQuery("audio.mejs,video.mejs").not(".done").each(function(){function c(){var e=!0,h;for(h in d.css)a.cssload(d.css[h]);for(var f in d.plugins)"undefined"== typeof a.plug[f]?(e=!1,a.plug[f]=!1,jQuery.getScript(d.plugins[f],function(){a.plug[f]=!0;c()})):0==a.plug[f]&&(e=!1);e&&new MediaElementPlayer("#"+b,jQuery.extend(d.options,{success:function(a){function b(){jQuery(a).closest(".mejs-inner").removeClass(a.paused?"playing":"paused").addClass(a.paused?"paused":"playing")}b();a.addEventListener("play",b,!1);a.addEventListener("playing",b,!1);a.addEventListener("pause",b,!1);a.addEventListener("paused",b,!1);g.attr("autoplay")&&a.play()}}))}var g=jQuery(this).addClass("done"), b;(b=g.attr("id"))||(b="mejs-"+g.attr("data-id")+"-"+a.c++,g.attr("id",b));var d={options:{},plugins:{},css:[]},e,h;for(e in d)if(h=g.attr("data-mejs"+e))d[e]=jQuery.parseJSON(h);c()})}(jQuery)});a.gs||("undefined"!==typeof mejscss&&a.cssload(mejscss),a.gs=jQuery.getScript(mejspath,function(){a.gs=!0;a.init();jQuery(a.init);onAjaxLoad(a.init)}))})();
var mejsloader;
(function(){var a=mejsloader;"undefined"==typeof a&&(mejsloader=a={gs:null,plug:{},css:{},init:null,c:0,cssload:null});a.init||(a.cssload=function(c){if("undefined"==typeof a.css[c]){a.css[c]=!0;var b=document.createElement("link");b.href=c;b.rel="stylesheet";b.type="text/css";document.getElementsByTagName("head")[0].appendChild(b)}},a.init=function(){!0===a.gs&&function(c){jQuery("audio.mejs,video.mejs").not(".done").each(function(){function b(){var e=!0,h;for(h in d.css)a.cssload(d.css[h]);for(var f in d.plugins)"undefined"==
typeof a.plug[f]?(e=!1,a.plug[f]=!1,jQuery.getScript(d.plugins[f],function(){a.plug[f]=!0;b()})):0==a.plug[f]&&(e=!1);e&&jQuery("#"+c).mediaelementplayer(jQuery.extend(d.options,{success:function(a,c){function b(){var b=jQuery(a).closest(".mejs__inner");a.paused?(b.addClass("pausing"),setTimeout(function(){b.filter(".pausing").removeClass("playing").removeClass("pausing").addClass("paused")},100)):b.removeClass("paused").removeClass("pausing").addClass("playing")}b();a.addEventListener("play",b,!1);
a.addEventListener("playing",b,!1);a.addEventListener("pause",b,!1);a.addEventListener("paused",b,!1);g.attr("autoplay")&&a.play()}}))}var g=jQuery(this).addClass("done"),c;(c=g.attr("id"))||(c="mejs-"+g.attr("data-id")+"-"+a.c++,g.attr("id",c));var d={options:{},plugins:{},css:[]},e,h;for(e in d)if(h=g.attr("data-mejs"+e))d[e]=jQuery.parseJSON(h);b()})}(jQuery)});a.gs||("undefined"!==typeof mejscss&&a.cssload(mejscss),a.gs=jQuery.getScript(mejspath,function(){a.gs=!0;a.init();jQuery(a.init);onAjaxLoad(a.init)}))})();

2
modeles/audio.html

@ -4,7 +4,7 @@
style='[(#ENV{align}|match{^(left|right)$}|oui)float:#ENV{align};][width:(#GET{largeur})px]'>
[(#LOGO_DOCUMENT{vignette}|image_reduire{#GET{largeur},0}|vider_attribut{class})]
<div class="audio-wrapper"[ style='width:(#GET{largeur})px;max-width:100%;']>
<audio class="mejs mejs__player mejs-#ID_DOCUMENT [ mejs-(#ENV{skin})]"
<audio class="mejs mejs-#ID_DOCUMENT [ mejs-(#ENV{skin})]"
data-id="[(#VAL{mejs-#ID_DOCUMENT}|concat{#ENV{skin}}|md5)]"
src="#FICHIER"
type="#MIME_TYPE"

4
paquet.xml

@ -1,7 +1,7 @@
<paquet
prefix="medias"
categorie="multimedia"
version="2.20.19"
version="2.20.20"
etat="stable"
compatibilite="[3.2.0;3.2.*]"
logo="prive/themes/spip/images/portfolio-32.png"
@ -58,4 +58,4 @@
<chemin path="squelettes" />
<chemin path="" />
</paquet>
</paquet>

Loading…
Cancel
Save