MediaWiki:Common.js:修订间差异
跳转到导航
跳转到搜索
无编辑摘要 |
无编辑摘要 |
||
第16行: | 第16行: | ||
mw.loader.using('mediawiki.util', function () { | mw.loader.using('mediawiki.util', function () { | ||
const audio = document.createElement('audio'); | |||
audio.src = 'https://d1rtq9slcl72gh.cloudfront.net/audio/home.mp3'; | audio.src = 'https://d1rtq9slcl72gh.cloudfront.net/audio/home.mp3'; | ||
audio.loop = true; | audio.loop = true; | ||
audio.id = 'bgm'; | audio.id = 'bgm'; | ||
// 尝试恢复播放位置 | |||
const lastTime = localStorage.getItem('bgm-time'); | |||
if (lastTime) audio.currentTime = parseFloat(lastTime); | |||
player.style.cssText = | // 播放器UI | ||
const player = document.createElement('div'); | |||
player.innerHTML = ` | |||
<button onclick="document.getElementById('bgm').play()">▶ 播放</button> | |||
<button onclick="document.getElementById('bgm').pause()">⏸ 暂停</button> | |||
<div style='flex-grow:1; height:6px; background:#444; border-radius:3px; overflow:hidden;'> | |||
<div id='bar' style='height:6px;width:0%;background:#66f;'></div> | |||
</div> | |||
`; | |||
player.style.cssText = ` | |||
position: fixed; | |||
bottom: 10px; | |||
right: 10px; | |||
z-index: 9999; | |||
background: #111; | |||
color: white; | |||
padding: 10px 15px; | |||
border-radius: 10px; | |||
display: flex; | |||
gap: 10px; | |||
align-items: center; | |||
box-shadow: 0 0 10px #000; | |||
font-size: 14px; | |||
`; | |||
document.body.appendChild(audio); | document.body.appendChild(audio); | ||
document.body.appendChild(player); | document.body.appendChild(player); | ||
// 用户首次点击后允许播放 | |||
document.body.addEventListener('click', function () { | document.body.addEventListener('click', function () { | ||
audio.play().catch( | audio.play().catch(() => {}); | ||
}, { once: true }); | }, { once: true }); | ||
// 播放条和位置存储 | |||
setInterval(function () { | setInterval(function () { | ||
if (!audio.duration) return; | if (!audio.duration) return; | ||
const percent = (audio.currentTime / audio.duration) * 100; | |||
document.getElementById('bar').style.width = percent + '%'; | document.getElementById('bar').style.width = percent + '%'; | ||
// 每次更新时存储当前播放位置 | |||
localStorage.setItem('bgm-time', audio.currentTime); | |||
}, 300); | }, 300); | ||
}); | }); |
2025年6月4日 (三) 22:51的版本
$(function () {
var $counter = $('<div id="online-counter">当前在线 <span style="color:#a782ff;">👥</span>:<span id="online-number">加载中...</span></div>');
$('body').append($counter);
function updateOnlineNumber() {
$.getJSON('/api/online.php', function(data) {
$('#online-number').text(data.count || 0);
}).fail(function () {
$('#online-number').text('获取失败');
});
}
updateOnlineNumber();
setInterval(updateOnlineNumber, 30000);
});
mw.loader.using('mediawiki.util', function () {
const audio = document.createElement('audio');
audio.src = 'https://d1rtq9slcl72gh.cloudfront.net/audio/home.mp3';
audio.loop = true;
audio.id = 'bgm';
// 尝试恢复播放位置
const lastTime = localStorage.getItem('bgm-time');
if (lastTime) audio.currentTime = parseFloat(lastTime);
// 播放器UI
const player = document.createElement('div');
player.innerHTML = `
<button onclick="document.getElementById('bgm').play()">▶ 播放</button>
<button onclick="document.getElementById('bgm').pause()">⏸ 暂停</button>
<div style='flex-grow:1; height:6px; background:#444; border-radius:3px; overflow:hidden;'>
<div id='bar' style='height:6px;width:0%;background:#66f;'></div>
</div>
`;
player.style.cssText = `
position: fixed;
bottom: 10px;
right: 10px;
z-index: 9999;
background: #111;
color: white;
padding: 10px 15px;
border-radius: 10px;
display: flex;
gap: 10px;
align-items: center;
box-shadow: 0 0 10px #000;
font-size: 14px;
`;
document.body.appendChild(audio);
document.body.appendChild(player);
// 用户首次点击后允许播放
document.body.addEventListener('click', function () {
audio.play().catch(() => {});
}, { once: true });
// 播放条和位置存储
setInterval(function () {
if (!audio.duration) return;
const percent = (audio.currentTime / audio.duration) * 100;
document.getElementById('bar').style.width = percent + '%';
// 每次更新时存储当前播放位置
localStorage.setItem('bgm-time', audio.currentTime);
}, 300);
});