Added buffering
This commit is contained in:
parent
1b135c8ad7
commit
be7f9000f3
|
@ -13,7 +13,7 @@
|
|||
<div class="inner-1">
|
||||
<% if @hide_player.nil? -%>
|
||||
<div id="player">
|
||||
<audio autoplay preload></audio>
|
||||
<div id="audiobox"></div>
|
||||
<div class="prev" title="Play Previous Track"><img src="/images/player/prev.svg" alt="prv" /></div>
|
||||
<div class="play" title="Play"><img src="/images/player/play.svg" alt="ply" /></div>
|
||||
<div class="pause" title="Pause" style="display:none"><img src="/images/player/pause.svg" alt="pause" /></div>
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
var audio;
|
||||
var prev_audio;
|
||||
var next_audio;
|
||||
var utid;
|
||||
$(function(){
|
||||
$.extend($.fn.disableTextSelect = function() {
|
||||
|
@ -69,6 +71,11 @@ function updatePlayer() {
|
|||
progress = Math.round((cur_time / duration) * 390);
|
||||
$('#player .progress-loaded').css('width', loaded +'px')
|
||||
$('#player .progress-point').css('margin-left', progress +'px')
|
||||
|
||||
/* Starting buffering next track */
|
||||
if (Math.round(cur_time / duration * 100) > 70) {
|
||||
addAudio(next_audio);
|
||||
}
|
||||
}
|
||||
utid = window.setTimeout(updatePlayer, 100);
|
||||
}
|
||||
|
@ -79,7 +86,7 @@ function formatTime(sec) {
|
|||
return m +':'+ (s < 10 ? '0' : '') +s;
|
||||
}
|
||||
function playTrack(artist, track, id) {
|
||||
$(audio).attr('src', '/listen/'+ id +'.mp3');
|
||||
switchAudio(id);
|
||||
$('#player .track-title').html(artist +' — '+ track);
|
||||
$('#player .time-played').html('0:00');
|
||||
$('#player .time-left').html('0:00');
|
||||
|
@ -130,3 +137,14 @@ function addToPlaylist(artist, track, length, id) {
|
|||
}
|
||||
$('#player .playlist .count').html($('#playlist ul.list li').length);
|
||||
}
|
||||
function addAudio(id) {
|
||||
if ($('#audio_'+ id).length == 0) {
|
||||
$('#audiobox').append('<audio id="audio_'+ id +'" src="/listen/'+ id +'.mp3" preload="preload"></audio>');
|
||||
}
|
||||
}
|
||||
function switchAudio(id) {
|
||||
if ($('#audio_'+ id).length == 0) {
|
||||
addAudio(id);
|
||||
}
|
||||
audio = document.getElementById('audio_'+ id);
|
||||
}
|
|
@ -1,3 +1,10 @@
|
|||
audio {
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
top: -1000px;
|
||||
left: -1000px;
|
||||
}
|
||||
#player {
|
||||
position: fixed;
|
||||
width: 750px;
|
||||
|
|
Loading…
Reference in New Issue