跳转到内容

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

来自电棍ottowiki
 
(未显示同一用户的5个中间版本)
第1行: 第1行:
// MediaWiki:Gadget-AudioText.js
// MediaWiki:Gadget-AudioText.js
(function() {
(function() {
    // 预加载音频URL缓存
     const audioUrlCache = new Map();
     const audioUrlCache = new Map();


     // 统一处理播放逻辑
     // 播放音频核心逻辑
     function handlePlay(element) {
     function handlePlay(element) {
        const originalText = element.textContent;
       
        // 显示加载状态
        element.textContent = "加载中...";
        element.style.color = "#999";
         const audioFile = element.dataset.audioFile;
         const audioFile = element.dataset.audioFile;
          
          
         // 优先使用缓存
         // 优先使用缓存
         if (audioUrlCache.has(audioFile)) {
         if (audioUrlCache.has(audioFile)) {
             playAudio(audioUrlCache.get(audioFile), element, originalText);
             new Audio(audioUrlCache.get(audioFile)).play();
             return;
             return;
         }
         }


         // 通过API获取音频真实URL
         // 通过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';
第29行: 第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]?.url;
                 const audioUrl = pages[pageId].imageinfo[0].url;
               
                if (!audioUrl) {
                    throw new Error("未找到音频文件");
                }
               
                // 缓存URL并播放
                 audioUrlCache.set(audioFile, audioUrl);
                 audioUrlCache.set(audioFile, audioUrl);
                 playAudio(audioUrl, element, originalText);
                 new Audio(audioUrl).play();
            })
            .catch(() => {
                // 失败状态提示
                element.textContent = "加载失败,点击重试";
                element.style.color = "red";
             });
             });
     }
     }


     function playAudio(url, element, originalText) {
     // 初始化事件绑定
        const audio = new Audio(url);
       
        audio.play().then(() => {
            // 播放成功恢复状态
            element.textContent = originalText;
            element.style.color = "blue";
        }).catch(() => {
            // 静默失败,不干扰用户
            element.textContent = originalText;
            element.style.color = "blue";
        });
    }
 
    // 事件绑定(支持移动端)
     function initAudioTriggers() {
     function initAudioTriggers() {
         document.querySelectorAll('.audio-trigger').forEach(element => {
         document.querySelectorAll('.audio-trigger').forEach(element => {
第66行: 第34行:
             element._audioBound = true;
             element._audioBound = true;


            // 统一事件处理器(不阻止冒泡和默认行为)
             const handler = (event) => {
             const handler = (event) => {
                event.preventDefault();
                 handlePlay(element);
                 handlePlay(element);
                // 不调用 event.stopPropagation() 或 event.preventDefault()
             };
             };


             element.addEventListener('touchstart', handler, { passive: false });
            // 同时绑定touch和click(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);
})();