xforms:output mediatype="text/html" and canvas element?

classic Classic list List threaded Threaded
4 messages Options
Reply | Threaded
Open this post in threaded view
|

xforms:output mediatype="text/html" and canvas element?

fl.schmitt(ops-users)
Hi all,

i'm trying to display some html content using a xforms:output
mediatype="text/html" control. The html contains a canvas element that's
already supported by firefox and likely part of HTML5. Embedding the
canvas element in static html works, but in the output of the
xforms:output control the canvas element is missing. Do i have to
declare the canvas element as valid content anywhere? I've put it into
orbeon-resources-private.jar/orbeon/xforms/clean-html.xsl, but this
doesn't seem to help. Any other way to get the canvas element into
xforms:output output? Is there any filter applied to the content of
xforms:output@mediatype="text/html" that needs modification?

TIA
florian

PS: Some days before, i wrote some lines about xforms:submit inside
fr:tabview - any news on this?



--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
Reply | Threaded
Open this post in threaded view
|

Re: xforms:output mediatype="text/html" and canvas element?

fl.schmitt(ops-users)
I've attached a test xforms page to demonstrate the problem - it
contains two instances with html content and canvas elements and some
attempts to render that html content using xforms:output. To check if
the canvas element works, the xhtml:body contains some plain html
content including similar canvas elements and some javascript to make
firefox render the canvas elements.

Using a newer firefox version, the canvas elements that are "hard-coded"
in the html body are displayed correctly, but those which should be
included in the xforms:output seem to be stripped from the output.

The test won't work with IE, i think, because canvas is still a
proprietary element. I've modified ops/xforms/clean-html.xsl, adding the
canvas element to the list of "safe" elements; also, modifying tagsoup
to let custom tags pass didn't help.

It would be great if anyone could help! Because of a recent update,
firefox doesn't allow inserting custom elements using the insertHtml
function any more. The canvas element would be an perfect replacement
for a certain custom tag i used up to now in my app, but i can't update
my app until orbeon supports displaying the canvas element in
xforms:output....

TIA
florian


Canvas Test <div> <p>First canvas: <canvas id="rd21" /></p> <p>Second canvas <canvas id="rd33333" /></p> </div>

First canvas:

Second canvas

