Jump to content

Loader.once('complete'... responds only after all asset are loaded


Recommended Posts

I have been trying to add a loading screen to my game. I know that I need to use .on('progress') and .once('complete') handlers. I run following code for loading an asset batch;

assetManager.loadImageBatch = function(args, callback){
  var ctr = 0;
  var toLoad = args.assets.length;
  args.assets.forEach(elm=>{
    loadFile(elm.name, args.pathPrefix + elm.path);
  })

  function loadFile(name, path){
    assetManager.loader.add(name, path);
    assetManager.loader.once('complete', loadCallback);
    assetManager.loader.load();
  }

  function loadCallback(){
    console.log("loading");
    ctr++;
    if(ctr == toLoad)
      callback();
  }
}

it runs ok, loads all assets but as it has to log "loading" after loading each asset, it logs it after loading the whole asset batch. I tested it on both local and on my website. It results the same, nothing to do with download speed or whatsoever. I googled about loading screen usage on pixi but I wasn't able to find anything useful. Any thoughts?

Link to post
Share on other sites

https://github.com/englercj/resource-loader/blob/408199ceea27aea601bb776fb01ea0e6e3bb04c6/README.md

From the resource-loader readme:

// throughout the process multiple events can happen.
loader.on('progress', ...); // called once per loaded/errored file
loader.on('error', ...); // called once per errored file
loader.on('load', ...); // called once per loaded file
loader.on('complete', ...); // called once when the queued resources all load.

The loader loads a queue of resources, not one resource at a time. Calling `.load()`, then calling `.add()` afterwards is an error. If you call loadFile() multiple times you will get an error thrown.

You even say in your comment that you know you need to use progress, but then your code doesn't...

Try this instead:

assetManager.loadImageBatch = function(args, callback){
  args.assets.forEach(elm => {
    assetManager.loader.add(elm.name, args.pathPrefix + elm.path);
  })

  assetManager.loader.on('progress', onProgress);
  assetManager.loader.once('complete', callback);
  assetManager.loader.load();

  function onProgress(){
    console.log("loading: %d% done", assetManager.loader.progress);
  }
}

 

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.

Guest
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.

Loading...
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...