Template:AudioPlayer: Difference between revisions
From Tuyin Archives
No edit summary |
No edit summary |
||
| Line 5: | Line 5: | ||
var audioFile = new Audio(); | var audioFile = new Audio(); | ||
// | // Set a single file source. For multiple formats, you'd need separate fallback logic. | ||
audioFile. | audioFile.src = 'https://tuyin.online/images/{{{1}}}'; | ||
audioFile.preload = 'metadata'; | |||
window['toggle_' + playerId] = function() { | window['toggle_' + playerId] = function() { | ||
| Line 15: | Line 15: | ||
button.innerHTML = '⏸️'; | button.innerHTML = '⏸️'; | ||
}).catch(function(e) { | }).catch(function(e) { | ||
console.error('Play failed:', e); | |||
alert('Could not play audio: ' + e.message); | alert('Could not play audio: ' + e.message); | ||
}); | }); | ||
| Line 25: | Line 26: | ||
audioFile.addEventListener('timeupdate', function() { | audioFile.addEventListener('timeupdate', function() { | ||
var progress = document.getElementById(playerId + '_progress'); | var progress = document.getElementById(playerId + '_progress'); | ||
if (progress) { | if (progress && audioFile.duration) { | ||
progress.style.width = ((audioFile.currentTime / audioFile.duration) * 100) + '%'; | progress.style.width = ((audioFile.currentTime / audioFile.duration) * 100) + '%'; | ||
} | } | ||
| Line 31: | Line 32: | ||
audioFile.addEventListener('ended', function() { | audioFile.addEventListener('ended', function() { | ||
document.getElementById(playerId + '_btn').innerHTML = '▶️'; | var btn = document.getElementById(playerId + '_btn'); | ||
document.getElementById(playerId + '_progress').style.width = '0%'; | if (btn) btn.innerHTML = '▶️'; | ||
var progress = document.getElementById(playerId + '_progress'); | |||
if (progress) progress.style.width = '0%'; | |||
}); | }); | ||
Revision as of 19:55, 23 July 2025
