Audio

Introduction

Play sounds, built-in object of phaser.

  • Author: Richard Davey

Usage

Configuration

Web audio

Web audio is the default audio context.

Html5 audio

var config = {
    // ....
    audio: {
        disableWebAudio: true
    }
    // ....
};
var game = new Phaser.Game(config);

No audio

var config = {
    // ....
    audio: {
        noAudio: true
    }
    // ....
};
var game = new Phaser.Game(config);

Load audio file

scene.load.audio(key, urls);  // urls: an array of file url

See loader

Decode audio

scene.sound.decodeAudio(key, audioData);
  • audioData : Audio data
    • A base64 encoded string
    • An audio media-type data uri
    • An ArrayBuffer instance

Or

scene.sound.decodeAudio(audioFiles);
  • audioFiles : An array of {key, data}
    • data : Audio data
      • A base64 encoded string
      • An audio media-type data uri
      • An ArrayBuffer instance
Decoded events
  • Finished decoding an audio data
    scene.sound.on('decoded', key);
    
  • Finished decoding all audio data
    scene.sound.on('decodedall');
    

Play sound

Sound instance will be destroyed when playback ends.

scene.sound.play(key);

Sound instance

Create sound instance

var music = scene.sound.add(key);
var music = scene.sound.add(key, config);
Configuration
{
    mute: false,
    volume: 1,
    rate: 1,
    detune: 0,
    seek: 0,
    loop: false,
    delay: 0
}

Play sound instance

  • Start playing
    music.play();
    
  • Start playing with configuration
    music.play(config);
    
  • Stop
    music.stop();
    
  • Pause
    music.pause();
    
  • Resume
    music.resume();
    

Methods

Mute
  • Set
    music.setMute(mute); // mute: true/false
    // music.mute = mute;
    
  • Get
    var mute = music.mute;
    
Volume
  • Set
    music.setVolume(volume); // volume: 0 to 1
    // music.volume = volume;
    
  • Get
    var volume = music.volume;
    
Detune
  • Set
    music.setDetune(detune); // detune: -1200 to 1200
    // music.detune = detune;
    
  • Get
    var detune = music.detune;
    
Play-rate
  • Set
    music.setRate(rate); // rate: 1.0(normal speed), 0.5(half speed), 2.0(double speed)
    // music.rate = rate;
    
  • Get
    var rate = music.rate;
    
Seek to
  • Seek to
    music.setSeek(time); // seek: playback time
    // music.seek = seek;
    
  • Get current playback time
    var time = music.seek;  // return 0 when playback ends
    
Loop
  • Set
    music.setLoop(loop); // loop: true/false
    // music.loop = loop;
    
  • Get
    var loop = music.loop;
    

Properties

  • Duration : duration of this sound
    var duratuin = music.duration;
    
  • Is playing
    var isPlaying = music.isPlaying;
    
  • Is paused
    var isPaused = music.isPaused;
    

Events

  • Start playing
    music.once('play', function(music){});
    
  • Playback end
    music.once('complete', function(music){});
    
  • Looping
    music.once('looped', function(music){});
    
  • Pause
    music.once('pause', function(music){});
    
  • Resume
    music.once('resume', function(music){});
    
  • Stop
    music.once('stop', function(music){});
    
  • Set mute
    music.once('mute', function(music, mute){});
    
  • Set volume
    music.once('volume', function(music, volume){});
    
  • Set detune
    music.once('detune', function(music, detune){});
    
  • Set play-rate
    music.once('rate', function(music, rate){});
    
  • Seek to
    music.once('seek', function(music, time){});
    
  • set loop
    music.once('loop', function(music, loop){});
    

Play marked sound

Sound instance will be destroyed when playback ends.

scene.sound.play(key, marker);

Marker

{
    name: '',
    start: 0,
    duration: music.duration,
    config: {
        mute: false,
        volume: 1,
        rate: 1,
        detune: 0,
        seek: 0,
        loop: false,
        delay: 0
    }
}

