Boa tarde, peguei o código de um player com html5 e javascript, no entanto gostaria que ao executar o primeiro áudio da lista ficassem desabilitadas todas as opções para alterar o áudio, não pudesse clicar em outro áudio da lista ou passar até que o primeiro terminasse.
O código é o seguinte:
HTML
<audio id="audio" preload="auto" tabindex="0" controls="" type="audio/mpeg"> <source type="audio/mp3" src="http://www.archive.org/download/bolero_69/Bolero.mp3"> Sorry, your browser does not support HTML5 audio. </audio> <ul id="playlist"> <li class="active"><a href="http://www.archive.org/download/bolero_69/Bolero.mp3">Ravel Bolero</a></li> <li><a href="http://www.archive.org/download/MoonlightSonata_755/Beethoven-MoonlightSonata.mp3">Moonlight Sonata - Beethoven</a></li> <li><a href="http://www.archive.org/download/CanonInD_261/CanoninD.mp3">Canon in D Pachabel</a></li> <li><a href="http://www.archive.org/download/PatrikbkarlChamberSymph/PatrikbkarlChamberSymph_vbr_mp3.zip">patrikbkarl chamber symph</a></li> </ul>
JavaScript
var audio; var playlist; var tracks; var current; init(); function init(){ current = 0; audio = $('audio'); playlist = $('#playlist'); tracks = playlist.find('li a'); len = tracks.length - 1; audio[0].volume = .10; audio[0].play(); playlist.find('a').click(function(e){ e.preventDefault(); link = $(this); current = link.parent().index(); run(link, audio[0]); }); audio[0].addEventListener('ended',function(e){ current++; if(current == len){ current = 0; link = playlist.find('a')[0]; }else{ link = playlist.find('a')[current]; } run($(link),audio[0]); }); } function run(link, player){ player.src = link.attr('href'); par = link.parent(); par.addClass('active').siblings().removeClass('active'); audio[0].load(); audio[0].play(); }
O que precisaria ser mudado pra fazer o que eu gostaria? Não tenho muito conhecimento em javascript