Firefox 20.0.1 seems to break vn-canvas

[GoogleCodeExporter]

What steps will reproduce the problem?
1.upgrade firefox from 19 to 20 
2.try the demo 

What is the expected output? What do you see instead?
The demo as usal :-)
No image except the actors appear ( no scene, no buttons, ... )

What version of the product are you using? On what operating system?
Windows 7, Linux Mint 14 + KDE, Firefox 20.0.1

Please provide any additional information below.
Since Firefox 20.0.1 the following warnings (not appearing before) are shot in 
the console when one would expect the graphical element to be displayed:
canvas: an attempt to set strokeStyle or fillStyle to a value that is neither a 
string, a CanvasGradient, or a CanvasPattern was ignored.
file:///home/guillermo/Projects/vncanvas-0.4.1/templates/vncanvas-0.4.js
Line 3459

Original issue reported on code.google.com by gfern...@kunagi.com on 14 Apr 2013 at 6:30

[GoogleCodeExporter]

Using this.context.createPattern(this.image, 'no-repeat') when this.image is an 
image fixes it somewhat.
Seems fillStyle has become intolerant and requires a pattern as a style not 
accepting images anymore

Original comment by gfern...@kunagi.com on 14 Apr 2013 at 7:17

[GoogleCodeExporter]

Silly of me!!!!
replacing the following tests
3453 if ((this.image.constructor == HTMLImageElement) || 
(this.image.constructor == Image)) {
by
if ((this.image instanceof HTMLImageElement) || (this.image instanceof Image)) {
Fixes it. 
Same in 3816

I didn't test it yet outside of Firefox 20.0.1 though

Original comment by gfern...@kunagi.com on 14 Apr 2013 at 7:32

[GoogleCodeExporter]

Hi gfernand,

Thanks for the feedback. And sorry for late reply (I have my hands full with 
work).
Will check the issues and update the engine as per your recommendation.

Original comment by oclabbao on 20 Apr 2013 at 1:43

[GoogleCodeExporter]

Hmmm... strange, I tried on FF 20.0.1 and there seems no issue for me, i.e. 
scenes, buttons appear normally. Used on WinXP though, will try on Win7 next.

As for the fix, since it doesn't appear to do any harm, I suggest keeping both 
conditions (constructor and instanceof) on the same "if" statement. This is to 
maximize compatibility with older and/or other browsers.

Thanks!

Original comment by oclabbao on 20 Apr 2013 at 2:17

[GoogleCodeExporter]

Hello,
welcome :-). Had the issue on Win7 and Linux. It doesn't harm on Chromium.
Your approach to keep both is certainly the right one :-).
By the way, good job, I like vn-canvas. I'm having fun making an interactive 
CV actually.

Regards, G.

On Saturday, April 20, 2013 02:17:20 AM you wrote:

Original comment by gfern...@kunagi.com on 21 Apr 2013 at 7:01

[GoogleCodeExporter]

READ THIS it is very IMPORTANT!!!
It may happen to you this.
If you are using a library like JQuery or so, they do bad thing setting 
properties
In the case of color, width an other cases when in the chain is obtained by a 
library
the result is a function not a value, even when you read it as a value
I have inspected objects and they do that

So all you have to do is casting with the value

var b1 = Boolean(“”); //false – empty string

var b2 = Boolean(“hi”); //true – non-empty string

var b3 = Boolean(100); //true – non-zero number

var b4 = Boolean(null); //false - null

var b5 = Boolean(0); //false - zero

var b6 = Boolean(new Object()); //true – object

ctx.fillStyle = String(value);

And that maybe the case with other properties

Example you may check

$(element).width(200);

you read direct

element.width and get 200

but pass to an inspector and see

element.width = function(){return 200}

so when you use  in some application

myW = element.width

instead trying to be myW 200 it tries to be =function(){..bla}
the application detects that and says is not valid value

Original comment by archivo....@gmail.com on 6 May 2013 at 2:05

[GoogleCodeExporter]

Hi archivo,

Thanks for the info. I'll keep an eye out for those issues. Though vn-canvas 
only use jquery for debug. It's not needed for normal operation and can be done 
away with.

Original comment by oclabbao on 6 May 2013 at 5:13

[GoogleCodeExporter]

Original comment by oclabbao on 22 May 2013 at 3:27

• Changed state: Accepted