Я создал этот маленький аудиоплеер, который играет рандомизированное введение, мидель для песни, а затем рандомизированное outro. Прямо сейчас он жестко запрограммирован на 1 песню. Каждая песня имеет 3 входа, мидель и 3 outros. Я хочу иметь список песен, которые выбираются случайным образом (например, произвольно выбирать из массива), поэтому скрипт выберет песню и соответственно изменит сценарий (входы и выходы и срез). Я думал о разных способах этого, но я не хочу иметь огромное количество массивов для каждой песни в скрипте. Как я буду разрабатывать такую систему? демо на www.saradio.tk/dev.html (аудио синхронизация работает только правильно в Chrome-ACTIVE-TAB AFAIK)Конвертировать JavaScript для работы с несколькими композициями?

Код:

<body onload="checkdif(), loadintro(), loadoutro()"> 
<audio id="intro" src="" controls preload autoplay></audio> 
<audio id="mid" src="radio/Barracuda-mid.ogg" controls preload></audio> 
<audio id="outro" src="" controls preload></audio> 
<br> 
<br> 
<button onclick="resetradio()">RESET</button> <span id="timeleft"> n/a </span> 

<script> 
    var intros = [ 
     "radio/Barracuda-intro1.ogg", 
     "radio/Barracuda-intro2.ogg", 
     "radio/Barracuda-intro3.ogg"]; 

    var outros = [ 
     "radio/Barracuda-outro1.ogg", 
     "radio/Barracuda-outro2.ogg", 
     "radio/Barracuda-outro3.ogg"]; 

    function loadintro() { 
     document.getElementById("intro").src = intros[Math.floor(Math.random() * intros.length)]; 
     document.getElementById("intro").load(); 
     document.getElementById("intro").play(); 
    } 

    function loadoutro() { 
     document.getElementById("outro").src = outros[Math.floor(Math.random() * outros.length)]; 
     document.getElementById("outro").load(); 
    } 

    x = document.getElementById('intro'); 
    y = document.getElementById('mid'); 
    done = false; 
    done2 = false; 

    function checkdif() { 
     if (done) return; 
     setTimeout('checkdif()', 5); 
     document.getElementById('timeleft').innerHTML = x.duration - x.currentTime; 
     if (x.duration - x.currentTime <= 0.09) { 
      document.getElementById('mid').play(); 
      done = true; 
      checkdif2(); 
     } 
    } 

    function checkdif2() { 
     if (done2) return; 
     setTimeout('checkdif2()', 5); 
     document.getElementById('timeleft').innerHTML = y.duration - y.currentTime; 
     if (y.duration - y.currentTime <= 0.09) { 
      document.getElementById('outro').play(); 
      done2 = true; 
     } 
    } 

    function resetradio() { 
     done = false; 
     done2 = false; 
     document.getElementById('mid').pause(); 
     document.getElementById('mid').currentTime = 0; 
     loadintro(); 
     loadoutro(); 
     checkdif(); 
    } 

    document.getElementById("outro").addEventListener('ended', resetradio, false) 
</script> 
</body>

PS: Я тоже, хотя о разработке системы, так что снимает эту песню просто играл из списка, поэтому он никогда не воспроизводит одну и ту же песню до тех пор, пока она не переместится через все другие возможности. Таким образом, он выбирает из множества песен, и когда он выбирает, скажет «песня x», он удалит «песню x» из массива для следующего запуска случайного выбора. Просто мысли ...

new.html

Если посмотреть исходный код и смотреть на консоли, вы увидите, что он тянет случайную песню из массива , затем удаляет эту песню из массива. Таким образом, он не повторяет песню до тех пор, пока не будут воспроизведены все песни. Как только петля попадает к последней песне, массив восстанавливается в исходное состояние.

источник

2013-03-04 turtlefeet

Даже если вы говорите, что не хотите иметь огромное количество массивов, если каждая песня содержит список интро и список outros, вы должны как-то «знать» о них. Вы в основном есть 2 варианта:

делают систему именования конвенции, где все Outros и интро имеют схожие имена файлов с некоторым суффиксом
указать все интро OUTROS

Для 1., ваши данные структура может выглядеть следующим образом:

var intro_suffix = '-intro'; 
var outro_suffix = '-outro'; 
var extension = '.ogg'; 
var songs = [ 
    { 
      base_name: "radio/Barracuda" 
     , num_intro: 3 
     , num_outros: 3 
    }, 
    { 
      base_name: "radio/SomeOtherSong" 
     , num_intro: 3 
     , num_outros: 3 
    }, 
];

от того, когда вы выбираете песню, вы черпаете имена файлов интро, основной песни, и аутро. Например:

var song = songs[0]; 
var intro_url = song.name 
    + intro_suffix 
    + (1 + Math.floor(Math.random() * song.num_intros)) 
    + extension; 
var song_url = song.name + extension; 
var outro_url = song.name 
    + outro_suffix 
    + (1 + Math.floor(Math.random() * song.num_outros)) 
    + extension;

Для 2, ваша структура данных должна быть четко:

var songs = [ 
    { 
      url: "radio/Barracuda.ogg" 
     , intros: ["radio/Barracuda-intro1.ogg", "radio/Barracuda-intro2.ogg", "radio/Barracuda-intro3.ogg"] 
     , outros: ["radio/Barracuda-outtro1.ogg", "radio/Barracuda-outro2.ogg", "radio/Barracuda-outro3.ogg"] 
    }, 
    { 
      url: "radio/SomeOtherSong.ogg" 
     , intros: ["radio/foo.ogg", "radio/bar.ogg", "radio/baz.ogg"] 
     , outros: ["radio/meh.ogg", "radio/fuuuuu.ogg", "radio/yo.ogg"] 
    }, 
];

А потом вы черпаете свои переменные:

var song = songs[0]; 
var intro_url = song.intros[Math.floor(Math.random() * song.intros.length)]; 
var song_url = song.url; 
var outro_url = song.outros[Math.floor(Math.random() * song.outros.length)];

One "преимущество" 2 заключается в том, что вы можете использовать свои файлы, все, что хотите.

источник

2013-03-04 05:33:08

+1 для пояснения. –

Я реализую идею №1, когда я печатаю это. Мне пришлось сделать то же самое изменение, которое вы сделали несколько минут назад (добавив 1 к math.floor, поэтому результаты x1-x3 не x0-x2. Этот метод работает лучше для меня, поскольку я заметил, что не все песни содержат 3 ввода или outros, и наличие этой системы гарантирует, что я могу просто изменить значения в массиве, чтобы «движок» не выдавал недопустимые источники. – turtlefeet

PS: Я также добавил 'var mid_suffix = '-mid';' и изменил 'var song_url = song.name + mid_suffix + extension;' поэтому правильный источник ** song-mid.ogg ** будет использоваться для середины , – turtlefeet

Конвертировать JavaScript для работы с несколькими композициями?

UPDATE: Вот моя окончательная реализация этой системы: http://saradio.tk/new.html

ответ

Смежные вопросы