MediaWiki:Gadget-AudioText.js:修订间差异
外观
![]() OctoberSama(留言 | 贡献) 小 |
![]() OctoberSama(留言 | 贡献) 小 |
||
(未显示同一用户的29个中间版本) | |||
第1行: | 第1行: | ||
// MediaWiki:Gadget-AudioText.js | // MediaWiki:Gadget-AudioText.js | ||
(function() { | (function() { | ||
const audioUrlCache = new Map(); | const audioUrlCache = new Map(); | ||
// | // 播放音频核心逻辑 | ||
function handlePlay(element) { | function handlePlay(element) { | ||
const audioFile = element.dataset.audioFile; | const audioFile = element.dataset.audioFile; | ||
// 优先使用缓存 | // 优先使用缓存 | ||
if (audioUrlCache.has(audioFile)) { | if (audioUrlCache.has(audioFile)) { | ||
new Audio(audioUrlCache.get(audioFile)).play(); | |||
return; | return; | ||
} | } | ||
// | // 通过API获取真实URL | ||
const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' + | const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' + | ||
encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json'; | encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json'; | ||
第28行: | 第22行: | ||
const pages = data.query.pages; | const pages = data.query.pages; | ||
const pageId = Object.keys(pages)[0]; | const pageId = Object.keys(pages)[0]; | ||
const audioUrl = pages[pageId].imageinfo[0] | const audioUrl = pages[pageId].imageinfo[0].url; | ||
audioUrlCache.set(audioFile, audioUrl); | audioUrlCache.set(audioFile, audioUrl); | ||
new Audio(audioUrl).play(); | |||
}); | }); | ||
} | } | ||
// 初始化事件绑定 | |||
function initAudioTriggers() { | function initAudioTriggers() { | ||
document.querySelectorAll('.audio-trigger').forEach(element => { | document.querySelectorAll('.audio-trigger').forEach(element => { | ||
if (element._audioBound) return; | if (element._audioBound) return; | ||
element._audioBound = true; | element._audioBound = true; | ||
// | // 统一事件处理器(不阻止冒泡和默认行为) | ||
const handler = (event) => { | const handler = (event) => { | ||
handlePlay(element); | handlePlay(element); | ||
// 不调用 event.stopPropagation() 或 event.preventDefault() | |||
}; | }; | ||
// | // 同时绑定touch和click(passive模式提升移动端性能) | ||
element.addEventListener('touchstart', handler, { passive: | element.addEventListener('touchstart', handler, { passive: true }); | ||
element.addEventListener('click', handler); | element.addEventListener('click', handler); | ||
}); | }); | ||
} | } | ||
// | // 页面加载时初始化 | ||
mw.hook('wikipage.content').add(initAudioTriggers); | mw.hook('wikipage.content').add(initAudioTriggers); | ||
mw.loader.using('mediawiki.api').then(initAudioTriggers); | mw.loader.using('mediawiki.api').then(initAudioTriggers); | ||
})(); | })(); |
2025年5月24日 (六) 23:56的最新版本
// MediaWiki:Gadget-AudioText.js (function() { const audioUrlCache = new Map(); // 播放音频核心逻辑 function handlePlay(element) { const audioFile = element.dataset.audioFile; // 优先使用缓存 if (audioUrlCache.has(audioFile)) { new Audio(audioUrlCache.get(audioFile)).play(); return; } // 通过API获取真实URL const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' + encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json'; fetch(apiUrl) .then(response => response.json()) .then(data => { const pages = data.query.pages; const pageId = Object.keys(pages)[0]; const audioUrl = pages[pageId].imageinfo[0].url; audioUrlCache.set(audioFile, audioUrl); new Audio(audioUrl).play(); }); } // 初始化事件绑定 function initAudioTriggers() { document.querySelectorAll('.audio-trigger').forEach(element => { if (element._audioBound) return; element._audioBound = true; // 统一事件处理器(不阻止冒泡和默认行为) const handler = (event) => { handlePlay(element); // 不调用 event.stopPropagation() 或 event.preventDefault() }; // 同时绑定touch和click(passive模式提升移动端性能) element.addEventListener('touchstart', handler, { passive: true }); element.addEventListener('click', handler); }); } // 页面加载时初始化 mw.hook('wikipage.content').add(initAudioTriggers); mw.loader.using('mediawiki.api').then(initAudioTriggers); })();