（建立内容为“→这里的任何JavaScript将为所有用户在每次页面载入时加载。： (function(window, $, mw) { 'use strict'; //Load Protection if (window.OggPla…”的新页面） |
DominicWoo（讨论 | 贡献） |
||
| 第294行： | 第294行： | ||
}); | }); | ||
})(this,jQuery, mediaWiki); | })(this,jQuery, mediaWiki); | ||
| + | |||
| + | (function(){ | ||
| + | let audios = document.getElementsByClassName("audio-player"); | ||
| + | for(let i=0;i<audios.length;i++){ | ||
| + | let audio = audios[i]; | ||
| + | let link = audio.firstElementChild.href; | ||
| + | audio.innerHTML = ""; | ||
| + | let a = document.createElement('audio'); | ||
| + | a.src = link; | ||
| + | audio.append(a); | ||
| + | let button = document.createElement('button'); | ||
| + | button.onclick = ()=>{ | ||
| + | if (a.paused){ | ||
| + | a.play(); | ||
| + | button.classList.add('audio-player-playing'); | ||
| + | button.classList.remove('audio-player-paused'); | ||
| + | }else{ | ||
| + | a.pause() | ||
| + | button.classList.add('audio-player-paused'); | ||
| + | button.classList.remove('audio-player-playing'); | ||
| + | } | ||
| + | } | ||
| + | |||
| + | a.onended = () => { | ||
| + | button.classList.remove('audio-player-playing'); | ||
| + | } | ||
| + | |||
| + | audio.append(button); | ||
| + | } | ||
| + | })(); | ||
2021年1月21日 (四) 12:52的版本
/* 这里的任何JavaScript将为所有用户在每次页面载入时加载。 */
(function(window, $, mw) {
'use strict';
//Load Protection
if (window.OggPlayerLoaded) return;
window.OggPlayerLoaded = true;
//Load Localization
importArticle({type: 'script',article: 'u:dev:MediaWiki:I18n-js/code.js'});
//Load Style
importArticle({type: 'style',article: 'u:dev:MediaWiki:OggPlayer.css'})
//Default Setting
if(typeof window.oggPlayerButtonOnly == 'undefined') window.oggPlayerButtonOnly = false;
function init(i18n) {
var OggPlayer = {
support: '',
allButtons: $([]),
monit: function($elem) {
if(!window.oggPlayerButtonOnly) $elem.find('.audio-button .ogg_player,.mediaContainer').each(OggPlayer.prepPlayer);
$elem.find('.audio-button').each(OggPlayer.prepButton);
},
init: function() {
//Test Audio Support
OggPlayer.support = document.createElement('audio').canPlayType('audio/ogg');
OggPlayer.monit($(document));
mw.hook('wikipage.content').add(OggPlayer.monit);
},
prepPlayer: function() {
var player = $(this);
if(player.data('url')) return;
var button = player.find('button[onclick]');
if(button.length) {
var onclick = button[0].onclick.toString();
var match, url, width, height, isVideo;
if(match = onclick.match(/"videoUrl":"((?:\\.|[^"\\])+)"/)) url = match[1].replace('\\x26', '&');
if(match = onclick.match(/"width":([0-9]+)/)) width = match[1];
if(match = onclick.match(/"height":([0-9]+)/)) height = match[1];
if(match = onclick.match(/"isVideo":(true|false)/)) isVideo = match[1] == 'true';
if(isVideo) {
OggPlayer.video(player, url, width, height);
} else {
OggPlayer.audio(player, url, width);
}
} else {
var p = player.find('audio[src], video[src], source[src]');
player.closest(".audio-button")
.data('src', p.attr('src'))
.empty()//We know this is an audio-button class, so empty contents
.append(p);
}
player.removeClass(['ogg_player','mediaContainer']).addClass('ogg-player').removeAttr('id');
},
prepButton: function() {
var button = $(this);
if(button.prop('tagName') == 'A' || button.hasClass('no-audio')) return;
var src = button.data('src'),
sources = button.find('audio, video, button[onclick], img, a.internal');
if(OggPlayer.support === '') {
button.attr('title', i18n.msg('no-support').plain()).addClass('no-audio').empty();
return;
}
if(typeof src == 'undefined' || !OggPlayer.isValid(src)) {
sources.each(function(i, v) {
v = $(v);
if(v.prop('tagName') == 'A') {
src = v.attr('href');
} else if(v.prop('tagName') == 'BUTTON') {
var match, onclick = v[0].onclick.toString();
if(match = onclick.match(/"videoUrl":"((?:\\.|[^"\\])+)"/)) src = match[1];
} else {
src = v.attr('src');
}
if(OggPlayer.isValid(src)) return false;
src = false;
});
if(!src) {
button.addClass('no-audio').empty().attr('title', i18n.msg('no-audio').plain());
return;
}
}
var link = $('<a />', {
'class': button.attr('class'),
'style': button.attr('style'),
'data-src': button.data('src'),
'title': i18n.msg('play').plain(),
'href': src,
'click':function(e) {
e.preventDefault();
var audio = $(this).find('audio');
if(audio.prop('paused')) {
OggPlayer.stopAllButtons();
audio.trigger('play');
} else {
audio.trigger('pause');
}
return false;
}
});
button.replaceWith(link);
if(link.hasClass('click-parent')) {
if(!link.parent().hasClass('audio-button-parent')) {
link.parent().addClass('audio-button-parent').click(function(e) {
$(this).find('.click-parent').click();
});
} else {
link.removeClass('click-parent');
}
}
var audio = $('<audio />', {
src: src,
preload: 'none',
}).appendTo(link).on('play', function(e) {
$(this).parent().addClass('now-playing');
}).on('pause', function(e) {
$(this).parent().removeClass('now-playing');
this.currentTime = 0;
}).on('ended', function(e) {
$(this).trigger('pause');
}).on('error', function(e) {
$(this).parent().addClass('no-audio').removeClass('now-playing').empty().attr('title', 'err' + i18n.msg('no-audio').plain());
});
OggPlayer.allButtons = OggPlayer.allButtons.add(audio);
},
stopAllButtons: function() {
OggPlayer.allButtons.trigger('pause');
},
isValid: function(url) {
if(url === undefined) return false;
url = url.replace(/\?.*$/, '');
if(url.search(/(?:https?:)?(?:\/\/)(?:images|img|static|vignette)\d*\.wikia\.(?:nocookie\.)?(?:net|com)/) < 0 && url.search(/(?:https?:)?(?:\/\/)upload\.wikimedia\.org/) < 0) return false; // Wikia and Wikimedia only
url = url.replace(/(vignette.*?)(\/revision.*$)/, '$1');
if(url.search(/\.(ogg|oga|ogv)$/) < 0) return false;
return true;
},
video: function(player, url, width, height) {
if(!url) return;
var a = player.find('a.image');
player.addClass('ogg-video-player')
.data('url', url)
.empty()
.append(
$('<video />', {
controls : 'controls',
width: width,
height: height,
src: url,
preload: 'metadata'
})
.click(function(){
this.paused ? this.play() : this.pause();
})
.dblclick(function(){
if(document.fullscreenEnabled || document.webkitFullscreenEnabled || document.mozFullScreenEnabled || document.msFullscreenEnabled) {
if(document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement) {
if(document.exitFullscreen) {
document.exitFullscreen();
} else if(document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if(document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if(document.msExitFullscreen) {
document.msExitFullscreen();
}
} else {
if(this.requestFullscreen) {
this.requestFullscreen();
} else if(this.webkitRequestFullscreen) {
this.webkitRequestFullscreen();
} else if(this.mozRequestFullScreen) {
this.mozRequestFullScreen();
} else if(this.msRequestFullscreen) {
this.msRequestFullscreen();
}
}
}
})
)
.append($('<a></a>').addClass('info-icon').attr({
href: a.attr('href'),
title: a.attr('title')
}));
},
audio: function(player, url, width) {
if(!url) return;
var a = player.find('a.image');
player.addClass('ogg-audio-player')
.data('url', url)
.empty()
.append($('<audio>', {
controls : 'controls',
src: url,
preload: 'metadata'
}).css('width', width))
.append($('<a>').addClass('info-icon').attr({
href: a.attr('href'),
title: a.attr('title')
}));
}
};
//If not fandom legacy
if (mw.config.get('wgVersion') !== '1.19.24')
OggPlayer = {
constRef:{
wrapper:"audio-button",
noSupport:"no-support",
noAudio:"no-audio",
nowPlaying:"now-playing",
OggAudio:"OggPlayer-Audio",
play:"play"
},
init: function() {
//Test Audio Support
var support = document.createElement('audio').canPlayType('audio/ogg');
if (support === "") return OggPlayer.noSupport();
mw.hook('wikipage.content').add(OggPlayer.monitor);
},
noSupport: function() {
$('.audio-button:not(.ready)').attr('title',i18n.msg(OggPlayer.constRef.noSupport).plain()).addClass(OggPlayer.constRef.noAudio);
},
monitor: function($elem) {
$elem.find('.audio-button').each(OggPlayer.eachInstance);
},
eachInstance: function() {
var instance = $(this);
//Normalize embed data to instance
if (instance.children().length) {
var focus = instance.find("a[href][class=internal],audio[src],video[src],source[src]");
instance.data("src",focus.attr("href")||focus.attr("src"));
}
//Create Button from instance src
OggPlayer.createButton(instance);
},
createButton: function(target) {
if (!OggPlayer.isValid(target.data('src')))
return OggPlayer.errorPlayer(target);
var audioObj = $('<audio>',{
src:target.data('src'),
preload:'none',
class:OggPlayer.constRef.OggAudio,
on:{
playing:function(){
$(this).parent().addClass(OggPlayer.constRef.nowPlaying);
},
pause:OggPlayer.stopThis,
ended:OggPlayer.stopThis,
error: function(){
OggPlayer.errorPlayer($(this).parent());
}
}
});
target.click(OggPlayer.clickButton).append(audioObj).attr('title',i18n.msg(OggPlayer.constRef.play).plain());
},
clickButton: function(){
var focusDom = $(this).find("audio."+OggPlayer.constRef.OggAudio).get(0);
var toPlay = false;
if (!focusDom.currentTime) toPlay = true;
OggPlayer.pauseAll();
if (toPlay) {
focusDom.preload="auto";
focusDom.play();
}
},
pauseAll: function(){
$("."+OggPlayer.constRef.nowPlaying+" audio."+OggPlayer.constRef.OggAudio).trigger("pause");
},
errorPlayer: function(player){
player.addClass(OggPlayer.constRef.noAudio).attr('title', i18n.msg(OggPlayer.constRef.noAudio).plain());
},
stopThis: function(){
$(this).parent().removeClass(OggPlayer.constRef.nowPlaying);
this.currentTime = 0;
},
isValid: function(url) {
if(url === undefined) return false;
url = url.replace(/\?.*$/, '');
if(url.search(/(?:https?:)?(?:\/\/)(?:images|img|static|vignette)\d*\.wikia\.(?:nocookie\.)?(?:net|com)/) < 0 && url.search(/(?:https?:)?(?:\/\/)upload\.wikimedia\.org/) < 0) return false; // Wikia and Wikimedia only
url = url.replace(/(vignette.*?)(\/revision.*$)/, '$1');
if(url.search(/\.(ogg|oga|ogv)/) < 0) return false; //Removed the ending tag ($) from previous author's vesion since regex strip didn't work too well
return true;
}
};
OggPlayer.init();
}
mw.hook('dev.i18n').add(function(i18n) {
i18n.loadMessages('OggPlayer').then(init);
});
})(this,jQuery, mediaWiki);
(function(){
let audios = document.getElementsByClassName("audio-player");
for(let i=0;i<audios.length;i++){
let audio = audios[i];
let link = audio.firstElementChild.href;
audio.innerHTML = "";
let a = document.createElement('audio');
a.src = link;
audio.append(a);
let button = document.createElement('button');
button.onclick = ()=>{
if (a.paused){
a.play();
button.classList.add('audio-player-playing');
button.classList.remove('audio-player-paused');
}else{
a.pause()
button.classList.add('audio-player-paused');
button.classList.remove('audio-player-playing');
}
}
a.onended = () => {
button.classList.remove('audio-player-playing');
}
audio.append(button);
}
})();