Drawing using canvas tag and JQuery

[eddparsons]

Hi,

I'm trying to allow a user to draw on an Ebase form page.

This looks like it ought to be possible using JQuery and Sketch.js but I am running into an immediate issue of Ebase not rendering canvas tags.

Using the below code in a html file gives me a canvas with a border as expected, but adding this within a text control with html content ticked in Ebase shows nothing when run and just a small line in the designer.

<canvas></canvas>

Should this be possible and if so what am I doing wrong?

Edd

[Jon]

I don't know much about the canvas tag but don't you have to give it some dimensions. I tried it like this and it seemed to work ok:

Code: Select all

<canvas id="myCanvas" width="200" height="100" style="border&#58;1px solid #000000;">
Your browser does not support the HTML5 canvas tag.
</canvas>

[eddparsons]

Huh.

Something went wrong with my last post, the canvas tag I am using does have dimensions. Will try again with HTML disabled.

<canvas width="800" height="300" id="simple_sketch" style="border:1px solid #000000;"></canvas>

Edit: Tried your html Jon, all I see in Ebase is the "Your browser does not support the HTML5 canvas tag" text, no border and the dimensions are ignored. Using IE 11 and Ebase 4.5.4

Edit2: Works using Chrome. Some kind of an issue between Ebase and IE11?

[Jon]

You should see "Your browser does not support the HTML5 canvas tag." in the Ebase Designer, but you should see an empty box with a black border when you run the form.

[eddparsons]

Yes, that is what I get when running the form using Chrome, but not with IE11. It's odd because the same code in a html file outside of Ebase does display correctly in IE.

[Jon]

Can you make sure the document type is set to HTML5 in Form Properties (on the Presentation tab I think - I'm using a V5 system and it might have changed). On my system this doesn't make any difference with IE 11, but you might be using a different level.

[eddparsons]

Was set to default, have changed to HTML5 but hasn't made any difference.

[Jon]

The only way I can get IE 11 to display "Your browser does not support the HTML5 canvas tag" is to add the Ebase server host name (localhost) to the IE Compatibility View settings in the browser. Otherwise it always works.

[eddparsons]

That's the problem - I had 'Display intranet sites in compatability view' ticked. Turn that off and it displays correctly. Thanks Jon.