Status
Not open for further replies.

p0_boy

anti-kumbaya
Veteran
Joined
Mar 26, 2019
Messages
64
Reaction score
29
First Language
English
Primarily Uses
RMMV
Is there any way to designate a Base64 image string / data url as the image of an event?

There are many posts about saving PNGs as Base64 data strings but I can't find anything about the best practice for loading them.

I came across this post by @mogwai which shows how to use one for the Bitmap.prototype._onError image:
Code:
Bitmap.prototype._onError = function() {
    this._image.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcsA' +
                      'AADxAgMAAADZ+nSrAAAACVBMVEX7/folJiR4endEQ+rIAAACE0' +
                      'lEQVR4AWIYyUAMQOQYaEYMRFH0TryEDHho2RZAl+lfTPMFARXA' +
                      'QNG/mM0XFCsAAvnPxqx1HsZznDvvdtswb90GYUL5LD/j+YCYvh' +
                      '63+7UeFcQscXmbzkdiJTCtedBXyCAsSx8q5i80o4Z8/wvV8wwS' +
                      'Vhx1CdZLrAT0O1Xr1lsFYQ33pJzSRTSjxvu8B+17AWGFI8pjHC' +
                      'RWAspduwnCkqnddJpRQ67mZxBWUPvCJFYC7ebZDYT1uGnuNKPG' +
                      'w/ecQVjti2AmsRLQ61pNWxAIKyxJeSwumlGjL6d/rRmEpe8o7x' +
                      'aTWAkwoKfF0IwazwFh/bNXh0YAACAMA/ffGhf1G9BKLof9bdu2' +
                      '+Tk/5+f83LZtfs7P+Tk/t237NviZefBTMnaqR9UL+5l58BMydq' +
                      'pX1Qv7mXnwEzJ2qlfVC/uZefATMnaqR9UL+ZnZ9FMydqpH1Qv6' +
                      'mXnwkzJ2qkdFgq89O6oBEAqgENq/tQ1QvX++QwnGGAD0il7RK3' +
                      'oFAH/yJ3/yJwD+5E/+5E8A8Mv8Mr8MeJ0dETNZQUN2RMx0BQ3Z' +
                      'ETHTFTRkR8RMV9CQHREzXUFDdkTMVAUN2RExExV0DgD4kz/5kz' +
                      '8B8Cd/8id/AsDn7ZUzLS/csL1ipvWFG7ZXzLS+cMP2ipnWF27Y' +
                      'XjHT+sIN2ytnWl04QK/oFb2iVwDwJ3/yJ38C4E/+5E/+BAC/zC' +
                      '/zy/AXLrwy2XuQyMlfAAAAAElFTkSuQmCC';
};
But, I am not sure how to apply it for use with events.

Is it as easy as designating an event's .src property?

And, how do I access that .src property?

I haven't found those answers yet in my foraging, but I dug up another post (coincidentally also by mogwai), where the example of takes a screenshot of the canvas and loads it using showPicture:
Code:
var freezeGameScreenToPicture = function(parameters){
   var p = parameters || {};
   var GC = SceneManager.snap()._canvas;       // gameCanvas
   var screenShot = GC.toDataURL("image/png");// base64 data image
   $gameScreen.showPicture(                  // show Picture (
       p.id       || 1,                     // picture ID and...
       screenShot,                         // name (saved ScreenShot)
       p.origin   || 0,                   // origin
       p.x        || 0,                  // x
       p.y        || 0,                 // y
       p.scaleX   || 100,              // scaleX
       p.scaleY   || 100,             // scaleY
       p.opacity  || 255,            // opacity
       p.blendMode|| 0              // blendMode
   );                              // );
};
The code looks like it is storing an image snapped by the SceneManager in a variable (GC). GC is then converted into a base64 data string and storing it in another variable (screenShot), and then it is used in .showPicture.