Canvas-Test First canvas: Second canvas XForms - escaped test1 - value - saxon:parse test2 - value - no mediatype test3 - ref - no mediatype test4 - value - xxforms:serialize test5 - ref - mediatype XForms 2 - unescaped test1 - value - saxon:parse test2 - value - no mediatype test3 - ref - no mediatype test4 - value - xxforms:serialize test5 - ref - mediatype var myKontext; var myId; var width; var myText var len; var x; var y; var canv = document.getElementsByTagName("canvas"); for ( var int = 0; int < canv.length; int++) { myKontext = canv[int].getContext("2d"); myId = canv[int].getAttribute("id"); myText = 'canvas with ID ' + myId; // passe Canvas-Größe an Text-Inhalt an len = myKontext.measureText(myText).width; width = canv[int].width = len + 24 canv[int].height = 18 // Textposition: aus Mitte bzw von unten verschoben wg. Schatten x = (width-len) / 2; y = canv[int].height - 4; // gelber Hintergrund myKontext.fillStyle = "lightblue"; myKontext.fillRect(0,0,width,18); // schreibe Inhalt myKontext.fillStyle = "black"; myKontext.fillText(myText, x, y); }


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
Reply | Threaded
Open this post in threaded view
|

Re: Re: xforms:output mediatype="text/html" and canvas element?

Alessandro  Vernet
Administrator
Hi Florian,

Sorry for the delay with this response! I hope you will still get
this, and that it is not too late for us to help. The clean-html.xsl
is only used in "input", when the <xforms:textarea
mediatype="text/html"> receives content from the browser:

http://wiki.orbeon.com/forms/doc/developer-guide/xforms-controls#TOC-HTML-cleanup

So I am not sure why the <xhtml:canvas> wouldn't show. Your code was
pasted as is in your email, and the markup didn't make it. If this is
still an issue, could you resend your test case as an attachment?

Alex

On Thu, Sep 23, 2010 at 1:17 AM, Florian Schmitt
<[hidden email]> wrote:

> I've attached a test xforms page to demonstrate the problem - it
> contains two instances with html content and canvas elements and some
> attempts to render that html content using xforms:output. To check if
> the canvas element works, the xhtml:body contains some plain html
> content including similar canvas elements and some javascript to make
> firefox render the canvas elements.
>
> Using a newer firefox version, the canvas elements that are "hard-coded"
> in the html body are displayed correctly, but those which should be
> included in the xforms:output seem to be stripped from the output.
>
> The test won't work with IE, i think, because canvas is still a
> proprietary element. I've modified ops/xforms/clean-html.xsl, adding the
> canvas element to the list of "safe" elements; also, modifying tagsoup
> to let custom tags pass didn't help.
>
> It would be great if anyone could help! Because of a recent update,
> firefox doesn't allow inserting custom elements using the insertHtml
> function any more. The canvas element would be an perfect replacement
> for a certain custom tag i used up to now in my app, but i can't update
> my app until orbeon supports displaying the canvas element in
> xforms:output....
>
> TIA
> florian
>
>
> Canvas Test <div> <p>First canvas: <canvas id="rd21" /></p> <p>Second canvas <canvas id="rd33333" /></p> </div>
>
> First canvas:
>
> Second canvas
>
> Canvas-Test First canvas: Second canvas XForms - escaped test1 - value - saxon:parse test2 - value - no mediatype test3 - ref - no mediatype test4 - value - xxforms:serialize test5 - ref - mediatype XForms 2 - unescaped test1 - value - saxon:parse test2 - value - no mediatype test3 - ref - no mediatype test4 - value - xxforms:serialize test5 - ref - mediatype var myKontext; var myId; var width; var myText var len; var x; var y; var canv = document.getElementsByTagName("canvas"); for ( var int = 0; int < canv.length; int++) { myKontext = canv[int].getContext("2d"); myId = canv[int].getAttribute("id"); myText = 'canvas with ID ' + myId; // passe Canvas-Größe an Text-Inhalt an len = myKontext.measureText(myText).width; width = canv[int].width = len + 24 canv[int].height = 18 // Textposition: aus Mitte bzw von unten verschoben wg. Schatten x = (width-len) / 2; y = canv[int].height - 4; // gelber Hintergrund myKontext.fillStyle = "lightblue"; myKontext.fillRect(0,0,width,18); // schreibe Inhalt myKontext.fillStyle = "black"; myKontext.fillText(myText, x, y); }
>
> --
> You receive this message as a subscriber of the [hidden email] mailing list.
> To unsubscribe: mailto:[hidden email]
> For general help: mailto:[hidden email]?subject=help
> OW2 mailing lists service home page: http://www.ow2.org/wws
>
>


--
Orbeon Forms - Web forms, open-source, for the Enterprise -
http://www.orbeon.com/
My Twitter: http://twitter.com/avernet


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Reply | Threaded
Open this post in threaded view
|

Re: Re: Re: xforms:output mediatype="text/html" and canvas element?

fl.schmitt(ops-users)
Hi Alessandro,

> So I am not sure why the <xhtml:canvas> wouldn't show. Your code was
> pasted as is in your email, and the markup didn't make it. If this is
> still an issue, could you resend your test case as an attachment?

thank you for your reply - i think the problem was caused by JTidy
stripping unknown elements. The patch that i've proposed later [1]
allows the declaration of "new" elements that JTidy won't touch. The
patch contains such a declaration regarding the canvas tag, and with
JTidy modified in that manner, the canvas example works fine.

But as Eric wrote [2], it's not quite efficient to (re-)load the JTidy
config file every time when htmlStringToDocument() is called, so i will
try to modify the patch as soon as possible.

florian

[1]
http://forge.ow2.org/tracker/index.php?func=detail&aid=315508&group_id=168&atid=350209
and
http://orbeon-forms-ops-users.24843.n4.nabble.com/RfE-Tagsoup-configuration-in-properties-local-xml-td2550129.html#a2718520

[2]
http://orbeon-forms-ops-users.24843.n4.nabble.com/RfE-Tagsoup-configuration-in-properties-local-xml-tp2550129p3005023.html


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws