Sign in to follow this  

Ensuring that all assets have been loaded in Preload state

Recommended Posts

Hello all,

I don't actually know if this is a Phaser issue or if this is a server related problem. So, sometimes when I start my game and go through the Preload-state, I get this log message in browser's console which says that one of the assets wasn't loaded. It's a Phaser message and it goes like Phaser.Loader error loading file... When this happens the file is always different. Sometimes it's an audio file, sometimes a single image file or sometimes a spritesheet. It's completely random.


Now I'm wondering if there is any efficient way to ensure that every file has been loaded before switching state. Do I have to check the game's cache with every key or is there any better way?


I'm using Phaser 2.2.2 and in the Preload state I'm loading quite a load of files:

  • 10 audio music files
  • 22 audio fx files
  • 41 single image files
  • 24 spritesheets
  • 2 atlas files

This has happened on both PC and mobile.


It would be great that the game wouldn't skip a file in any case because that eventually leads into a crash.

Share this post

Link to post
Share on other sites

Is your game wrapped around :

window.onload = function () {};



No, it's not. In my index.html file I load all script files inside <head> tag and then inside <body> tag I load main.js, which is the main game file.


Would this window.onload help in this preload issue of mine? How?

Share this post

Link to post
Share on other sites

Try something like this:

<!DOCTYPE html><html><head>    <meta charset="utf-8" />    <title>Monster Wants Candy demo</title>    <style> body { margin: 0; background: #B4D9E7; } </style>    <script src="src/phaser.min.js"></script>    <script src="src/Boot.js"></script>    <script src="src/Preloader.js"></script>    <script src="src/MainMenu.js"></script>    <script src="src/Game.js"></script></head><body><script>window.onload = function() {    var game = new Phaser.Game(640, 960, Phaser.AUTO, 'game');    game.state.add('Boot', Candy.Boot);    game.state.add('Preloader', Candy.Preloader);    game.state.add('MainMenu', Candy.MainMenu);    game.state.add('Game', Candy.Game);    game.state.start('Boot');};</script></body></html>

Share this post

Link to post
Share on other sites



The window.onload event is fired by the browser when EVERYTHING has finished loading - this includes the DOM, images, iFrames and scripts.


So if I do it like icp suggested, will it also make sure that all the loadings inside my Preload state get assuredly done? I mean that even though it makes sure that all scripts etc. have been loaded, I'm still making the game load more files when Boot-state has completed and switched to Preload state.

window.onload = function() {var game = new Phaser.Game(640, 960, Phaser.AUTO, 'game');game.state.add('Boot', Candy.Boot);game.state.add('Preloader', Candy.Preloader);game.state.add('MainMenu', Candy.MainMenu);game.state.add('Game', Candy.Game);game.state.start('Boot');};

Preload state starts inside window.onload after Boot.

Share this post

Link to post
Share on other sites

I'm wondering if I could do this somehow by adding a function to Loader's onFileError event. The difficult part of that is all different file types, I guess. At least if I make it to load something again by using basic commands ( this.load.spritesheet...)

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.