84,049
个编辑
无编辑摘要
(function () {
var Bikit = Bikit || {};
Bikit.kits.audio = {
Bikit.kits = Bikit.kits || {};
Bikit.kits.audio = {
isReady: false,
ready: function () {
this.isReady = true;
window.resetPlayer = function () {
this.pause();
this.currentTime = 0;
$(this).parent().find('.icon-btn').toggleClass('icon-play');
};
$("head").prepend('<style>.default-player audio{display:none;}.default-player .audio-controller{display:inline-block;width:30px;height:30px;padding:0;position:relative;text-align:center;background-color:#f8f9fa;cursor:pointer;border-radius:50%;border:1px solid #dddddd;box-sizing:border-box;}.default-player .audio-controller .icon-btn{display:inline-block;width:100%;height:100%;background:url("https://patchwiki.biligame.com/images/szqy/0/05/1tg75ar2mq110pxbmcze33cy0xlbrk0.png");background-size:100% 100%;background-repeat:no-repeat;background-position:center;} .default-player .audio-controller .icon-play{background:url("https://patchwiki.biligame.com/images/szqy/d/db/afe454y0obdwci3azwzc66j7jx9ge0r.png");background-size:100% 100%;background-repeat:no-repeat;background-position:center;}</style>');
$(".mw-parser-output").on("click", ".bikited-audio .audio-controller", function () {
var controlBtn = $(this).find('.icon-btn');
var audio = $(this).parent().find('audio')[0];
if (controlBtn.hasClass('icon-play')) {
audio.pause();
controlBtn.toggleClass('icon-play');
} else {
$("audio").each(function () {
if (this.paused) return true;
this.pause();
audio.currentTime = 0;
$(this).parent().find('.icon-btn').toggleClass('icon-play');
});
if (!audio.duration) audio.addEventListener("ended", resetPlayer);
audio.play();
controlBtn.toggleClass('icon-play');
audio.play();
}
});
},
main: function (ele, opts) {
if (!opts.src) return $(ele).hide();
var $audio = $("<audio>").attr({
"src": opts.src,
"controls": opts.controls || "",
"preload": opts.preload || "none"
});
$(ele).addClass("bikited-audio").append($audio);
if (opts.mode === "default") {
$(ele).addClass("default-player").append(
'<div class="audio-controller"><div class="play-pause"><div class="icon-btn"></div></div></div>');
if (!this.isReady) this.ready();
}
}
}
}
}
};
};
})();