Я работаю над веб-приложением метронома iOS. Так как мобильное сафари может воспроизводить только один звук за раз, я пытаюсь создать "аудио спрайт", где я могу использовать разные сегменты одной звуковой дорожки для генерировать разные звуки. У меня есть 1-секундный клип с двумя полусекундными звуками.
<audio id="sample" src="sounds.mp3"></audio>
<a href="javascript:play1();">Play1</a>
<a href="javascript:play2();">Play2</a>
<a href="javascript:pauseAudio();">Pause</a>
<script>
var audio = document.getElementById('click');
function play1(){
audio.currentTime = 0;
audio.play();
// This is the problem area
audio.addEventListener('timeupdate', function (){
if (currentTime >= 0.5) {
audio.pause();
}
}, false);
}
function play2(){
audio.currentTime = 0.5;
audio.play();
}
function pause(){
audio.pause();
}
</script>
Посмотрите на JSFiddle.
Как вы можете видеть, я попытался использовать событие timeupdate (jPlayer example) безрезультатно.
Я видел сообщение Remy Sharp на аудио спрайтах, но (A) я не смог заставить его работать для меня, и (B) я предпочитает избегать зависимости от библиотеки.
Любые идеи? Заранее благодарим за помощь!
Обновление
Теперь я работаю с помощью setInterval
:
function play1(){
audio.currentTime = 0;
audio.play();
int = setInterval(function() {
if (audio.currentTime > 0.4) {
audio.pause();
clearInterval(int);
}
}, 10);
}
function play2(){
clearInterval(int);
audio.currentTime = 0.5;
audio.play();
}
Есть некоторые проблемы с последовательностью и интервалами настройки/очистки, но для моей цели - это работает.
Спасибо!
P.S. Если у кого есть исправление для этого, это может быть использовано в играх и интерфейсе Sound FX.