2014-10-04 2 views
0

Я следующий сценарий, используя howler.js и JQuery-UI-1.8.21.custom.min.js:Howler.js продолжительность OnLoad

$(function(){ 
    var sounduser1 = new Howl({ 
     urls: ['studio/keysintheair.mp3', 'studio/keysintheair.ogg'], 
     buffer:true, 
     volume: 1.0, 
     onend: function() { 
      $('.buttons').fadeIn(); 
     }, 
    }); 
    var sounduser2 = new Howl({ 
     urls: ['studio/keysintheair-original.mp3'], 
     buffer:true, 
     volume: 0.1, 
    }); 

    var thisArray = { 
     user1: sounduser1, 
     user2: sounduser2 
    }; 

    $.each(thisArray, function(key,value) { 
     $('.buildplayer .player').clone().attr('id',key).appendTo('#song'); 
     $('#song .player:last .waveform').css("width", value._duration + "px"); 
     $('#song .player:last .slider').slider({ 
      value: value.volume() * 100, 
      range: "min", 
      animate: true, 
      orientation: "horizontal", 
      //Slider Event 
      slide: function(event, ui) { //When the slider is sliding 
       var now_id = $(this).parent().parent('.player').attr('id'); 
       thisArray[now_id].volume(ui.value/100); 
      }, 
     }); 
    }); 

    $('.mainplayer .trackslider').slider({ 
     value: 0, 
     range: "min", 
     animate: true, 
     orientation: "horizontal", 
     //Slider Event 
     slide: function trackslider(event, ui) { //When the slider is sliding 
      var audiogetlength = Object.keys(thisArray).map(function (key) { return thisArray[key]._duration; }); 
      var longest = Math.max.apply(null, audiogetlength); 
      var dividedlength = 100/ui.value; 
      $.each(thisArray, function(key, value) { 
       value.pos(longest/dividedlength); 
       if (ui.value > value._duration) { 
        value.stop(); 
       } 
      }); 
     }, 
    }); 

    setInterval(function starttrackslider() { 
     var dividedslider = sounduser1._duration/sounduser1.pos(); 
     $('.trackslider').slider('value', 100/dividedslider); 
    },1000); 

    //Single Audio Track Player 
    $('.ex1-play').on('click', function(){ 
     var now_id = $(this).parent().parent('.player').attr('id'); 
     thisArray[now_id].stop().play(); 
    }); 
    $('.ex1-stop').on('click', function(){ 
     var now_id = $(this).parent().parent('.player').attr('id'); 
     thisArray[now_id].stop(); 
    }); 
    $('.ex1-loop').on('click', function(){ 
     var now_id = $(this).parent().parent('.player').attr('id'); 
     thisArray[now_id].loop(true); 
    }); 

    //Main All Track Player 
    $('.main-play').on('click', function(){ 
     $.each(thisArray, function(key, value) { 
     value.stop().play(); 
     $('.buttons').fadeOut(); 
     }); 
    }); 
    $('.main-pause').on('click', function(){ 
     $.each(thisArray, function(key, value) { 
     value.pause(); 
     }); 
    }); 
    $('.main-stop').on('click', function(){ 
     $.each(thisArray, function(key, value) { 
     value.stop(); 
     $('.buttons').fadeIn(); 
     }); 
    }); 
    $('.main-loop').on('click', function(){ 
     $.each(thisArray, function(key, value) { 
     value.loop(true); 
     }); 
    }); 

}); 

В последней части $('.mainplayer .trackslider').slider({ }); вы найдете if (ui.value > value._duration) {value.stop();}

value равняется Завывание называется sounduser2

Оба аудиотреков начинаются в то же самое время. Использование слайдера заставит меня пропустить аудио. Ползунок будет иметь длину самого длинного аудиотрека - который называется Howl под названием sounduser1. Использование ползунка вернет номер, который активирует положение аудио.

Если ползунок возвращает число, большее, чем фактическая длина аудиотрека, он должен остановить более короткий аудиотрек.

По какой-то причине это не остановит игру, хотя ситуация правильная. Есть ли кто-нибудь, кто знает, что делать?

ответ

0
$('.mainplayer .trackslider').slider({ 
     value: 0, 
     range: "min", 
     animate: true, 
     orientation: "horizontal", 
     //Slider Event 
     slide: function (event, ui) { //When the slider is sliding 
      var audiogetlength = Object.keys(thisArray).map(function (key) { return thisArray[key]._duration; }); 
      var longest = Math.max.apply(null, audiogetlength); 
      var dividedlength = 100/ui.value; 
      $.each(thisArray, function(key, value) { 
       var percentvalue = (value._duration/longest)*100; 
       if (percentvalue > ui.value) { 
        if (value.pos()==0) { 
         value.play().pos(longest/dividedlength); 
        } else { 
         value.pos(longest/dividedlength); 
        } 
       } else { 
         value.stop(); 
       } 

      }); 
     } 
    }); 

ли трюк

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