Problem with audio?

Phaser 3
1

so I’m trying to get this music code to work. it’s an evolution of the above code. what I’m trying to do is load all the keys for which ever specific music to play in which ever specific level. Problem is, I get :

Sound track{s} ::  bgMusic
TitleScene.js:288 Sound data {s} ::  {volume: 0.1, loop: true}
phaser.js:82849 Audio cache entry missing: undefined
phaser.js:26468 Uncaught TypeError: Cannot set property 'seek' of undefined

But I have the correct files in the correct folder which is 'assets' , obviously & the files are not corrupt as they both play fine in my music player. here is what I’m defining in 'preload ( )' :

preload : function ( ) {
 
    console.log ( 'HELLO FROM TITLE SCENE!' );
 
    this.__soundTrack = [
 
        'bgMusic', 'lvl1Music', 'lvl2Music',
 
    ];
 
    this.__soundData = [
 
        {
            volume : 0.1,
            loop : true,
        },
 
        {
            volume : 0.5,
            loop : true,
        },
 
    ];
 
    this.__stats = new Stats ( );
    document.body.appendChild ( this.__stats.dom );
 
},

here is what i’m doing in 'create ( )' :

this.model = this.sys.game.globals.model;
 
this.__soundTrackCount = ( this.__soundTrack.length );
 
for ( this.__i = 0; this.__i < ( this.__soundTrackCount - 1 ); this.__i++ ) {
 
    console.log ( 'Sound track{s} :: ', this.__soundTrack [ this.__i ] );
    console.log ( 'Sound data {s} :: ', this.__soundData [ this.__i ] );
 
    this.createAudio ({
        soundID : this.__soundTrack [ this.__i ],
        soundData : this.__soundData [ this.__i ]
    });
 
}

here is how I’m loading the files in 'PreloaderScene.js' :

preload ( ) {
    this.load.audio ( 'bgMusic', [
        'assets/TownTheme.mp3',
    ] );
 
    this.load.audio ( 'lvl1Music', [
        'assets/TownTheme2.mp3',
    ] );
}

here is the 'createAudio ( )' function :

createAudio : function ( __objData ) {
 
    this.__objData = __objData;
 
    this.__soundID = [ this.__objData.soundID ];
    this.__soundData = [ this.__objData.soundData ];
 
    if ( this.model.musicOn === true && this.model.bgMusicPlaying === false ) {
 
        this.__sound = [ ];
 
        for ( this.__i = 0; this.__i < ( this.__soundTrack.length ); this.__i++ ) {
 
            this.__sound [ this.__i ] = this.sound.add (
                this.__soundID [ this.__i ], this.__soundData [ this.__i ]
            );
 
            this.__sound [ this.__i ].play ( );
 
        }
 
        this.model.bgMusicPlaying = true;
        this.sys.game.globals.music [ this.__i ] = this.__sound [ this.__i ];
 
    }
 
    else
 
    {
 
        this.sys.game.globals.music [ this.__i ].stop ( );
        this.model.bgMusicPlaying = false;
 
    }
 
    if ( this.model.bgMusicPlaying === false ) {
 
        this.sys.game.globals.music [ this.__i ].play ();
        this.sound.pauseOnBlur = false;
        this.model.bgMusicPlaying = true;
 
    }
 
},

Any help is GREATLY appreciated!

2

Put a breakpoint there and step backwards.

Most likely it comes from

this.add.sound(undefined, …)
3

that’s not what i’m looking at. i’m looking at

Uncaught TypeError: Cannot set property 'seek' of undefined
4

I don’t understand why it’s undefined. I passed the data…

5

phaser.js:82849 Audio cache entry missing: undefined

phaser.js:26468 Uncaught TypeError: Cannot set property ‘seek’ of undefined

Put a breakpoint on both lines and then step backwards.

The warning probably comes from adding a sound with key undefined.

The error probably comes from trying to play the same sound.

In createAudio() this.__soundID and this.__soundData are created with one element only. But in the loop below you’re trying to access indices 0, 1, and 2.

6

how am i playing the same sound? I want it to play the 1st theme at the title scene, then stop playing, then play the level 1 theme. Appreciated as always for all your help, @samme. :slight_smile:

7

I mean you may be adding a sound with key undefined and then trying to play it. That would give a warning and then an error.

