Page 1 of 1
need some jquery assistance.
Posted: Fri Apr 13, 2012 10:50 pm
by UnknownUser
hey guys,
i'm building a html5 audio player just for the fun off it,
but having problem with one thing at the moment,
i have a jquery slider that i use as a seekbar for my audio player
but having problems connecting it to the sound seek state.
Old range/input code
Code: Select all
audio.addEventListener('durationchange', setupSeekbar);
audio.addEventListener('timeupdate', updateUI);
seekbar.value = 0;
var audio = document.getElementById("audio");
var seekbar = document.getElementById('seekbar');
function setupSeekbar() {
seekbar.min = audio.startTime;
seekbar.max = audio.startTime + audio.duration;
}
audio.ondurationchange = setupSeekbar;
function seekAudio() {
audio.currentTime = seekbar.value;
}
function updateUI() {
var lastBuffered = audio.buffered.end(audio.buffered.length-1);
seekbar.min = audio.startTime;
seekbar.max = lastBuffered;
seekbar.value = audio.currentTime;
}
seekbar.onchange = seekAudio;
audio.ontimeupdate = updateUI;
New code i'm working with that is jquery but stuck on it so here is where i need
help if i could get any assistance i would greatly appreciated it
Code: Select all
$('#seekbar').slider({
value: 0,
step: 0.01,
orientation: "vertically",
range: "min",
max: audio.duration,
animate: true,
slide: function() {
manualSeek = true;
},
stop:function(e,ui) {
manualSeek = false;
audio.currentTime = ui.value;
}
});
thanks!
Re: need some jquery assistance.
Posted: Mon Apr 16, 2012 10:10 pm
by Xaleph
It`s quite difficult for us to see whats going wrong here. Maybe some scalar values and some weird offset? ui.value may not scale well to the audio file?
Re: need some jquery assistance.
Posted: Tue Apr 17, 2012 9:18 am
by UnknownUser
the thing that is wrong is that basically the slider wont link up with the audio file in the meaning it is not yet in a seekbar mode!
i need help to figure out how to link the jquery slider to work with the audio file if that explains it better.
TY!
Re: need some jquery assistance.
Posted: Tue Apr 17, 2012 9:35 am
by Chris
what's in ui.value?
Code: Select all
stop:function(e,ui) {
manualSeek = false;
audio.currentTime = ui.value;
console.log(ui.value);
}
Re: need some jquery assistance.
Posted: Wed Apr 18, 2012 2:37 am
by UnknownUser
i messed around changed around and came up with this,
but still ain't working, ps e,ui has been striped from the code..
Chris.
Code: Select all
$("#seekbar").slider({
value : 'seekbar.value',
step : 1,
range : 'min',
min : 'seekbar.min',
max : 'seekbar.max',
slide : function(){
var audio = document.getElementById("audio");
var seekbar = document.getElementById('seekbar');
var s = $("#seekbar").slider("seekbar");
seekbar.value = 0;
audio.addEventListener('durationchange', setupSeekbar);
audio.addEventListener('timeupdate', updateUI);
}
function setupSeekbar() {
seekbar.min = audio.startTime;
seekbar.max = audio.startTime + audio.duration;
}
audio.ondurationchange = setupSeekbar;
function seekAudio() {
audio.currentTime = seekbar.value;
}
function updateUI() {
var lastBuffered = audio.buffered.end(audio.buffered.length-1);
seekbar.min = audio.startTime;
seekbar.max = lastBuffered;
seekbar.value = audio.currentTime;
}
seekbar.onchange = seekAudio;
audio.ontimeupdate = updateUI;
});
Re: need some jquery assistance.
Posted: Wed Apr 18, 2012 12:30 pm
by UnknownUser
solved the problem!
Re: need some jquery assistance.
Posted: Wed Apr 18, 2012 3:22 pm
by Foofighter
UnknownUser wrote:solved the problem!
Would be nice to know what the problem was
regards
Re: need some jquery assistance.
Posted: Wed Apr 18, 2012 9:30 pm
by Jackolantern
Yeah, if you could post the solution, that would be awesome! Like a lot of other people, I am not that familiar with the HTML5 audio controls or how jQuery can be used with them as of yet. I think that is also why help was kind of slow on this issue. But having an answer and some working code will no doubt help others down the line!
Re: need some jquery assistance.
Posted: Thu Apr 19, 2012 12:26 am
by UnknownUser
will make a tutorial on the subjects when i'm done with a full audio player,
so you will learn the steps then, Hope that is ok.
Re: need some jquery assistance.
Posted: Thu Apr 19, 2012 12:30 am
by Jackolantern
Sounds great!