Markers in sound instance

Add marker

music.addMarker(marker);

Marker

Play marked sound

music.play(markerName);
music.play(markerName, config);

config

Audio sprite

Load audio sprite

scene.load.audioSprite(key, urls, markersConfig, config);

See loader

Format of markersConfig

{
    resources: urls, // an array of audio files
    spritemap: {
        markerName0: {
            start: 0,
            end: 0
        },
        markerName1: {
            start: 0,
            end: 0
        }
        // ...
    }
}

Play sound

Create a sound instance then play the marked section, this sound instance will be destroyed when playback ends.

scene.sound.playAudioSprite(key, markerName, config);

config

Sound instance

Create a sound instance with markers.

var music = scene.sound.addAudioSprite(key, config);

config

Play sound instance

music.play(markerName);
music.play(markerName, config);

config

Sound manager

Mute

  • Set
    scene.sound.setMute(mute); // mute: true/false
    // scene.sound.mute = mute;
    
  • Get
    var mute = scene.sound.mute;
    

Volume

  • Set
    scene.sound.setVolume(volume); // volume: 0 to 1
    // scene.sound.volume = volume;
    
  • Get
    var volume = scene.sound.volume;
    

Detune

  • Set
    scene.sound.setDetune(detune); // detune: -1200 to 1200
    // scene.sound.detune = detune;
    
  • Get
    var detune = scene.sound.detune;
    

Play-rate

  • Set
    scene.sound.setRate(rate); // rate: 1.0(normal speed), 0.5(half speed), 2.0(double speed)
    // scene.sound.rate = rate;
    
  • Get
    var rate = scene.sound.rate;
    

Get music instance

  • Get first
    var music = scene.sound.get(key); // music instance, or null
    
  • Get all
    var musicArray = scene.sound.getAll(key); // music instance, or null
    

Remove music instance

  • Remove by key
    var removed = scene.sound.removeByKey(key);
    
    • removed : The number of matching sound objects that were removed.
  • Remove all
    scene.sound.removeAll();
    

Stop music instance

  • Stop by key
    var stopped = scene.sound.stopByKey(key);
    
    • stopped : How many sounds were stopped.
  • Stop all
    scene.sound.stopAll();
    

Analyser

Analyser node is only available in Web audio mode.

  1. Create analyser node
    var analyser = scene.sound.context.createAnalyser();
    
  2. Configure analyser node
    analyser.smoothingTimeConstant = 1;
    analyser.fftSize = 8192;
    analyser.minDecibels = -90;
    analyser.maxDecibels = -10;
    
    • smoothingTimeConstant : Averaging constant with the last analysis frame.
      • 0(no time averaging) ~ 1. Default value is 0.8.
    • fftSize : Window size.
      • 32, 64, 128, 256, 512, 1024, 2048, 4096, 8192, 16384, and 32768. Defaults to 2048.
    • minDecibels : Minimum decibel value for scaling the FFT analysis data.
      • 0 dB is the loudest possible sound, -10 dB is a 10th of that, etc. The default value is -100 dB
    • maxDecibels : Maximum decibel value for scaling the FFT analysis data.
      • The default value is -30 dB.
  3. Set source of analyser node
    • Global volume nodee -> analyser node
      scene.sound.masterVolumeNode.connect(analyser);
      
    • A sound instance -> analyser node
      music.volumeNode.connect(analyser);
      
  4. Ouput analyser node to audio context
    analyser.connect(scene.sound.context.destination);
    
  5. Create output data array
    var dataArrayLength = analyser.frequencyBinCount;
    var dataArray = new Uint8Array(dataArrayLength);
    
  6. Get output data
    analyser.getByteTimeDomainData(dataArray);
    
    • Retrieve output data
      for(var i= 0; i < dataArrayLength; i++) {
          var data = dataArray[i];
      }