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

2025年5月24日 (六) 23:03的版本 查看源代码 OctoberSama​（留言 | 贡献） 小 ←上一编辑		2025年5月24日 (六) 23:07的版本 查看源代码 OctoberSama​（留言 | 贡献） 小 下一编辑→
第1行：		第1行：
	// MediaWiki:Gadget-AudioText.js		// MediaWiki:Gadget-AudioText.js
	(function() {		(function() {
	// ========== 阶段1：全局初始化追踪 ==========		mw.hook('wikipage.content').add(function() {
	alert("[0/5] Gadget脚本开始执行");		alert("🎉 JS脚本已加载！"); // 1. 脚本加载确认
	// ========== 阶段2：基础环境检测 ==========		document.querySelectorAll('.audio-trigger').forEach(element => {
	if (typeof mw === 'undefined') {		element.addEventListener('click', function() {
	alert("[1/5] ❌ 致命错误：MediaWiki核心对象未定义");		alert("🖱️ 点击事件已触发！"); // 2. 点击事件确认
	return;
	}		const audioFile = element.dataset.audioFile;
	alert("[2/5] ✅ 检测到MediaWiki核心对象");		alert("📁 音频文件名: " + audioFile); // 3. 显示模板参数
	// ========== 阶段3：强制加载依赖 ==========		// 构造API请求URL
	mw.loader.using(['mediawiki.util', 'mediawiki.api'], function() {		const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' +
	alert("[3/5] ✅ 核心依赖已加载");		encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json';
			alert("🔗 即将请求API: \n" + apiUrl); // 4. 显示API地址
	// ========== 阶段4：主逻辑定义 ==========
	const initAudioSystem = function() {
	try {
	// 调试：检查页面元素
	const elements = document.querySelectorAll('.audio-trigger');
	if (elements.length === 0) {
	alert("[4/5] ⚠️ 未找到.audio-trigger元素");
	return;
	}
	alert(`[4/5] ✅ 找到${elements.length}个音频元素`);
	// 定义播放逻辑		// 发送API请求
	const handleClick = async (element) => {		fetch(apiUrl)
	try {		.then(response => {
	// 获取音频参数		alert("📡 API响应状态: " + response.status); // 5. HTTP状态码
	const audioFile = element.dataset.audioFile;		return response.json();
	alert("[播放1] 模板参数: " + audioFile);		})
			.then(data => {
	// 构造API请求		alert("📦 API返回原始数据: \n" + JSON.stringify(data)); // 6. 原始API数据
	const apiUrl = mw.util.wikiScript('api') +
	'?action=query&format=json&titles=' +
	encodeURIComponent(audioFile) +
	'&prop=imageinfo&iiprop=url';
	alert("[播放2] 请求API: " + apiUrl);
	// 获取音频URL
	const response = await fetch(apiUrl);
	const data = await response.json();
	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;
	alert("[播放3] 解析URL: " + audioUrl);		alert("🎵 解析出的音频URL: \n" + audioUrl); // 7. 最终音频地址
	// 立即播放		// 尝试播放
	const audio = new Audio(audioUrl);		const audio = new Audio(audioUrl);
	audio.play().then(() => {		audio.play()
	alert("[播放4] ✅ 播放成功");		.then(() => alert("✅ 播放成功！"))
	}).catch(e => {		.catch(e => alert("❌ 播放失败: " + e.message)); // 8. 播放结果
	alert("[播放5] ❌ 播放失败: " + e.message);		})
	});		.catch(error => {
			alert("💥 发生严重错误: " + error.message); // 9. 全局错误捕获
	} catch(e) {
	alert("[播放X] 💥 全局错误: " + e.message);
	}
	};
	// ========== 阶段5：事件绑定 ==========
	elements.forEach(element => {
	if (element._bound) return;
	element._bound = true;
	// 桌面端点击
	element.addEventListener('click', (e) => {
	e.preventDefault();
	alert("[事件] 点击事件触发");
	handleClick(element);
	});		});
			});
	// 移动端触摸
	element.addEventListener('touchstart', (e) => {
	e.preventDefault();
	alert("[事件] 触摸事件触发");
	handleClick(element);
	}, { passive: false });
	alert(`[绑定] 元素已绑定: ${element.textContent}`);
	});
	} catch(e) {
	alert("[初始化X] 💣 系统崩溃: " + e.message);
	}
	};
	// ========== 强制初始化机制 ==========
	if (document.readyState === 'complete') {
	alert("[5/5] ⚡ 文档已就绪，立即初始化");
	initAudioSystem();
	} else {
	alert("[5/5] ⏳ 等待文档加载完成");
	document.addEventListener('DOMContentLoaded', initAudioSystem);
	}
	// 动态内容监听
	mw.hook('wikipage.content').add(() => {
	alert("[动态] 检测到新内容，重新初始化");
	initAudioSystem();
	});		});
	}, function(error) {
	alert("[依赖X] ❌ 依赖加载失败: " + error.toString());
	});		});
	})();		})();

2025年5月24日 (六) 23:07的版本

// MediaWiki:Gadget-AudioText.js
(function() {
    mw.hook('wikipage.content').add(function() {
        alert("🎉 JS脚本已加载！"); // 1. 脚本加载确认

        document.querySelectorAll('.audio-trigger').forEach(element => {
            element.addEventListener('click', function() {
                alert("🖱️ 点击事件已触发！"); // 2. 点击事件确认
                
                const audioFile = element.dataset.audioFile;
                alert("📁 音频文件名: " + audioFile); // 3. 显示模板参数

                // 构造API请求URL
                const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' + 
                    encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json';
                alert("🔗 即将请求API: \n" + apiUrl); // 4. 显示API地址

                // 发送API请求
                fetch(apiUrl)
                    .then(response => {
                        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);
                        audio.play()
                            .then(() => alert("✅ 播放成功！"))
                            .catch(e => alert("❌ 播放失败: " + e.message)); // 8. 播放结果
                    })
                    .catch(error => {
                        alert("💥 发生严重错误: " + error.message); // 9. 全局错误捕获
                    });
            });
        });
    });
})();