[+]
[audiopl.js|public]
{.add header|Cache-Control: public, max-age=86400.}
export function audiop(){ //© DJ BSD-2-Clause License
document.querySelector('#files').addEventListener("click", function(e){ var f=e.target; if (f.tagName!='A') return;
B=[...document.querySelectorAll('#files a[href$=".mp3"],#files a[href$=".ogg"]')].map(obj => obj.href);
if(document.querySelector('.checked')) B=[...document.querySelectorAll('.checked a:not([href$="/"])')].map(obj => obj.href) //
if (B.find( el => el == f.href )) {e.preventDefault();
var shuffle=false; if(new URL(location).searchParams.get('shuffle')) shuffle=!shuffle; if(shuffle) B=B.sort(function(a, b){return 0.5 - Math.random()}) //?shuffle=true
if(f.href==audio.src) if(audio.paused) audio.play(); else audio.pause(); else {audio.src=f.href; audio.play(); art()}}
else if (document.querySelector('main') && f.href.endsWith('.m3u')) {e.preventDefault(); folder=f.pathname.replace(/[^\/]*$/,''); fetch(f.pathname) .then(res => res.text()).then(txt => render(txt))} //
})
var audio=new Audio(), B, vtt=false //edit here
//if(document.querySelector('a[href$=".vtt"]')) vtt=true
if(vtt) {document.querySelector('header').insertAdjacentHTML('beforebegin',''); audio=document.querySelector('video')}
audio.onended = function(z) {if(z!=-1) z=1; let ind=B.findIndex(o => o==audio.src); audio.src=B[(ind+z)%B.length];audio.play(); art()}
if ('mediaSession' in navigator) {navigator.mediaSession.setActionHandler('nexttrack', function(){audio.onended()}); navigator.mediaSession.setActionHandler('previoustrack', function(){audio.onended(-1)});
navigator.mediaSession.setActionHandler('seekforward', function(){audio.currentTime+=10})}
function art() { const ext_th='' //edit here '.png'
if(!'mediaSession' in navigator) return //thumbs must have same name and be in subfolder thumb
var tmp=decodeURI(audio.src.replace(/.*\//,'')); tmp=tmp.split(' - ') //artist - title.mp3
navigator.mediaSession.metadata = new MediaMetadata({title: tmp[1]||tmp[0], artist: tmp[1]? tmp[0]:'',
artwork: document.querySelector('a[href$="thumb/"]')? [{src: audio.src.replace(/.*\//,'$&thumb/')+ext_th, sizes:'128x128', type:'image/png'}] : []})
//if(!document.querySelector('nav>img')) document.querySelector('nav').insertAdjacentHTML('afterbegin', ''); document.querySelector('nav>img').src=audio.src.replace(/.*\//,'$&thumb/')+ext_th
//document.querySelector('a[href="'+audio.src.replace(location.origin,'')+'"]').focus()
if(vtt) document.querySelector('track').src=audio.src.replace(location.origin,'')+'.vtt' //vtt file must have same name
} //
audio.onloadedmetadata=function() {document.querySelector('a[href="'+this.src.replace(location.origin,'')+'"]').title=audio.mozGetMetadata? audio.mozGetMetadata().TITLE:new Date(audio.duration*1000).toJSON().slice(14,-5)} //
const sleep=new URL(location).searchParams.get('sleep') ; if(sleep) setTimeout(function(){audio.pause()},sleep*60000) //?sleep=5 in min
audio.onerror=function(){audio.onended()} //
//document.querySelector('#menu-bar').insertAdjacentHTML('beforeend', ''); play.onclick=function() {if(audio.paused) audio.play(); else audio.pause()}; audio.onpause=function() {play.textContent="►"}; audio.onplay=function() {play.textContent="❙❙"}
//audio.ontimeupdate=function(e){upload.style.backgroundPosition=e.target.currentTime/e.target.duration*74-74+'px'}
}