In an effort to recreate the parts of this that would work for me, I tried putting the PNG data url from mogwai's first code into a variable (imageTest):
Code:
var imageTest = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcsA' +
                      'AADxAgMAAADZ+nSrAAAACVBMVEX7/folJiR4endEQ+rIAAACE0' +
                      'lEQVR4AWIYyUAMQOQYaEYMRFH0TryEDHho2RZAl+lfTPMFARXA' +
                      'QNG/mM0XFCsAAvnPxqx1HsZznDvvdtswb90GYUL5LD/j+YCYvh' +
                      '63+7UeFcQscXmbzkdiJTCtedBXyCAsSx8q5i80o4Z8/wvV8wwS' +
                      'Vhx1CdZLrAT0O1Xr1lsFYQ33pJzSRTSjxvu8B+17AWGFI8pjHC' +
                      'RWAspduwnCkqnddJpRQ67mZxBWUPvCJFYC7ebZDYT1uGnuNKPG' +
                      'w/ecQVjti2AmsRLQ61pNWxAIKyxJeSwumlGjL6d/rRmEpe8o7x' +
                      'aTWAkwoKfF0IwazwFh/bNXh0YAACAMA/ffGhf1G9BKLof9bdu2' +
                      '+Tk/5+f83LZtfs7P+Tk/t237NviZefBTMnaqR9UL+5l58BMydq' +
                      'pX1Qv7mXnwEzJ2qlfVC/uZefATMnaqR9UL+ZnZ9FMydqpH1Qv6' +
                      'mXnwkzJ2qkdFgq89O6oBEAqgENq/tQ1QvX++QwnGGAD0il7RK3' +
                      'oFAH/yJ3/yJwD+5E/+5E8A8Mv8Mr8MeJ0dETNZQUN2RMx0BQ3Z' +
                      'ETHTFTRkR8RMV9CQHREzXUFDdkTMVAUN2RExExV0DgD4kz/5kz' +
                      '8B8Cd/8id/AsDn7ZUzLS/csL1ipvWFG7ZXzLS+cMP2ipnWF27Y' +
                      'XjHT+sIN2ytnWl04QK/oFb2iVwDwJ3/yJ38C4E/+5E/+BAC/zC' +
                      '/zy/AXLrwy2XuQyMlfAAAAAElFTkSuQmCC';
And then calling setImage:
Code:
$gameMap.event(3).setImage(imageTest,0);
This of course causes a Loading Error, because setImage tries to load a file named "data:image/png;base64,iVBOR..." from the img/characters folder rather than seeing imageTest as data.

Is there a way around saving the base64 data as a file and having to reload it into the game?

I tried to adopt a solution from stackoverflow about "Drawing an image from a data URL to a canvas" which looked like a good way to change the Data URL variable (now named img_test) into something that could be used by setImage:
Code:
var imageTest = new Image;
imageTest.src = img_test;

$gameMap.event(3).setImage(imageTest,0);
But this just caused a TypeError- filename.match is not a function.

Because, again, setImage is looking for a string, a filename, rather than a data object.

If there was a way around this- I would not have to create a file in the img/character to load the new image data.

Does the solution lie in exploring the RMMV JS (along the lines of what mogwai was doing in his first code)?

Thanks in advance, have a good week!
 
Last edited:

caethyril

^_^
Global Mod
Joined
Feb 21, 2018
Messages
2,768
Reaction score
2,118
First Language
EN
Primarily Uses
RMMZ
Interesting, I recently wrote a simple per-session plugin for something similar. It checks the requested filename against a list of names, and on match returns the associated screenshot (if it exists). It just aliases the loadBitmap routine of Game_Picture:
Code:
// Substitute picture bitmap for snapshot if appropriate
_.Sprite_Picture_loadBitmap = Sprite_Picture.prototype.loadBitmap;
Sprite_Picture.prototype.loadBitmap = function() {
	let n = _.pics.indexOf(this._pictureName);
	let b = _.getSnap(n + 1);
	if (b) { this.bitmap = b; } else { _.Sprite_Picture_loadBitmap.call(this); };
};
If you've got the images saving/loading correctly ("LZString.decompressFromBase64(data)"?), then I guess all you'd need to do is load them into the appropriate array on game load. There may well be an easier approach, though. :kaoswt:
 

p0_boy

