javascriptwebapiaudiocontextsynthesizer

AudioContext.resume()/.suspend() is faulting


In order to create triggers and have them play, I need to have copied them and hit the button I created. The copy is good. But when I toggle the button, it says that I am Illegally invoking the functions of the AudioContext Object.

I attemped using single AudioContexts and I've tried forEach, for...of, and for loops, as well as while loops. I can't think of anything else that I haven't tried and Google doesn't offer much of a response, suprisingly enough. I expected that one of the loops would've been a great doorway to completing the task, but none have been the silver bullet.

Can someone see the error in my code?

`


function playPauseSample(osc)
{
    console.log(audioCtxPads.get(osc.id));
    if (osc.getAttribute("active") == "true")
    {
        osc.setAttribute("active","false");
        var z = audioCtxPads.get(osc.id);
        var i = 1;
        while (audioCtxPads.has(osc.id) && i < 8)
        {
            var p = "0" + i.toString();
            console.log(z);
            if (z[p] != null)
                z[p].suspend();
            i++;
        }
        audioCtxPads.set(osc.id, z);
        console.log(z);
        osc.classList.toggle("on");
        osc.classList.toggle("off");
        return;
    }
    else if (osc.getAttribute("active") == "false") {
        osc.setAttribute("active","true");
        var z = audioCtxPads.get(osc.id);
        var i = 1;
        while (audioCtxPads.has(osc.id) && i < 8)
        {
            var p = "0" + i.toString();
            console.log(z);
            if (z[p] != null)
                z[p].resume();
            i++;
        }
        audioCtxPads.set(osc.id, z);
        console.log(z);
        osc.classList.toggle("off");
        osc.classList.toggle("on");
        return;
    }
    console.log(osc.getAttribute("active"));
}

`


Solution

  • if (audioCtxPads.has(osc.id) && osc.getAttribute("active") == "true")
    {
        osc.setAttribute("active","false");
        
        for (let i of audioCtxPads.get(osc.id).values())
            for (let j of i.values())
                j.suspend();
        if (osc.nextSibling.nextSibling.classList == "play on")
            osc.nextSibling.nextSibling.classList.toggle("on");
        
        osc.classList.toggle("on");
        osc.classList.toggle("off");
        return;
    }
    else if (audioCtxPads.has(osc.id) && osc.getAttribute("active") == "false") {
        osc.setAttribute("active","true");
        console.log(audioCtxPads.get(osc.id).values());
        for (let i of audioCtxPads.get(osc.id).values())
            for (let j of i.values())
                j.resume();
        if (osc.nextSibling.nextSibling.classList == "play on")
            osc.nextSibling.nextSibling.classList.toggle("on");
        
        osc.classList.toggle("off");
        osc.classList.toggle("on");
        return;
    }
    

    Okay, so the answer lay buried under the nesting structure. You have to get the Values and then the values of that set of values. And something similar, for those in the future, please read up carefully on this. Thanks all! (BTW, this example is using a Map with a textual key, and a Array for a value. So that's it!)