Ajax JavaScript CSS HTML 5 DOM

First Program

To write a XUL interface, you need for two things:
- A simple text editor.
- The Firefox browser who will display code XUL.

The code of a XUL graphic interface is composed of defined XML tags and JavaScript code to process events made by actions of user. Other elements, other formats could also be used, but we will see this later.

XUL code starts with a definition of a namespace with the xmlns property which is always the same one:

xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"

It a property of a window, which is created with the <window> tag.
That gives the following complete model:

<?xml version="1.0" encoding="iso-8859-1"?>
<window
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
</window>

Once defined this rather obscure model, one will re-use it by copy-paste and will not need more, in the first time at least to deal with what it means.

Displaying a text

Our first example will display simply the text "Hello the World!".
In this goal, it is necessary to place into the window we have created with the <window> tag, a textual component.

The component is the "description" tag and the text is assigned with the attribute "value" of this tag:

<description value= "Hello the World!"/>

The complete example

We give a identifier to the window

id="hello"

as well as dimensions with the attributes height and width:

width="300" 
height="300"
Thus finally:
<?xml version="1.0" encoding="iso-8859-1"?>
<window  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   id="hello"
   width="300"
   height="300"
>
    <description value="Hello the World!" />
</window>
Licence: (c) 2007 Xul.fr