Привет
Надеюсь, здесь найду помощь!
Я пытаюсь создать простой аудиоплеер на html5 и jQuery.
Принцип работы придумал такой: создаю аудио элемент, добавляю к нему источники со ссылками, средствами jQuery управляю им. Когда нужно проиграть другой файл - меняю ссылку в источнике.
Когда хочу проиграть один файл/поток либо когда сам кликаю по файлам в СВ (списке воспроизведения), то мой плеер работает хорошо. Но мне нужно, чтобы он мог проиграть весь СВ, чтобы все файлы прозвучали один за другим автоматически.
Я не силен в Javascript... Попытался реализовать это с $.each(), также попытался создать рекурсивную функцию... но... без успешно!
Могу показать часть кода:
var el = $('#playerbox'); // это <div> в котором создам плеер...
var soundType = el.data('page-soundtype');
var soundFile = el.data('page-soundfile');
var soundFiles = el.data('page-soundfiles');//playlist, paths to sources
var audio = $("<audio preload />");
//make 2 types of sources for different browsers:
var source1= $('<source />').attr('type', 'audio/mpeg'); // original, mp3 format
var source2= $('<source />').attr('type', 'audio/ogg'); // a copy, ogg format
audio.append(source1).append(source2);
el.append(audio);
var player=audio[0];
player.volume=0;
var i=0; //The play list counter, in case we have it
var op={}; //player options
var runPlayer = function(op){
var fadetime = (op.fadetime || 1000);
player.oncanplay = function(){
player.play();
audio.animate({volume: 1}, fadetime);
}
if(soundType === 'list'){
player.addEventListener('ended', function(){
i++;
if(soundFiles[i].length>0){
source1.attr('src', soundFiles[i]);
source2.attr('src', soundFiles[i].replace(".mp3", ".ogg"));
op.fadetime = 1500;
player.pause();
runPlayer(op);
}
}, false)
}
}
//set sources
if(soundType==='list' && $.isArray(soundFiles)){
//prepare playlist
source1.attr('src', soundFiles[i]);
source2.attr('src', soundFiles[i].replace(".mp3", ".ogg"));
op.fadetime = 1;
}
else if(soundType==='sound'){
//prepare sound
source1.attr('src', soundFile);
source2.attr('src', soundFile.replace(".mp3", ".ogg"));
}
runPlayer(op);
Так, мой плеер проигрывает первый файл из СВ, загружает второй в "src" плеера, но не проигрывает его...
С помощью консоли определил, что второй файл загружается в 'src', но все что внутри player.oncanplay = function(){ } - при втором вызове уже не срабатывает...
Помогите разобраться...
Благодарю.
