Problem getting images in Sprites to refresh

For developers using the Construct 2 Javascript SDK

Post » Thu Apr 26, 2012 11:55 am

For the moment, I'm creating behaviors dealing with the HTML image inside the Sprite object.

I usually get it back with that line of code :
[quote]
this.inst.type.animations[0].frames[this.inst.cur_frame].texture_img.src;
[/quote]

I do what I need to do with that (usually drawing it on another private canvas to modify it).

When I want to inject it back (as a base64 string), it updates in Chrome, but not in Firefox.

To clarify my problem, here's a typical piece of code :

[quote]
var tmpImage;
var base64str;

this.tmpImg.onload = function(){
    ctx.drawImage(tmpImg, 0, 0,tmpImg.width,tmpImg.height);
    //do my thing
    base64str = cvs.toDataURL("image/png");
    inst.cur_animation.frames[inst.cur_frame].texture_img.onload = (function (self) {
        return function(info) {
            inst.set_bbox_changed();
            cr.runtime.redraw = true;
     };
    })(this);
              
              img.src = base64str;
              cr.runtime.redraw = true;
}

this.tmpImg.src = this.inst.type.animations[0].frames[this.inst.cur_frame].texture_img.src;
[/quote]
It works perfectly in Chrome.
However, although the new "img.src" of the Sprite contain, indeed, the base64 string, FF doesn't update.
When I do that kind of things outside C2's SDK, it works perfectly on FF and Chrome (see here, for example : http://jsfiddle.net/2Unnf/).

So, here's my question : what's the right way to inject an image inside the Sprite object, when dealing with onload() methods ?Pode2012-04-26 11:56:13
B
33
S
9
G
6
Posts: 709
Reputation: 6,704

Post » Thu Apr 26, 2012 3:59 pm

Your closure has a mistake, you return "function (info)" but use "inst.", you probably wanted to write "function (inst)". Surprised that doesn't crash in Chrome.

You should probably also only update the sprite's image when tmpImage's onload event fires.
Scirra Founder
B
359
S
214
G
72
Posts: 22,952
Reputation: 178,580

Post » Thu Apr 26, 2012 4:23 pm

[QUOTE=Ashley]Surprised that doesn't crash in Chrome.[/QUOTE]
@Ashley: I've noticed that chrome is really "laxist" on the JS code execution whereas firebug is far stricter. I don't know if FF without firebug executes said code, but with the extension on it often "shoots" some bit of code that are not working as they should.

If you want to make sure some code is correct, run it by firebug and you'll be set.
New to Construct ? Where to start

Image Image
Image Image

Please attach a capx to any help request or bug report !
Moderator
B
247
S
85
G
40
Posts: 6,999
Reputation: 57,793

Post » Sat Apr 28, 2012 4:36 pm

@Kyatric: Very interesting. For me it feels that Chrome is much more stricter than Firefox/bug with Javascript.. (using external-resources(scripts,..), dirty fast scripts, and also with the WebGL-stuff)Joe72012-04-28 16:39:21
B
14
S
6
G
5
Posts: 173
Reputation: 4,742

Post » Wed May 02, 2012 4:56 pm

@Ashley : I made the modification you noticed, but I still can't force Firefox to update the image (and checking with Firebug, the image .src is the right base64 string).
How do you force the refresh ?
B
33
S
9
G
6
Posts: 709
Reputation: 6,704

Post » Wed May 02, 2012 5:19 pm

@Pode, as far as C2's engine is concerned, you literally only need to set the runtime redraw flag to true. That forces a complete refresh of the entire game. If that is not doing it, perhaps the image is not loaded or there is something else in the browser involved.
Scirra Founder
B
359
S
214
G
72
Posts: 22,952
Reputation: 178,580


Return to Javascript SDK

Who is online

Users browsing this forum: No registered users and 0 guests