[PLUGIN] Canvas

Post your completed addons to share with the community

Post » Tue Jun 05, 2012 6:06 pm

Humm i really a novice but try add a update screen for browser where it doesn't seems to work (firefox have sometimes redraw bugs) and perhaps some tests with no webgl renderer ?

CHROME 19 ... flood work ... no real cpu/gpu activity increase but app crash (canvas plugin) after 10-20 flood.naelian2012-06-05 18:27:59
B
16
S
5
G
3
Posts: 298
Reputation: 5,240

Post » Tue Jun 05, 2012 6:32 pm

[QUOTE=naelian] Humm i really a novice but try add a update screen for browser where it doesn't seems to work (firefox have sometimes redraw bugs) and perhaps some tests with no webgl renderer ?

CHROME 19 ... flood work ... no real cpu/gpu activity increase but app crash (canvas plugin) after 10-20 flood.[/QUOTE]

I changed a couple settings and this version shows nearly 0% CPU usage.
(when previewing)

NEW

But it still wont work in Chrome from dropbox...it kills my CPU?

STRANGEchrisbrobs2012-06-05 18:35:02
B
19
S
6
G
7
Posts: 1,204
Reputation: 7,296

Post » Tue Jun 05, 2012 6:47 pm

Works better for me !, suggested you perhaps to change the process ... selecting area before (special effect on this area) and then choosing the color ... i have accuracing problem on a desktop pc so i can't imagine this app on mobile with "touch" unless providing a zoom feature. There is no undo process so when filling a area with the same color than another "nearest" area the 2 becomes one and it's the end ... perhaps it's the needed effect ?

Other thing really avoid spaces in folders and names using dropbox ... put some com plugins searching to identified the source to don't work. Sure it's not your actual problems but ...
naelian2012-06-05 19:08:51
B
16
S
5
G
3
Posts: 298
Reputation: 5,240

Post » Tue Jun 05, 2012 7:01 pm

[QUOTE=naelian] Works better for me !, suggested you perhaps to change the process ... selecting area before (special effect on this area) and then choosing the color ... i have accuracing problem on a desktop pc so i can't imagine this app on mobile with "touch" unless proving a zoom feature. There is no undo process so when filling a area with the same color than another "nearest" area the 2 becomes one and it's the end ... perhaps it's the needed effect ?

Other thing really avoid spaces in folders and names using dropbox ... put some com plugins searching to identified the source to don't work. Sure it's not your actual problems but ...
[/QUOTE]

A lot of the things you have pointed out, are possible !
But if i cant get it run in Chrome...I cant do any test's.
B
19
S
6
G
7
Posts: 1,204
Reputation: 7,296

Post » Tue Jun 05, 2012 7:07 pm

OK, it should not hang anymore when flood filling an area that was already that color. Also Chrome is working fine here.

I recommend using Canvas2d when using the plugin, it's faster. I don't have a system with webgl so I'm unable to correct issues with the webgl portion of the plugin.R0J0hound2012-06-05 19:09:18
B
79
S
24
G
52
Posts: 4,725
Reputation: 39,713

Post » Wed Jun 06, 2012 7:55 pm

Looking for help with ROJOHOUND CANVAS PLUGIN.

I came across a website that features various HTML5 CANVAS and SVG CANVAS experiments.

One project 'SVG to HTML5 Canvas Converter' lets you convert SVG TO Html5 canvasJavaScript function.

http://www.professorcloud.com/svg-to-canvas
----------------------------------------------------
I created the following image with SVG-edit-



The SVG code for this is-

<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg">
<!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
<g>
<title>Layer 1</title>
<rect ry="20" rx="20" id="svg_1" height="122" width="124" y="3.5" x="2" stroke-width="5" stroke="#000000" fill="#FF0000"/>
</g>
</svg>
----------------------------------------------------
After using the coverter-

The HTML5 Canvas JavaScript function is-

var draw = function(ctx) {
ctx.save();
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(128,0);
ctx.lineTo(128,128);
ctx.lineTo(0,128);
ctx.closePath();
ctx.clip();
ctx.strokeStyle = 'rgba(0,0,0,0)';
ctx.lineCap = 'butt';
ctx.lineJoin = 'miter';
ctx.miterLimit = 4;
ctx.save();
ctx.save();
ctx.restore();
ctx.save();
ctx.fillStyle = "#ff0000";
ctx.strokeStyle = "#000000";
ctx.lineWidth = 5;
ctx.beginPath();
ctx.moveTo(22,3.5);
ctx.lineTo(106,3.5);
ctx.quadraticCurveTo(126,3.5,126,23.5);
ctx.lineTo(126,105.5);
ctx.quadraticCurveTo(126,125.5,106,125.5);
ctx.lineTo(22,125.5);
ctx.quadraticCurveTo(2,125.5,2,105.5);
ctx.lineTo(2,23.5);
ctx.quadraticCurveTo(2,3.5,22,3.5);
ctx.closePath();
ctx.fill();
ctx.stroke();
ctx.restore();
ctx.restore();
ctx.restore();
};
-----------------------------------------------

Rojohound...Any chance you could post a example of the above code converted into a workable set of events for your canvas plugin?

Thanks in advance.chrisbrobs2012-06-06 19:56:41
B
19
S
6
G
7
Posts: 1,204
Reputation: 7,296

Post » Wed Jun 06, 2012 8:24 pm

@chrisbrobs
It's much simpler than what the converter spits out.
http://dl.dropbox.com/u/5426011/examples12/canvas_rounded_box.capxR0J0hound2012-06-06 20:24:46
B
79
S
24
G
52
Posts: 4,725
Reputation: 39,713

Post » Wed Jun 06, 2012 9:40 pm

Thanks Rojohound...solved my problem again!

Amazing plugin, learning new things everyday.

Got lots of ideas for apps games that can be made with it.

B
19
S
6
G
7
Posts: 1,204
Reputation: 7,296

Post » Wed Jun 27, 2012 2:58 am

Will this plugin work with Flashcanvas?

http://www.scirra.com/forum/flashcanvas-an-answer-for-nonhtml5-browsers_topic48639.html

I'm curious because I've built a small prototype that needs IE8 compatibility.
B
25
S
5
G
6
Posts: 18
Reputation: 5,154

Post » Mon Jul 09, 2012 11:04 am

I made a simple coloring book that uses Floodfill. It works, but is there a way to leave the black outlines intact (not to color outlines)?
B
109
S
6
G
6
Posts: 14
Reputation: 7,327

PreviousNext

Return to Completed Addons

Who is online

Users browsing this forum: No registered users and 5 guests