5 Replies Latest reply on Mar 15, 2017 10:59 AM by ClayUUID

    Event complete in Soundjs

    Marampazú Level 1

      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[i] = 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!

        • 1. Re: Event complete in Soundjs
          ClayUUID Adobe Community Professional

          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().

          • 2. Re: Event complete in Soundjs
            Marampazú Level 1

            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 [i] = 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.

            • 3. Re: Event complete in Soundjs
              ClayUUID Adobe Community Professional

              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");

              1 person found this helpful
              • 4. Re: Event complete in Soundjs
                Marampazú Level 1

                Oops, it was the google translator.
                The code I have is 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 arregloAzar = [""];

                var numeroAzar = 0;

                var incremento = 0;

                var sonido;

                 

                function preloadSound() {

                     if (soundsLoaded++ == 4) {

                          miFuncion();

                     }

                }

                 

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

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

                     arregloAzar[i] = numeroAzar;

                     console.log(arregloAzar);

                }

                 

                function miFuncion() {

                       alert("hola");

                       incremento++;

                            if (incremento < arregloAzar.length) {

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

                                 switch (arregloAzar[incremento]) {

                                    case 1:

                                           console.log("sonó do");

                                           sonido = createjs.Sound.play("do");

                                           break;

                                    case 2:

                                          console.log("sonó re");

                                         sonido = createjs.Sound.play("re")

                                         break;

                                    case 3:

                                          console.log("sonó mi");

                                         sonido = createjs.Sound.play("mi");

                                         break;

                                    case 4:

                                         console.log("sonó fa");

                                         sonido = createjs.Sound.play("fa");

                                         break;

                                   }

                             } else {

                                console.log("terminé");

                           }

                }

                 

                As I told you, I need to locate the window.setTimeOut function, I would understand that I would have to execute every second (or the interval that is defined) the function miFuncion.

                Thanks for the support, I'm still testing.

                Stay tuned.

                1 person found this helpful
                • 5. Re: Event complete in Soundjs
                  ClayUUID Adobe Community Professional

                  You put window.setTimeOut() wherever you want a certain function to be called a certain number of milliseconds later.

                   

                  JavaScript timers - Mozilla | MDN

                  1 person found this helpful