Add console.log(…) to see what values you’re actually passing in to this.sound.add().

8

Here’s a direct link to the demo :

https://thundros.github.io/menu-system/

I just want it to play 'bgMusic' at the title screen, & all other music for each different level in 'GameScene.js'.

9

Hi @Thundros,
In my humble opinion I would start with something very simple and easy to read, and I would gradually add complexity to the code, but only if necessary.
I would start with something like this:

// In TitleScene.js

function create() {

    // ...

    this.titleMusic = this.sound.add('bgMusic', { volume: 0.1, loop: true });
    this.titleMusic.play();

    this.events.on('shutdown', () => { this.titleMusic.stop() })

    // ...

}

// In GameScene.js
function create(){

    //...

    this.lv1Music = this.sound.add('lvl1Music', { volume: 0.1, loop: true });
    this.lv1Music.play();

    //...
    
}

If there were different levels, you could save the music in an array and recover the one that interests you at each level change.

Regards.

2 Likes
10

@jjcapellan : thank you! that worked. I was able to create my own working function from that. But I now have a problem. i’m trying to get 'OptionsScene.js' to work. When I click the 'Play' button. it works fine, but for some reason when I click the 'Options' button, I’m getting :

Cannot read property 'play' of undefined OptionsScene.js:218

Here’s the demo : https://thundros.github.io/menu-system/

If I didn’t explain well enough, please let me know & I’ll explain further as best I can.

Any help is GREATLY appreciated! :slight_smile:

Thank You!

11

https://developers.google.com/web/updates/2015/05/automatically-pause-on-any-exception

When paused you’ll be able to see which value is undefined.

12

it’s working now.

so i’m trying to get my music to switch depending on the array number I give 'this.__soundTrack'. but for some reason even though I give :

this.createAudio({
    soundID : this.__soundTrack [ 1 ], 
    soundData : this.__soundData [ 1 ], 
});

a ’1' instead of '0' for 'this.__soundTrack [ ... ]' & 'this.__soundData [ ... ]', it still plays the 'this.__soundTrack [ 0 ]' & 'this.__soundData [ 0 ]' theme from 'TitleScene.js'.

here’s the demo ::

https://thundros.github.io/menu-system/

13

Hi @Thundros
Some points:

  1. Here you are assigning a new value to a scene plugin (webaudiomanager), so you cannot reuse it later in the scene.
// In your createaudio()
this.sound = this.sound.add ( this.__soundID, this.__soundData );
  1. The sound is global, so when you change the scene, you have to manually stop or remove the sounds.
  2. This condition is never met.
if ( this.model.musicOn === true && this.model.bgMusicPlaying === false ) {
		this.sound = this.sound.add ( this.__soundID, this.__soundData ); //<--- rename this variable
//....
}

Regards.

14

@jjcapellan : so i pushed a new commit to :

https://thundros.github.io/menu-system/

I changed the variable like you said from 'this.sound' to 'this.sound1', & it’s still doing the same thing.

15

Hi again @Thundros,
About my previus answer:

Point 1 did not really affect your problem but it prevented you from using the webaudiomanager again in that same scene, hence I advised you to rename it since it would surely give you problems later.

Regarding point 3:
When the scene GameScene begins, the value of the variable this.sys.game.globals.model.bgMusicPlaying is true, so in the createaudio() you stop the sound and assign that variable the value false, and since you no longer call createaudio(), the sound of the level never comes added to the scene.
Good luck this time.

16

@1jjcapellan : i FINALLY got it working! check it out! & the source code! :

https://thundros.github.io/menu-system/

although, for some reason when I uncheck then recheck the music checkbox in 'Options' , & go back to the 'Title' , for some reason the music doesn’t restart.

17

Hi @Thundros,
It is almost the same problem as before.
The checkbox music enabled of the options scene only assigns two combinations to the variables musicOn and bgMusicPlaying, {true, true} or {false, false}, and none of them meets the condition to add the sound in the titleScene scene:

if ( this.model1.musicOn === true && this.model1.bgMusicPlaying === false ) {
                // ...
		this.sound1 = this.sound.add ( this.__soundID, this.__soundData );
                //...
}

I think this time is the definitive :smile: . Take your time and follow the logic of your code.

21

@jjcapellan : FIGURED IT OUT!

Check it out here :

https://thundros.github.io/menu-system/