跳转到内容

MediaWiki:Gadget-AudioText.js:修订间差异

来自电棍ottowiki
 
(未显示同一用户的15个中间版本)
第1行: 第1行:
// MediaWiki:Gadget-AudioText.js
// MediaWiki:Gadget-AudioText.js
(function() {
(function() {
     mw.hook('wikipage.content').add(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 => {
         document.querySelectorAll('.audio-trigger').forEach(element => {
             element.addEventListener('click', async function(event) {
             if (element._audioBound) return;
                try {
            element._audioBound = true;
                    event.preventDefault();
                   
                    // === 调试1: 点击事件触发 ===
                    alert("🖱️ 点击事件已触发!");


                    // 1. 立即创建空音频对象并尝试播放(同步获取用户授权)
            // 统一事件处理器(不阻止冒泡和默认行为)
                    const audio = new Audio();
            const handler = (event) => {
                    audio.autoplay = true;
                handlePlay(element);
                   
                // 不调用 event.stopPropagation() 或 event.preventDefault()
                    // === 调试2: 开始获取用户播放权限 ===
            };
                    alert("🔑 正在请求播放权限...");
                    await audio.play().catch(() => {}); // 静默忽略首次错误
                   
                    // 2. 异步获取真实音频URL
                    const audioFile = element.dataset.audioFile;
                    const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' +
                        encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json';


                    // === 调试3: 显示API请求URL ===
            // 同时绑定touch和click(passive模式提升移动端性能)
                    alert("🌐 请求API:\n" + apiUrl);
            element.addEventListener('touchstart', handler, { passive: true });
                   
             element.addEventListener('click', handler);
                    const response = await fetch(apiUrl);
                    const data = await response.json();
                   
                    // === 调试4: 显示原始API响应 ===
                    alert("📦 API原始数据:\n" + JSON.stringify(data).slice(0, 200) + "...");
                   
                    const pages = data.query.pages;
                    const pageId = Object.keys(pages)[0];
                    const audioUrl = pages[pageId].imageinfo[0].url;
                   
                    // === 调试5: 显示解析后的URL ===
                    alert("🎵 获得音频地址:\n" + audioUrl);
                   
                    // 3. 替换音频源并播放
                    audio.src = audioUrl;
                    await audio.play();
                   
                    // === 调试6: 播放成功反馈 ===
                    alert("✅ 播放成功!");
                } catch (error) {
                    // === 调试7: 错误捕获 ===
                    alert(`❌ 发生错误:\n${error.name}: ${error.message}`);
                }
             });
         });
         });
     });
     }
 
    // 页面加载时初始化
    mw.hook('wikipage.content').add(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);
})();