Re: [Xsltforms-support] AVT for SVG

SourceForge Headquarters 225 Broadway Suite 1600 San Diego, CA 92101 +1 (858) 422-6466

Alain,

Found another bug. For the following page, I'm getting an error "Object
#<Text> has no method "getAttribute", apparently triggered off the <text>
element below:

The web page is:

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms">
<head>
<title>Trig Functions</title>
<xf:model>
<xf:instance id="state">
    <state xmlns="">
        <angle>0</angle>
    </state>
</xf:instance>
</xf:model>
<script type="text/javascript"><![CDATA[
var trig = function(op,angle){
    return Math[op](3.14159 * angle / 180).toFixed(4);
    };
]]></script>
</head>
<body>
<div>
<table>
<tr>
<th>Angle</th>
<th>sin()</th>
<th>cos()</th>
<th>tan()</th>
</tr>
<tr>
<td><xf:input ref="angle" incremental="true"/></td>
<td><xf:output value="trig('sin',angle)"/></td>
<td><xf:output value="trig('cos',angle)"/></td>
<td><xf:output value="trig('tan',angle)"/></td>
</tr>
</table>
</div>
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
    <circle r="100" cx="100" cy="100" fill="white" stroke="black"
stroke-width="2"/>
    <g transform="translate(100,100)">
        <path d="M0,0 L0,-80z M0,0
L{80*trig('sin',angle)},{-80*trig('cos',angle)}z" stroke="black"
stroke-width="4"/>
        <g>
        <text>Test</text>
        </g>
    </g>
</svg>
</body>
</html>

Kurt Cagle
Invited Expert, XForms Working Group, W3C
Managing Editor, XMLToday.org
kur...@gm...
443-837-8725

On Thu, Mar 1, 2012 at 4:39 PM, Kurt Cagle <kur...@gm...> wrote:

> Alain,
>
> Much thanks!
>
> Kurt Cagle
> Invited Expert, XForms Working Group, W3C
> Managing Editor, XMLToday.org
> kur...@gm...
> 443-837-8725
>
>
>
>
> On Thu, Mar 1, 2012 at 4:17 PM, Alain Couthures <
> ala...@ag...> wrote:
>
>>  Kurt,
>>
>> I didn't test before AVT for SVG and I discovered that the DOM API is not
>> exactly the same for SVG as for HTML.
>>
>> I fixed issues about classes and about children vs childNodes.
>>
>> So now it works for rev.533 with your example in which I added
>> style="overflow:hidden" for IE9.
>>
>> Thank you for your feedbacks!
>>
>> -Alain
>>
>> Le 29/02/2012 18:44, Kurt Cagle a écrit :
>>
>> Alain,
>>
>>  Just wanted to say that I've downloaded and been testing the new AVT
>> and JS changes to xsltforms and have only two words: *This ROCKS!!!!*
>>
>>  I think this will have a *profound* impact upon how applications are
>> built with XForms and XSLTForms.
>>
>>  The only downside I've seen thus far is that trying to work with
>> embedded SVG is generating significant errors. The following illustrates
>> this:
>>
>>  (
>> xdmp:set-response-content-type("text/xml"),
>> processing-instruction {"xml-stylesheet"} {'type="text/xsl"
>> href="/lib/xsltforms/xsltforms.xsl"'},
>> <html xmlns="http://www.w3.org/1999/xhtml"
>> xmlns:xf="http://www.w3.org/2002/xforms">
>>  <head>
>> <title>Background Colors</title>
>> <xf:model>
>> <xf:instance id="colors">
>> <colors xmlns="">
>> <color name="Blue" code="#0000FF" size="100"/>
>> <color name="Green" code="#00FF00" size="120"/>
>> <color name="Olive" code="#808000" size="150"/>
>> <color name="Orange" code="#F87A17" size="90"/>
>> <color name="Pink" code="#FFC0CB" size="200"/>
>> <color name="Purple" code="#800080" size="80"/>
>> <color name="Red" code="#FF0000" size="150"/>
>> <color name="Yellow" code="#FFFF00" size="200"/>
>> </colors>
>> </xf:instance>
>> <xf:instance id="state">
>>     <state xmlns="">
>>         <color>#0000FF</color>
>>     </state>
>> </xf:instance>
>> </xf:model>
>> </head>
>> <body>
>>
>>  <xf:select1 ref="instance('state')/color">
>>     <xf:itemset nodeset="instance('colors')//color">
>>         <xf:label ref="@name"/>
>>         <xf:value ref="@code"/>
>>     </xf:itemset>
>> </xf:select1>
>> <input type="text" value="{{instance('state')/*:color}}"
>> style="color:{{instance('state')/*:color}}"></input>
>> <div
>>  style="background-color:{{instance('state')/color}};width:{{instance('colors')/color[@code=instance('state')/color]/@size}}px;height:50px;">
>> This is a test.</div>
>> <svg width="300" height="300" xmlns="http://www.w3.org/2000/svg">
>>     <circle
>> r="{{instance('colors')/color[@code=instance('state')/color]/@size}}"
>> cx="50" cy="50" fill="red"/>
>> </svg>
>> </body>
>> </html>)
>>
>>  Given that AVT just landed, this is not surprising, just wanted to let
>> you know. However, other than that issue, I'm having a blast playing with
>> this.
>>
>>
>> On Wed, Feb 29, 2012 at 12:06 PM, Leigh L. Klotz, Jr. <
>> Lei...@xe...> wrote:
>>
>>> Please respond with corrections.
>>> Please start new threads for discussion.
>>>
>>>
>>
>>
>