Strange behavior of Sprites/Bitmap

[Lihinel]

This question is related to Orange Overlay, but I am pretty sure its a general issue.
https://forums.rpgmakerweb.com/index.php?threads/orange-overlay.63524/

I am trying to replicate/move a harvestmoon like script from VXAce to MV, I basically blt plant parts to the ground or upper layers of an overlay, which is a normal bitmap.
For testing purposes, I tried starting small so instead of a blocktransfer I just used the fillRect and clear function on the bitmap with the following code:

var Lihinel = Lihinel || {};
  (function() {

Lihinel.blt_plants = false;


var oldSpriteset_Map_updateGroundLayer = Spriteset_Map.prototype.updateGroundLayer
 Spriteset_Map.prototype.updateGroundLayer = function() {
    oldSpriteset_Map_updateGroundLayer.call(this);
   
    if(!Lihinel.blt_plants){
        this._groundLayer.bitmap.fillRect(0,0,100,100,"#000000");
       
        Lihinel.blt_plants = true;
        console.log(Lihinel.blt_plants);
    }
  };
 
var oldGameInterpreter_pluginCommand = Game_Interpreter.prototype.pluginCommand;
  Game_Interpreter.prototype.pluginCommand = function (command, args) {
    if (command.toLowerCase() == 'greenhouse') {
        Lihinel.blt_plants = false;
       
        return null;
    }
    oldGameInterpreter_pluginCommand.apply(this, arguments);
  }
 })();

This works and puts a 100*100 black square,however,
if I set the first Lihinel.blt_plants to true instead of false, like this:

var Lihinel = Lihinel || {};
  (function() {

Lihinel.blt_plants = true;
...

It no longer works, no matter how often I use the plugin command.

I know I am missing something fundamental about sprites/bitmaps here, but I don't know what.

 

[Shaz]

Just a guess, but try using === instead of == in your plugin command function.

 

[Lihinel]

That can't be it, the

console.log(Lihinel.blt_plants);

block inside the Spriteset_Map.prototype.updateGroundLayer is always executed, I checked using the console.
only the

this._groundLayer.bitmap.fillRect(0,0,100,100,"#000000");

doesn't seem to do anything if the variable Lihinel.blt_plants is set to true instead of false in the beginning.

Edit:
and just to add, if I remove the change Lihinel.blt_plants to true inside of the method with the .fillRect, it just goes tries use the fill method (as well as the console.log) every frame, but it still doesn't do anything to the bitmap. Really weird.

 

[Lihinel]

Update:
I replaced the .fillRect with multiple .blt's and the true/false with a counter and noticed that it needs a higher count to display the images when I add an additional load.
So I guess the problem is with images not being loaded when I want to use them and them eventually getting loaded as my counter goes up high enough. Is there an easy way to tell if all images you need are loaded? I think something along the lines of an async function or onload (like here, but with multiple images)

 

[Andar]

not directly - because that is implemented too deeply into the way the internet and the browsers load files.

However, there are preloader-plugins that allow you to specify which files will be needed later and load them before they become in use.
That solution has other disadvantages (like the risk of too much RAM-use), but it might be a solution for you.