anti-kumbaya
Veteran
Joined
Mar 26, 2019
Messages
64
Reaction score
29
First Language
English
Primarily Uses
RMMV
Interesting, I recently wrote a simple per-session plugin for something similar. It checks the requested filename against a list of names, and on match returns the associated screenshot (if it exists). It just aliases the loadBitmap routine of Game_Picture:
Code:
// Substitute picture bitmap for snapshot if appropriate
_.Sprite_Picture_loadBitmap = Sprite_Picture.prototype.loadBitmap;
Sprite_Picture.prototype.loadBitmap = function() {
    let n = _.pics.indexOf(this._pictureName);
    let b = _.getSnap(n + 1);
    if (b) { this.bitmap = b; } else { _.Sprite_Picture_loadBitmap.call(this); };
};
If you've got the images saving/loading correctly ("LZString.decompressFromBase64(data)"?), then I guess all you'd need to do is load them into the appropriate array on game load. There may well be an easier approach, though. :kaoswt:
Thanks, @caethyril .

I'm a bit daft, so I hope you don't mind if I press you for a few more answers...

(1) In your example, is pics an object array of base64 data strings with names? Like:
Code:
var pics = {};
pics["blank"] = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcsA' +
'AADxAgMAAADZ+nSrAAAACVBMVEX7/folJiR4endEQ+rIAAACE0' +
'lEQVR4AWIYyUAMQOQYaEYMRFH0TryEDHho2RZAl+lfTPMFARXA' +
'QNG/mM0XFCsAAvnPxqx1HsZznDvvdtswb90GYUL5LD/j+YCYvh' +
'63+7UeFcQscXmbzkdiJTCtedBXyCAsSx8q5i80o4Z8/wvV8wwS' +
'Vhx1CdZLrAT0O1Xr1lsFYQ33pJzSRTSjxvu8B+17AWGFI8pjHC' +
'RWAspduwnCkqnddJpRQ67mZxBWUPvCJFYC7ebZDYT1uGnuNKPG' +
'w/ecQVjti2AmsRLQ61pNWxAIKyxJeSwumlGjL6d/rRmEpe8o7x' +
'aTWAkwoKfF0IwazwFh/bNXh0YAACAMA/ffGhf1G9BKLof9bdu2' +
'+Tk/5+f83LZtfs7P+Tk/t237NviZefBTMnaqR9UL+5l58BMydq' +
'pX1Qv7mXnwEzJ2qlfVC/uZefATMnaqR9UL+ZnZ9FMydqpH1Qv6' +
'mXnwkzJ2qkdFgq89O6oBEAqgENq/tQ1QvX++QwnGGAD0il7RK3' +
'oFAH/yJ3/yJwD+5E/+5E8A8Mv8Mr8MeJ0dETNZQUN2RMx0BQ3Z' +
'ETHTFTRkR8RMV9CQHREzXUFDdkTMVAUN2RExExV0DgD4kz/5kz' +
'8B8Cd/8id/AsDn7ZUzLS/csL1ipvWFG7ZXzLS+cMP2ipnWF27Y' +
'XjHT+sIN2ytnWl04QK/oFb2iVwDwJ3/yJ38C4E/+5E/+BAC/zC' +
'/zy/AXLrwy2XuQyMlfAAAAAElFTkSuQmCC';
(2) And is ._pictureName the filename string argument passed to loadBitmap by whatever function uses it (like .setImage and/or .showPicture)?

(3) Finally, is getSnap converting the specified item in the pics array to base64 data using LZString.decompressFromBase64(data) and returning a bitmap data object?

Sorry if these are dumb questions, I am still not very confident with aliasing and the RMMV JS libraries.

I look forward to your answers!

