RMMV Most effective way to wait for ImageManager.loadBitmap to completely load an image?

[subengari]

Behold the following JS snippet:

It works partially upon execution, running the script commands between the bmp.isReady clause for a few of the PNGs that I am processing... however a good chunk of other PNGs aren't processed at all.

Is there someway to completely wait for ImageManager.loadBitmap to do its thing before running the commands between the bmp.isReady clause?

This is all happening upon loading of the game, so I am not really concerned if there is a waiting time for the operation to complete- the important thing is that the commands are run on each and every PNG before proceeding.

Thanks in advance!

 

[caethyril]

You can use Bitmap#addLoadListener. This will attach a callback function which will be run once the bitmap is done loading (cf rpg_core.js). I think it goes something like this (untested):

const onLoadImage = function() {
  this._context.getImageData(0, 0, this.width, this.height);
  // etc
};

const bmp = ImageManager.loadBitmap(folder, image);   // initiate async load request
bmp.addLoadListener(onLoadImage.bind(bmp));           // bind function to bitmap to run on load

 

[subengari]

You can use Bitmap#addLoadListener. This will attach a callback function which will be run once the bitmap is done loading (cf rpg_core.js). I think it goes something like this (untested):

const onLoadImage = function() {
  this._context.getImageData(0, 0, this.width, this.height);
  // etc
};

const bmp = ImageManager.loadBitmap(folder, image);   // initiate async load request
bmp.addLoadListener(onLoadImage.bind(bmp));           // bind function to bitmap to run on load

Thanks, @caethyril - the example you give doesn't work outright... but I will read up on addLoadListener and see if I can use it to work out my problem. I appreciate the suggestion!

 

[subengari]

@caethyril hmmm... addLoadListener seems less effective than my original code... I get no errors but none of the PNGs are processed!

If successful, the process should add opaqueWidth and opaqueHeight to the members of the $dataImages object.

Unfortunately, using addLoadListener produces:


Whilst, the OG code that I had produces:


So, you can see a few of the images acquired the opaqueWidth and opaqueHeight properties... but I need all of them to have it. Back to the drawing board for moi.

 

[caethyril]

Not certain exactly what you tried, but I just tried entering these two lines into the console (F8 during test), from the title screen, and it seemed to work OK for me:

var myFct = function(bmp) { console.log('loaded\n\t width: ' + bmp.width + '\n\theight: ' + bmp.height); };
var bmp = ImageManager.loadFace('Actor1'); bmp.addLoadListener(myFct);

I picked the face image because that's not something that will be loaded/cached at that point, but it seems to work OK with various other images too (battlebacks, system, enemies, etc). It turned out that bind was unnecessary here since the bitmap gets passed in as the first argument of the callback function.

 

[subengari]

Not certain exactly what you tried, but I just tried entering these two lines into the console (F8 during test), from the title screen, and it seemed to work OK for me:

var myFct = function(bmp) { console.log('loaded\n\t width: ' + bmp.width + '\n\theight: ' + bmp.height); };
var bmp = ImageManager.loadFace('Actor1'); bmp.addLoadListener(myFct);

I picked the face image because that's not something that will be loaded/cached at that point, but it seems to work OK with various other images too (battlebacks, system, enemies, etc). It turned out that bind was unnecessary here since the bitmap gets passed in as the first argument of the callback function.

thanks @caethyril .

I think I needed to sleep on it... I tried it this morning and it seems to be working better! I appreciate it.






There are two straggling images ("$large_chest_beam_old" and "$large_chest_stars") but they aren't important to what I am doing so it's ok!

Thanks again!