[PLUGIN] Canvas

R0J0hound, I posted this in the General area, but then I thought you might want to address it here too...

I don't know if this has to do with your Plugin, but...

When I paste things into a blank canvas then spawn another canvas (during a Startup For Next Loop), It SEEMS like the new canvas is not blank like the original at startup. It is almost like the new one has the coppied Sprites in it...

CAPX: http://www.box.com/s/44f6c3b06132c4fe947c

Here's a small addition I have done to Canvas. The code is cleaner than what I send R0j0hound before, so I put here the archive.

If R0j0hound want to integrate it in the main branch, here's what I have done.

The code for the floodfilling is used from there http://www.williammalone.com/articles/html5-canvas-javascript-paint-bucket-tool/.

I also used the color.js helper from there http://www.phpied.com/rgb-color-parser-in-javascript/, because the algo uses the RGB value of a color, not a textual name (and there's no easy way to translate between the two in the HTML/JS world).

The code is pasted at the top of the runtime.js file. I added a "flood fill" action to the edittime.js, with the ID(22). It takes (x,y) and a color name as parameter. The floodfill is nearly instantaneous, but you must use images with clean edges !

You can see in the demo here how to do a "coloring book" app for kids.

(And you can see why you need a clean edges image !)

<img src="http://dl.dropbox.com/u/1412774/CanvasFloodFillDemo/demo.png" border="0">

The .capx :

http://dl.dropbox.com/u/1412774/CanvasFloodFillDemo/CanvasFloodFillDemo.capx

The demo : http://dl.dropbox.com/u/1412774/CanvasFloodFillDemo/index.html

The plugin : http://dl.dropbox.com/u/1412774/CanvasFloodFillDemo/canvas.modPode.0.1.zip

As always, when I add some code to someone's plugin, I don't claim anything on his realisation, you need to thanks the original author here, R0j0hound !

Thanks Pode! Hope to see that added by R0j0hound as I'm already using the Canvas plugin in several projects.

Do you think gradient fills would be difficult?

Thanks for all your work - to R0J0hound, and everyone else who has helped with input, etc. I was wondering if there was a way to control the time - to let the user watch the line being drawn on the screen.

This is exactly the function I'm looking for. Hope, that R0j0hound will incude it in R5.

Pode

Finally got around to reviewing your change. Your example wasn't working in Firefox, so I changed the color conversion to use another method.

Anyway updated the first post with R5.

R0J0hound : thanks for integrating it so quickly ! I remember know that I tested it on Chrome but don't remember if I tested it on Firefox, my bad.

Anyway, good news for everybody !

newt asked for it on IRC, and it took me only two minutes, so here's a quick modification I added to the Canvas plugin : Overlap/Collison, like the Sprite plugin. In fact, I copy/pasted the code from the OnCollision and OnOverlap from the Sprite plugin inside the Canvas plugin (really dirty, but I don't have a lot of time to test & debug it...)

<img src="http://dl.dropbox.com/u/1412774/canvasCollisionOverlap/demo.png" border="0">

The demo : http://dl.dropbox.com/u/1412774/canvasCollisionOverlap/index.html

The .capx : http://dl.dropbox.com/u/1412774/canvasCollisionOverlap/canvas_Collision_Overlap_demo.capx

The plugin : http://dl.dropbox.com/u/1412774/canvasCollisionOverlap/canvas_Collision_Overlap.zip

I don't know if R0j0hound has the time to integrate it into the main branch, so don't forget to backup you original Canvas plugin !

Canvas, my wmd of preference. :)

Just a heads up with Pode's build. Everything seems to work, with the exception that my game will not work in IE on Kongregate. It just gets to the html5 logo and stops, no load apparently.

Ive tested IE against another C2 game on Kongregate, and that game ran fine... fairly sure it didn't use Canvas.

Perhaps it's something to do with the Iframe, as the standard Html5 export runs fine in all browsers, including IE, with no webgl of course.

Also no idea if the collision build has anything to do with it, as testing different versions on Kongregate is problematic at best.

Also, also wmd means weapon of mass distraction.:P

OK

Found the culprit, and it was not Canvas!.

After gutting the game, pulling out all the questionable objects, Canvas, Particles, Webstorage, Audio......

Turns out it was something completely innocuous, you would think... Families...

Any way thumbs up, Canvas is good to go.    <img src="smileys/smiley17.gif" border="0" align="middle" />

Can someone share a capx with working "Floodfill canvas with color" demo?

Can someone share a capx with working "Floodfill canvas with color" demo?

If your having problems getting the floodfill canvas to work, try this-

instead of using a named color...ie-"red" or green"

Use the event-

Mouse - On left button Clicked on Canvas    

      Canvas-Fill canvas with color "rgb(10,100,100)" at (MouseX-Canvas.X,Mouse.Y-Canvas.Y)

I could not get it to work without this method.

WindowsXP sp3

It works fine, thanks chrisbrobs

Floodfilling possible bug - browser crash if I click fast multiple times.