Skip to main content
Marampazú
Marampazú
Known Participant
March 14, 2017
Answered

Event complete in Soundjs

  • March 14, 2017
  • 1 reply
  • 1379 views

I'm developing a game like Simon Says, I have a couple of functional versions, but not optimal.

Beginning to develop something more practical, I generated this code:

createjs.Sound.registerSound("audio/do.mp3", "do");

createjs.Sound.registerSound("audio/re.mp3", "re");

createjs.Sound.registerSound("audio/mi.mp3", "mi");

createjs.Sound.registerSound("audio/fa.mp3", "fa");

createjs.Ticker.setInterval(1000);

var arregloAzar = [""];

var numeroAzar = 0;

var incremento = 0;

var sonido;

var queNota;

for (i = 1; i < 10; i++) {

  numeroAzar = (Math.floor((Math.random() * 4) + 1));

  arregloAzar = numeroAzar;

  console.log(arregloAzar);

}

function miFuncion() {

  incremento++;

  if (incremento < arregloAzar.length) {

  //console.log("este es el cajón " + incremento + " del arreglo " + arregloAzar[incremento]);

  switch (arregloAzar[incremento]) {

  case 1:

  queNota = "do";

  console.log(queNota);

  createjs.Sound.addEventListener("fileload", loadedF.bind(this));

  break;

  case 2:

  queNota = "re";

  console.log(queNota);

  createjs.Sound.addEventListener("fileload", loadedF.bind(this));

  break;

  case 3:

  queNota = "mi";

  console.log(queNota);

  createjs.Sound.addEventListener("fileload", loadedF.bind(this));

  break;

  case 4:

  queNota = "fa";

  console.log(queNota);

  createjs.Sound.addEventListener("fileload", loadedF.bind(this));

  break;

  }

  } else {

  createjs.Ticker.removeEventListener("tick", miFuncion);

  }

}

function loadedF(e) {

  sonido = createjs.Sound.play(queNota);

  //sonido.on("complete", alerta); (this works, but call "alerta" repeatedly)

}

function ejecuta() {

  createjs.Ticker.addEventListener("tick", miFuncion);

}

ejecuta();

This works, the switch-case properly executes the corresponding code, but the audio only plays the first time. I already checked in the console and if it accedes to each case according to the increment that takes the sequence. I am trying to handle this with tickers, in order to have the animations reproduced that will have to press the user according to each button.

In a previous version I did it type Flash, with a click reproduced a movieclip that in turn reproduced the corresponding sound. This does not work correctly in Animate when the sequence of clicks generated by the AI ​​is displayed.

Thanks for your support and an apology for my English google.

Cheers!

    This topic has been closed for replies.
    Correct answer ClayUUID

    marampazú  wrote

    createjs.Ticker.setInterval(1000);

    The "setInterval()" method of the Ticker object is deprecated and should not be used.

    EaselJS v0.8.2 API Documentation : Ticker

    But you should not be messing with the Ticker like that, because that sets the frame rate for the entire project. Your code forces your movie's frame rate to 1 FPS. If you want a one-second delay, use window.setTimeout().

    Anyway, you're hooking into the sound load event, so of course it only fires once. After the first time, they're all already loaded.

    What you should be doing instead is waiting for all your sounds to preload before doing anything else. Something like this:

    var soundsLoaded = 0;

    createjs.Sound.addEventListener("fileload", preloadSound);

    createjs.Sound.registerSound("audio/do.mp3", "do");

    createjs.Sound.registerSound("audio/re.mp3", "re");

    createjs.Sound.registerSound("audio/mi.mp3", "mi");

    createjs.Sound.registerSound("audio/fa.mp3", "fa");

    function preloadSound() {

         if (soundsLoaded++ == 4) {

              miFuncion();

         }

    }

    I can't test this at the moment, but that should be close.

    Then in your switch/case block, play each sound directly. Get rid of loadedF() and ejecuta().

    1 reply

    C
    ClayUUIDCorrect answer
    Legend
    March 15, 2017

    marampazú  wrote

    createjs.Ticker.setInterval(1000);

    The "setInterval()" method of the Ticker object is deprecated and should not be used.

    EaselJS v0.8.2 API Documentation : Ticker

    But you should not be messing with the Ticker like that, because that sets the frame rate for the entire project. Your code forces your movie's frame rate to 1 FPS. If you want a one-second delay, use window.setTimeout().

    Anyway, you're hooking into the sound load event, so of course it only fires once. After the first time, they're all already loaded.

    What you should be doing instead is waiting for all your sounds to preload before doing anything else. Something like this:

    var soundsLoaded = 0;

    createjs.Sound.addEventListener("fileload", preloadSound);

    createjs.Sound.registerSound("audio/do.mp3", "do");

    createjs.Sound.registerSound("audio/re.mp3", "re");

    createjs.Sound.registerSound("audio/mi.mp3", "mi");

    createjs.Sound.registerSound("audio/fa.mp3", "fa");

    function preloadSound() {

         if (soundsLoaded++ == 4) {

              miFuncion();

         }

    }

    I can't test this at the moment, but that should be close.

    Then in your switch/case block, play each sound directly. Get rid of loadedF() and ejecuta().

    Marampazú
    MarampazúAuthor
    Known Participant
    March 15, 2017

    Thank you for answering so quickly!

    I already did the modifications, the code was like this:

    Createjs.Sound.addEventListener ("fileload", preloadSound);
    Createjs.Sound.registerSound ("audio / do.mp3", "do");
    Createjs.Sound.registerSound ("audio / re.mp3", "re");
    Createjs.Sound.registerSound ("audio / mi.mp3", "mi");
    Createjs.Sound.registerSound ("audio / fa.mp3", "fa");

    Var soundsLoaded = 0;
    Var arrayAzar = [""];
    Var numberAzar = 0;
    Var increment = 0;
    Var sound;

    Function preloadSound () {
    If (soundsLoaded ++ == 4) {
    MyFunction ();
    }
    }

    For (i = 1; i <10; i ++)
    NumberAzar = (Math.floor ((Math.random () * 4) + 1));
    Array = numberAzar;
    Console.log (Array);
    }

    Function miFuncion () {
    Alert ("hello");
    Increment ++;
    If (increment <array.length) {
    //console.log ("this is the drawer" + increment + "of the array" + arrayAzar [increment]);
    Switch (Array [increment]) {
    Case 1:
    Console.log ("sonó do");
    Sound = createjs.Sound.play ("do");
    Break;
    Case 2:
    Console.log ("sonó re");
    Sound = createjs.Sound.play ("re");
    Break;
    Case 3:
    Console.log ("sonó mi");
    Sound = createjs.Sound.play ("mi");
    Break;
    Case 4:
    Console.log ("sono fa");
    Sound = createjs.Sound.play ("fa");
    Break;
    }
    } Else {
    Console.log ("finished");
    }
    }

    I put an alert inside miFuncion to see if it was running, but apparently it is not working.

    On the other hand, I do not know exactly where to locate the window.setTimeOut.
    I also placed an alert in the preloadSound function and the same thing happens, apparently it is not running.

    Thank you very much for the help.
    Greetings.

    C
    ClayUUID
    Legend
    March 15, 2017

    Why did you add spaces around the forward slashes in your file paths?

    Createjs.Sound.registerSound ("audio / do.mp3", "do");
    Createjs.Sound.registerSound ("audio / re.mp3", "re");
    Createjs.Sound.registerSound ("audio / mi.mp3", "mi");

    Createjs.Sound.registerSound ("audio / fa.mp3", "fa");

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices