Frage Timeouts starten gleichzeitig?

[Willibergi]

Moin,
ich habe folgenden Code:

for(var i=0; i<sounds.length; ++i){
    window.setTimeout(function(){
        //Blabla
    }, time);
    time += 500;
    console.log(time);
}

Es sollte eigentlich folgendes passieren:
Es werden x Intervalle im Abstand von 500ms erstellt, die einen Code ausführen.
Dann sollte eigentlich alle 500ms der Code ausgeführt werden (in einer anderen Weise).
Warum funktioniert das nun nicht? (es wird alles gleichzeitig ausgeführt)
LG
Willibergi

 

[methosiea]

nutze dazu window.setInterval

window.setInterval(function () { /*Blabla*/ }, 500);

danach hast du die Möglichkeit eine Variabel zu erstellen

window.time = 0;
window.durationTime = 500;

window.durationFunction = function (time) { console.log(time) };


window.setInterval(function () { window.time += window.durationTime; window.durationFunction(window.time) }, window.durationTime);

 

[Willibergi]

Funktioniert aber irgendwie auch nicht:

var end = false;
var dl = 0;
var sndI = window.setInterval(function(){
    if(sounds.length > 0){
        var rs = sounds.randsplice();
        ++dl;
        switch(rs){
            case "q":
                s1.play();
                break;
            case "m":
                s2.play();
                break;
        }
    }else{
        window.clearInterval(sndI);
        console.info("Cleared!");
    }
}, 500);

Ich will Sounds abspielen, aber nacheinander!
Mit diesem Code spielen beide wild durcheinander...
Im Array sounds sind Werte zweier Arten vorhanden: "q" und "m"...
Warum funktioniert das nicht?

 

[Tronjer]

Ich will Sounds abspielen, aber nacheinander!

Dazu würde ich einen anderen Ansatz wählen. Es gibt in HTML5 die Audio API und diese hat ein Event namens onended(). Erzeuge ein Audio-Tag, welches seine source aus dem Array bezieht und nach dem abspielen mit dem nächsten Array-Element neu lädt.

 

[Willibergi]

Dazu würde ich einen anderen Ansatz wählen. Es gibt in HTML5 die Audio API und diese hat ein Event namens onended(). Erzeuge ein Audio-Tag, welches seine source aus dem Array bezieht und nach dem abspielen mit dem nächsten Array-Element neu lädt.

Hört sich gut an - wie kann ich aber den Audio-Tag "abspielen"? Audio-Elemente in JS gehen ja mit x.play(), aber wie ist das mit Audio-Tags?

 

[Tronjer]

Ein Audio-Tag ist ein einfaches HTML-Element. Das kann onload per autoplay spielen oder bsw. mit einem Click-Event getriggert werden. Google mal nach der Audio API.

 

[methosiea]

var audio = document.createElement('audio');
{
    audio.setAttributeNode(document.createAttribute('autoplay'));
    audio.style.display = 'none';
  
    (document.body || document.documentElement).appendChild(audio);
  
    var SoundSources = {};
    {
        SoundSources.listOf = [ /*SoundSources*/ ];
        SoundSources.__defineGetter__('sourceOf', function () {
            return this.listOf.shift();
        });
    }
  
    audio.setAttribute('src', SoundSources.sourceOf);
  
    audio.onplay = function () {
        window.setTimeout(function () { audio.setAttribute('src', SoundSources.sourceOf) }, 500);
    };
}

soinetwa... hab' jetzt nicht getestet, bei SoundSources müsstest du dann die Dateipfade angeben