[FRAGE] HTML audio Playlist nach Seite neu laden wieder zum letzten Lied springen.

[the Obstkuchen]

Hallo, ich habe mir aus dem Internet einen HTML audio Player mit Playlist zusammen geklaut.
Soweit läuft auch alles super, nach dem Ende von Lied 1 kommt automatisch das nächste usw.

Nun wäre es schön, dass wenn man die Seite verlässt und später weiter hören möchte, dass man an der Position im Lied/Playlist weiter hören kann wo man aufgehört hat.

Das mit der Lied Zeit habe ich schon hinbekommen. Ich speichere dazu die "audio.currentTime" in die "localStorage" per "localStorage.setItem(window.location, time);"

und rufe sie mit "localStorage.getItem(window.location);" wieder auf.
Doch was ich auch speichere z.B. "link", "current" er springt nach dem Seite neu laden nicht zur Lied Position.

Daher die frage welche variable muss ich speichern das ich die Lied Position habe.

<script type="text/javascript">//<![CDATA[
$(window).load(function(){
var aud = document.getElementById("audio");
var audio;
var playlist;
var tracks;
var ausgabe = localStorage.getItem(window.location);
var tim = ausgabe.split(";");

init();
function init(){
    current = 0;
    audio = $('audio');
    playlist = $('#playlist');
    tracks = playlist.find('li a');
    len = tracks.length - 1;
    audio[0].volume = .99;
    playlist.find('a').click(function(e){
        e.preventDefault();
        link = $(this);
        current = link.parent().index();
        run(link, audio[0]);
    });
    audio[0].addEventListener('ended',function(e){
        current++;
        if(current == len){
            current = 0;
            link = playlist.find('a')[0];
        }else{
            link = playlist.find('a')[current];    
        }
        run($(link),audio[0]);
    });
/*----zur letzten Zeit springen----*/
	aud.currentTime = tim[0];
		
}
function run(link, player){
        player.src = link.attr('href');
        par = link.parent();
        par.addClass('active').siblings().removeClass('active');
        audio[0].load();
        audio[0].play();
}

});//]]> 

</script>

Die Seite wird nur im Lokalen Netzwerk zur Verfügung gestellt, sie wird also niemals ins Internet kommen.

Danke schon mal für eure mühen.
Mit freundlichem Gruß
Heiko

 

[kkapsner]

Warum speicherst du im localStorage deine Information mit dem Key window.location? Verwende da doch was sinnvolles - z.B. "lastTime" und "lastTrack". Dann musst du auch keine Verrenkungen mit .split() machen...

Aber zu deiner Frage: du kannst doch im localStorage auch einfach current speichern - du musst es dann aber natürlich auch aus dem localStorage auslesen und nicht mit 0 initialisieren.

PS: deine vielen globalen Variablen werden dir ziemlich sicher noch Probleme bereiten.

 

[SteelWheel]

Hmm ... localStorage ... irgendwie vergess ich immer, dass es den auch gibt. ^^

Alternativ kannst dem User die Info in die Session packen (falls das technisch für Dich schneller lösbar ist). Sobald der Track wechselt, $post() an den Server und Session geändert. Bei Seitenwechsel dann halt auslesen oder bei Track 1 beginnen, wenn nicht lesbar/gesetzt.

 

[kkapsner]

Die letzte Zeit in einer Session zu speichern kann aber ein Problem sein. Entweder du hast viel zu viele Requests an den Server oder du hast das Problem, das manche Browser einen Request, der im onbeforeunload gefeuert wird, nicht komplett abarbeiten - also nicht komplett beim Server ankommen.

 

[SteelWheel]

Völlig korrekt. Ist wieder das "Kleingedruckte" mit "Position im Lied". Ob das allerdings "sekundengenau" sein müsste, wage ich zu bezweifeln.

Ich revidiere also: Bei "sekundengenau" macht es mit localStorage einfach Sinn - Alternativen gibt es dann keine.

 

[kkapsner]

Man könnte noch Cookies verwenden... aber localStorage ist da definitiv besser.

 

[SteelWheel]

offtopic: Ich habe localStorage jetzt wirklich für mich entdeckt und auch am Freitag aktiv für etwas benutzt: letzte Scrollposition in der Suchergebnisseite, wenn man sich Details anschauen will; der Weg zurück ist "komplizierter", wodurch ein history.back() (da scrollt der Browser selbst) nicht klappt (Stichwort: Dokument erloschen). Darum: localStorage. Habe mir eine ID in die Seite geflanscht, welche auf Präsenz angefragt wird und bei Fund localStorage interviewt wird, ob ein Wert vorliegt - falls ja, holla-die-bolla ... scroll runter! Ergo: Ist nicht so spektakulär wie Audiodaten festhalten, hat mir aber am Freitag die ToDo-Liste verkürzt. ^^ Danke, kkapsner ... einfach nur für die Erwähnung von localStorage.

 

[kkapsner]

Danke, kkapsner ... einfach nur für die Erwähnung von localStorage.

Bitte - auch wenn der localStorage schon vom Obstkuchen erwähnt wurde...