5 Replies Latest reply on Nov 28, 2017 8:28 AM by Colin Holgate

    Muting sounds in Animate CC (HMTL5 Canvas)

    lassep34521165

      Hi

       

      Okay so im having a problem figuring out how to only play one sound at a frame and muting the others.

       

      As you can se in my timeline and actionsscript my buttons (btn1&2) click to frame 2 and 3.

      In frame 2 and 3 i have two different sounds playing, that have been imported to the library, draged on to their own layer and are only present in one frame.

       

      There is also a back to start button called "start" that goes back to the first frame and are supposed to mute all sound.

       

      Actionscript:

       

      this.stop();

       

      this.btn1.addEventListener("click", fl_ClickToGoToAndStopAtFrame.bind(this));

           function fl_ClickToGoToAndStopAtFrame()

           {

           this.gotoAndStop(1);

           }

       

      this.btn2.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2.bind(this));

           function fl_ClickToGoToAndStopAtFrame_2()

           {

           this.Sound.stop(snd2);

           this.gotoAndStop(2);

           }

       

       

      this.start.addEventListener("click", fl_ClickToGoToAndStopAtFrame_3.bind(this));

           function fl_ClickToGoToAndStopAtFrame_3()

           {

           this.Sound.stop(snd2);

           this.gotoAndStop(0);

           }

       

       

      The problem

      The problem is that the sounds are getting combined and are therefore played both sounds when you click btn1 and btn2, instead of muting the one on the frame that im not on.

       

      (For better usability its all in HTML5 Canvas)

        • 1. Re: Muting sounds in Animate CC (HMTL5 Canvas)
          ClayUUID Adobe Community Professional

          There is no such function as "this.Sound()". If you had your browser's console open during testing you'd probably be seeing an error message on those lines.

           

          To kill all sound in Canvas documents you do this:

          createjs.Sound.stop();

          • 2. Re: Muting sounds in Animate CC (HMTL5 Canvas)
            lassep34521165 Level 1

            Ahhh, this helps a bit!

             

            But, how can i now play one sound and mute the others?

            • 3. Re: Muting sounds in Animate CC (HMTL5 Canvas)
              ClayUUID Adobe Community Professional

              Mute everything, then play the sound.

              • 4. Re: Muting sounds in Animate CC (HMTL5 Canvas)
                lassep34521165 Level 1

                ahh this works! Thank you so much!

                 

                i now put create.sound.stop(); before the actions.

                 

                However i when i click the "go to the first frame and mute everything" button, one of the sound links dont work (frame 3).

                 


                I have encluded the files via weetransfer here:

                https://we.tl/O60rXteAsO

                 

                Actionsscript:

                 

                this.stop();

                this.btn1.addEventListener("click", fl_ClickToGoToAndStopAtFrame.bind(this));

                 

                function fl_ClickToGoToAndStopAtFrame()

                {

                this.stop();

                this.gotoAndStop(1);

                }

                 

                this.btn2.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2.bind(this));

                 

                function fl_ClickToGoToAndStopAtFrame_2()

                {

                createjs.Sound.stop();

                this.gotoAndStop(2);

                }

                 

                this.start.addEventListener("click", fl_ClickToGoToAndStopAtFrame_3.bind(this));

                 

                function fl_ClickToGoToAndStopAtFrame_3()

                {

                createjs.Sound.stop();

                this.gotoAndStop(0);

                }

                • 5. Re: Muting sounds in Animate CC (HMTL5 Canvas)
                  Colin Holgate MVP & Adobe Community Professional

                  Each time you come back to the first frame you're adding another listener to each button. You can check if the button already has the listener, or you could use a Boolean variable that you check to see if you have already set up the listeners.

                   

                  Here's your code using the check for listener (hasEventListener):

                   

                  this.stop();

                  if (!this.btn1.hasEventListener("click")) {

                    this.btn1.addEventListener("click", fl_ClickToGoToAndStopAtFrame.bind(this));

                  }

                  function fl_ClickToGoToAndStopAtFrame() {

                    this.stop();

                    this.gotoAndStop(1);

                  }

                  if (!this.btn2.hasEventListener("click")) {

                    this.btn2.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2.bind(this));

                  }

                  function fl_ClickToGoToAndStopAtFrame_2() {

                    createjs.Sound.stop();

                    this.gotoAndStop(2);

                  }

                  if (!this.start.hasEventListener("click")) {

                    this.start.addEventListener("click", fl_ClickToGoToAndStopAtFrame_3.bind(this));

                  }

                  function fl_ClickToGoToAndStopAtFrame_3() {

                    createjs.Sound.stop();

                    this.gotoAndStop(0);

                  }

                   

                  Here it is rearranged and using a variable to see if you have initialized things:

                   

                  this.stop();

                  if (!this.initted) {

                    this.initted = true;

                    this.btn1.addEventListener("click", fl_ClickToGoToAndStopAtFrame.bind(this));

                    this.btn2.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2.bind(this));

                    this.start.addEventListener("click", fl_ClickToGoToAndStopAtFrame_3.bind(this));

                  }

                  function fl_ClickToGoToAndStopAtFrame() {

                    this.stop();

                    this.gotoAndStop(1);

                  }

                  function fl_ClickToGoToAndStopAtFrame_2() {

                    createjs.Sound.stop();

                    this.gotoAndStop(2);

                  }

                  function fl_ClickToGoToAndStopAtFrame_3() {

                    createjs.Sound.stop();

                    this.gotoAndStop(0);

                  }

                  1 person found this helpful