Addendum
I tried to use your code and change Sprite_Character.prototype.setCharacterBitmap, which I believe is responsible for loading event images:
Code:
  $._pics = {};
  $._pics["blank"] = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcsA' +
  'AADxAgMAAADZ+nSrAAAACVBMVEX7/folJiR4endEQ+rIAAACE0' +
  'lEQVR4AWIYyUAMQOQYaEYMRFH0TryEDHho2RZAl+lfTPMFARXA' +
  'QNG/mM0XFCsAAvnPxqx1HsZznDvvdtswb90GYUL5LD/j+YCYvh' +
  '63+7UeFcQscXmbzkdiJTCtedBXyCAsSx8q5i80o4Z8/wvV8wwS' +
  'Vhx1CdZLrAT0O1Xr1lsFYQ33pJzSRTSjxvu8B+17AWGFI8pjHC' +
  'RWAspduwnCkqnddJpRQ67mZxBWUPvCJFYC7ebZDYT1uGnuNKPG' +
  'w/ecQVjti2AmsRLQ61pNWxAIKyxJeSwumlGjL6d/rRmEpe8o7x' +
  'aTWAkwoKfF0IwazwFh/bNXh0YAACAMA/ffGhf1G9BKLof9bdu2' +
  '+Tk/5+f83LZtfs7P+Tk/t237NviZefBTMnaqR9UL+5l58BMydq' +
  'pX1Qv7mXnwEzJ2qlfVC/uZefATMnaqR9UL+ZnZ9FMydqpH1Qv6' +
  'mXnwkzJ2qkdFgq89O6oBEAqgENq/tQ1QvX++QwnGGAD0il7RK3' +
  'oFAH/yJ3/yJwD+5E/+5E8A8Mv8Mr8MeJ0dETNZQUN2RMx0BQ3Z' +
  'ETHTFTRkR8RMV9CQHREzXUFDdkTMVAUN2RExExV0DgD4kz/5kz' +
  '8B8Cd/8id/AsDn7ZUzLS/csL1ipvWFG7ZXzLS+cMP2ipnWF27Y' +
  'XjHT+sIN2ytnWl04QK/oFb2iVwDwJ3/yJ38C4E/+5E/+BAC/zC' +
  '/zy/AXLrwy2XuQyMlfAAAAAElFTkSuQmCC';

  $.Sprite_Character_setCharacterBitmap = Sprite_Character.prototype.setCharacterBitmap;
  Sprite_Character.prototype.setCharacterBitmap = function() {
    console.log(this._characterName);
    if (Object.keys($._pics).indexOf(this._characterName) != -1) var b = $._pics[this._characterName];
    if (b) {this.bitmap = b} else {$.Sprite_Character_setCharacterBitmap.call(this); };
  };
But that results in a TypeError: value.addLoadListener is not a function.

Passing $._pics["blank"] through LZString.decompressFromBase64() only returns a blank string.

How do I turn $._pics["blank"] into a bitmap object?
314czvc.jpg
 
Last edited:

caethyril

^_^
Global Mod
Joined
Feb 21, 2018
Messages
2,768
Reaction score
2,118
First Language
EN
Primarily Uses
RMMZ
In my example it's all just bitmaps, nothing special and no explicit type conversion...I only cited it to show one approach to storing/retrieving the bitmaps, since the default "assign graphic" stuff is almost entirely filename-based. :kaoslp:

This is just theory, but based on that SO link you cited, couldn't you use something like this to convert from string to image before assignment?
Code:
var sprite = new Sprite();
var base64src = "etc";
sprite.bitmap._image.src = base64src;
pics[1] = sprite;

I admit this is a bit beyond me, so if that doesn't work out then let's hope someone more knowledgeable happens along. xP
 

p0_boy

anti-kumbaya
Veteran
Joined
Mar 26, 2019
Messages
64
Reaction score
29
First Language
English
Primarily Uses
RMMV
In my example it's all just bitmaps, nothing special and no explicit type conversion...I only cited it to show one approach to storing/retrieving the bitmaps, since the default "assign graphic" stuff is almost entirely filename-based. :kaoslp:

This is just theory, but based on that SO link you cited, couldn't you use something like this to convert from string to image before assignment?
Code:
var sprite = new Sprite();
var base64src = "etc";
sprite.bitmap._image.src = base64src;
pics[1] = sprite;

I admit this is a bit beyond me, so if that doesn't work out then let's hope someone more knowledgeable happens along. xP

No worries, @caethyril - at least your info has given me something to mull over!

Unfortunately, sprite.bitmap._image.src doesn't seem to be a valid way to pass the base64 string... otherwise, sprite.bitmap could be assigned to this.bitmap and maybe solve the problem.

There seems to be no way that I can find to convert the base64 string to a bitmap object.

I tried turning the base64 string into a blob, and then trying to use that blob with the function createImageData() but that didn't work either.

I am not sure if I have to create a canvas element, place the base64 data in that, and then pull a bitmap object from that canvas element? I need to read some more though.

Thanks again anyway!


