<![CDATA[ syntax error - newbie needs a clue

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

<![CDATA[ syntax error - newbie needs a clue

Martin-65
Im trying to learn SVG. I want to send out an html page with an
embedded SVG page in it.

The pages shown below work as expected (without errors) when viewed
with Internet Explorer but when using Firefox (ver 1.5), the
Javascript Console flags the line <![CDATA[ as being a syntax error.

Can someone tell me what's going on here?

Thanks.

--------------------------------------------------------
This is the html page:

<html>
<body>
<embed src='SVGPage1.svg' type='image/svg+xml'></embed>
<form name='InputForm'>

<input type='button' value='Green'
onclick="parent.window.changeFillColor('green');">

<input type='button' value='Red'
onclick="parent.window.changeFillColor('red');">
</form>
</body>
</html>

--------------------------------------------------------
And, this is SVGPage1.svg that's being "embedded":


<svg height="500px" width="500px" onload="Initialize(evt)"
xmlns="http://www.w3.org/2000/svg">

<script type="text/ecmascript">
<![CDATA[
SVGDocument = null;
top.changeFillColor = ChangeFillColor;

function Initialize(LoadEvent)
{
SVGDocument = LoadEvent.target.ownerDocument
}

function ChangeFillColor(color)
{
SVGDocument.getElementById("MSD103").setAttribute("fill", color);
}

]]>
</script>


<rect id="MSD103" x="50" y="130" width="100" height="25" fill="green"
stroke="black" stroke-width="2"/>

<text x="60" y="190" style="font-family: tahoma; font-size: 14pt;
stroke:none; fill:black;">MSD-103</text>

</svg>
       
_______________________________________________
Mozilla-svg mailing list
[hidden email]
http://mail.mozilla.org/listinfo/mozilla-svg
Reply | Threaded
Open this post in threaded view
|

Re: <![CDATA[ syntax error - newbie needs a clue

Gus Richter
Martin wrote:
> Im trying to learn SVG. I want to send out an html page with an
> embedded SVG page in it.
>
> The pages shown below work as expected (without errors) when viewed
> with Internet Explorer but when using Firefox (ver 1.5), the
> Javascript Console flags the line <![CDATA[ as being a syntax error.
>
> Can someone tell me what's going on here?

Thanks for that example. It will add another example to play with. I
also am trying to learn.

Testing with IE it does not work since I don't have Adobe installed.
Testing with Opera it does not work.
Testing it locally with Fx 1.5 works for me without an error message.

Aside: Try adding width and height attributes to embed - first as
width="500" height="350"  and then as  width="500" height="500"  and
note the different responses regarding vertical and horizontal scrollbars.

What is your reason for using embed instead of object?

--
Gus
_______________________________________________
Mozilla-svg mailing list
[hidden email]
http://mail.mozilla.org/listinfo/mozilla-svg
Reply | Threaded
Open this post in threaded view
|

Re: <![CDATA[ syntax error - newbie needs a clue

Jonathan Watt-2
In reply to this post by Martin-65
Hi Martin,

That works fine for me without errors. Here's another couple of demos you may
find useful for learning more about scripting across HTML/SVG docs:

   http://jwatt.org/svg/demos/scripting-across-embed.html
   http://jwatt.org/svg/demos/scripting-across-object.html

Regards,
Jonathan

Martin wrote:

> Im trying to learn SVG. I want to send out an html page with an
> embedded SVG page in it.
>
> The pages shown below work as expected (without errors) when viewed
> with Internet Explorer but when using Firefox (ver 1.5), the
> Javascript Console flags the line <![CDATA[ as being a syntax error.
>
> Can someone tell me what's going on here?
>
> Thanks.
>
> --------------------------------------------------------
> This is the html page:
>
> <html>
> <body>
> <embed src='SVGPage1.svg' type='image/svg+xml'></embed>
> <form name='InputForm'>
>
> <input type='button' value='Green'
> onclick="parent.window.changeFillColor('green');">
>
> <input type='button' value='Red'
> onclick="parent.window.changeFillColor('red');">
> </form>
> </body>
> </html>
>
> --------------------------------------------------------
> And, this is SVGPage1.svg that's being "embedded":
>
>
> <svg height="500px" width="500px" onload="Initialize(evt)"
> xmlns="http://www.w3.org/2000/svg">
>
> <script type="text/ecmascript">
> <![CDATA[
> SVGDocument = null;
> top.changeFillColor = ChangeFillColor;
>
> function Initialize(LoadEvent)
> {
> SVGDocument = LoadEvent.target.ownerDocument
> }
>
> function ChangeFillColor(color)
> {
> SVGDocument.getElementById("MSD103").setAttribute("fill", color);
> }
>
> ]]>
> </script>
>
>
> <rect id="MSD103" x="50" y="130" width="100" height="25" fill="green"
> stroke="black" stroke-width="2"/>
>
> <text x="60" y="190" style="font-family: tahoma; font-size: 14pt;
> stroke:none; fill:black;">MSD-103</text>
>
> </svg>
>
_______________________________________________
Mozilla-svg mailing list
[hidden email]
http://mail.mozilla.org/listinfo/mozilla-svg
Reply | Threaded
Open this post in threaded view
|

Re: <![CDATA[ syntax error - newbie needs a clue

Martin-65
Jonathan / Gus

Thanks for the feedback. I got it working.

It turns out that the problem was on the server side. I was not
sending out the proper header on the SVG page. When you both said it
worked ok for you, I looked in to how I was serving the page - guided
by the excellent information on your web pages, Jonathan.

You see, I'm not using an "ordinary" server. The pages I'm sending out
are part of an industrial process control system. I have a program
(that I've written in Visual basic) that has a web server built in to
it. I'm generating these pages much like a PHP script would generate
pages when running under a normal server (like IIS or Apache).

One of your web pages, Jonathan, mentioned that sometimes servers do
not send the correct header for svg pages. When I added the header
('content-type: image/svg+xml'), the embedded page worked like it
should in Firefox. For some reason, it worked OK in IE without the
correct header.

Now I'm in a position to learn some more about SVG.

Thanks again.

Martin


On Sat, 17 Dec 2005 09:33:33 +0000, Jonathan Watt
<[hidden email]> wrote:

>Hi Martin,
>
>That works fine for me without errors. Here's another couple of demos you may
>find useful for learning more about scripting across HTML/SVG docs:
>
>   http://jwatt.org/svg/demos/scripting-across-embed.html
>   http://jwatt.org/svg/demos/scripting-across-object.html
>
>Regards,
>Jonathan
>
>Martin wrote:
>> Im trying to learn SVG. I want to send out an html page with an
>> embedded SVG page in it.
>>
>> The pages shown below work as expected (without errors) when viewed
>> with Internet Explorer but when using Firefox (ver 1.5), the
>> Javascript Console flags the line <![CDATA[ as being a syntax error.
>>
>> Can someone tell me what's going on here?
>>
>> Thanks.
>>
>> --------------------------------------------------------
>> This is the html page:
>>
>> <html>
>> <body>
>> <embed src='SVGPage1.svg' type='image/svg+xml'></embed>
>> <form name='InputForm'>
>>
>> <input type='button' value='Green'
>> onclick="parent.window.changeFillColor('green');">
>>
>> <input type='button' value='Red'
>> onclick="parent.window.changeFillColor('red');">
>> </form>
>> </body>
>> </html>
>>
>> --------------------------------------------------------
>> And, this is SVGPage1.svg that's being "embedded":
>>
>>
>> <svg height="500px" width="500px" onload="Initialize(evt)"
>> xmlns="http://www.w3.org/2000/svg">
>>
>> <script type="text/ecmascript">
>> <![CDATA[
>> SVGDocument = null;
>> top.changeFillColor = ChangeFillColor;
>>
>> function Initialize(LoadEvent)
>> {
>> SVGDocument = LoadEvent.target.ownerDocument
>> }
>>
>> function ChangeFillColor(color)
>> {
>> SVGDocument.getElementById("MSD103").setAttribute("fill", color);
>> }
>>
>> ]]>
>> </script>
>>
>>
>> <rect id="MSD103" x="50" y="130" width="100" height="25" fill="green"
>> stroke="black" stroke-width="2"/>
>>
>> <text x="60" y="190" style="font-family: tahoma; font-size: 14pt;
>> stroke:none; fill:black;">MSD-103</text>
>>
>> </svg>
>>

_______________________________________________
Mozilla-svg mailing list
[hidden email]
http://mail.mozilla.org/listinfo/mozilla-svg