У кого-нибудь есть идея, как добиться бесцельной петли для звукового тега? Я думаю что-то основанное на javascript.
У меня есть цикл say 1 measure, и я хочу, чтобы он зациклился и остался в темпе. Поэтому мне нужно, чтобы петля была гладкой/бесщеточной. Когда я просто устанавливаю "loop" в true, он будет отставать и не останется в темпе.
К сожалению, это одна из недостатков элемента HTML5. Нет никакой гарантии, что звук будет воспроизводиться, когда вы захотите его или без задержки.
Есть два варианта, на которые стоит обратить внимание - SoundManager2 (http://www.schillmania.com/projects/soundmanager2/) - отличная библиотека, которая, вероятно, будет здесь полезной, хотя она будет использовать Flash для воспроизведения звука в этот случай.
Другим вариантом является просмотр API веб-аудио в Chrome или API аудиоданных в Firefox. Оба они действительно новы и еще не готовы к прайм-тайм, но позволяют делать такие вещи, как плановое воспроизведение звука, цикл и многое другое. http://www.htmlfivewow.com/slide58 для более подробной информации!
Пока все еще не идеально, это сработало для меня:
var audio_file = new Audio('whatever.mp3')
audio_file.addEventListener('timeupdate', function(){
var buffer = .44
if(this.currentTime > this.duration - buffer){
this.currentTime = 0
this.play()
}}, false);
Экспериментируйте с размером буфера, чтобы найти то, что лучше всего подходит вам.
Решение должно иметь 2 экземпляра для управления воспроизведением.
Что-то вроде этого:
var current_player = "a";
var player_a = document.createElement("audio");
var player_b = document.createElement("audio");
player_a.src = "sounds/back_music.ogg";
player_b.src = player_a.src;
function loopIt(){
var player = null;
if(current_player == "a"){
player = player_b;
current_player = "b";
}
else{
player = player_a;
current_player = "a";
}
player.play();
setTimeout(loopIt, 5333); //5333 is the length of the audio clip in milliseconds.
}
loopIt();
И если вы используете SoundManager2, отправьте звук через URI данных вместо URL-запроса.
Странно, я обнаружил, что SoundManager2 запрашивает файл с сервера каждый раз, когда он играет. Даже при загрузке из кеша будет задержка до тех пор, пока не будет получен не модифицированный заголовок для аудиофайла.
Я пытаюсь сделать это с помощью интервалов, попробуйте https://github.com/Hivenfour/SeamlessLoop
работал у меня с wav файлами, тестировался в Chrome, Firefox и Opera
Да, это настоящая боль... очевидно, тот, кто специфицировал элемент, не был ни музыкантом, ни разработчиком игры - хе.
Во всяком случае, в зависимости от того, что вы делаете, другим возможным обходным путем является создание MP3/OGG/wav, что является несколькими повторами вашего цикла. Это очень удобно для тех случаев, когда вы хотите зацикливать звук всего несколько раз, прежде чем перестать играть.
Примером этого может быть игрок, проталкивающий ракетный корабль. На данный момент я разрабатываю игру только с этим сценарием и создал MP3 с несколькими циклами звукового эффекта осевого удара, всего около 6 секунд воспроизведения. Чтобы свести к минимуму размер загрузки, я закодировал звук со скоростью 32 кбит/с - любой ниже, и он начинает звучать неприемлемо всплеск, так как звук осевого шума в значительной степени белый.
Как вы можете догадаться, я просто разбираюсь в том, что очень маловероятно, что игрок будет нажимать непрерывно в течение 6 секунд. Если они это сделают, они услышат разрыв, но я смогу жить с этим. Большую часть времени они не будут тянуть на что-нибудь подобное, поэтому не услышите сбой.
Еще один вариант, который я рассмотрел, - это пара образцов, которые исчезают и исчезают, и оба цикла со смещением.
Хотя они работают для некоторых игровых сценариев, они почти наверняка не будут работать для любого музыкального сценария. YMMV.
Я искал пару часов для решения, так как это была первая страница, на которой я приземлился, я хочу поделиться с вами ссылкой на библиотеку JS, которая, кажется, отлично воспроизводит петлю звуковых дорожек без любой пробел Gapless-5
Я пробовал методы выше, без успеха. В моем случае использования (с использованием Firefox 43.0) все, кажется, нажмите. Частично это связано с необходимостью зацикливаться на непрерывном тоне, который не имеет удобных разрывов или низких точек в нем (я пытаюсь создать двигатель с изменением скорости, используя 22010 выборок/сек. Моновальные файлы).
Однако я могу объединить мой .wav файл вместе несколько раз, чтобы создать один длинный .wav файл, который не имеет кликов в нем (за исключением того, что он не встречается в конце), это потому, что мой оригинал. Файл wav был тщательно обработан, чтобы быть циклическим.
Теперь я планирую, что несколько из этих длинных файлов все время воспроизводятся одновременно (по одному для каждого уровня оборотов автомобиля) и смешивают эти сигналы с использованием коэффициента усиления (описанного здесь: http://www.html5rocks.com/en/tutorials/webaudio/intro/). Это должно привести к созданию движка с двигателем без щелчка, который будет звучать намного лучше, чем просто запуск и остановка воспроизведения отдельных файлов .wav.
Это пока невозможно использовать с использованием HTML5 аудио, потому что закончившееся событие запускается только один раз для каждого аудио элемента.
мой подход - сложный, но тот, который работает для эмбиентной фоновой музыки
скажем, что наш трек имеет 5,3 секунды
у вас есть 2 аудиодорожки одного и того же файла. когда заканчивается (например, за 1 секунду до окончания - 4.3s-5.3s), вы исчезаете (устанавливаете громкость на процент позиции за одну секунду). в то же время второй трек начинает исчезать в (0s-1s). вы можете сделать это через некоторый интервал 50 мс или что-то еще, в зависимости от вашей аудио-библиотеки
после окончания воспроизведения вы переключаете логическую переменную, которая управляет этим fadein/fadeout и реверсирует, какая дорожка будет исчезать и какая дорожка будет исчезать в следующем прогоне