Addendum
The answer might have been right in front of me, in mogwai's second post he has this alias:
Code:
(function(alias){
   ImageManager.loadPicture = function(filename, hue) {
       if(filename.match(/^data:image\/png;base64,/) !== null){
           return this.loadNormalBitmap(filename, hue);
       }
       return alias.apply(this, arguments);
   };
Which seems to use .loadNormalBitmap to handle base64 strings.

As I am using .setImage instead of .showPicture, I changed his code for use with ImageManager.loadCharacter instead:
Code:
(function(alias){
  ImageManager.loadCharacter = function(filename, hue) {
      if(filename.match(/^data:image\/png;base64,/) !== null){
          console.log(this.loadNormalBitmap(filename, hue));
          return this.loadNormalBitmap(filename, hue);
      }
      return alias.apply(this, arguments);
  };
})(ImageManager.loadCharacter);
And this seems to let me, use a base64 string without error:
Code:
var test = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASAAAAGACAYAAAANn79uAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OEMwRDA3NTI1RDc5MTFFOUExMzhCN0JFNzQ3N0FBRDciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OEMwRDA3NTM1RDc5MTFFOUExMzhCN0JFNzQ3N0FBRDciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxMjg5RjJFQjVENzgxMUU5QTEzOEI3QkU3NDc3QUFENyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxMjg5RjJFQzVENzgxMUU5QTEzOEI3QkU3NDc3QUFENyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pi8Psw8AAAtgSURBVHja7N2xbttI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"

$gameMap.event(3).setImage(test,0);
Unfortunately, the event image just appears blank.

But something is happening here (that isn't causing the game to crash).

I just need to experiment more.


This is the object produced by .loadNormalBitmap:
negl8i.png


I will sleep on it and try again tomorrow.


Addendum 2
Still having trouble getting the image to show.

This is the test image:
vreqeu.png


This is how it looks as a base64 (as converted by https://www.base64-image.de/):
Code:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASAAAAGACAYAAAANn79uAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OEMwRDA3NTI1RDc5MTFFOUExMzhCN0JFNzQ3N0FBRDciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OEMwRDA3NTM1RDc5MTFFOUExMzhCN0JFNzQ3N0FBRDciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxMjg5RjJFQjVENzgxMUU5QTEzOEI3QkU3NDc3QUFENyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxMjg5RjJFQzVENzgxMUU5QTEzOEI3QkU3NDc3QUFENyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pi8Psw8AAAtgSURBVHja7N2xbttI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
Instead of aliasing ImageManager.loadCharacter, I just reverted back to using
Sprite_Character.prototype.setCharacterBitmap:
Code:
  $._pics = {
    "slime" : "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASAAAAGACAYAAAANn79uAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OEMwRDA3NTI1RDc5MTFFOUExMzhCN0JFNzQ3N0FBRDciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OEMwRDA3NTM1RDc5MTFFOUExMzhCN0JFNzQ3N0FBRDciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxMjg5RjJFQjVENzgxMUU5QTEzOEI3QkU3NDc3QUFENyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxMjg5RjJFQzVENzgxMUU5QTEzOEI3QkU3NDc3QUFENyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pi8Psw8AAAtgSURBVHja7N2xbttI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"
  };

  $.Sprite_Character_setCharacterBitmap = Sprite_Character.prototype.setCharacterBitmap;
  Sprite_Character.prototype.setCharacterBitmap = function() {
    console.log(this._characterName);
    if (Object.keys($._pics).indexOf(this._characterName) != -1) var b = ImageManager.loadNormalBitmap($._pics[this._characterName]);
    if (b) {this.bitmap = b} else {$.Sprite_Character_setCharacterBitmap.call(this); };
  };
And then:
Code:
$gameMap.event(3).setImage("slime",0);
Unfortunately, still no success- no errors, it's just that Event 3 just goes blank when I call the .setImage command.

I am trying to find as much info as I can about ImageManager.loadNormalBitmap:
(static) loadNormalBitmap (path, hue) → { Bitmap }
The image of the specified path is read from under the project folder, shifted to the specified hue, and returned.

Parameters:
Name
Type Description
path String Path string (written as 'img / system / Balloon.png')
hue Number Hue (360 degrees)
Returns:
Type
Bitmap
(source: https://katai5plate.github.io/RPGMV-CoreScript-Reference/jsdoc/ImageManager.html)

loadNormalBitmap
  • loadNormalBitmap(path: string, hue: number): Bitmap
Loads a Bitmap object given a path and returns it.

memberof
ImageManagerStatic

Parameters
  • path: string
  • hue: number
Returns Bitmap
(source: https://kinoar.github.io/rmmv-doc-web/interfaces/imagemanagerstatic.html#loadnormalbitmap)

Code:
ImageManager . LoadNormalBitmap  =  Function ( Path ,  Hue )  {
    Var  Key  =  This . _GenerateCacheKey ( Path ,  Hue );
    Var  Bitmap  =  This . _ImageCache . Get ( Key );
    If  ( ! Bitmap )  {
        Bitmap  =  Bitmap . Load ( Path );                      // ver1.5.2
        bitmap  =  Bitmap. Load ( decodeURIComponent ( path ));  // Ver1.6.2
        bitmap . AddLoadListener ( function ()  {
            bitmap . RotateHue ( hue );
        });
        this . _ImageCache . The add ( key ,  bitmap );
    } the else  an if ( ! Bitmap . isReady ()) {
        bitmap . decode ();
    }

    return  bitmap ;
};
(source: https://qiita.com/yamachan360/items/0a1e09df91296a43de73#rpg_managersjs)

But, aside from the fact Event 3 is blank, I cannot tell if I am using it wrong as per mogwai's application.

I am wondering if I have to go further and intercept Bitmap.load?

Again, the solution seems so close.


Addendum 3
After a lot of playing around, it turns out that it does work using .loadNormalBitmap... depending on the character length of the base64 data.

$._pics["blank"] (which is 834 characters) works.

$._pics["slime"] (which is 5118 characters) doesn't.

I am now trying to determine what the maximum number of characters allowed is.

This is from Mozilla's description of Data URIs, which states:
Length limitations
Although Firefox supports data URLs of essentially unlimited length, browsers are not required to support any particular maximum length of data. For example, the Opera 11 browser limited URLs to 65535 characters long which limits data URLs to 65529 characters (65529 characters being the length of the encoded data, not the source, if you use the plain data:, without specifying a MIME type).
But this doesn't seem the case here.

Another interesting thing that they both happen to be loaded into the ImageManager._imageCache._items, even if only one is appearing.
2nkihah.png

I am still hoping that somebody has tackled this problem before and is able to give me even just a little bit of insight.

Addendum 4
It works for some base64 data but not all. I am still trying to figure it out. But it works:
Code:
(function(alias){
  ImageManager.loadCharacter = function(filename, hue) {
    console.log(filename);
      if(filename.match(/^data:image\/png;base64,/) !== null){
          console.table(this.loadNormalBitmap(filename, hue));
          return this.loadNormalBitmap(filename, hue);
      }
      return alias.apply(this, arguments);
  };
})(ImageManager.loadCharacter);
 
Last edited:

slimmmeiske2

Little Red Riding Hood
Global Mod
Joined
Sep 6, 2012
Messages
8,938
Reaction score
5,852
First Language
Dutch
Primarily Uses
RMXP

This thread is being closed, due to being solved. If for some reason you would like this thread re-opened, please report this post and leave a message why. Thank you.

 
Status
Not open for further replies.

Latest Threads

Latest Posts

Latest Profile Posts

Still alive! Totally did not finish in time for the Jam (boy that's late) but tl;dr of the last half a year is Work term -> Covid Lockdown -> Sick... again -> Full time Employment. Game stuff has been on hiatus but got a new graphics tablet so hopefully updates again soon. =D
Going on hiatus. Won't be back until mid October.:LZSoops:
Just read the English lyrics for Despacito. Ramen aint innocent no more! :kaodes:
Well today was blown away with nothing to show for it. I made a new character to my game who I was going to have a protection mechanic where he protects my main character randomly unless it's a critical, and no matter what, to check if an attack received will be critical, means checking the apply method. This means rewriting the entire method and I refused to do that.

Forum statistics

Threads
115,316
Messages
1,088,881
Members
149,961
Latest member
MrSunshine
Top