Base64 Images

[Lizard]

All what i found about it is 

https://github.com/photonstorm/phaser/issues/3342

But nothing is clear from answer.

I triying to use

this.textures.addBase64('key', data);

On preload where data is string 'data:image/jpeg;base64....'

And on create 

this.add.image(400, 300, 'key');

But it not works, what i do wrong?

[PsichiX]

please, provide fiddle with example of your case, so we could investigate what's happening in your case.

[snowbillr]

Since you are adding this to `this.textures`, and not loading it using the regular `this.load`, Rich mentioned you need to do a little extra work to make this work. He commented on that GitHub issue - https://github.com/photonstorm/phaser/issues/3342#issuecomment-372332727

> Note that you must listen out for the onload event from the Texture Manager before you can use the base64 texture in a game object.

So once you do the add the base 64 data to the textures object, you'll also need to do something like:

this.textures.on('onload', function() { /* do something with the texture */ });

 

[Lizard]

Thanks for fast respond

But still not so clear sorry

Upd: Thanks got it, solution is in codepen 

UpdUpd: moved 'on' to create. Thanks!

[snowbillr]

FWIW you should probably run the `on` code in the `create` function, since adding things to the scene from `preload` is unusual.

[Lizard]

May be someone know is it possible to use preloaded images as spritesheet? Or may be here is some another way to preload spritesheet as base64?

UPD found how to add frames for already preloaded images in base64 (further it can be used as spritesheet)

this.textures.list.NAMEOFIMAGE.add(index, 0, startX, startY, width, height);

index - number of frame

startX and startY - coordinates for upper left corner cropping rectangle

width and height - size of cropping rectangle

You can easily wrap it into cycle and crop  your spritesheet to frames.