Jump to content

Turn On/Off a specific sound


Recommended Posts


I'm trying to implement a simple button that let user turn on/off music, and an other one to control other sounds effects.


First, in my boot state, I load my music.

export default class Boot {  preload() {    this.load.audio('ambiance', 'assets/audio/musics/ambiance.mp3');  }  create() {    var ambianceMusic = this.add.audio('ambiance', 0.2, true);    ambianceMusic.play();    this.state.start('next');  }}

In my play state, I load my others sounds:

export default class Play {  preload() {    this.load.audio('bip', 'assets/audio/sounds/bip.mp3');    this.load.audio('scream', 'assets/audio/sounds/scream.mp3');  }   create() {    this.bipSound = this.add.audio('bip', 1);    this.screamSound = this.add.audio('scream', 1);  }    /*  * then this.bipSound.play() when I need it  */}

Next, I've got a menu to control them:

/* ...*/var musicCheckbox = new Phaser.Button(this.game, 120, 10, 'sprite', this.turnSound, this, 'buttons/check', 'buttons/check', 'buttons/check');var soundCheckbox = new Phaser.Button(this.game, 120, 60, 'sprite', this.turnSound, this, 'buttons/check', 'buttons/check', 'buttons/check');musicCheckbox.name = 'music';soundCheckbox.name = 'sound';/* ...*/turnSound(button) {  switch (button.name) {    case 'music':      let music = this.cache.getSound('ambiance');      console.log(music);     break;   case 'sound':     /*..*/}

 This is suposed to return the Sound (http://phaser.io/docs/2.3.0/Phaser.Cache.html#getSound), but I got this :

Object {url: "assets/audio/musics/ambiance.mp3", data: AudioBuffer, isDecoding: false, decoded: true, webAudio: true…}audioTag: falsedata: AudioBufferdecoded: trueisDecoding: falselocked: falseurl: "assets/audio/musics/ambiance.mp3"webAudio: true__proto__: Object

the only way I found to get my sound is by "private" properties:

let music = this.sound._sounds[0];

(and thats sucks!)


So the question is what is the right way doing this ?

Link to comment
Share on other sites

  • 3 weeks later...

Maybe you've figured it out by now but to turn on/off music and fxs should be something like this:


// A property to store the toggle state of the sound fx'sthis.fxEnabled = true;// Holds a reference to all fx sound instancesthis.fxs = [];this.fxs.push(this.bipSound);this.fxs.push(this.screamSound);turnSound(button) {  switch (button.name) {    case 'music':      // For music      if(ambienceMusic.isPlaying) {        ambienceMusic.stop();      } else {        ambienceMusic.stop();      }     break;   case 'sound':     // And for sound FX, loop through all the fxs and stop the ones that are playing     if(this.fxEnabled) {       for(var i = 0; i <this.fxs.length; i++) {         if(this.fxs[i].isPlaying) {           this.fxs[i].stop();         }         }           this.fxEnabled = false;     } else {       // Just turn on the flag.       // Each fx will have to check if this flag is on before calling play()        this.fxEnabled = true;     }}

It would be better to wrap all this in a sound manager class (not the SoundManager that comes with phaser) that allows us to enable/disable music sounds and fx sound separately.

Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...