跳转到内容

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

来自电棍ottowiki
OctoberSama
OctoberSama留言 | 贡献 (撤销OctoberSama讨论)的修订版本6344
 
(未显示同一用户的16个中间版本)
第1行: 第1行:
// MediaWiki:Gadget-AudioText.js
// MediaWiki:Gadget-AudioText.js
(function() {
(function() {
     mw.hook('wikipage.content').add(function() {
     const audioUrlCache = new Map();
        alert("🎉 JS脚本已加载!"); // 1. 脚本加载确认


    // 播放音频核心逻辑
    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', function() {
             if (element._audioBound) return;
                alert("🖱️ 点击事件已触发!"); // 2. 点击事件确认
            element._audioBound = true;
               
                const audioFile = element.dataset.audioFile;
                alert("📁 音频文件名: " + audioFile); // 3. 显示模板参数


                // 构造API请求URL
            // 统一事件处理器(不阻止冒泡和默认行为)
                const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' +
            const handler = (event) => {
                    encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json';
                handlePlay(element);
                 alert("🔗 即将请求API: \n" + apiUrl); // 4. 显示API地址
                 // 不调用 event.stopPropagation() 或 event.preventDefault()
            };


                // 发送API请求
            // 同时绑定touch和click(passive模式提升移动端性能)
                fetch(apiUrl)
            element.addEventListener('touchstart', handler, { passive: true });
                    .then(response => {
            element.addEventListener('click', handler);
                        alert("📡 API响应状态: " + response.status); // 5. HTTP状态码
        });
                        return response.json();
    }
                    })
                    .then(data => {
                        alert("📦 API返回原始数据: \n" + JSON.stringify(data)); // 6. 原始API数据
                       
                        const pages = data.query.pages;
                        const pageId = Object.keys(pages)[0];
                        const audioUrl = pages[pageId].imageinfo[0].url;
                        alert("🎵 解析出的音频URL: \n" + audioUrl); // 7. 最终音频地址


                        // 尝试播放
    // 页面加载时初始化
                        const audio = new Audio(audioUrl);
    mw.hook('wikipage.content').add(initAudioTriggers);
                        audio.play()
    mw.loader.using('mediawiki.api').then(initAudioTriggers);
                            .then(() => alert("✅ 播放成功!"))
                            .catch(e => alert("❌ 播放失败: " + e.message)); // 8. 播放结果
                    })
                    .catch(error => {
                        alert("💥 发生严重错误: " + error.message); // 9. 全局错误捕获
                    });
            });
        });
    });
})();
})();

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);
})();