W3C home > Mailing lists > Public > www-svg@w3.org > October 2003

Re: SVG-based Template via javascript

From: Fred P. <fprog26@hotmail.com>
Date: Mon, 06 Oct 2003 20:02:53 -0400
To: saschwarz@hotmail.com
Cc: www-svg@w3.org, svg-developers@yahoogroups.com
Message-ID: <BAY2-F1349aZ1i6bdVJ0001c609@hotmail.com>

XUL is like a XFORMS on speed, it defines many GUI element like
toolbar, button, listbox, window, splitter, label, tree, etc.

It would be good perhaps to have native XUL or XFORMS support for SVG.

The main problem with XUL is that it doesn't define any other "custom 

For instance, in SVG, you may want to draw a "pizza"
and that pizza might have attribute like:
- mushroom, pepper, cheeze, nb of peperonni

XUL cannot define such "objects".

The problem is that even if someone define what's a pizza in a given 
a new user say X might have a smaller or bigger or different definition,
for instance, for him a pizza might have bacon and oignons on it.

Since such definition is unpredictable, the problem reside is:
"How do I tell an SVG editor that I have here a <pizza>
that I want to resize, move, rotate it and change it's appearance or 

Now, let's assume we got a new object let say a book,
we want to draw a book in SVG. What does it look like, what are the 
properties, etc.

One way is to have special tags which define a custom "Book" template
with a list of properties and a reference to a bunch of javascript function
to manipulate it, transform it, changes it's attribute, etc.

Sincerely yours,

>Hi Fred
>I'm not sure this is directly related, but have you taken a look at XUL: 
>It appears to address some of these issues(?).
>>  Goals:
>>    - A pure XML based template declaration
>>    - SVG Editor with simple ecmascript can 'understand' these templates
>>      by using them as objects with parameters (or attributes or 
>>    - Parameters type can be typesafe, declared, with min/max/default 
>>values, etc.
>>    - An editor can therefore design objects parameter "editor" dialog
>>      using such information like IDL have done for OOP language.
>>    - An editor can drag, resize, move, create, delete these objects.
>>    - Fully descriptive
>>    - No need to invent any new language
>>    - SVG 1.0/1.1 can be supported using a proper ecmascript translator:
>>      left as an exercise shouldn't be too complicated to implement 
>>    - Need an XML standard on which all SVG editor 1.2 can rely on
>>      for describing unknown objects/figures/entities...
>><?xml version="1.0" encoding="iso-8859-1"?>
>>  width='1024' height='700' enableZoomAndPanControls='false'
>>  xmlns="http://www.w3.org/2000/svg"
>>  xmlns:f='http://xmlns.fred.com/'
>>  >
>>  <template xmlns='http://xmlns.fred.com/'
>>    name='user'
>>    function='drawUser(x,y,w,h,id,drag,child)'
>>    resize='resizeUser(node,w,h)'
>>    move='moveUser(node,x,y)'
>>    >
>>    <param name='x'     type='Integer' min='0' max='100' default='0'  />
>>    <param name='y'     type='Integer' min='0' max='100' default='0'  />
>>    <param name='w'     type='Integer' min='0' max='20'  default='10' />
>>    <param name='h'     type='Integer' min='0' max='20'  default='10' />
>>    <param name='id'    type='String'  min='0' max='80'  default='fred' />
>>    <param name='drag'  type='Boolean'                   default='false' 
>>    <param name='child' type='NodeList' empty='true'     default='null' />
>>  </template>
>>  <!-- Cannot be move or resize -->
>>  <template name='f:pizza' function='drawPizza(x,y)'>
>>    <param name='x'     type='Integer' min='0' max='100' default='0'  />
>>    <param name='y'     type='Integer' min='0' max='100' default='0'  />
>>  </template>
>><f:user  x='10' y='10' w='10' h='10'/>
>><f:pizza x='30' y='30'/>
>><script type='text/ecmascript'
>>function drawPizza(x,y) { return drawUser(x,y,10,10,'pizza',false,null); }
>>function resizeUser(node,w,h) { node.setAttribute( 'width', w ); 
>>node.setAttribute( 'height', h ); return node; }
>>function moveUser(node,w,h)   { node.setAttribute( 'x',     x ); 
>>node.setAttribute( 'y',      y ); return node; }
>>function drawUser(x,y,w,h,id,drag,child)
>>  var s = "<rect x='" + x + "' y='" + y + "' width='"+ w +"' height='"+ h 
>>  // Return an XML node
>>  return parseXML( s, document );
>>Comments, suggestions welcome.
>>Sincerely yours,

The new MSN 8: smart spam protection and 2 months FREE*  
Received on Monday, 6 October 2003 20:02:55 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 22:53:59 UTC