[PLUGIN] Canvas

Post your completed addons to share with the community

Post » Tue Nov 15, 2011 7:59 pm

Oh yeah you're completely right
I just tested with your idea

But! mine works too, I modified the acts.pasteObject function this way :
[code]
ctx.save();
ctx.scale(this.canvas.width/this.width, this.canvas.height/this.height);
ctx.rotate(-this.angle);
ctx.translate(-this.bquad.tlx, -this.bquad.tly);
ctx.globalCompositeOperation = "destination-out";
instances[x].draw(ctx);
ctx.globalCompositeOperation = "source-out";
ctx.restore();
[/code]

And it erase perfectly, even if it's a bit weird now that I think about it.

But yeah I'll stick with your idea... it's simplerYann2011-11-15 20:00:26
B
60
S
22
G
14
Posts: 1,479
Reputation: 16,346

Post » Fri Nov 18, 2011 8:43 pm

@R0J0hound: is it possible to add a function to you Canvas plugin to retrieve the canvas' image as data (I think the best is to retrieve a base64 text string) ?
I'm trying to add a property inside the canvas object, but it doesn't works...
(In fact, I'm trying to implement a floodfill like there http://www.williammalone.com/articles/html5-canvas-javascript-paint-bucket-tool/, but perhaps I'm trying to climb a too high mountain...
B
33
S
9
G
6
Posts: 709
Reputation: 6,704

Post » Fri Nov 18, 2011 8:54 pm

[QUOTE=Pode] @R0J0hound: is it possible to add a function to you Canvas plugin to retrieve the canvas' image as data (I think the best is to retrieve a base64 text string) ?
I'm trying to add a property inside the canvas object, but it doesn't works...
(In fact, I'm trying to implement a floodfill like there http://www.williammalone.com/articles/html5-canvas-javascript-paint-bucket-tool/, but perhaps I'm trying to climb a too high mountain...[/QUOTE]

rgbaAt gets the color of the pixel at xy in the canvas.
So you could to a nested loop like:
for x=0 to canvas.width
->for y=0 to canvas.height
-->system compare rgbaAt(loopindex("x"),loopindex("y"))= n do stuff

Very slow though, and recursion will slow it a bit as well.
Image Image
B
161
S
48
G
90
Posts: 7,356
Reputation: 66,767

Post » Fri Nov 18, 2011 10:46 pm

newt: yes that could emulate the behavior. The problem is that a true floodfill needs to start in a spiral, starting from the clicked pixel. It needs a structure to hold all that, it's a headache to implement it outside the core of the script ;)...
B
33
S
9
G
6
Posts: 709
Reputation: 6,704

Post » Fri Nov 18, 2011 10:57 pm

For that you could use x+1, x-1, y+1, y-1, or sin, and cos.
Then there's the datastructures plug('s) to store things.
Image Image
B
161
S
48
G
90
Posts: 7,356
Reputation: 66,767

Post » Sat Nov 19, 2011 11:08 am

@newt: something that annoys me, is that the original floodfill implementation works only with recursion. And I don't think you can build something like that with events in C2...
B
33
S
9
G
6
Posts: 709
Reputation: 6,704

Post » Sat Nov 19, 2011 7:53 pm

Doesn't the "rgbaAt" expression do the trick?

There are other implementations of flood fill that don't use recursion:
http://en.wikipedia.org/wiki/Flood_fill

Here I used the array object to implement a queue to keep track of what points to fill next.
http://dl.dropbox.com/u/5426011/examples%208/floodfill.capx
B
79
S
24
G
54
Posts: 4,746
Reputation: 40,755

Post » Sat Nov 19, 2011 9:27 pm

@R0J0hound: it's slow as hell, but it's really, really, really impressive ! You're the best !
B
33
S
9
G
6
Posts: 709
Reputation: 6,704

Post » Thu Nov 24, 2011 10:06 am

HAHA Awesome Guys!

@R0j0hound you should really integrate the PasteDelete stuff officially...

I've made this using the modified Canvas plugin from Yann in a few Minutes:

CLICK ME!!!

The black color is actually the layouts background color. The holes in the Canvas are made at start using PasteDelete :D

EDIT:
Updated with some more lemmings :D

Runs pretty decent imo:
http://dl.dropbox.com/u/45711709/LemTest2/index.htmlIze2011-11-24 10:43:14
B
33
S
6
G
7
Posts: 338
Reputation: 7,424

Post » Fri Nov 25, 2011 5:47 am

[QUOTE=Ize]
@R0j0hound you should really integrate the PasteDelete stuff officially...
[/QUOTE]

I won't integrate it, because it will only work with the Sprite object if it's effect is set to "none". If the sprite uses any other effect PasteDelete won't work right. It also won't work with TiledBackground or Canvas objects either.

Just give whatever object you want to delete from the canvas a "destination out" effect before pasting it.
B
79
S
24
G
54
Posts: 4,746
Reputation: 40,755

PreviousNext

Return to Completed Addons

Who is online

Users browsing this forum: No registered users and 5 guests