Loading files with pack attribute in scene settings config

[Tom Atom]

Hi, if I use pack attribute in scene settings config in scene constructor I can load some small assets even befor preloader is called.

Are these files loaded on every scene start? At least it looks they are added on loading list.

Is it intentional? Constructor of object is called only once when object is constructed. So, I would expect files in pack attribute to be processed only once too.

UPDATE: hmmm... it looks like scene payload is not loaded during constructor, but later when scene is started (before init method)

[BdR]

I'm also struggling with this payload concept. Looking at this example  it seems to me that the "pack" property could be used to load assets before the .preload() function is called. So this would be ideal for loading the images for a loading bar or a "please wait while loading" image.

However, when I try it like in the code below the image "nowloading.png" is not loaded. I mean when I try to display it in the .preload() function it just shows the green missing-graphic square.

EDIT: Fixed the code below to work, the "pack:{files[]}" part has to be passed into the constructor. 

var Preloader = new Phaser.Class({

    Extends: Phaser.Scene,

    initialize:

    function Preloader ()
    {
        Phaser.Scene.call(this, {
			key: 'preloader',
			pack: {
			    files: [
			        { type: 'image', key: 'nowloading', url: 'img/nowloading.png' }
			    ]
			}
		});
    },
	
    preload: function ()
    {
		// nowloading image is available in preload :) so like a pre-preloaded image
		this.add.sprite(400, 300, "nowloading");
		
		// load all assets
		this.load.audio('coin', ['snd/coin.mp3', 'snd/coin.ogg']);
		this.load.audio('bomb', ['snd/expl.mp3', 'snd/expl.ogg']);
		//etc.
    },

    create: function ()
    {
		// start the game
		this.scene.start('mainmenu');
    }
});

// ..etc.

var config = {
	type: Phaser.AUTO,
	width: 800,
	height: 600,
	backgroundColor: '#006060',
	parent: 'phaser-example'
	scene: [ Preloader, MainMenu, TutorScene, GameScene ]
};

var game = new Phaser.Game(config);

 

Edited July 21, 2018 by BdR
Fixed the code

[Tom Atom]

Hi,

 I am using Typescript and this works for me:

    export class Preloader extends SceneBase {

        // -------------------------------------------------------------------------
        public constructor() {

            // list of files to load as scene payload
            let files = [];
            // general config
            files.push({ type: "json", key: "Config", url: "assets/config.json" });
            // sponsor specific config if exists
            if (Sponsor.isFeatureOn("hasConfig")) {
                let sponsorConfigUrl = `assets/sponsor/config_${Sponsor.features().name}.json`;
                files.push({ type: "json", key: "SponsorConfig", url: sponsorConfigUrl });
            }
            // preload assets - like loading bar, etc.

            super({
                key: "Preloader",
                pack: {
                    files: files
                }
            });
        }

        :
        :
        :

I am loading game configs during constructor and I plan to load loading bar graphics too.

I think, your problem is, you defined pack, but are not passing it to super class constructor - you are passing only "key" for scene name. See my super call in the end.

[BdR]

19 minutes ago, Tom Atom said:

I think, your problem is, you defined pack, but are not passing it to super class constructor - you are passing only "key" for scene name. See my super call in the end.

Thanks  yes that was the problem. The "pack:{files[] }" array has to be passed into the constructor.