r19141: add a reasonable subset of the qooxdoo runtime environment, and example applications

(This used to be commit ff28ab7314ff1eebcd62f387678b816091af8121)
author: Derrell Lipman <derrell@samba.org> 2006-10-06 15:40:18 +0000
committer: Gerald (Jerry) Carter <jerry@samba.org> 2007-10-10 14:20:40 -0500
commit: 10c06a1968dbf39d8a3790077a3537b8323f36ff (patch)
tree: f7389aac531dfe7c0d538879bdbd15cca33156e4 /swat/apps/qooxdoo-examples/example
parent: 77fc14c0818498e277a79196fa4f6e15f4b607b1 (diff)
download: samba-10c06a1968dbf39d8a3790077a3537b8323f36ff.tar.gz
samba-10c06a1968dbf39d8a3790077a3537b8323f36ff.tar.bz2
samba-10c06a1968dbf39d8a3790077a3537b8323f36ff.zip
63 files changed, 6795 insertions, 0 deletions
diff --git a/swat/apps/qooxdoo-examples/example/Atom_1.html b/swat/apps/qooxdoo-examples/example/Atom_1.html
new file mode 100644
index 0000000000..4dff79cf3d
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Atom_1.html
@@ -0,0 +1,73 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>qx.ui.basic.Atom is the parent class for buttons, menu entries, icons, checkboxes. While you can do,
+    you usually don't have to instantiate qx.ui.basic.Atom directly.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    // test no1
+    var nl1 = new qx.ui.basic.Atom("Test #1", "icon/16/reload.png", 16, 16);
+    nl1.setTop(48);
+    nl1.setLeft(20);
+    nl1.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+    nl1.setBackgroundColor(new qx.renderer.color.Color("white"));
+    nl1.setPadding(4);
+    d.add(nl1);
+
+    // test no2
+    var nl2 = new qx.ui.basic.Atom("Test #2");
+    nl2.setTop(48);
+    nl2.setLeft(120);
+    nl2.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+    nl2.setBackgroundColor(new qx.renderer.color.Color("white"));
+    nl2.setPadding(4);
+    d.add(nl2);
+
+    // test no3
+    var nl3 = new qx.ui.basic.Atom(null, "icon/16/reload.png");
+    nl3.setTop(48);
+    nl3.setLeft(200);
+    nl3.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+    nl3.setBackgroundColor(new qx.renderer.color.Color("white"));
+    nl3.setPadding(4);
+    d.add(nl3);
+
+    // test no4
+    var nl4 = new qx.ui.basic.Atom("<span style='font-size:14px'>Some great HTML</span><br/>for <b>you</b>", "icon/32/reload.png");
+    nl4.setTop(48);
+    nl4.setLeft(250);
+    nl4.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+    nl4.setBackgroundColor(new qx.renderer.color.Color("white"));
+    nl4.setPadding(4);
+    d.add(nl4);
+
+    // test no5
+    var nl5 = new qx.ui.basic.Atom(qx.util.Textile.textilize("*File Information*:\nJPEG-Photo\nCreated: 01/03/05"), "icon/48/icons.png");
+    with(nl5)
+    {
+      setTop(200);
+      setLeft(20);
+      setBorder(qx.renderer.border.BorderPresets.getInstance().outset);
+      setPadding(3, 6);
+    };
+    d.add(nl5);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/Atom_2.html b/swat/apps/qooxdoo-examples/example/Atom_2.html
new file mode 100644
index 0000000000..db698a7232
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Atom_2.html
@@ -0,0 +1,172 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Some more complex tests for qx.ui.basic.Atom.</p>
+    <p>You can change all the properties before "really creating" the object or any time after this was done.</p>
+  </div>
+
+  <div style="display:none" id="control">
+    <p>
+      Width:
+      <a href="javascript://" onclick="void(at1.setWidth(null))">null</a> |
+      <a href="javascript://" onclick="void(at1.setWidth('auto'))">auto</a> |
+      <a href="javascript://" onclick="void(at1.setWidth(25))">25</a> |
+      <a href="javascript://" onclick="void(at1.setWidth(50))">50</a> |
+      <a href="javascript://" onclick="void(at1.setWidth(100))">100</a> |
+      <a href="javascript://" onclick="void(at1.setWidth(200))">200</a>
+    </p>
+    <p>
+      Height:
+      <a href="javascript://" onclick="void(at1.setHeight(null))">null</a> |
+      <a href="javascript://" onclick="void(at1.setHeight('auto'))">auto</a> |
+      <a href="javascript://" onclick="void(at1.setHeight(25))">25</a> |
+      <a href="javascript://" onclick="void(at1.setHeight(50))">50</a> |
+      <a href="javascript://" onclick="void(at1.setHeight(100))">100</a> |
+      <a href="javascript://" onclick="void(at1.setHeight(200))">200</a>
+    </p>
+    <hr/>
+    <p>
+      Label Size:
+      <a href="javascript://" onclick="void(at1.setLabel(null))">null</a> |
+      <a href="javascript://" onclick="void(at1.setLabel('short'))">short</a> |
+      <a href="javascript://" onclick="void(at1.setLabel('some cool label'))">medium</a> |
+      <a href="javascript://" onclick="void(at1.setLabel('ultra long label description'))">long</a> |
+      <a href="javascript://" onclick="void(at1.setLabel('<b>hello <i>world</i></b>'))">html</a> |
+      <a href="javascript://" onclick="void(at1.setLabel('<p>Hello tester.</p><ul><li>cool</li><li><b>test</b></li><li>file</li></ul>'))">complex</a>
+    </p>
+    <p>
+      Icon Size:
+      <a href="javascript://" onclick="void(at1.setIcon(null))">null</a> |
+      <a href="javascript://" onclick="void(at1.setIcon('icon/16/date.png'))">16px</a> |
+      <a href="javascript://" onclick="void(at1.setIcon('icon/32/colors.png'))">32px</a> |
+      <a href="javascript://" onclick="void(at1.setIcon('icon/48/memory.png'))">48px</a>
+    </p>
+    <p>
+      Icon Position:
+      <a href="javascript://" onclick="void(at1.setIconPosition('top'))">top</a> |
+      <a href="javascript://" onclick="void(at1.setIconPosition('right'))">right</a> |
+      <a href="javascript://" onclick="void(at1.setIconPosition('bottom'))">bottom</a> |
+      <a href="javascript://" onclick="void(at1.setIconPosition('left'))">left</a>
+    </p>
+    <p>
+      Spacing:
+      <a href="javascript://" onclick="void(at1.setSpacing(0))">0</a> |
+      <a href="javascript://" onclick="void(at1.setSpacing(2))">2</a> |
+      <a href="javascript://" onclick="void(at1.setSpacing(4))">4</a> |
+      <a href="javascript://" onclick="void(at1.setSpacing(6))">6</a> |
+      <a href="javascript://" onclick="void(at1.setSpacing(8))">8</a> |
+      <a href="javascript://" onclick="void(at1.setSpacing(10))">10</a> |
+      <a href="javascript://" onclick="void(at1.setSpacing(25))">25</a> |
+      <a href="javascript://" onclick="void(at1.setSpacing(50))">50</a>
+    </p>
+    <hr/>
+    <p>
+      Show:
+      <a href="javascript://" onclick="void(at1.setShow('none'))">None</a> |
+      <a href="javascript://" onclick="void(at1.setShow('label'))">Label</a> |
+      <a href="javascript://" onclick="void(at1.setShow('icon'))">Icon</a> |
+      <a href="javascript://" onclick="void(at1.setShow('both'))">Both</a>
+    </p>
+    <hr/>
+    <p>
+      Horizontal Children Align:
+      <a href="javascript://" onclick="void(at1.setHorizontalChildrenAlign('left'))">left</a> |
+      <a href="javascript://" onclick="void(at1.setHorizontalChildrenAlign('center'))">center</a> |
+      <a href="javascript://" onclick="void(at1.setHorizontalChildrenAlign('right'))">right</a>
+    </p>
+    <p>
+      Vertical Children Align:
+      <a href="javascript://" onclick="void(at1.setVerticalChildrenAlign('top'))">top</a> |
+      <a href="javascript://" onclick="void(at1.setVerticalChildrenAlign('middle'))">middle</a> |
+      <a href="javascript://" onclick="void(at1.setVerticalChildrenAlign('bottom'))">bottom</a>
+    </p>
+    <hr/>
+    <p>
+      Padding:
+      <a href="javascript://" onclick="void(at1.setPadding(null))">None</a> |
+      <a href="javascript://" onclick="void(at1.setPadding(2, 4))">2, 4</a> |
+      <a href="javascript://" onclick="void(at1.setPadding(4, 8))">4, 8</a> |
+      <a href="javascript://" onclick="void(at1.setPadding(16))">16</a>
+    </p>
+    <p>
+      Border:
+      <a href="javascript://" onclick="void(at1.setBorder(null))">null</a> |
+      <a href="javascript://" onclick="void(at1.setBorder(new qx.renderer.border.Border(1, 'solid', 'black')))">1</a> |
+      <a href="javascript://" onclick="void(at1.setBorder(new qx.renderer.border.Border(5, 'solid', 'black')))">5</a> |
+      <a href="javascript://" onclick="void(at1.setBorder(new qx.renderer.border.Border(10, 'solid', 'black')))">10</a> |
+      <a href="javascript://" onclick="void(at1.setBorder(new qx.renderer.border.Border(25, 'solid', 'black')))">25</a> |
+      <a href="javascript://" onclick="void(at1.setBorder(qx.renderer.border.BorderPresets.getInstance().outset))">outset</a> |
+      <a href="javascript://" onclick="void(at1.setBorder(qx.renderer.border.BorderPresets.getInstance().inset))">inset</a>
+    </p>
+    <hr/>
+    <p>
+      Opacity:
+      <a href="javascript://" onclick="void(at1.setOpacity(null))">null</a> |
+      <a href="javascript://" onclick="void(at1.setOpacity(0))">0</a> |
+      <a href="javascript://" onclick="void(at1.setOpacity(0.25))">0.25</a> |
+      <a href="javascript://" onclick="void(at1.setOpacity(0.5))">0.5</a> |
+      <a href="javascript://" onclick="void(at1.setOpacity(0.75))">0.75</a> |
+      <a href="javascript://" onclick="void(at1.setOpacity(1))">1</a>
+    </p>
+    <p>
+      Enabled:
+      <a href="javascript://" onclick="void(at1.setEnabled(false))">false</a> |
+      <a href="javascript://" onclick="void(at1.setEnabled(true))">true</a>
+    </p>
+  </div>
+
+  <script type="text/javascript">
+  var at1;
+
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    at1 = new qx.ui.basic.Atom("My first qx.ui.basic.Atom", "icon/32/colors.png");
+
+    with(at1)
+    {
+      setTop(48);
+      setLeft(20);
+
+      setIconPosition("right");
+
+      setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+      setBackgroundColor(new qx.renderer.color.Color("white"));
+      setPadding(2, 4);
+    };
+
+    var ct1 = new qx.ui.basic.Label(document.getElementById("control").innerHTML);
+
+    with(ct1)
+    {
+      setWidth(300);
+      setRight(335);
+
+      setHeight(null);
+      setTop(48);
+      setBottom(48);
+
+      setOverflow("auto");
+
+      setBackgroundColor(new qx.renderer.color.Color("white"));
+      setBorder(qx.renderer.border.BorderPresets.getInstance().groove);
+      setPadding(10);
+    };
+
+    d.add(at1, ct1);
+  });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Atom_3.html b/swat/apps/qooxdoo-examples/example/Atom_3.html
new file mode 100644
index 0000000000..4a5db8e9bf
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Atom_3.html
@@ -0,0 +1,39 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Testing the new flash support for qx.ui.basic.Atom</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+      var a;
+
+      for (var i=1; i<11; i++)
+      {
+        var a = new qx.ui.basic.Atom("Flash Atom #" + i, "icon/16/reload.png", 16, 16, "./image/flash/color/file" + i + ".swf");
+
+        a.setTop(48 + ((i-1)*30));
+        a.setLeft(20);
+        a.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+        a.setBackgroundColor(new qx.renderer.color.Color("white"));
+        a.setPadding(4);
+
+        d.add(a);
+      };
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ButtonView_1.html b/swat/apps/qooxdoo-examples/example/ButtonView_1.html
new file mode 100644
index 0000000000..d50caeb5c5
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ButtonView_1.html
@@ -0,0 +1,89 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>qx.ui.pageview.buttonview.ButtonView implementation</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var bs = new qx.ui.pageview.buttonview.ButtonView;
+
+      bs.setLocation(20, 48);
+      bs.setRight(335);
+      bs.setBottom(48);
+
+      var bsb1 = new qx.ui.pageview.buttonview.ButtonViewButton("Display", "icon/32/display.png");
+      var bsb2 = new qx.ui.pageview.buttonview.ButtonViewButton("Penguin", "icon/32/penguin.png");
+      var bsb3 = new qx.ui.pageview.buttonview.ButtonViewButton("Colors", "icon/32/colors.png");
+      var bsb4 = new qx.ui.pageview.buttonview.ButtonViewButton("Icons", "icon/32/icons.png");
+      var bsb5 = new qx.ui.pageview.buttonview.ButtonViewButton("Paint", "icon/32/paint.png");
+      var bsb6 = new qx.ui.pageview.buttonview.ButtonViewButton("Applications", "icon/32/run.png");
+      var bsb7 = new qx.ui.pageview.buttonview.ButtonViewButton("System", "icon/32/control-center.png");
+
+      bsb1.setChecked(true);
+
+      bs.getBar().add(bsb1, bsb2, bsb3, bsb4, bsb5, bsb6, bsb7);
+
+      var p1 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb1);
+      var p2 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb2);
+      var p3 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb3);
+      var p4 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb4);
+      var p5 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb5);
+      var p6 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb6);
+      var p7 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb7);
+
+      bs.getPane().add(p1, p2, p3, p4, p5, p6, p7);
+
+      var f1 = new qx.ui.form.TextField("Display Input");
+      var f2 = new qx.ui.form.TextField("Penguin Input");
+      var f3 = new qx.ui.form.TextField("Colorize Input");
+      var f4 = new qx.ui.form.TextField("Icons Input");
+      var f5 = new qx.ui.form.TextField("Paint Input");
+      var f6 = new qx.ui.form.TextField("Applications Input");
+      var f7 = new qx.ui.form.TextField("System Input");
+
+      p1.add(f1);
+      p2.add(f2);
+      p3.add(f3);
+      p4.add(f4);
+      p5.add(f5);
+      p6.add(f6);
+      p7.add(f7);
+
+      var r1 = new qx.ui.form.RadioButton("Top", "top", null, true);
+      var r2 = new qx.ui.form.RadioButton("Right", "right");
+      var r3 = new qx.ui.form.RadioButton("Bottom", "bottom");
+      var r4 = new qx.ui.form.RadioButton("Left", "left");
+
+      r1.setTop(50);
+      r2.setTop(70);
+      r3.setTop(90);
+      r4.setTop(110);
+
+      p1.add(r1, r2, r3, r4);
+
+      var rm = new qx.manager.selection.RadioManager(null, [r1, r2, r3, r4]);
+
+      rm.addEventListener("changeSelected", function(e) {
+        bs.setBarPosition(e.getData().getValue());
+      });
+
+      d.add(bs);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ButtonView_2.html b/swat/apps/qooxdoo-examples/example/ButtonView_2.html
new file mode 100644
index 0000000000..d7acf86cd5
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ButtonView_2.html
@@ -0,0 +1,98 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Yet Another qx.ui.pageview.buttonview.ButtonView Example</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var bs = new qx.ui.pageview.buttonview.ButtonView;
+      bs.set({ left: 20, top: 48, right: 335, bottom: 48 });
+      bs.setBarPosition("left");
+
+      var bsb1 = new qx.ui.pageview.buttonview.ButtonViewButton("Display", "icon/16/display.png");
+      var bsb2 = new qx.ui.pageview.buttonview.ButtonViewButton("Organizer", "icon/16/organizer.png");
+      var bsb3 = new qx.ui.pageview.buttonview.ButtonViewButton("Colorize", "icon/16/colors.png");
+      var bsb4 = new qx.ui.pageview.buttonview.ButtonViewButton("Icons", "icon/16/icons.png");
+      var bsb5 = new qx.ui.pageview.buttonview.ButtonViewButton("Paint", "icon/16/paint.png");
+      var bsb6 = new qx.ui.pageview.buttonview.ButtonViewButton("Applications", "icon/16/run.png");
+      var bsb7 = new qx.ui.pageview.buttonview.ButtonViewButton("System", "icon/16/control-center.png");
+
+      bsb1.setChecked(true);
+
+      bsb1.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
+      bsb2.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
+      bsb3.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
+      bsb4.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
+      bsb5.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
+      bsb6.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
+      bsb7.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
+
+      bs.getBar().add(bsb1, bsb2, bsb3, bsb4, bsb5, bsb6, bsb7);
+
+      bs.getBar().setHorizontalChildrenAlign("center");
+      bs.getBar().setVerticalChildrenAlign("bottom");
+
+      var p1 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb1);
+      var p2 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb2);
+      var p3 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb3);
+      var p4 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb4);
+      var p5 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb5);
+      var p6 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb6);
+      var p7 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb7);
+
+      bs.getPane().add(p1, p2, p3, p4, p5, p6, p7);
+
+      var f1 = new qx.ui.form.TextField("Display Input");
+      var f2 = new qx.ui.form.TextField("Sunshine Input");
+      var f3 = new qx.ui.form.TextField("Paint Input");
+      var f4 = new qx.ui.form.TextField("Icons Input");
+      var f5 = new qx.ui.form.TextField("Images Input");
+      var f6 = new qx.ui.form.TextField("Applications Input");
+      var f7 = new qx.ui.form.TextField("System Input");
+
+      p1.add(f1);
+      p2.add(f2);
+      p3.add(f3);
+      p4.add(f4);
+      p5.add(f5);
+      p6.add(f6);
+      p7.add(f7);
+
+      var r1 = new qx.ui.form.RadioButton("Top", "top");
+      var r2 = new qx.ui.form.RadioButton("Right", "right");
+      var r3 = new qx.ui.form.RadioButton("Bottom", "bottom");
+      var r4 = new qx.ui.form.RadioButton("Left", "left", null, true);
+
+      r1.setTop(50);
+      r2.setTop(70);
+      r3.setTop(90);
+      r4.setTop(110);
+
+      p1.add(r1, r2, r3, r4);
+
+      var rm = new qx.manager.selection.RadioManager(null, [r1, r2, r3, r4]);
+
+      rm.addEventListener("changeSelected", function(e) {
+        bs.setBarPosition(e.getData().getValue());
+      });
+
+      d.add(bs);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Button_1.html b/swat/apps/qooxdoo-examples/example/Button_1.html
new file mode 100644
index 0000000000..7f26c3325c
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Button_1.html
@@ -0,0 +1,73 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test the qx.ui.form.Button constructor. qx.ui.form.Button is based on qx.ui.basic.Atom.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    function buttonExecute() { this.debug("Executed: " + this.getLabel()); };
+
+    var btn1 = new qx.ui.form.Button("Button No #1");
+    with(btn1)
+    {
+      setTop(48);
+      setLeft(20);
+      addEventListener("execute", buttonExecute);
+    };
+
+    d.add(btn1);
+
+
+
+    var btn2 = new qx.ui.form.Button("Button No #2");
+    with(btn2)
+    {
+      setTop(48);
+      setLeft(120);
+      addEventListener("execute", buttonExecute);
+      setEnabled(false);
+    };
+
+    d.add(btn2);
+
+
+
+    var btn3 = new qx.ui.form.Button("Button No #3");
+    with(btn3)
+    {
+      setTop(48);
+      setLeft(220);
+      addEventListener("execute", buttonExecute);
+    };
+
+    d.add(btn3);
+
+
+    var btn4 = new qx.ui.form.Button("Button No #4", "icon/16/forward.png");
+    with(btn4)
+    {
+      setTop(48);
+      setLeft(320);
+      addEventListener("execute", buttonExecute);
+    };
+
+    d.add(btn4);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/CheckBox_1.html b/swat/apps/qooxdoo-examples/example/CheckBox_1.html
new file mode 100644
index 0000000000..9073dc7098
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/CheckBox_1.html
@@ -0,0 +1,104 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Tests for qx.ui.form.CheckBox. qx.ui.form.CheckBox extends qx.ui.basic.Atom and so it inherits all the options and properties defined there.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    var c1 = new qx.ui.form.CheckBox("Send Data to Server", "c1checked", "c1");
+    with(c1)
+    {
+      setTop(48);
+      setLeft(20);
+    };
+    d.add(c1);
+
+    var c2 = new qx.ui.form.CheckBox("Delete all Data on Server", "c2checked", "c2");
+    with(c2)
+    {
+      setTop(78);
+      setLeft(20);
+    };
+    d.add(c2);
+    c2.setChecked(true);
+
+
+    var c3 = new qx.ui.form.CheckBox("Top Checkbox", "c3checked", "c3");
+    with(c3)
+    {
+      setTop(120);
+      setLeft(20);
+      setIconPosition("top");
+    };
+    d.add(c3);
+
+    var c4 = new qx.ui.form.CheckBox("Bottom Checkbox", "c4checked", "c4");
+    with(c4)
+    {
+      setTop(120);
+      setLeft(140);
+      setIconPosition("bottom");
+    };
+    d.add(c4);
+
+
+    var c5 = new qx.ui.form.CheckBox("Left Checkbox", "c5checked", "c5");
+    with(c5)
+    {
+      setTop(180);
+      setLeft(20);
+      setIconPosition("left");
+    };
+    d.add(c5);
+
+    var c6 = new qx.ui.form.CheckBox("Right Checkbox", "c6checked", "c6");
+    with(c6)
+    {
+      setTop(180);
+      setLeft(140);
+      setIconPosition("right");
+    };
+    d.add(c6);
+
+    var c7 = new qx.ui.form.CheckBox(null, "c7checked", "c7");
+    with(c7)
+    {
+      setTop(250);
+      setLeft(20);
+    };
+    d.add(c7);
+
+    var c8 = new qx.ui.form.CheckBox(null, "c7checked", "c7");
+    with(c8)
+    {
+      setTop(300);
+      setLeft(20);
+      setLabel("Label pure");
+      setShow("label");
+      setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+      setBackgroundColor(new qx.renderer.color.Color("red"));
+    };
+    d.add(c8);
+
+    c8.addEventListener("changeChecked", function(e) {
+      this.setBackgroundColor(new qx.renderer.color.Color(this.getChecked() ? "green" : "red"));
+    });
+  });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ColorPopup_1.html b/swat/apps/qooxdoo-examples/example/ColorPopup_1.html
new file mode 100644
index 0000000000..c7763e1c95
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ColorPopup_1.html
@@ -0,0 +1,83 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for qx.ui.component.ColorPopup.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var mybtn = new qx.ui.form.Button("Open Popup");
+    mybtn.setLocation(20, 48);
+    mybtn.addEventListener("execute", function() {
+      mypop.setTop(qx.dom.DomLocation.getPageBoxBottom(this.getElement()));
+      mypop.setLeft(qx.dom.DomLocation.getPageBoxLeft(this.getElement()));
+      mypop.show();
+    });
+
+    var myview = new qx.ui.basic.Label("Selected Color");
+    myview.setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+    myview.setLocation(100, 48);
+    myview.setPadding(3, 6);
+    myview.setBackgroundImage("core/dotted_white.gif");
+    myview.addToDocument();
+
+    var mytables =
+    {
+      core : {
+        label : "Basic Colors",
+        values : [ "#000", "#333", "#666", "#999", "#CCC", "#FFF", "red", "green", "blue", "yellow", "teal", "maroon" ]
+      },
+
+      template : {
+        label : "Template Colors",
+        values : [ "#B07B30", "#B07BC9", "#E3AEC9", "#7A2A53" ]
+      },
+
+      recent : {
+        label : "Recent Colors",
+
+        // In this case we need named colors or rgb-value-strings, hex is not allowed currently
+        values : [ "rgb(122,195,134)", "orange" ]
+      }
+    }
+
+    var mypop = new qx.ui.component.ColorPopup(mytables);
+    mypop.setLocation(100, 100);
+    mypop.setValue(new qx.renderer.color.Color("#23F3C1"));
+
+    mybtn.addToDocument();
+    mypop.addToDocument();
+
+    mypop.addEventListener("changeValue", function(e) {
+      this.debug("Value Listener: " + e.getData());
+      myview.setBackgroundColor(e.getData());
+      myview.setBackgroundImage(e.getData() ? null : "core/dotted_white.gif");
+    });
+
+    mypop.addEventListener("changeRed", function(e) {
+      this.debug("Red Listener: " + e.getData());
+    });
+
+    mypop.addEventListener("changeGreen", function(e) {
+      this.debug("Green Listener: " + e.getData());
+    });
+
+    mypop.addEventListener("changeBlue", function(e) {
+      this.debug("Blue Listener: " + e.getData());
+    });
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/ColorSelector_1.html b/swat/apps/qooxdoo-examples/example/ColorSelector_1.html
new file mode 100644
index 0000000000..a54005fbd9
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ColorSelector_1.html
@@ -0,0 +1,29 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for qx.ui.component.ColorSelector.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var mycolor = new qx.ui.component.ColorSelector;
+
+    mycolor.setLocation(50, 50);
+
+    qx.ui.core.ClientDocument.getInstance().add(mycolor);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/ColorSelector_2.html b/swat/apps/qooxdoo-examples/example/ColorSelector_2.html
new file mode 100644
index 0000000000..1fbf822822
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ColorSelector_2.html
@@ -0,0 +1,30 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for qx.ui.component.ColorSelector.</p>
+    <p>Adding a default/previous/old color value to compare it with the new selection.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var mycolor = new qx.ui.component.ColorSelector(130, 180, 100);
+
+    mycolor.setLocation(50, 50);
+
+    qx.ui.core.ClientDocument.getInstance().add(mycolor);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/ComboBox_1.html b/swat/apps/qooxdoo-examples/example/ComboBox_1.html
new file mode 100644
index 0000000000..682b17229e
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ComboBox_1.html
@@ -0,0 +1,101 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Testing ComboBox implementation.</p>
+    <p>The elements of the popup will be created on the first open of the qx.ui.form.ComboBox.</p>
+  </div>
+
+  <select style="position:absolute; left:300px; top:48px; width: 120px;">
+    <option>Item No 1</option>
+    <option>Item No 2</option>
+    <option>Item No 3</option>
+    <option>Item No 4</option>
+    <option>Item No 5</option>
+    <option>Item No 6</option>
+    <option>Item No 7</option>
+    <option>Item No 8</option>
+    <option>Item No 9</option>
+    <option disabled="true">Item No 10</option>
+    <option>Item No 11</option>
+    <option>Item No 12</option>
+    <option>Item No 13</option>
+    <option>Item No 14</option>
+    <option>Item No 15</option>
+    <option>Item No 16</option>
+    <option>Item No 17</option>
+    <option>Item No 18</option>
+    <option>Item No 19</option>
+    <option disabled="true">Item No 20</option>
+    <option>Item No 21</option>
+    <option>Item No 22</option>
+    <option>Item No 23</option>
+    <option>Item No 24</option>
+    <option>Item No 23</option>
+    <option>Item No 24</option>
+    <option>Item No 25</option>
+    <option>Item No 26</option>
+    <option>Item No 27</option>
+    <option>Item No 28</option>
+    <option>Item No 29</option>
+    <option disabled="true">Item No 30</option>
+  </select>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var c1 = new qx.ui.form.ComboBox;
+      c1.set({ top: 48, left: 20 });
+
+
+
+      var item;
+
+      for(var i=1; i<=30; i++)
+      {
+        item = new qx.ui.form.ListItem("Item No " + i);
+        !(i % 10) && (item.setEnabled(false));
+        c1.add(item);
+      };
+
+
+      c1.setSelected(c1.getList().getFirstChild());
+
+      c1.addEventListener("changeValue", function(e) {
+        this.debug("New value: " + e.getData());
+      });
+
+      c1.addEventListener("changeSelected", function(e) {
+        this.debug("New selected: " + e.getData());
+      });
+
+
+
+
+      var b1 = new qx.ui.form.CheckBox("Editable");
+
+      b1.set({ top: 50, left: 150 });
+
+      b1.addEventListener("changeChecked", function(e) {
+        c1.setEditable(e.getData());
+      });
+
+
+
+      d.add(c1, b1);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/DateChooser_1.html b/swat/apps/qooxdoo-examples/example/DateChooser_1.html
new file mode 100644
index 0000000000..582ca8b386
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/DateChooser_1.html
@@ -0,0 +1,31 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>The DateChooser shows calendar and allows choosing a date.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    var chooser = new qx.ui.component.DateChooser;
+    chooser.setLocation(10, 50);
+    chooser.setWidth("auto");
+    chooser.setHeight("auto");
+    d.add(chooser);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/Drag_1.html b/swat/apps/qooxdoo-examples/example/Drag_1.html
new file mode 100644
index 0000000000..3347f13020
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Drag_1.html
@@ -0,0 +1,57 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Show one way to drag a widget around the screen.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+    
+    var a1 = new qx.ui.basic.Atom("Drag Me");
+    a1.set({ backgroundColor: "white", border: qx.renderer.border.BorderPresets.getInstance().groove });
+    a1.setPadding(10);
+    a1.setLocation(20, 48); 
+    d.add(a1);
+
+    
+    a1.addEventListener("mousedown", handleMouseDown);
+    a1.addEventListener("mousemove", handleMouseMove);
+    a1.addEventListener("mouseup", handleMouseUp);
+    
+    function handleMouseDown(e)
+    {
+      this.setCapture(true);
+      a1._offsetX = e.getPageX() - a1.getLeft();
+      a1._offsetY = e.getPageY() - a1.getTop();
+    }
+    
+    function handleMouseMove(e)
+    {
+      if (this.getCapture())
+      {
+        a1.setLeft(e.getPageX() - a1._offsetX);
+        a1.setTop(e.getPageY() - a1._offsetY);
+      }
+    }
+          
+    function handleMouseUp(e)
+    {
+      this.setCapture(false);
+    }
+  });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Fields_1.html b/swat/apps/qooxdoo-examples/example/Fields_1.html
new file mode 100644
index 0000000000..5fc0f73445
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Fields_1.html
@@ -0,0 +1,107 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Some tests for some of the most used properties of qx.ui.core.Widget (coordinates, dimensions, backgroundColor, opacity, ...).</p>
+    <p>Also here are the first test of some widgets which extend qx.ui.core.Widget: qx.ui.form.TextField and qx.ui.form.PasswordField. These extended
+    widgets also interacts like the basic QxWidgets with the qx.event.handler.FocusHandler.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    function textChange(e) {
+      this.debug("Text changed: " + e.getData());
+    }
+
+    var t1 = new qx.ui.form.TextField;
+    t1.setValue("textfield");
+    t1.setTop(48);
+    t1.setLeft(20);
+
+    t1.addEventListener("changeValue", textChange);
+    t1.addEventListener("input", function(e) {
+      this.debug("Input: " + e.getData());
+    });
+
+    d.add(t1);
+
+
+
+
+    var t2 = new qx.ui.form.PasswordField;
+    t2.setValue("passwordfield");
+    t2.setTop(80);
+    t2.setLeft(20);
+
+    t2.addEventListener("changeValue", textChange);
+
+    d.add(t2);
+
+
+    var t3 = new qx.ui.form.TextArea;
+    t3.setValue("textarea");
+    t3.setTop(110);
+    t3.setLeft(20);
+    t3.setWidth(300);
+    t3.setHeight(60);
+
+    t3.addEventListener("changeValue", textChange);
+
+    d.add(t3);
+
+
+    var t4 = new qx.ui.form.TextField;
+    t4.setValue("textfield");
+    t4.setTop(200);
+    t4.setLeft(20);
+    t4.setWidth(200);
+    t4.setMaxLength(100);
+    t4.setReadOnly(true);
+
+    t4.addEventListener("changeValue", textChange);
+
+    d.add(t4);
+
+
+    var t5 = new qx.ui.form.TextField;
+    t5.setValue("You are foo!");
+    t5.setTop(240);
+    t5.setLeft(20);
+
+    t5.addEventListener("changeValue", textChange);
+
+    d.add(t5);
+
+
+
+    var t6 = new qx.ui.form.TextField;
+    t6.setTop(270);
+    t6.setLeft(20);
+
+    t6.addEventListener("changeText", textChange);
+    t6.addEventListener("input", function(e) {
+      this.debug("Input: " + e.getData());
+    });
+
+    t6.addEventListener("keydown", function(e) {
+      this.debug("Keypress: " + e.getKeyCode());
+    });
+
+    d.add(t6);
+  });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Flash_1.html b/swat/apps/qooxdoo-examples/example/Flash_1.html
new file mode 100644
index 0000000000..3e2f0ceca8
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Flash_1.html
@@ -0,0 +1,53 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Simple test for qx.ui.embed.Flash.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    // Try no version required
+    var fo1 = new qx.ui.embed.Flash("./image/flash/fo_tester.swf");
+
+    // Try version 7 required
+    // var fo1 = new qx.ui.embed.Flash("image/flash/fo_tester.swf", "7");
+
+    // Try version 9 required
+    // var fo1 = new qx.ui.embed.Flash("image/flash/fo_tester.swf", "9");
+
+    // Error handling methods:
+    // #1: Enable Express Install: Available in Flash Players >= 6.0.65
+    // fo1.setEnableExpressInstall(true);
+    // #2: Enable Redirect URL: Jump to an installer page
+    // fo1.setRedirectUrl("http://www.google.de");
+
+    fo1.setVariable("flashVarText", "this is passed in via FlashVars");
+    fo1.setScale("noscale");
+
+    fo1.setLeft(20);
+    fo1.setRight(335);
+    fo1.setTop(48);
+    fo1.setBottom(48);
+
+    fo1.setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+    fo1.setBackgroundColor("#FF6600");
+
+    d.add(fo1);
+  });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/GalleryList_1.html b/swat/apps/qooxdoo-examples/example/GalleryList_1.html
new file mode 100644
index 0000000000..1dae618f18
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/GalleryList_1.html
@@ -0,0 +1,129 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+
+  <style type="text/css">
+.qx.ui.embed.GalleryList{
+  position: absolute;
+  visibility: visible;
+}
+
+.qx.ui.embed.GalleryList .galleryFrame{
+  padding: 2px;
+}
+
+.qx.ui.embed.GalleryList .galleryCell{
+  margin: 2px;
+  padding-bottom: 2px;
+  border: 1px solid #EEE;
+
+  background: #fff;
+  overflow: hidden;
+  white-space: normal;
+
+  font-family: Tahoma, Verdana, sans-serif;
+  font-size: 12px;
+
+  cursor: default;
+
+  -moz-user-select: none;
+  user-select: none;
+
+  position: relative;
+}
+
+.qx.ui.embed.GalleryList .galleryCell img{
+  vertical-align: bottom;
+  display: block;
+}
+
+.qx.ui.embed.GalleryList .galleryNumber{
+  width: 45px;
+  padding: 4px;
+
+  position: absolute;
+  top: 0px;
+  left: 0px;
+}
+
+.qx.ui.embed.GalleryList .galleryImageContainer{
+  position: absolute;
+  top: 0px;
+  left: 50px;
+}
+
+.qx.ui.embed.GalleryList .galleryText{
+  padding: 4px;
+  position: absolute;
+  top: 0px;
+  left: 130px;
+}
+
+.qx.ui.embed.GalleryList .galleryNumber,
+.qx.ui.embed.GalleryList .galleryText h3{
+  font-weight: bold;
+  font-size: 11px;
+}
+
+.qx.ui.embed.GalleryList .galleryText p{
+  font-size: 10px;
+}
+
+.qx.ui.embed.GalleryList .galleryCell-Selected{
+  background: #9BBCFF;
+  border-color: #3B7CFF;
+}
+  </style>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>ListSort implementation</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var imgPath = qx.manager.object.AliasManager.getInstance().resolvePath("icon/48/bug.png");
+
+      var galleryData = [];
+
+      for (var i=0; i<100; i++)
+      {
+        galleryData.push({
+          display : "bmzN9ci5",
+          width : 350,
+          height : 350,
+          thumbWidth : 48,
+          thumbHeight : 48,
+          title : "gohome.png",
+          timestamp : Math.random().toString(),
+          comment : "Cool Comment sadas asd dsa asdas dasd asd asdas dasdasdasd sadasdas dsds as",
+          id : "7686191121780974-10682",
+          src : imgPath,
+          number : "#" + i
+        });
+      };
+
+      var galleryList = new qx.ui.embed.GalleryList(galleryData);
+
+      galleryList.setWidth(400);
+      galleryList.setTop(48);
+      galleryList.setBottom(48);
+      galleryList.setLeft(250);
+
+      galleryList.setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+      galleryList.setBackgroundColor("white");
+
+      qx.ui.core.ClientDocument.getInstance().add(galleryList);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Gallery_1.html b/swat/apps/qooxdoo-examples/example/Gallery_1.html
new file mode 100644
index 0000000000..3252d3d1de
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Gallery_1.html
@@ -0,0 +1,116 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+
+  <style type="text/css">
+.qx_ui_embed_Gallery .galleryFrame{
+  padding: 2px;
+}
+
+.qx_ui_embed_Gallery .galleryCell{
+  border: 1px solid #444;
+  background: #fff;
+  margin: 2px;
+  float: left;
+  overflow: hidden;
+
+  font-family: Tahoma, Verdana, sans-serif;
+  font-size: 10px;
+
+  cursor: default;
+
+  -moz-user-select: none;
+  user-select: none;
+}
+
+.qx_ui_embed_Gallery .galleryCell img{
+  vertical-align: bottom;
+  display: block;
+}
+
+.qx_ui_embed_Gallery .galleryCell .galleryTitle,
+.qx_ui_embed_Gallery .galleryCell .galleryComment{
+  background: #eee;
+  padding: 3px 6px;
+  text-align: center;
+  cursor: default;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.qx_ui_embed_Gallery .galleryCell .galleryTitle{
+  border-bottom: 1px solid #aaa;
+}
+
+.qx_ui_embed_Gallery .galleryCell .galleryComment{
+  border-top: 1px solid #aaa;
+}
+
+.qx_ui_embed_Gallery .galleryCell-Selected{
+  background: #DCE8F6;
+  border: 1px solid #2760A1;
+}
+
+.qx_ui_embed_Gallery .galleryCell-Selected .galleryTitle,
+.qx_ui_embed_Gallery .galleryCell-Selected .galleryComment{
+  background: #9BBFE7;
+}
+
+.qx_ui_embed_Gallery .galleryCell-Selected .galleryTitle{
+  border-bottom: 1px dotted #2760A1;
+}
+
+.qx_ui_embed_Gallery .galleryCell-Selected .galleryComment{
+  border-top: 1px dotted #2760A1;
+}
+  </style>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test file for qx.ui.embed.Gallery</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var imgPath = qx.manager.object.AliasManager.getInstance().resolvePath("icon/64/chart.png");
+
+      var galleryList = [];
+
+      for (var i=0; i<100; i++)
+      {
+        galleryList.push({
+          display : "bmzN9ci5",
+          width : 350,
+          height : 350,
+          thumbWidth : 64,
+          thumbHeight : 64,
+          title : "gohome.png",
+          timestamp : Math.random().toString(),
+          comment : "Cool Comment",
+          id : "7686191121780974-10682",
+          src : imgPath
+        });
+      };
+
+      var gallery = new qx.ui.embed.Gallery(galleryList);
+
+      gallery.setLeft(20);
+      gallery.setRight(335);
+      gallery.setTop(48);
+      gallery.setBottom(48);
+      gallery.setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+
+      qx.ui.core.ClientDocument.getInstance().add(gallery);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/GroupBox_1.html b/swat/apps/qooxdoo-examples/example/GroupBox_1.html
new file mode 100644
index 0000000000..39c2eafd00
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/GroupBox_1.html
@@ -0,0 +1,107 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Introducing qx.ui.groupbox.GroupBox.</p>
+  </div>
+
+  <fieldset style="position:absolute; top:48px; left:400px; width:200px; height:100px"><legend>builtin</legend>content content content content content content content content content content content content content content content</fieldset>
+
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var fs = new qx.ui.groupbox.GroupBox("My first Fieldset");
+
+      with(fs)
+      {
+        setWidth("40%");
+        setBottom(48);
+        setTop(48);
+        setLeft(20);
+
+        setMaxWidth(350);
+        setMinWidth(250);
+      };
+
+
+
+      var a1 = new qx.ui.basic.Atom("TextField 1");
+      with(a1)
+      {
+        setTop(3);
+        setLeft(0);
+        setWidth("35%");
+        setHorizontalChildrenAlign("left");
+      };
+
+      var i1 = new qx.ui.form.TextField();
+      with(i1)
+      {
+        setTop(0);
+        setRight(0);
+        setWidth("60%");
+      };
+      fs.add(a1, i1);
+
+
+
+      var a2 = new qx.ui.basic.Atom("TextField 2", "icon/16/appearance.png");
+      with(a2)
+      {
+        setTop(33);
+        setLeft(0);
+        setWidth("35%");
+        setHorizontalChildrenAlign("left");
+      };
+      fs.add(a2);
+
+      var i2 = new qx.ui.form.TextField();
+      with(i2)
+      {
+        setTop(30);
+        setRight(0);
+        setWidth("60%");
+      };
+      fs.add(i2);
+
+
+
+      var a3 = new qx.ui.basic.Atom("TextField 3");
+      with(a3)
+      {
+        setTop(63);
+        setLeft(0);
+        setWidth("35%");
+        setHorizontalChildrenAlign("left");
+      };
+      fs.add(a3);
+
+      var i3 = new qx.ui.form.TextField();
+      with(i3)
+      {
+        setTop(60);
+        setRight(0);
+        setWidth("60%");
+      };
+      fs.add(i3);
+
+
+
+      d.add(fs);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/GroupBox_2.html b/swat/apps/qooxdoo-examples/example/GroupBox_2.html
new file mode 100644
index 0000000000..117732caf4
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/GroupBox_2.html
@@ -0,0 +1,153 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for qx.ui.groupbox.CheckGroupBox</p>
+  </div>
+
+  <fieldset style="position:absolute; top:48px; left:400px; width:200px; height:100px"><legend>builtin</legend>content content content content content content content content content content content content content content content</fieldset>
+
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var fs = new qx.ui.groupbox.CheckGroupBox("CheckBox FieldSet");
+
+      with(fs)
+      {
+        setWidth("40%");
+        setBottom(48);
+        setTop(48);
+        setLeft(20);
+
+        setMaxWidth(350);
+        setMinWidth("auto");
+      };
+
+      d.add(fs);
+
+
+
+
+      var fsl = new qx.ui.layout.VerticalBoxLayout;
+      fsl.setLeft(0);
+      fsl.setRight(0);
+      fsl.setHeight("auto");
+      fsl.setSpacing(4);
+      fs.add(fsl);
+
+
+
+
+      var r1 = new qx.ui.layout.HorizontalBoxLayout;
+      r1.setLeft(0);
+      r1.setWidth("100%");
+      r1.setHeight("auto");
+      r1.setVerticalChildrenAlign("middle");
+      fsl.add(r1);
+
+      var a1 = new qx.ui.basic.Atom("TextField 1");
+      with(a1)
+      {
+        setLeft(0);
+        setWidth("40%");
+        setHorizontalChildrenAlign("left");
+      };
+
+      var i1 = new qx.ui.form.TextField;
+      with(i1)
+      {
+        setRight(0);
+        setWidth("60%");
+      };
+
+      r1.add(a1, i1);
+
+
+
+
+
+      var r2 = new qx.ui.layout.HorizontalBoxLayout;
+      r2.setLeft(0);
+      r2.setWidth("100%");
+      r2.setHeight("auto");
+      r2.setVerticalChildrenAlign("middle");
+      fsl.add(r2);
+
+      var a2 = new qx.ui.basic.Atom("TextField 2", "icon/16/appearance.png");
+      with(a2)
+      {
+        setLeft(0);
+        setWidth("40%");
+        setHorizontalChildrenAlign("left");
+      };
+
+      var i2 = new qx.ui.form.TextField;
+      with(i2)
+      {
+        setRight(0);
+        setWidth("60%");
+      };
+
+      r2.add(a2, i2);
+
+
+
+
+
+
+      var r3 = new qx.ui.layout.HorizontalBoxLayout;
+      r3.setLeft(0);
+      r3.setWidth("100%");
+      r3.setHeight("auto");
+      r3.setVerticalChildrenAlign("middle");
+      fsl.add(r3);
+
+      var a3 = new qx.ui.basic.Atom("TextField 3");
+      with(a3)
+      {
+        setLeft(0);
+        setWidth("40%");
+        setHorizontalChildrenAlign("left");
+      };
+
+      var i3 = new qx.ui.form.TextField;
+      with(i3)
+      {
+        setRight(0);
+        setWidth("60%");
+      };
+
+      r3.add(a3, i3);
+
+
+
+
+
+      fs.getLegendObject().addEventListener("changeChecked", function(e) {
+        i1.setEnabled(e.getData());
+        i2.setEnabled(e.getData());
+        i3.setEnabled(e.getData());
+
+        a1.setEnabled(e.getData());
+        a2.setEnabled(e.getData());
+        a3.setEnabled(e.getData());
+      });
+
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/GroupBox_3.html b/swat/apps/qooxdoo-examples/example/GroupBox_3.html
new file mode 100644
index 0000000000..e9a77c64bf
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/GroupBox_3.html
@@ -0,0 +1,160 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for qx.ui.groupbox.RadioGroupBox</p>
+  </div>
+
+  <fieldset style="position:absolute; top:48px; left:400px; width:200px; height:100px"><legend>builtin</legend>content content content content content content content content content content content content content content content</fieldset>
+
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var fsr = new qx.ui.form.RadioButton("Simple configuration");
+
+      fsr.setLocation(27, 48);
+      d.add(fsr);
+
+      var fs = new qx.ui.groupbox.RadioGroupBox("RadioButton FieldSet");
+
+      with(fs)
+      {
+        setWidth("40%");
+        setBottom(48);
+        setTop(72);
+        setLeft(20);
+
+        setMaxWidth(350);
+        setMinWidth("auto");
+      };
+
+      d.add(fs);
+
+      var fag = new qx.manager.selection.RadioManager("fscontrol", [ fsr, fs.getLegendObject() ]);
+
+
+
+
+      var fsl = new qx.ui.layout.VerticalBoxLayout;
+      fsl.setLeft(0);
+      fsl.setRight(0);
+      fsl.setHeight("auto");
+      fsl.setSpacing(4);
+      fs.add(fsl);
+
+
+
+
+      var r1 = new qx.ui.layout.HorizontalBoxLayout;
+      r1.setLeft(0);
+      r1.setWidth("100%");
+      r1.setHeight("auto");
+      r1.setVerticalChildrenAlign("middle");
+      fsl.add(r1);
+
+      var a1 = new qx.ui.basic.Atom("TextField 1");
+      with(a1)
+      {
+        setLeft(0);
+        setWidth("40%");
+        setHorizontalChildrenAlign("left");
+      };
+
+      var i1 = new qx.ui.form.TextField;
+      with(i1)
+      {
+        setRight(0);
+        setWidth("60%");
+      };
+
+      r1.add(a1, i1);
+
+
+
+
+
+      var r2 = new qx.ui.layout.HorizontalBoxLayout;
+      r2.setLeft(0);
+      r2.setWidth("100%");
+      r2.setHeight("auto");
+      r2.setVerticalChildrenAlign("middle");
+      fsl.add(r2);
+
+      var a2 = new qx.ui.basic.Atom("TextField 2", "icon/16/appearance.png");
+      with(a2)
+      {
+        setLeft(0);
+        setWidth("40%");
+        setHorizontalChildrenAlign("left");
+      };
+
+      var i2 = new qx.ui.form.TextField;
+      with(i2)
+      {
+        setRight(0);
+        setWidth("60%");
+      };
+
+      r2.add(a2, i2);
+
+
+
+
+
+
+      var r3 = new qx.ui.layout.HorizontalBoxLayout;
+      r3.setLeft(0);
+      r3.setWidth("100%");
+      r3.setHeight("auto");
+      r3.setVerticalChildrenAlign("middle");
+      fsl.add(r3);
+
+      var a3 = new qx.ui.basic.Atom("TextField 3");
+      with(a3)
+      {
+        setLeft(0);
+        setWidth("40%");
+        setHorizontalChildrenAlign("left");
+      };
+
+      var i3 = new qx.ui.form.TextField;
+      with(i3)
+      {
+        setRight(0);
+        setWidth("60%");
+      };
+
+      r3.add(a3, i3);
+
+
+
+
+
+      fs.getLegendObject().addEventListener("changeChecked", function(e) {
+        i1.setEnabled(e.getData());
+        i2.setEnabled(e.getData());
+        i3.setEnabled(e.getData());
+
+        a1.setEnabled(e.getData());
+        a2.setEnabled(e.getData());
+        a3.setEnabled(e.getData());
+      });
+
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Iframe_1.html b/swat/apps/qooxdoo-examples/example/Iframe_1.html
new file mode 100644
index 0000000000..90d87e1d9b
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Iframe_1.html
@@ -0,0 +1,71 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Iframe implementation. Elastic.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      //----------
+      // qx.ui.embed.Iframe
+      //----------
+
+      w1 = new qx.ui.embed.Iframe();
+
+      w1.addEventListener("load", function(e) {
+        this.debug("Loaded: " + this.getSource());
+      });
+
+      // elastic
+      w1.set( { left: 20, top: 96, right: 335, bottom: 48 } );
+      w1.setSource("http://www.google.com");
+
+      d.add(w1);
+
+
+      function changeURL(e) {
+
+        this.setSource(e.getData());
+      };
+
+      // make qx.ui.embed.Iframe react to event "surfTo" via function changeURL()
+      d.addEventListener("surfTo", changeURL, w1);
+
+
+      //-------------
+      // radio group
+      //-------------
+
+      var rd1 = new qx.ui.form.RadioButton("Google", "http://www.google.com");
+      var rd2 = new qx.ui.form.RadioButton("Yahoo", "http://www.yahoo.com");
+
+      rd1.set( { left: 20, top: 48, checked: true } );
+      rd2.set( { left: 120, top: 48 } );
+
+      var rbm = new qx.manager.selection.RadioManager( name, [rd1, rd2]);
+
+      // elements of radio group fire event "surfTo"
+      rbm.addEventListener("changeSelected", function(e)
+      {
+        d.dispatchEvent( new qx.event.type.DataEvent("surfTo", e.getData().getValue() ) );
+      });
+
+      d.add(rd1, rd2);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Inline_1.html b/swat/apps/qooxdoo-examples/example/Inline_1.html
new file mode 100644
index 0000000000..5dac06a698
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Inline_1.html
@@ -0,0 +1,260 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Inline widget.</p><p>Application layout is disabled by using qx.core.Settings. Scrollbars appear, if the content is bigger than the window.</p>
+  </div>
+
+  <div id="iframe1" class="manualFrame" style="overflow:hidden;position:static;margin-top:38px;margin-left:10px">
+    Inline Frame #1
+  </div>
+
+  <div id="iframe2" class="manualFrame" style="overflow:hidden;position:static;margin-top:20px;margin-left:10px">
+    Inline Frame #2
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    var inlineWidget = new qx.ui.basic.Inline("iframe1");
+
+    inlineWidget.setHeight("auto");
+    inlineWidget.setWidth("auto");
+
+    var fieldSet = new qx.ui.groupbox.GroupBox("My first inline fieldset");
+
+    with(fieldSet)
+    {
+      // setWidth("auto");
+      // setWidth("100%");
+
+      setLeft(0);
+      setRight(0);
+
+      setHeight("auto");
+    };
+
+    inlineWidget.add(fieldSet);
+
+    d.add(inlineWidget);
+
+
+
+    var atom1 = new qx.ui.basic.Atom("Name");
+    var textfield1 = new qx.ui.form.TextField;
+
+    with(atom1)
+    {
+      setLeft(0);
+      setTop(3);
+    };
+
+    with(textfield1)
+    {
+      setLeft(80);
+      setRight(0);
+      setTop(0);
+    };
+
+    fieldSet.add(atom1, textfield1);
+
+
+
+    var atom2 = new qx.ui.basic.Atom("First Name");
+    var textfield2 = new qx.ui.form.TextField;
+
+    with(atom2)
+    {
+      setLeft(0);
+      setTop(33);
+    };
+
+    with(textfield2)
+    {
+      setLeft(80);
+      setRight(0);
+      setTop(30);
+    };
+
+    fieldSet.add(atom2, textfield2);
+
+
+
+    var atom3 = new qx.ui.basic.Atom("City");
+    var textfield3 = new qx.ui.form.TextField;
+
+    with(atom3)
+    {
+      setLeft(0);
+      setTop(63);
+    };
+
+    with(textfield3)
+    {
+      setLeft(80);
+      setRight(0);
+      setTop(60);
+    };
+
+    fieldSet.add(atom3, textfield3);
+
+
+
+    /*
+      Menu
+    */
+
+      var m1 = new qx.ui.menu.Menu;
+
+      var mb1_01 = new qx.ui.menu.MenuButton("New");
+      var mb1_02 = new qx.ui.menu.MenuButton("Open");
+      var mb1_03 = new qx.ui.menu.MenuButton("Save");
+      var mb1_04 = new qx.ui.menu.MenuButton("Save as");
+      var mb1_05 = new qx.ui.menu.MenuButton("Close");
+      var mb1_06 = new qx.ui.menu.MenuButton("Restore last saved");
+
+      m1.add(mb1_01, mb1_02, mb1_03, mb1_04, mb1_05, mb1_06);
+
+
+      var m2 = new qx.ui.menu.Menu;
+
+      var mb2_01 = new qx.ui.menu.MenuButton("Undo");
+      var mb2_02 = new qx.ui.menu.MenuButton("Redo");
+      var mb2_b1 = new qx.ui.menu.MenuSeparator();
+      var mb2_03 = new qx.ui.menu.MenuButton("Cut", "icon/16/edit-cut.png");
+      var mb2_04 = new qx.ui.menu.MenuButton("Copy", "icon/16/edit-copy.png");
+      var mb2_05 = new qx.ui.menu.MenuButton("Paste", "icon/16/edit-paste.png");
+      var mb2_06 = new qx.ui.menu.MenuButton("Delete", "icon/16/edit-delete.png");
+      var mb2_b2 = new qx.ui.menu.MenuSeparator();
+      var mb2_07 = new qx.ui.menu.MenuButton("Select All");
+      var mb2_08 = new qx.ui.menu.MenuButton("Find");
+      var mb2_09 = new qx.ui.menu.MenuButton("Find Again");
+
+
+
+
+      mb2_05.setEnabled(false);
+      mb2_06.setEnabled(false);
+      mb2_09.setEnabled(false);
+
+      m2.add(mb2_01, mb2_02, mb2_b1, mb2_03, mb2_04, mb2_05, mb2_06, mb2_b2, mb2_07, mb2_08, mb2_09);
+
+
+      var m3 = new qx.ui.menu.Menu;
+      var m3_suba = new qx.ui.menu.Menu;
+      var m3_subb = new qx.ui.menu.Menu;
+      var m3_subc = new qx.ui.menu.Menu;
+
+      var mb3_01 = new qx.ui.menu.MenuCheckBox("File List", null, false);
+      var mb3_02 = new qx.ui.menu.MenuCheckBox("Syntax Highlighting", null, true);
+      var mb3_03 = new qx.ui.menu.MenuCheckBox("Statusbar", null, true);
+      var mb3_b1 = new qx.ui.menu.MenuSeparator();
+      var mb3_04 = new qx.ui.menu.MenuButton("Printer Font", null, null, m3_suba);
+      var mb3_05 = new qx.ui.menu.MenuButton("Editor Font", null, null, m3_subb);
+      var mb3_06 = new qx.ui.menu.MenuButton("Export Font", null, null, m3_subc);
+
+      m3.add(mb3_01, mb3_02, mb3_03, mb3_b1, mb3_04, mb3_05, mb3_06);
+
+      var mb3_suba_01 = new qx.ui.menu.MenuButton("Tahoma, 11pt");
+      var mb3_suba_02 = new qx.ui.menu.MenuButton("Tahoma, 12pt");
+      var mb3_suba_03 = new qx.ui.menu.MenuButton("Tahoma, 13pt");
+      var mb3_suba_04 = new qx.ui.menu.MenuButton("Tahoma, 14pt");
+      var mb3_suba_05 = new qx.ui.menu.MenuButton("Tahoma, 15pt");
+
+      m3_suba.add(mb3_suba_01, mb3_suba_02, mb3_suba_03, mb3_suba_04, mb3_suba_05);
+
+      var mb3_subb_01 = new qx.ui.menu.MenuButton("Verdana, 11pt");
+      var mb3_subb_02 = new qx.ui.menu.MenuButton("Verdana, 12pt");
+      var mb3_subb_03 = new qx.ui.menu.MenuButton("Verdana, 13pt");
+      var mb3_subb_04 = new qx.ui.menu.MenuButton("Verdana, 14pt");
+      var mb3_subb_05 = new qx.ui.menu.MenuButton("Verdana, 15pt");
+
+      m3_subb.add(mb3_subb_01, mb3_subb_02, mb3_subb_03, mb3_subb_04, mb3_subb_05);
+
+      var mb3_subc_01 = new qx.ui.menu.MenuButton("Courier, 11pt");
+      var mb3_subc_02 = new qx.ui.menu.MenuButton("Courier, 12pt");
+      var mb3_subc_03 = new qx.ui.menu.MenuButton("Courier, 13pt");
+      var mb3_subc_04 = new qx.ui.menu.MenuButton("Courier, 14pt");
+      var mb3_subc_05 = new qx.ui.menu.MenuButton("Courier, 15pt");
+
+      m3_subc.add(mb3_subc_01, mb3_subc_02, mb3_subc_03, mb3_subc_04, mb3_subc_05);
+
+
+
+      var m4 = new qx.ui.menu.Menu;
+
+      var m4_suba = new qx.ui.menu.Menu;
+
+      var mb4_01 = new qx.ui.menu.MenuButton("View", null, null, m4_suba);
+      var mb4_b1 = new qx.ui.menu.MenuSeparator();
+      var mb4_02 = new qx.ui.menu.MenuButton("Editor Preferences...");
+      var mb4_03 = new qx.ui.menu.MenuButton("Editor Extensions");
+      var mb4_04 = new qx.ui.menu.MenuButton("Framework Preferences");
+
+      m4.add(mb4_01, mb4_b1, mb4_02, mb4_03, mb4_04);
+
+      var mb4_suba_01 = new qx.ui.menu.MenuButton("New Window");
+      var mb4_suba_b1 = new qx.ui.menu.MenuSeparator();
+      var mb4_suba_02 = new qx.ui.menu.MenuRadioButton("Overlapping", null, true);
+      var mb4_suba_03 = new qx.ui.menu.MenuRadioButton("Split Horizontally", null);
+      var mb4_suba_04 = new qx.ui.menu.MenuRadioButton("Split Vertically", null);
+      var mb4_suba_b2 = new qx.ui.menu.MenuSeparator();
+      var mb4_suba_05 = new qx.ui.menu.MenuButton("Next Window");
+      var mb4_suba_06 = new qx.ui.menu.MenuButton("Previous Window");
+
+      m4_suba.add(mb4_suba_01, mb4_suba_b1, mb4_suba_02, mb4_suba_03, mb4_suba_04, mb4_suba_b2, mb4_suba_05, mb4_suba_06);
+
+      var mb4_manager = new qx.manager.selection.RadioManager("windowMode", [ mb4_suba_02, mb4_suba_03, mb4_suba_04 ]);
+
+
+      var m5 = new qx.ui.menu.Menu;
+
+      var mb5_01 = new qx.ui.menu.MenuButton("Help");
+      var mb5_02 = new qx.ui.menu.MenuButton("About");
+
+      m5.add(mb5_01, mb5_02);
+
+      d.add(m1, m2, m3, m3_suba, m3_subb, m3_subc, m4, m4_suba, m5);
+
+
+    var inline2 = new qx.ui.basic.Inline("iframe2");
+
+    inline2.setHeight("auto");
+    inline2.setWidth("auto");
+
+
+    var mb1 = new qx.ui.toolbar.ToolBar;
+
+    var mbb1 = new qx.ui.toolbar.ToolBarMenuButton("File", m1);
+    var mbb2 = new qx.ui.toolbar.ToolBarMenuButton("Edit", m2);
+    var mbb3 = new qx.ui.toolbar.ToolBarMenuButton("View", m3);
+    var mbb4 = new qx.ui.toolbar.ToolBarMenuButton("Options", m4);
+    var mbb5 = new qx.ui.toolbar.ToolBarMenuButton("Help", m5);
+
+    mb1.add(mbb1, mbb2, mbb3, mbb4, mbb5);
+
+    with(mb1)
+    {
+      setWidth(400);
+      setHeight("auto");
+    };
+
+    inline2.add(mb1);
+
+    d.add(inline2);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/ListView_1.html b/swat/apps/qooxdoo-examples/example/ListView_1.html
new file mode 100644
index 0000000000..661c4a8030
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ListView_1.html
@@ -0,0 +1,67 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Testing qx.ui.listview.ListView with text cells.</p>
+    <p>Testing of column alignment, resizeable prohibition for columns and live resizing.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var ld = [];
+      var lt = [ "Image", "Text", "PDF", "Illustration", "Document" ];
+      
+      for (var i=0, t; i<1000; i++) 
+      {
+        t=Math.round(Math.random()*4);
+        ld.push({ name : { text : "File " + i }, size : { text : Math.round(Math.random()*100) + "kb" }, type : { text : lt[t] }, modified : { text : "Nov " + Math.round(Math.random() * 30 + 1) + " 2005" }, rights: { text : "-rw-r--r--" }});
+      };
+      
+      var lc = 
+      {
+        name : { label : "Name", width : 100, type : "text" },
+        size: { label : "Size", width : 50, type : "text", align : "right", resizable : false },
+        type : { label : "Type", width : 80, type : "text" },
+        modified : { label : "Last Modified", width : 150, type : "text" },
+        rights : { label : "Rights", width: 80, type : "text" }
+      };
+      
+      var lv = new qx.ui.listview.ListView(ld, lc);
+
+      lv.setBorder(qx.renderer.border.BorderPresets.getInstance().shadow);
+      lv.setBackgroundColor("white");
+      lv.setWidth(600);
+      lv.setHeight(350);
+      lv.setLocation(20, 48);
+      
+      // Prohibit resizing of columns completly
+      // lv.setResizable(false);
+
+      qx.ui.core.ClientDocument.getInstance().add(lv);
+      
+      
+      
+      
+      var chk1 = new qx.ui.form.CheckBox("Enable Live Resize");
+      chk1.setLocation(20, 420);
+      qx.ui.core.ClientDocument.getInstance().add(chk1);
+      
+      chk1.addEventListener("changeChecked", function(e) {
+        lv.setLiveResize(e.getData());
+      });
+      
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ListView_2.html b/swat/apps/qooxdoo-examples/example/ListView_2.html
new file mode 100644
index 0000000000..14df77b47e
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ListView_2.html
@@ -0,0 +1,53 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Testing qx.ui.listview.ListView with text cells and an additional icon.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var ld = [];
+      var lt = [ "Image", "Text", "PDF", "Illustration", "Document" ];
+      var li = [ "icons.png", "edit.png", "emoticon.png", "appearance.png", "file-new.png" ];
+
+      for (var i=0, t; i<1000; i++)
+      {
+        t=Math.round(Math.random()*4);
+        ld.push({ icon : { source : "icon/16/" + li[t] }, name : { text : "File " + i }, size : { text : Math.round(Math.random()*100) + "kb" }, type : { text : lt[t] }, modified : { text : "Nov " + Math.round(Math.random() * 30 + 1) + " 2005" }, rights: { text : "-rw-r--r--" }});
+      };
+
+      var lc =
+      {
+        icon : { label : "", width: 24, type : "image" },
+        name : { label : "Name", width : 100, type : "text" },
+        size: { label : "Size", width : 50, type : "text", align : "right" },
+        type : { label : "Type", width : 80, type : "text" },
+        modified : { label : "Last Modified", width : 150, type : "text" },
+        rights : { label : "Rights", width: 80, type : "text" }
+      };
+
+      var lv = new qx.ui.listview.ListView(ld, lc);
+
+      lv.setBorder(qx.renderer.border.BorderPresets.getInstance().shadow);
+      lv.setBackgroundColor("white");
+      lv.setWidth(600);
+      lv.setHeight(350);
+      lv.setLocation(20, 48);
+
+      qx.ui.core.ClientDocument.getInstance().add(lv);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ListView_3.html b/swat/apps/qooxdoo-examples/example/ListView_3.html
new file mode 100644
index 0000000000..89bfc6b086
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ListView_3.html
@@ -0,0 +1,51 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Testing qx.ui.listview.ListView with iconHtml cells.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var ld = [];
+      var lt = [ "Image", "Text", "PDF", "Illustration", "Document" ];
+      
+      for (var i=0, t; i<1000; i++) 
+      {
+        t=Math.round(Math.random()*4);
+        ld.push({ name : { html : "E-Mail " + i, icon : "icon/16/email.png", iconWidth : 16, iconHeight : 16 }, size : { text : Math.round(Math.random()*100) + "kb" }, type : { text : lt[t] }, modified : { text : "Nov " + Math.round(Math.random() * 30 + 1) + " 2005" }, rights: { text : "-rw-r--r--" }, open : { uri : "http://www.google.com/search?q=" + i, html : "Open " + i }});
+      };
+      
+      var lc = 
+      {
+        name : { label : "Name", width : 120, type : "iconHtml" },
+        size: { label : "Size", width : 50, type : "text", align : "right" },
+        type : { label : "Type", width : 80, type : "text" },
+        modified : { label : "Last Modified", width : 150, type : "text" },
+        rights : { label : "Rights", width: 80, type : "text" }     
+      };
+      
+      var lv = new qx.ui.listview.ListView(ld, lc);
+
+      lv.setBorder(qx.renderer.border.BorderPresets.getInstance().shadow);
+      lv.setBackgroundColor("white");
+      lv.setWidth(600);
+      lv.setHeight(350);
+      lv.setLocation(20, 48);
+
+      qx.ui.core.ClientDocument.getInstance().add(lv);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ListView_4.html b/swat/apps/qooxdoo-examples/example/ListView_4.html
new file mode 100644
index 0000000000..f673bacc90
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ListView_4.html
@@ -0,0 +1,58 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Testing qx.ui.listview.ListView with text cells.</p>
+    <p>Added some sort handling stuff.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var ld = [];
+      var lt = [ "Image", "Text", "PDF", "Illustration", "Document" ];
+
+      for (var i=0, t; i<1000; i++)
+      {
+        t=Math.round(Math.random()*4);
+        ld.push({ name : { text : "File " + i }, size : { text : Math.round(Math.random()*100) + "kb" }, type : { text : lt[t] }, modified : { text : "Nov " + Math.round(Math.random() * 30 + 1) + " 2005" }, rights: { text : "-rw-r--r--" }});
+      };
+
+      var lc =
+      {
+        name : { label : "Name", width : 100, type : "text", sortable : true, sortProp : "text" },
+        size: { label : "Size", width : 50, type : "text", sortable : true, sortProp : "text", sortMethod : qx.util.Compare.byIntegerString, align : "right" },
+        type : { label : "Type", width : 80, type : "text", sortable : true, sortProp : "text" },
+        modified : { label : "Last Modified", width : 150, type : "text" },
+        rights : { label : "Rights", width: 80, type : "text" }
+      };
+
+      var lv = new qx.ui.listview.ListView(ld, lc);
+
+      lv.setBorder(qx.renderer.border.BorderPresets.getInstance().shadow);
+      lv.setBackgroundColor("white");
+      lv.setWidth(600);
+      lv.setHeight(350);
+      lv.setLocation(20, 48);
+
+      qx.ui.core.ClientDocument.getInstance().add(lv);
+
+
+
+
+      // Color Themes
+      qx.manager.object.ColorManager.getInstance().createThemeList(qx.ui.core.ClientDocument.getInstance(), 20, 448);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/List_1.html b/swat/apps/qooxdoo-examples/example/List_1.html
new file mode 100644
index 0000000000..17981e6f0c
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/List_1.html
@@ -0,0 +1,127 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>List implementation</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var l1 = new qx.ui.form.List;
+      
+      l1.set({ top : 48, left: 20, height: 200, width: 150, overflow : "scrollY" });
+      
+      var item;
+      for( var i=1; i<=35; i++ ) 
+      {
+        // item = new qx.ui.form.ListItem("Item No " + i);
+        item = new qx.ui.form.ListItem("Item No " + i, "icon/" + ((i % 4) ? "16" : "48") + "/folder.png");
+        
+        !(i % 9) && (item.setEnabled(false));
+        
+        l1.add(item);
+      };
+      
+      d.add(l1);
+      
+      var l2 = new qx.ui.form.List;
+      
+      l2.set({ top : 48, left: 400, height: 200, width: 150 });
+      l2.getManager().setMultiSelection(false);
+      //l2.setOverflow("scrollY");
+      l2.setHeight("auto");
+      
+      var l2l = [ "red", "violett", "rose", "blue", "green", "cyan", "magenta", "yellow", "brown", "orange", "black", "white", "grey", "gray", "brown" ];
+      
+      for (var i=0; i<l2l.length; i++) {
+        l2.add(new qx.ui.form.ListItem(l2l[i]));
+      };      
+      
+      d.add(l2);
+      
+
+      
+
+      var c1 = new qx.ui.form.CheckBox("Enable Multi-Selection");
+      var c2 = new qx.ui.form.CheckBox("Enable Drag-Selection");
+      var c3 = new qx.ui.form.CheckBox("Allow Deselection");
+      var c4 = new qx.ui.form.CheckBox("Enable Inline Find");
+
+      c1.setLocation(180, 48);
+      c2.setLocation(180, 68);
+      c3.setLocation(180, 88);
+      c4.setLocation(180, 108);
+      
+      d.add(c1, c2, c3, c4);
+      
+      c1.setChecked(true);
+      c2.setChecked(true);
+      c3.setChecked(true);
+      c4.setChecked(true);
+      
+      c1.addEventListener("changeChecked", function(e) {
+        l1.getManager().setMultiSelection(e.getData());
+      });
+      
+      c2.addEventListener("changeChecked", function(e) {
+        l1.getManager().setDragSelection(e.getData());
+      });
+
+      c3.addEventListener("changeChecked", function(e) {
+        l1.getManager().setCanDeselect(e.getData());
+      });
+      
+      c4.addEventListener("changeChecked", function(e) {
+        l1.setEnableInlineFind(e.getData());
+      });
+      
+      
+      
+      
+
+      var rd1 = new qx.ui.form.RadioButton("Show Label", "label");
+      var rd2 = new qx.ui.form.RadioButton("Show Icon", "icon");
+      var rd3 = new qx.ui.form.RadioButton("Show Both", "both");
+
+      rd1.set( { left: 180, top: 128 } );
+      rd2.set( { left: 180, top: 148 } );
+      rd3.set( { left: 180, top: 168 } );
+      
+      d.add(rd1, rd2, rd3);
+      
+      rd3.setChecked(true);
+
+      var rbm = new qx.manager.selection.RadioManager( name, [rd1, rd2, rd3]);
+
+      rbm.addEventListener("changeSelected", function(e)
+      {
+        for( var i=0; i<l1.getChildrenLength(); i++ ) {
+          l1.getChildren()[i].setShow(e.getData().getValue());
+        }
+      });
+      
+      
+      
+      
+      // Icon Themes
+      qx.manager.object.ImageManager.getInstance().createThemeList(d, 20, 400);
+    
+      // Color Themes
+      qx.manager.object.ColorManager.getInstance().createThemeList(d, 200, 400);      
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Menu_1.html b/swat/apps/qooxdoo-examples/example/Menu_1.html
new file mode 100644
index 0000000000..6e42b2eb4a
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Menu_1.html
@@ -0,0 +1,193 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>qx.ui.menu.Menu Implementation.</p>
+    <p>Added qx.client.Command support tests.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var q1 = new qx.client.Command("Ctrl+Z");
+      q1.addEventListener("execute", function(e) {
+        alert("Undo");
+      });
+
+      var q2 = new qx.client.Command("Ctrl+Y");
+      q2.addEventListener("execute", function(e) {
+        alert("Redo");
+      });
+
+      var q3 = new qx.client.Command("Ctrl+X");
+      q3.addEventListener("execute", function(e) {
+        alert("Cut");
+      });
+
+      var q4 = new qx.client.Command("Ctrl+C");
+      q4.addEventListener("execute", function(e) {
+        alert("Copy");
+      });
+
+      var q5 = new qx.client.Command("Ctrl+V");
+      q5.addEventListener("execute", function(e) {
+        alert("Paste");
+      });
+
+      var q6 = new qx.client.Command("Del");
+      q6.addEventListener("execute", function(e) {
+        alert("Delete");
+      });
+
+      var q7 = new qx.client.Command("Ctrl+A");
+      q7.addEventListener("execute", function(e) {
+        alert("Select All");
+      });
+
+      var q8 = new qx.client.Command("Ctrl+F");
+      q8.addEventListener("execute", function(e) {
+        alert("Search");
+      });
+
+      var q9 = new qx.client.Command("Ctrl+G");
+      q9.addEventListener("execute", function(e) {
+        alert("Search Again");
+      });
+
+      var q10 = new qx.client.Command();
+      q10.addEventListener("execute", function(e) {
+        alert("Syntax Highlighting");
+      });
+
+      var q11 = new qx.client.Command("Esc");
+      q11.addEventListener("execute", function(e) {
+        alert("Escape");
+      });
+
+      var q12 = new qx.client.Command(null, qx.event.type.KeyEvent.keys.space);
+      q12.addEventListener("execute", function(e) {
+        alert("Space");
+      });
+
+
+
+
+      var m2 = new qx.ui.menu.Menu;
+
+      var mb2_01 = new qx.ui.menu.MenuButton("New Window");
+      var mb2_02 = new qx.ui.menu.MenuButton("Overlapping");
+      var mb2_03 = new qx.ui.menu.MenuButton("Split Vertical");
+      var mb2_04 = new qx.ui.menu.MenuButton("Split Horizontal");
+      var mb2_05 = new qx.ui.menu.MenuButton("Next Window");
+      var mb2_06 = new qx.ui.menu.MenuButton("Previous Window");
+
+      m2.add(mb2_01, mb2_02, mb2_03, mb2_04, mb2_05, mb2_06);
+
+
+
+
+      var m3 = new qx.ui.menu.Menu;
+
+      var mb3_01 = new qx.ui.menu.MenuButton("Tahoma, 11pt");
+      var mb3_02 = new qx.ui.menu.MenuButton("Tahoma, 12pt");
+      var mb3_03 = new qx.ui.menu.MenuButton("Tahoma, 13pt");
+      var mb3_04 = new qx.ui.menu.MenuButton("Tahoma, 14pt");
+      var mb3_05 = new qx.ui.menu.MenuButton("Tahoma, 15pt");
+
+      m3.add(mb3_01, mb3_02, mb3_03, mb3_04, mb3_05);
+
+
+
+      var m1 = new qx.ui.menu.Menu;
+
+      var mb1_01 = new qx.ui.menu.MenuButton("View/Lists", null, q12);
+      var mb1_02 = new qx.ui.menu.MenuButton("Syntax Highlighting", null, q10);
+      var ms1    = new qx.ui.menu.MenuSeparator();
+      var mb1_03 = new qx.ui.menu.MenuButton("Window Font", null, q11);
+      var mb1_04 = new qx.ui.menu.MenuButton("Printer Font", null, null, m3);
+      var ms2    = new qx.ui.menu.MenuSeparator();
+      var mb1_05 = new qx.ui.menu.MenuButton("Undo", null, q1);
+      var mb1_06 = new qx.ui.menu.MenuButton("Redo", null, q2);
+      var ms3    = new qx.ui.menu.MenuSeparator();
+      var mb1_07 = new qx.ui.menu.MenuButton("Cut", "icon/16/edit-cut.png", q3);
+      var mb1_08 = new qx.ui.menu.MenuButton("Copy", "icon/16/edit-copy.png", q4);
+      var mb1_09 = new qx.ui.menu.MenuButton("Paste", "icon/16/edit-paste.png", q5);
+      var mb1_10 = new qx.ui.menu.MenuButton("Delete", "icon/16/edit-delete.png", q6);
+      var mb1_11 = new qx.ui.menu.MenuButton("Select All", null, q7);
+      var ms4    = new qx.ui.menu.MenuSeparator();
+      var mb1_12 = new qx.ui.menu.MenuButton("Search", null, q8);
+      var mb1_13 = new qx.ui.menu.MenuButton("Search Again", null, q9);
+      var ms5    = new qx.ui.menu.MenuSeparator();
+      var mb1_14 = new qx.ui.menu.MenuButton("View", null, null, m2);
+      var mb1_15 = new qx.ui.menu.MenuButton("Editor Settings...");
+      var mb1_16 = new qx.ui.menu.MenuButton("Editor Plugins");
+      var mb1_17 = new qx.ui.menu.MenuButton("Framework Settings");
+
+      m1.add(mb1_01, mb1_02, ms1, mb1_03, mb1_04, ms2, mb1_05, mb1_06, ms3, mb1_07, mb1_08, mb1_09, mb1_10, mb1_11, ms4, mb1_12, mb1_13, ms5, mb1_14, mb1_15, mb1_16, mb1_17);
+
+
+      d.add(m1, m2, m3);
+
+
+
+
+
+      var w1 = new qx.ui.form.Button("Open");
+
+      w1.setTop(48);
+      w1.setLeft(20);
+
+      w1.addEventListener("click", function(e)
+      {
+        if (m1.isSeeable())
+        {
+          m1.hide();
+        }
+        else
+        {
+          var el = this.getElement();
+
+          m1.setLeft(qx.dom.DomLocation.getPageBoxLeft(el));
+          m1.setTop(qx.dom.DomLocation.getPageBoxBottom(el));
+
+          m1.show();
+        };
+
+        e.setPropagationStopped(true);
+      });
+
+      w1.addEventListener("mousedown", function(e)
+      {
+        e.setPropagationStopped(true);
+      });
+
+
+      d.add(w1);
+
+
+
+
+
+
+      // Icon Themes
+      qx.manager.object.ImageManager.getInstance().createThemeList(d, 180, 48);
+
+      // Color Themes
+      qx.manager.object.ColorManager.getInstance().createThemeList(d, 380, 48);
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/NativeWindow_1.html b/swat/apps/qooxdoo-examples/example/NativeWindow_1.html
new file mode 100644
index 0000000000..99bb6f7959
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/NativeWindow_1.html
@@ -0,0 +1,190 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Native Windows. Could be understood as an enhanced window.open with some additional options like to create modal windows.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var w1 = new qx.client.NativeWindow("http://www.google.com");
+
+    w1.setDimension(600, 400);
+
+
+
+
+
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    var btn1 = new qx.ui.form.Button("Open Native Window", "icon/16/appearance.png");
+    with(btn1)
+    {
+      setTop(48);
+      setLeft(20);
+
+      addEventListener("click", function() { w1.open(); } );
+    };
+
+    d.add(btn1);
+
+
+
+
+
+    var l = new qx.ui.layout.VerticalBoxLayout;
+    l.setLocation(20, 96);
+    l.setWidth("auto");
+    l.setHeight("auto");
+    d.add(l);
+
+    var fs1 = new qx.ui.groupbox.GroupBox("Initial Settings");
+    fs1.setHeight("auto");
+    l.add(fs1);
+
+
+    var chk1 = new qx.ui.form.CheckBox("Resizeable");
+    chk1.setLocation(0, 0);
+    chk1.setChecked(true);
+    chk1.addEventListener("changeChecked", function(e) {
+      w1.setResizeable(e.getData());
+    });
+
+    var chk2 = new qx.ui.form.CheckBox("Show Statusbar");
+    chk2.setLocation(0, 20);
+    chk2.setChecked(false);
+    chk2.addEventListener("changeChecked", function(e) {
+      w1.setShowStatusbar(e.getData());
+    });
+
+    var chk3 = new qx.ui.form.CheckBox("Show Menubar");
+    chk3.setLocation(0, 40);
+    chk3.setChecked(false);
+    chk3.addEventListener("changeChecked", function(e) {
+      w1.setShowMenubar(e.getData());
+    });
+
+    var chk4 = new qx.ui.form.CheckBox("Show Location");
+    chk4.setLocation(0, 60);
+    chk4.setChecked(false);
+    chk4.addEventListener("changeChecked", function(e) {
+      w1.setShowLocation(e.getData());
+    });
+
+    var chk5 = new qx.ui.form.CheckBox("Show Toolbar");
+    chk5.setLocation(0, 80);
+    chk5.setChecked(false);
+    chk5.addEventListener("changeChecked", function(e) {
+      w1.setShowToolbar(e.getData());
+    });
+
+    var chk6 = new qx.ui.form.CheckBox("Allow Scrollbars");
+    chk6.setLocation(0, 100);
+    chk6.setChecked(true);
+    chk6.addEventListener("changeChecked", function(e) {
+      w1.setAllowScrollbars(e.getData());
+    });
+
+    var chk7 = new qx.ui.form.CheckBox("Modal");
+    chk7.setLocation(0, 120);
+    chk7.setChecked(false);
+    chk7.addEventListener("changeChecked", function(e) {
+      w1.setModal(e.getData());
+    });
+
+    var chk8 = new qx.ui.form.CheckBox("Dependent");
+    chk8.setLocation(0, 140);
+    chk8.setChecked(true);
+    chk8.addEventListener("changeChecked", function(e) {
+      w1.setDependent(e.getData());
+    });
+
+    fs1.add(chk1, chk2, chk3, chk4, chk5, chk6, chk7, chk8);
+
+
+
+
+
+
+
+
+    var fs2 = new qx.ui.groupbox.GroupBox("Runtime Settings");
+    fs2.setHeight("auto");
+    l.add(fs2);
+
+
+
+    var tf1 = new qx.ui.form.TextField("http://www.google.com");
+    tf1.setLocation(0, 2);
+    tf1.setWidth(150);
+
+    var btn1 = new qx.ui.form.Button("Set Url", "icon/16/button-ok.png");
+    btn1.setLocation(155, 0);
+    btn1.addEventListener("click", function() {
+      w1.setUrl(tf1.getValue());
+    });
+
+
+
+
+    var tf2 = new qx.ui.form.TextField("600");
+    tf2.setLocation(0, 42);
+    tf2.setWidth(50);
+
+    var btn2 = new qx.ui.form.Button("Set Width", "icon/16/button-ok.png");
+    btn2.setLocation(55, 40);
+    btn2.addEventListener("click", function() {
+      w1.setWidth(parseInt(tf2.getValue()));
+    });
+
+
+
+
+    var tf3 = new qx.ui.form.TextField("400");
+    tf3.setLocation(0, 72);
+    tf3.setWidth(50);
+
+    var btn3 = new qx.ui.form.Button("Set Height", "icon/16/button-ok.png");
+    btn3.setLocation(55, 70);
+    btn3.addEventListener("click", function() {
+      w1.setHeight(parseInt(tf3.getValue()));
+    });
+
+
+
+    var btn4 = new qx.ui.form.Button("Center to screen", "icon/16/paint.png");
+    btn4.setLocation(0, 110);
+    btn4.addEventListener("click", function() {
+      w1.centerToScreen()
+    });
+
+    var btn5 = new qx.ui.form.Button("Center to screen area", "icon/16/paint.png");
+    btn5.setLocation(0, 140);
+    btn5.addEventListener("click", function() {
+      w1.centerToScreenArea()
+    });
+
+    var btn6 = new qx.ui.form.Button("Center to opener", "icon/16/paint.png");
+    btn6.setLocation(0, 170);
+    btn6.addEventListener("click", function() {
+      w1.centerToOpener()
+    });
+
+
+
+    fs2.add(tf1, btn1, tf2, btn2, tf3, btn3, btn4, btn5, btn6);
+  });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/RadioButton_1.html b/swat/apps/qooxdoo-examples/example/RadioButton_1.html
new file mode 100644
index 0000000000..6976cb5fbf
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/RadioButton_1.html
@@ -0,0 +1,114 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>    
+  
+  <div id="demoDescription"> 
+    <p>Tests for qx.ui.form.RadioButton. qx.ui.form.RadioButton extends qx.ui.basic.Atom and so it inherits all the options and properties defined there.</p>
+    <p>To group multiple QxRadioButtons you must define a instance of qx.manager.selection.RadioManager and add them to this new instance. All QxRadioButtons assigned to the same group make sure that only one of them is checked at the same time.</p>
+    <p>
+  </div>
+  
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+    
+    var rb1 = new qx.ui.form.RadioButton("Option #1", "rb1");
+    with(rb1)
+    {
+      setTop(80);
+      setLeft(20);
+    };
+    d.add(rb1);
+
+    var rb2 = new qx.ui.form.RadioButton("Option #2", "rb2");
+    with(rb2)
+    {
+      setTop(110);
+      setLeft(20);
+    };
+    d.add(rb2);
+    rb2.setChecked(true);
+    
+    
+    var rb3 = new qx.ui.form.RadioButton("Top RadioButton", "rb3");
+    with(rb3)
+    {
+      setTop(160);
+      setLeft(20);
+      setIconPosition("top");
+    };
+    d.add(rb3);
+    
+    var rb4 = new qx.ui.form.RadioButton("Bottom RadioButton", "rb4");
+    with(rb4)
+    {
+      setTop(160);
+      setLeft(160);
+      setIconPosition("bottom");
+    };
+    d.add(rb4);    
+
+
+    var rb5 = new qx.ui.form.RadioButton("Left RadioButton", "rb5");
+    with(rb5)
+    {
+      setTop(220);
+      setLeft(20);
+      setIconPosition("left");
+    };
+    d.add(rb5);
+    
+    var rb6 = new qx.ui.form.RadioButton("Right RadioButton", "rb6");
+    with(rb6)
+    {
+      setTop(220);
+      setLeft(160);
+      setIconPosition("right");
+    };
+    d.add(rb6);  
+    
+    var rb7 = new qx.ui.form.RadioButton(null, "rb7");
+    with(rb7)
+    {
+      setTop(280);
+      setLeft(20);
+    };
+    d.add(rb7);     
+    
+
+    var rg1 = new qx.manager.selection.RadioManager("mygroup", [rb1, rb2, rb3, rb4, rb5, rb6, rb7]);
+
+
+    
+
+
+    var linfo = new qx.ui.basic.Atom("Current Value: \"" + rg1.getSelected().getLabel() + "\" (" + rg1.getSelected().getValue() + ")", "icon/16/forward.png");
+
+    with(linfo)
+    {
+      setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+      setPadding(2, 4);
+      setBackgroundColor("white");
+      setTop(48);
+      setLeft(20);
+    };
+    
+    rg1.addEventListener("changeSelected", function(e) {
+      linfo.setLabel("Current Value: \"" + e.getData().getLabel() + "\" (" + e.getData().getValue() + ")");
+    });
+    
+    d.add(linfo);
+  });
+  </script>
+</body>
+</html>  
diff --git a/swat/apps/qooxdoo-examples/example/RepeatButton_1.html b/swat/apps/qooxdoo-examples/example/RepeatButton_1.html
new file mode 100644
index 0000000000..3858e7594a
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/RepeatButton_1.html
@@ -0,0 +1,73 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test the qx.ui.form.RepeatButton constructor. qx.ui.form.RepeatButton is based on qx.ui.form.Button but adds some interval handled event mechanism.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    function buttonExecute() { this.debug("Executed: " + this.getLabel()); };
+
+    var btn1 = new qx.ui.form.RepeatButton("Repeat Button No #1");
+    with(btn1)
+    {
+      setTop(48);
+      setLeft(20);
+      addEventListener("execute", buttonExecute);
+    };
+
+    d.add(btn1);
+
+
+
+    var btn2 = new qx.ui.form.RepeatButton("Repeat Button No #2");
+    with(btn2)
+    {
+      setTop(48);
+      setLeft(160);
+      addEventListener("execute", buttonExecute);
+      setEnabled(false);
+    };
+
+    d.add(btn2);
+
+
+
+    var btn3 = new qx.ui.form.RepeatButton("Repeat Button No #3");
+    with(btn3)
+    {
+      setTop(48);
+      setLeft(300);
+      addEventListener("execute", buttonExecute);
+    };
+
+    d.add(btn3);
+
+
+    var btn4 = new qx.ui.form.RepeatButton("Repeat Button No #4", "icon/16/forward.png");
+    with(btn4)
+    {
+      setTop(148);
+      setLeft(20);
+      addEventListener("execute", buttonExecute);
+    };
+
+    d.add(btn4);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/RpcTreeFullControl_1.html b/swat/apps/qooxdoo-examples/example/RpcTreeFullControl_1.html
new file mode 100644
index 0000000000..84c36576a4
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/RpcTreeFullControl_1.html
@@ -0,0 +1,192 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link
+   type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+
+  <div id="demoDescription">
+    <p>
+    Shows a tree which listens for tree events.  This script communicates via
+    JSON-RPC to a backend server.  Each time a new tree node is opened, the
+    children are requested from the server.  See the server-side functions
+    at backend/php/services/qooxdoo/fs.php.
+  </div>
+
+<script type="text/javascript">
+qx.core.Init.getInstance().defineMain(
+    function()
+    {
+        var addChildren = function(parent, children)
+        {
+            var t;
+            var trs;
+            var child;
+
+            for (i = 0; i < children.length; i++)
+            {
+                child = children[i];
+
+                trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().newRow();
+
+                // Here's our indentation and tree-lines
+                trs.addIndent();
+
+                // If not a file or directory, change the icon
+                var bIsDirectory = ((child.mode & 0040000) != 0);
+                var bIsFile = ((child.mode & 0100000) != 0);
+                if (! bIsDirectory && ! bIsFile)
+                {
+                    trs.addIcon("icon/16/desktop.png",
+                                "icon/16/dictionary.png");
+                }
+                else
+                {
+                    trs.addIcon();
+                }
+
+                // The label
+                trs.addLabel(child.name);
+
+                // All else should be right justified
+                obj = new qx.ui.basic.HorizontalSpacer;
+                trs.addObject(obj, true);
+
+                // Add the permissions
+                mode = "";
+                mode = ((child.mode & 0001) ? "x" : "-") + mode;
+                mode = ((child.mode & 0002) ? "w" : "-") + mode;
+                mode = ((child.mode & 0004) ? "r" : "-") + mode;
+                mode = ((child.mode & 0010) ? "x" : "-") + mode;
+                mode = ((child.mode & 0020) ? "w" : "-") + mode;
+                mode = ((child.mode & 0040) ? "r" : "-") + mode;
+                mode = ((child.mode & 0100) ? "x" : "-") + mode;
+                mode = ((child.mode & 0200) ? "w" : "-") + mode;
+                mode = ((child.mode & 0400) ? "r" : "-") + mode;
+                obj = new qx.ui.basic.Label(mode);
+                obj.setWidth(80);
+                obj.setStyleProperty("fontFamily", "monospace");
+                trs.addObject(obj, true);
+
+                // Add a file size, date and mode
+                obj = new qx.ui.basic.Label(child.size + "");
+                obj.setWidth(50);
+                obj.setStyleProperty("fontFamily", "monospace");
+                trs.addObject(obj, true);
+
+                var d = new Date();
+                d.setTime(child.mtime * 1000);
+                obj = new qx.ui.basic.Label(d.toString().slice(0,33));
+                obj.setWidth(200);
+                obj.setStyleProperty("fontFamily", "monospace");
+                trs.addObject(obj, true);
+
+                if (bIsDirectory)
+                {
+                    t = new qx.ui.treefullcontrol.TreeFolder(trs);
+                }
+                else
+                {
+                    t = new qx.ui.treefullcontrol.TreeFile(trs);
+                }
+                parent.add(t);
+            }
+        }
+
+        /*
+         * Reset the default of always showing the plus/minus symbol.  The
+         * default is 'false'.  We want to always display it for each folder
+         * (and then stop displaying it if we determine upon open that there
+         * are no contents).
+         */
+        var constructor = qx.OO.classes["qx.ui.treefullcontrol.TreeFolder"];
+        qx.Proto = constructor.prototype;
+        qx.OO.changeProperty({
+              name : "alwaysShowPlusMinusSymbol",
+              type : qx.constant.Type.BOOLEAN,
+              defaultValue : true });
+
+        var rpc = new qx.io.remote.Rpc();
+        rpc.setTimeout(10000);
+        rpc.setUrl("/services/");
+        rpc.setServiceName("qooxdoo.fs");
+        rpc.setCrossDomain(false);
+
+        var mycall = null;
+
+        var trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Root");
+        var t = new qx.ui.treefullcontrol.Tree(trs);
+
+        with(t)
+        {
+            setBackgroundColor(255);
+            setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+            setOverflow("scrollY");
+
+            setHeight(null);
+            setTop(48);
+            setLeft(20);
+            setWidth(700);
+            setBottom(48);
+
+            setHideNode(true);          // hide the root node
+            setUseTreeLines(true);      // display tree lines
+        };
+
+        /*
+         * All subtrees will use this root node's event listeners.  Create an
+         * event listener for an open while empty.
+         */
+        t.addEventListener(
+            qx.constant.Event.TREEOPENWHILEEMPTY,
+            function(e)
+            {
+                var parent = e.getData();
+                var hierarchy = parent.getHierarchy(new Array());
+
+                parent.debug("Requesting children...");
+
+                // Strip off the root node
+                hierarchy.shift();
+
+                mycall = rpc.callAsync(
+                    function(result, ex, id)
+                    {
+                        mycall = null;
+                        if (ex == null) {
+                            parent.debug("Children obtained.  Rendering...");
+                            addChildren(parent, result);
+                            parent.debug("Rendering complete.");
+                        } else {
+                            alert("Async(" + id + ") exception: " + ex);
+                        }
+                    },
+                    "readDirEntries",
+                    hierarchy,
+                    true);
+            });
+
+        qx.ui.core.ClientDocument.getInstance().add(t);
+
+        var trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Sandbox");
+        var tf = new qx.ui.treefullcontrol.TreeFolder(trs);
+        t.add(tf);
+    });
+/*
+ * Local Variables:
+ * mode: java
+ * End:
+ */
+</script>
+
+</body>
+</html>
+
diff --git a/swat/apps/qooxdoo-examples/example/Spinner_1.html b/swat/apps/qooxdoo-examples/example/Spinner_1.html
new file mode 100644
index 0000000000..05406d5c53
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Spinner_1.html
@@ -0,0 +1,106 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for qx.ui.form.Spinner.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+    var s1 = new qx.ui.form.Spinner;
+
+    with(s1)
+    {
+      setLeft(20);
+      setTop(64);
+    };
+
+    d.add(s1);
+
+    d.add( (new qx.ui.basic.Label("100").set({left:20, top:48})) );
+    d.add( (new qx.ui.basic.Label("0").set({left:20, top:90})) );
+
+    var s2 = new qx.ui.form.Spinner;
+
+    with(s2)
+    {
+      setLeft(100);
+      setTop(64);
+      setValue(30);
+      setMin(-30);
+      setMax(30);
+    };
+
+    d.add(s2);
+
+    d.add( (new qx.ui.basic.Label("30").set({left:100, top:48})) );
+    d.add( (new qx.ui.basic.Label("-30").set({left:100, top:90})) );
+
+    var s3 = new qx.ui.form.Spinner;
+
+    with(s3)
+    {
+      setLeft(180);
+      setTop(64);
+      setValue(0);
+      setMin(-3000);
+      setMax(3000);
+    };
+
+    d.add(s3);
+
+    d.add( (new qx.ui.basic.Label("3000").set({left:180, top:48})) );
+    d.add( (new qx.ui.basic.Label("-3000").set({left:180, top:90})) );
+
+    /*
+    s3._manager.addEventListener("changeValue", function(e) {
+      this.debug("Value: " + e.getData());
+    });
+    */
+
+    var s4 = new qx.ui.form.Spinner;
+    
+    with(s4)
+    {
+      setLeft(260);
+      setTop(64);
+      setValue(0);
+      setMin(100);
+      setMax(200);
+    };
+
+    d.add(s4);
+
+    d.add( (new qx.ui.basic.Label("200").set({left:260, top:48})) );
+    d.add( (new qx.ui.basic.Label("100").set({left:260, top:90})) );
+
+
+    var s5 = new qx.ui.form.Spinner( -200, null, -100);
+
+    with(s5)
+    {
+      setLeft(340);
+      setTop(64);
+    };
+
+    d.add(s5);
+
+    d.add( (new qx.ui.basic.Label("-100").set({left:340, top:48})) );
+    d.add( (new qx.ui.basic.Label("-200").set({left:340, top:90})) );
+
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/SplitPane_1.html b/swat/apps/qooxdoo-examples/example/SplitPane_1.html
new file mode 100644
index 0000000000..bdceb1f0a3
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/SplitPane_1.html
@@ -0,0 +1,70 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for Splitpane functionality.</p>
+  </div>
+
+  <script type="text/javascript">
+
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var frame = new qx.ui.layout.CanvasLayout;
+    frame.setLocation(20, 48);
+    frame.setBottom(48);
+    frame.setRight(300);
+    frame.setBackgroundColor("#134275");
+    frame.setPadding(20);
+    frame.addToDocument();
+
+    // the splitpane itself
+    var splitpane = new qx.ui.splitpane.HorizontalSplitPane("1*", "2*");
+    splitpane.setEdge(0);
+    frame.add(splitpane);
+
+    // left Widget
+    var leftWidget = new qx.ui.form.TextArea("LeftWidget");
+    leftWidget.setWrap(true);
+    leftWidget.setBackgroundColor(new qx.renderer.color.Color("white"));
+    leftWidget.setWidth("100%");
+    leftWidget.setHeight("100%");
+
+    // rightWidget (another splitpane)
+    var rightWidget = new qx.ui.splitpane.VerticalSplitPane;
+    rightWidget.setHeight("100%");
+    rightWidget.setWidth("100%");
+
+    // add widgets to splitpane
+    splitpane.addLeft(leftWidget);
+    splitpane.addRight(rightWidget);
+
+
+
+    // right top widget
+    var topWidget = new qx.ui.form.TextArea("Right Top Widget");
+    topWidget.setBackgroundColor(new qx.renderer.color.Color("white"));
+    topWidget.setHeight("100%");
+    topWidget.setWidth("100%");
+
+    // right bottom widget
+    var bottomWidget = new qx.ui.embed.Iframe("http://www.qooxdoo.org");
+    bottomWidget.setHeight("100%");
+    bottomWidget.setWidth("100%");
+
+    // add widgets to right splitpane
+    rightWidget.addTop(topWidget);
+    rightWidget.addBottom(bottomWidget);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/SplitPane_2.html b/swat/apps/qooxdoo-examples/example/SplitPane_2.html
new file mode 100644
index 0000000000..dfcbe27302
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/SplitPane_2.html
@@ -0,0 +1,72 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for Splitpane functionality with enabled live resize.</p>
+  </div>
+
+  <script type="text/javascript">
+
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var frame = new qx.ui.layout.CanvasLayout;
+    frame.setLocation(20, 48);
+    frame.setBottom(48);
+    frame.setRight(300);
+    frame.setBackgroundColor("#134275");
+    frame.setPadding(20);
+    frame.addToDocument();
+
+    // the splitpane itself
+    var splitpane = new qx.ui.splitpane.HorizontalSplitPane("1*", "2*");
+    splitpane.setEdge(0);
+    splitpane.setLiveResize(true);
+    frame.add(splitpane);
+
+    // left Widget
+    var leftWidget = new qx.ui.form.TextArea("LeftWidget");
+    leftWidget.setWrap(true);
+    leftWidget.setBackgroundColor(new qx.renderer.color.Color("white"));
+    leftWidget.setWidth("100%");
+    leftWidget.setHeight("100%");
+
+    // rightWidget (another splitpane)
+    var rightWidget = new qx.ui.splitpane.VerticalSplitPane;
+    rightWidget.setHeight("100%");
+    rightWidget.setWidth("100%");
+    rightWidget.setLiveResize(true);
+
+    // add widgets to splitpane
+    splitpane.addLeft(leftWidget);
+    splitpane.addRight(rightWidget);
+
+
+
+    // right top widget
+    var topWidget = new qx.ui.form.TextArea("Right Top Widget");
+    topWidget.setBackgroundColor(new qx.renderer.color.Color("white"));
+    topWidget.setHeight("100%");
+    topWidget.setWidth("100%");
+
+    // right bottom widget
+    var bottomWidget = new qx.ui.embed.Iframe("http://www.qooxdoo.org");
+    bottomWidget.setHeight("100%");
+    bottomWidget.setWidth("100%");
+
+    // add widgets to right splitpane
+    rightWidget.addTop(topWidget);
+    rightWidget.addBottom(bottomWidget);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/TabView_1.html b/swat/apps/qooxdoo-examples/example/TabView_1.html
new file mode 100644
index 0000000000..6269593810
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/TabView_1.html
@@ -0,0 +1,152 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Tabbar implementation.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    var tf1 = new qx.ui.pageview.tabview.TabView;
+    tf1.set({ left: 20, top: 48, right: 335, bottom: 48 });
+
+    var t1_1 = new qx.ui.pageview.tabview.TabViewButton("Edit");
+    var t1_2 = new qx.ui.pageview.tabview.TabViewButton("Find");
+    var t1_3 = new qx.ui.pageview.tabview.TabViewButton("Backup");
+
+    t1_1.setChecked(true);
+
+    tf1.getBar().add(t1_1, t1_2, t1_3);
+
+    var p1_1 = new qx.ui.pageview.tabview.TabViewPage(t1_1);
+    var p1_2 = new qx.ui.pageview.tabview.TabViewPage(t1_2);
+    var p1_3 = new qx.ui.pageview.tabview.TabViewPage(t1_3);
+
+    tf1.getPane().add(p1_1, p1_2, p1_3);
+
+    var f2 = new qx.ui.form.TextField("Find Anywhere");
+    var f3 = new qx.ui.form.TextField("Backup Input");
+
+    p1_2.add(f2);
+    p1_3.add(f3);
+
+    var c1 = new qx.ui.form.CheckBox("Place bar on top");
+    var c2 = new qx.ui.form.CheckBox("Align tabs to left");
+
+    c1.setTop(0);
+    c1.setChecked(true);
+
+    c2.setTop(20);
+    c2.setChecked(true);
+
+    p1_1.add(c1, c2);
+
+    c1.addEventListener("changeChecked", function(e) {
+      tf1.setPlaceBarOnTop(e.getData());
+    });
+
+    c2.addEventListener("changeChecked", function(e) {
+      tf1.setAlignTabsToLeft(e.getData());
+    });
+
+
+
+
+    var tf2 = new qx.ui.pageview.tabview.TabView;
+
+    tf2.set({ left: 0, top: 50, right: 0, bottom: 0 });
+
+
+
+    var t2_1 = new qx.ui.pageview.tabview.TabViewButton("Search for Files", "icon/16/file-open.png");
+    var t2_2 = new qx.ui.pageview.tabview.TabViewButton("Search the Web", "icon/16/network.png");
+    var t2_3 = new qx.ui.pageview.tabview.TabViewButton("Search for Text", "icon/16/contents.png");
+    var t2_4 = new qx.ui.pageview.tabview.TabViewButton("Search for Persons", "icon/16/emoticon.png");
+    var t2_5 = new qx.ui.pageview.tabview.TabViewButton("Search in Mails", "icon/16/mail.png");
+
+    t2_1.setChecked(true);
+
+    tf2.getBar().add(t2_1, t2_2, t2_3, t2_4, t2_5);
+
+    var p2_1 = new qx.ui.pageview.tabview.TabViewPage(t2_1);
+    var p2_2 = new qx.ui.pageview.tabview.TabViewPage(t2_2);
+    var p2_3 = new qx.ui.pageview.tabview.TabViewPage(t2_3);
+    var p2_4 = new qx.ui.pageview.tabview.TabViewPage(t2_4);
+    var p2_5 = new qx.ui.pageview.tabview.TabViewPage(t2_5);
+
+    tf2.getPane().add(p2_1, p2_2, p2_3, p2_4, p2_5);
+
+    var t2_1 = new qx.ui.form.TextField("Files...");
+    var t2_2 = new qx.ui.form.TextField("Web...");
+    var t2_3 = new qx.ui.form.TextField("Printers...");
+    var t2_4 = new qx.ui.form.TextField("Persons...");
+    var t2_5 = new qx.ui.form.TextField("Mails...");
+
+    t2_1.set({ top: 2, left: 0, width: 140 });
+    t2_2.set({ top: 2, left: 0, width: 140 });
+    t2_3.set({ top: 2, left: 0, width: 140 });
+    t2_4.set({ top: 2, left: 0, width: 140 });
+    t2_5.set({ top: 2, left: 0, width: 140 });
+
+    p2_1.add(t2_1);
+    p2_2.add(t2_2);
+    p2_3.add(t2_3);
+    p2_4.add(t2_4);
+    p2_5.add(t2_5);
+
+    var b2_1 = new qx.ui.form.Button("Search", "icon/16/search.png");
+    var b2_2 = new qx.ui.form.Button("Search", "icon/16/search.png");
+    var b2_3 = new qx.ui.form.Button("Search", "icon/16/search.png");
+    var b2_4 = new qx.ui.form.Button("Search", "icon/16/search.png");
+    var b2_5 = new qx.ui.form.Button("Search", "icon/16/search.png");
+
+    b2_1.set({ top: 0, left: 150 });
+    b2_2.set({ top: 0, left: 150 });
+    b2_3.set({ top: 0, left: 150 });
+    b2_4.set({ top: 0, left: 150 });
+    b2_5.set({ top: 0, left: 150 });
+
+    p2_1.add(b2_1);
+    p2_2.add(b2_2);
+    p2_3.add(b2_3);
+    p2_4.add(b2_4);
+    p2_5.add(b2_5);
+
+    function dosearch(e) {
+      alert("Searching...");
+    };
+
+    b2_1.addEventListener("click", dosearch);
+    b2_2.addEventListener("click", dosearch);
+    b2_3.addEventListener("click", dosearch);
+    b2_4.addEventListener("click", dosearch);
+    b2_5.addEventListener("click", dosearch);
+
+
+
+
+    p1_2.add(tf2);
+
+
+
+
+
+
+    d.add(tf1);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/TabView_2.html b/swat/apps/qooxdoo-examples/example/TabView_2.html
new file mode 100644
index 0000000000..df9dcbe039
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/TabView_2.html
@@ -0,0 +1,127 @@
+<html>
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+    <script type="text/javascript" src="../../script/qx.js"></script>
+  </head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Tabbar implementation.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    var tf1 = new qx.ui.pageview.tabview.TabView;
+    tf1.set({ left: 20, top: 48, right: 335, bottom: 48 });
+
+    var t1_1 = new qx.ui.pageview.tabview.TabViewButton("Edit");
+    var t1_2 = new qx.ui.pageview.tabview.TabViewButton("Find");
+    var t1_3 = new qx.ui.pageview.tabview.TabViewButton("Backup");
+    var t1_4 = new qx.ui.pageview.tabview.TabViewButton("System");
+    var t1_5 = new qx.ui.pageview.tabview.TabViewButton("Tools");
+    var t1_6 = new qx.ui.pageview.tabview.TabViewButton("Infos");
+
+    // set tab 1 active
+    t1_1.setChecked(true);    
+    
+    // add close images to tab
+    t1_1.setShowCloseButton(true);
+    t1_2.setShowCloseButton(true);
+    t1_3.setShowCloseButton(true);
+    t1_4.setShowCloseButton(true);
+    t1_5.setShowCloseButton(true);
+    t1_6.setShowCloseButton(true);
+
+    
+    // modify the default images
+    t1_2.setCloseButtonImage("icon/16/error.png");
+    t1_4.setCloseButtonImage("icon/16/apply.png");
+ 
+    // add an eventlistener on the buttons
+    t1_1.addEventListener("closetab", _ontabclose);
+    t1_2.addEventListener("closetab", _ontabclose);
+    t1_3.addEventListener("closetab", _ontabclose);
+    t1_4.addEventListener("closetab", _ontabclose);
+    t1_5.addEventListener("closetab", _ontabclose);
+    t1_6.addEventListener("closetab", _ontabclose);
+    
+    
+    
+    // this handler gets called if a tab-button fires a "closetab" event
+    function _ontabclose(e){
+      var btn = e.getData();
+      
+      var pagesArray = tf1.getPane().getChildren();
+      var pageSearched = null;
+      
+      for(var i = 0, l = pagesArray.length; i < l; i++){
+        var tmpPage = pagesArray[i];
+        if(tmpPage.getButton() === btn){
+          pageSearched = tmpPage;
+        }
+      }
+      if(pageSearched){
+
+        var itemsList = tf1.getBar().getChildren();
+        var lengthList = itemsList.length;    
+        var btnIndex = itemsList.indexOf(btn);
+      
+  // never remove the last tab
+        if( lengthList > 1 ) { 
+
+          // Select another tab
+          if (btnIndex < lengthList-1 ){
+            itemsList[btnIndex+1].setChecked(true);
+          }
+          else {
+            itemsList[btnIndex-1].setChecked(true);
+          }         
+          
+          btn.getManager().remove(btn);
+          tf1.getBar().remove(btn);
+          
+          tf1.getPane().remove(pageSearched);
+          
+          pageSearched.dispose();
+          btn.dispose();
+        } else {
+    alert("Last Tab won't be removed!");
+  }
+      }
+     
+      e.stopPropagation();
+    }
+    
+    tf1.getBar().add(t1_1, t1_2, t1_3, t1_4, t1_5, t1_6);
+
+    var p1_1 = new qx.ui.pageview.tabview.TabViewPage(t1_1);
+    var p1_2 = new qx.ui.pageview.tabview.TabViewPage(t1_2);
+    var p1_3 = new qx.ui.pageview.tabview.TabViewPage(t1_3);
+    var p1_4 = new qx.ui.pageview.tabview.TabViewPage(t1_4);
+    var p1_5 = new qx.ui.pageview.tabview.TabViewPage(t1_5);
+    var p1_6 = new qx.ui.pageview.tabview.TabViewPage(t1_6);
+
+    p1_1.setBackgroundColor("green");
+    p1_2.setBackgroundColor("red");
+    p1_3.setBackgroundColor("blue");
+    p1_4.setBackgroundColor("black");
+    p1_5.setBackgroundColor("yellow");
+    p1_6.setBackgroundColor("orange");
+    
+    tf1.getPane().add(p1_1, p1_2, p1_3, p1_4, p1_5, p1_6);
+
+    d.add(tf1);
+    
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/Table_1.html b/swat/apps/qooxdoo-examples/example/Table_1.html
new file mode 100644
index 0000000000..578d178d9e
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Table_1.html
@@ -0,0 +1,52 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>A table with virtual scrolling, model-view-controller, renderers,
+      fixed columns, editing, sorting, column resizing, column reordering,
+      column hiding.</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    // table model
+    var tableModel = new qx.ui.table.SimpleTableModel();
+    tableModel.setColumns([ "ID", "A number", "A date", "Boolean test" ]);
+    var rowData = [];
+    var now = new Date().getTime();
+    var dateRange = 400 * 24 * 60 * 60 * 1000; // 400 days
+    for (var row = 0; row < 100; row++) {
+      var date = new Date(now + Math.random() * dateRange - dateRange / 2);
+      rowData.push([ row, Math.random() * 10000, date, (Math.random() > 0.5) ]);
+    }
+    tableModel.setData(rowData);
+    tableModel.setColumnEditable(1, true);
+    tableModel.setColumnEditable(2, true);
+
+    // table
+    var table = new qx.ui.table.Table(tableModel);
+    with (table) {
+      set({ left:10, top:30, right:300, bottom:30 });
+      setMetaColumnCounts([1, -1]);
+      getSelectionModel().setSelectionMode(qx.ui.table.SelectionModel.MULTIPLE_INTERVAL_SELECTION);
+      getTableColumnModel().setDataCellRenderer(3, new qx.ui.table.BooleanDataCellRenderer());
+    };
+
+    d.add(table);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/ToolBar_1.html b/swat/apps/qooxdoo-examples/example/ToolBar_1.html
new file mode 100644
index 0000000000..a7ad9c6bfd
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ToolBar_1.html
@@ -0,0 +1,252 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Introduce all classes needed for creating real qx.ui.toolbar.ToolBars. This includes qx.ui.toolbar.ToolBars,
+    qx.ui.toolbar.ToolBarParts, qx.ui.toolbar.ToolBarSeparator and qx.ui.toolbar.ToolBarButtons.</p>
+
+    <p>The qx.ui.toolbar.ToolBarButtons and QxRadioButtons in this example are beautifully
+    decoupled by "global" qx.event.type.DataEvent.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var tb = new qx.ui.toolbar.ToolBar;
+      with(tb)
+      {
+        setTop(48);
+        setLeft(20);
+        setRight(335);
+        
+        // setWidth("auto");
+      };
+
+      var btns1 = [
+        { type : "button", icon : "file-new", text : "New" },
+        { type : "separator" },
+        { type : "button", icon : "edit-copy", text : "Copy" },
+        { type : "button", icon : "edit-cut", text : "Cut" },
+        { type : "button", icon : "edit-paste", text : "Paste" }
+      ];
+
+      var btns2 = [
+        { type : "button", icon : "up", text : "Upload" },
+        { type : "button", icon : "down", text : "Download" }
+      ];
+
+      var btns3 = [
+        { type : "button", icon : "help", text : "Help" }
+      ];
+
+      var bars = [ btns1, btns2, btns3 ];
+
+      function changeLayout(e) {
+        this.setShow(e.getData());
+      };
+      
+      function changeSize(e) {
+        var v = e.getData();
+        var o = v == 22 ? 32 : 22;
+        
+        this.setIcon(this.getIcon().replace(o, v));
+      };      
+      
+      function buttonExecute() { this.debug("Executed: " + this.getLabel()); };
+
+      var useParts = true;
+
+
+      for (var j=0; j<bars.length; j++)
+      {
+        var btns = bars[j];
+
+        if (useParts) {
+          var tbp = new qx.ui.toolbar.ToolBarPart;
+        };
+
+        for (var i=0; i<btns.length; i++)
+        {
+          var btn = btns[i];
+
+          switch(btn.type)
+          {
+            case "separator":
+              var o = new qx.ui.toolbar.ToolBarSeparator;
+              break;
+
+            case "button":
+              var o = new qx.ui.toolbar.ToolBarButton(btn.text, "icon/22/" + btn.icon + ".png");
+
+              // beautiful decoupling: toolbar buttons don't know about radio boxes
+
+              d.addEventListener("changeLayout", changeLayout, o);
+              d.addEventListener("changeSize", changeSize, o);
+              
+              o.addEventListener("execute", buttonExecute);
+              break;
+          };
+
+          if (useParts)
+          {
+            tbp.add(o);
+          }
+          else
+          {
+            tb.add(o);
+          };
+        };
+
+        if (useParts) {
+          tb.add(tbp);
+        };
+      };
+
+      d.add(tb);
+
+
+
+
+
+
+      var rd1 = new qx.ui.form.RadioButton("Show Icons and Label", "both");
+      var rd2 = new qx.ui.form.RadioButton("Show Icons", "icon");
+      var rd3 = new qx.ui.form.RadioButton("Show Label", "label");
+
+      with(rd1)
+      {
+        setTop(140);
+        setLeft(20);
+        setChecked(true);
+      };
+
+      with(rd2)
+      {
+        setTop(160);
+        setLeft(20);
+      };
+
+      with(rd3)
+      {
+        setTop(180);
+        setLeft(20);
+      };
+
+
+      var rbm = new qx.manager.selection.RadioManager();
+
+      rbm.add(rd1);
+      rbm.add(rd2);
+      rbm.add(rd3);
+
+
+      // beautiful decoupling: radio boxes don't know about toolbar buttons
+      rbm.addEventListener("changeSelected", function(e) {
+        d.dispatchEvent( new qx.event.type.DataEvent("changeLayout", e.getData().getValue() ) );
+      });
+
+      d.add(rd1, rd2, rd3);
+
+
+
+      // Alignment
+      var ra1 = new qx.ui.form.RadioButton("Left Aligned", "left");
+      var ra2 = new qx.ui.form.RadioButton("Centered", "center");
+      var ra3 = new qx.ui.form.RadioButton("Right Aligned", "right");
+
+      with(ra1)
+      {
+        setTop(140);
+        setLeft(220);
+        setChecked(true);
+      };
+
+      with(ra2)
+      {
+        setTop(160);
+        setLeft(220);
+      };
+
+      with(ra3)
+      {
+        setTop(180);
+        setLeft(220);
+      };
+
+
+      var ram = new qx.manager.selection.RadioManager();
+
+      ram.add(ra1);
+      ram.add(ra2);
+      ram.add(ra3);
+
+      d.add(ra1, ra2, ra3);
+
+      ram.addEventListener("changeSelected", function(e) {
+        tb.setHorizontalChildrenAlign(e.getData().getValue());
+      });
+
+
+
+
+      // Icon Sizes
+      var b3 = new qx.ui.form.Button("Icons: 22 Pixel", "icon/16/colors.png");
+
+      with(b3)
+      {
+        setTop(140);
+        setLeft(420);
+        setHorizontalAlign("center");
+      };
+
+      b3.addEventListener("execute", function(e) {
+        d.dispatchEvent(new qx.event.type.DataEvent("changeSize", 22));
+      });
+
+      var b4 = new qx.ui.form.Button("Icons: 32 Pixel", "icon/16/colors.png");
+
+      with(b4)
+      {
+        setTop(170);
+        setLeft(420);
+        setHorizontalAlign("center");
+      };
+
+      b4.addEventListener("execute", function(e) {
+        d.dispatchEvent(new qx.event.type.DataEvent("changeSize", 32));
+      });
+
+      d.add(b3, b4);
+      
+      
+      
+      
+
+      // Icon & Color Themes
+      qx.manager.object.ImageManager.getInstance().createThemeList(d, 20, 248);
+      qx.manager.object.ColorManager.getInstance().createThemeList(d, 220, 248);
+       
+
+     
+      /*
+      Test for cloning support
+      
+      tb2 = tb.clone(true);
+      tb2.setTop(400);
+      */
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ToolBar_2.html b/swat/apps/qooxdoo-examples/example/ToolBar_2.html
new file mode 100644
index 0000000000..849fc12b93
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ToolBar_2.html
@@ -0,0 +1,269 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Introducing qx.ui.toolbar.ToolBarCheckBox and qx.ui.toolbar.ToolBarRadioButton.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      function changeLayout(e) {
+        this.setShow(e.getData());
+      };
+
+      function changeSize(e) {
+        var v = e.getData();
+        var o = v == 22 ? 32 : 22;
+
+        this.setIcon(this.getIcon().replace(o, v));
+      };
+
+      var tb = new qx.ui.toolbar.ToolBar;
+      with(tb)
+      {
+        setTop(48);
+        setLeft(20);
+        setRight(335);
+        setParent(d);
+      };
+
+
+      var tbp1 = new qx.ui.toolbar.ToolBarPart;
+      tb.add(tbp1);
+
+      var tbp2 = new qx.ui.toolbar.ToolBarPart;
+      tb.add(tbp2);
+
+      var tbp3 = new qx.ui.toolbar.ToolBarPart;
+      tb.add(tbp3);
+
+      var tbp4 = new qx.ui.toolbar.ToolBarPart;
+      tb.add(tbp4);
+
+
+
+      // Default
+      var tbd1 = new qx.ui.toolbar.ToolBarButton("Default", "icon/22/file-new.png");
+      tbp1.add(tbd1);
+      d.addEventListener("changeLayout", changeLayout, tbd1);
+      d.addEventListener("changeSize", changeSize, tbd1);
+
+      tbd1._marker = true;
+
+      tbp1.setDisplay(false);
+      tbd1.setDisplay(false);
+
+
+
+      // Checkbox
+      var tbc1 = new qx.ui.toolbar.ToolBarCheckBox("Check", "icon/22/configure.png", true);
+      tbp2.add(tbc1);
+      d.addEventListener("changeLayout", changeLayout, tbc1);
+      d.addEventListener("changeSize", changeSize, tbc1);
+
+
+
+      // Radio
+      var tbr1 = new qx.ui.toolbar.ToolBarRadioButton("Radio1", "icon/22/view-choose.png");
+      tbp3.add(tbr1);
+      d.addEventListener("changeLayout", changeLayout, tbr1);
+      d.addEventListener("changeSize", changeSize, tbr1);
+
+      var tbr2 = new qx.ui.toolbar.ToolBarRadioButton("Radio2", "icon/22/view-detailed.png", true);
+      tbp3.add(tbr2);
+      d.addEventListener("changeLayout", changeLayout, tbr2);
+      d.addEventListener("changeSize", changeSize, tbr2);
+
+      var tbr3 = new qx.ui.toolbar.ToolBarRadioButton("Radio3", "icon/22/view-icon.png");
+      tbp3.add(tbr3);
+      d.addEventListener("changeLayout", changeLayout, tbr3);
+      d.addEventListener("changeSize", changeSize, tbr3);
+
+      // Radio Mananger
+      var tbr_manager = new qx.manager.selection.RadioManager(null, [tbr1, tbr2, tbr3]);
+
+
+
+
+      // Radio
+      var tbs1 = new qx.ui.toolbar.ToolBarRadioButton("Radio1", "icon/22/view-choose.png");
+      tbp4.add(tbs1);
+      tbs1.setDisableUncheck(true);
+      d.addEventListener("changeLayout", changeLayout, tbs1);
+      d.addEventListener("changeSize", changeSize, tbs1);
+
+      var tbs2 = new qx.ui.toolbar.ToolBarRadioButton("Radio2", "icon/22/view-detailed.png", true);
+      tbp4.add(tbs2);
+      tbs2.setDisableUncheck(true);
+      d.addEventListener("changeLayout", changeLayout, tbs2);
+      d.addEventListener("changeSize", changeSize, tbs2);
+
+      var tbs3 = new qx.ui.toolbar.ToolBarRadioButton("Radio3", "icon/22/view-icon.png");
+      tbp4.add(tbs3);
+      tbs3.setDisableUncheck(true);
+      d.addEventListener("changeLayout", changeLayout, tbs3);
+      d.addEventListener("changeSize", changeSize, tbs3);
+
+      // Radio Mananger
+      var tbs_manager = new qx.manager.selection.RadioManager(null, [tbs1, tbs2, tbs3]);
+
+
+
+
+      var rd1 = new qx.ui.form.RadioButton("Show Icons and Label", "both");
+      var rd2 = new qx.ui.form.RadioButton("Show Icons", "icon");
+      var rd3 = new qx.ui.form.RadioButton("Show Label", "label");
+
+      with(rd1)
+      {
+        setTop(140);
+        setLeft(20);
+      };
+
+      with(rd2)
+      {
+        setTop(160);
+        setLeft(20);
+      };
+
+      with(rd3)
+      {
+        setTop(180);
+        setLeft(20);
+      };
+
+
+      var rbm = new qx.manager.selection.RadioManager();
+
+      rbm.add(rd1);
+      rbm.add(rd2);
+      rbm.add(rd3);
+
+      // beautiful decoupling: radio boxes don't know about toolbar buttons
+      rbm.addEventListener("changeSelected", function(e)
+      {
+        d.dispatchEvent( new qx.event.type.DataEvent("changeLayout", e.getData().getValue() ) );
+      });
+
+      d.add(rd1, rd2, rd3);
+
+
+      // apply default layout
+      rd1.setChecked(true);
+
+
+
+
+
+      // Alignment
+      var ra1 = new qx.ui.form.RadioButton("Left Aligned", "left");
+      var ra2 = new qx.ui.form.RadioButton("Centered", "center");
+      var ra3 = new qx.ui.form.RadioButton("Right Aligned", "right");
+
+      with(ra1)
+      {
+        setTop(140);
+        setLeft(220);
+        setChecked(true);
+      };
+
+      with(ra2)
+      {
+        setTop(160);
+        setLeft(220);
+      };
+
+      with(ra3)
+      {
+        setTop(180);
+        setLeft(220);
+      };
+
+
+      var ram = new qx.manager.selection.RadioManager();
+
+      ram.add(ra1);
+      ram.add(ra2);
+      ram.add(ra3);
+
+      d.add(ra1, ra2, ra3);
+
+      ram.addEventListener("changeSelected", function(e) {
+        tb.setHorizontalChildrenAlign(e.getData().getValue());
+      });
+
+
+
+
+      // Icon Sizes
+      var b3 = new qx.ui.form.Button("Icons: 22 Pixel", "icon/16/colors.png");
+
+      with(b3)
+      {
+        setTop(140);
+        setLeft(420);
+        setHorizontalAlign("center");
+      };
+
+      b3.addEventListener("execute", function(e) {
+        d.dispatchEvent(new qx.event.type.DataEvent("changeSize", 22));
+      });
+
+      var b4 = new qx.ui.form.Button("Icons: 32 Pixel", "icon/16/colors.png");
+
+      with(b4)
+      {
+        setTop(170);
+        setLeft(420);
+        setHorizontalAlign("center");
+      };
+
+      b4.addEventListener("execute", function(e) {
+        d.dispatchEvent(new qx.event.type.DataEvent("changeSize", 32));
+      });
+
+      d.add(b3, b4);
+
+
+
+
+
+
+      var chkShowBtn1 = new qx.ui.form.CheckBox("Show First Button");
+
+      chkShowBtn1.setLocation(20, 500);
+      chkShowBtn1.addEventListener("changeChecked", function(e) {
+        tbd1.setDisplay(e.getData());
+      });
+
+      var chkShowPart1 = new qx.ui.form.CheckBox("Show First Part");
+
+      chkShowPart1.setLocation(220, 500);
+      chkShowPart1.addEventListener("changeChecked", function(e) {
+        tbp1.setDisplay(e.getData());
+      });
+
+      d.add(chkShowBtn1, chkShowPart1);
+
+
+
+      // Icon & Color Themes
+      qx.manager.object.ImageManager.getInstance().createThemeList(d, 20, 248);
+      qx.manager.object.ColorManager.getInstance().createThemeList(d, 220, 248);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ToolBar_3.html b/swat/apps/qooxdoo-examples/example/ToolBar_3.html
new file mode 100644
index 0000000000..391b144cbf
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ToolBar_3.html
@@ -0,0 +1,184 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Again a nice example which shows how to use qx.ui.toolbar.ToolBar as a menubar system.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+      
+      var c1 = new qx.client.Command();
+      c1.addEventListener("execute", function(e) {
+        this.debug("Execute: " + e.getData().getLabel());
+      });
+      
+      
+      
+
+      var m1 = new qx.ui.menu.Menu;
+      
+      var mb1_01 = new qx.ui.menu.MenuButton("New", null, c1);
+      var mb1_02 = new qx.ui.menu.MenuButton("Open", null, c1);
+      var mb1_03 = new qx.ui.menu.MenuButton("Save", null, c1);
+      var mb1_04 = new qx.ui.menu.MenuButton("Save as", null, c1);
+      var mb1_05 = new qx.ui.menu.MenuButton("Close", null, c1);
+      var mb1_06 = new qx.ui.menu.MenuButton("Restore last saved", null, c1);
+      
+      m1.add(mb1_01, mb1_02, mb1_03, mb1_04, mb1_05, mb1_06);
+
+
+      var m2 = new qx.ui.menu.Menu;
+
+      var mb2_01 = new qx.ui.menu.MenuButton("Undo", null, c1);
+      var mb2_02 = new qx.ui.menu.MenuButton("Redo", null, c1);
+      var mb2_b1 = new qx.ui.menu.MenuSeparator();
+      var mb2_03 = new qx.ui.menu.MenuButton("Cut", "icon/16/edit-cut.png", c1);
+      var mb2_04 = new qx.ui.menu.MenuButton("Copy", "icon/16/edit-copy.png", c1);
+      var mb2_05 = new qx.ui.menu.MenuButton("Paste", "icon/16/edit-paste.png", c1);
+      var mb2_06 = new qx.ui.menu.MenuButton("Delete", "icon/16/edit-delete.png", c1);
+      var mb2_b2 = new qx.ui.menu.MenuSeparator();
+      var mb2_07 = new qx.ui.menu.MenuButton("Select All", null, c1);
+      var mb2_08 = new qx.ui.menu.MenuButton("Find", null, c1);
+      var mb2_09 = new qx.ui.menu.MenuButton("Find Again", null, c1);
+      
+      
+      
+
+      mb2_05.setEnabled(false);
+      mb2_06.setEnabled(false);
+      mb2_09.setEnabled(false);
+      
+      m2.add(mb2_01, mb2_02, mb2_b1, mb2_03, mb2_04, mb2_05, mb2_06, mb2_b2, mb2_07, mb2_08, mb2_09);
+
+
+      var m3 = new qx.ui.menu.Menu;
+      var m3_suba = new qx.ui.menu.Menu;
+      var m3_subb = new qx.ui.menu.Menu;
+      var m3_subc = new qx.ui.menu.Menu;
+      var m3_subd = new qx.ui.menu.Menu;
+
+      var mb3_01 = new qx.ui.menu.MenuCheckBox("File List", c1, false);
+      var mb3_02 = new qx.ui.menu.MenuCheckBox("Syntax Highlighting", c1, true);
+      var mb3_03 = new qx.ui.menu.MenuCheckBox("Statusbar", c1, true);
+      var mb3_b1 = new qx.ui.menu.MenuSeparator();
+      var mb3_04 = new qx.ui.menu.MenuButton("Printer Font", null, null, m3_suba);
+      var mb3_05 = new qx.ui.menu.MenuButton("Editor Font", null, null, m3_subb);
+      var mb3_06 = new qx.ui.menu.MenuButton("Export Font", null, null, m3_subc);
+      var mb3_b2 = new qx.ui.menu.MenuSeparator();
+      var mb3_07 = new qx.ui.menu.MenuButton("Advanced", null, null, m3_subd);
+      
+      m3.add(mb3_01, mb3_02, mb3_03, mb3_b1, mb3_04, mb3_05, mb3_06, mb3_b2, mb3_07);
+      
+      var mb3_suba_01 = new qx.ui.menu.MenuButton("Tahoma, 11pt", null, c1);
+      var mb3_suba_02 = new qx.ui.menu.MenuButton("Tahoma, 12pt", null, c1);
+      var mb3_suba_03 = new qx.ui.menu.MenuButton("Tahoma, 13pt", null, c1);
+      var mb3_suba_04 = new qx.ui.menu.MenuButton("Tahoma, 14pt", null, c1);
+      var mb3_suba_05 = new qx.ui.menu.MenuButton("Tahoma, 15pt", null, c1);
+
+      m3_suba.add(mb3_suba_01, mb3_suba_02, mb3_suba_03, mb3_suba_04, mb3_suba_05);      
+      
+      var mb3_subb_01 = new qx.ui.menu.MenuButton("Verdana, 11pt", null, c1);
+      var mb3_subb_02 = new qx.ui.menu.MenuButton("Verdana, 12pt", null, c1);
+      var mb3_subb_03 = new qx.ui.menu.MenuButton("Verdana, 13pt", null, c1);
+      var mb3_subb_04 = new qx.ui.menu.MenuButton("Verdana, 14pt", null, c1);
+      var mb3_subb_05 = new qx.ui.menu.MenuButton("Verdana, 15pt", null, c1);
+
+      m3_subb.add(mb3_subb_01, mb3_subb_02, mb3_subb_03, mb3_subb_04, mb3_subb_05);      
+
+      var mb3_subc_01 = new qx.ui.menu.MenuButton("Courier, 11pt", null, c1);
+      var mb3_subc_02 = new qx.ui.menu.MenuButton("Courier, 12pt", null, c1);
+      var mb3_subc_03 = new qx.ui.menu.MenuButton("Courier, 13pt", null, c1);
+      var mb3_subc_04 = new qx.ui.menu.MenuButton("Courier, 14pt", null, c1);
+      var mb3_subc_05 = new qx.ui.menu.MenuButton("Courier, 15pt", null, c1);
+
+      m3_subc.add(mb3_subc_01, mb3_subc_02, mb3_subc_03, mb3_subc_04, mb3_subc_05);      
+      
+      var mb3_subd_02_suba = new qx.ui.menu.Menu();
+      
+      var mb3_subd_02_suba_01 = new qx.ui.menu.MenuButton("First", null, c1);
+      var mb3_subd_02_suba_02 = new qx.ui.menu.MenuButton("Second", null, c1);
+      var mb3_subd_02_suba_03 = new qx.ui.menu.MenuButton("Third", null, c1);
+      
+      mb3_subd_02_suba.add(mb3_subd_02_suba_01, mb3_subd_02_suba_02, mb3_subd_02_suba_03);
+      
+      var mb3_subd_01 = new qx.ui.menu.MenuButton("First", null, c1);
+      var mb3_subd_02 = new qx.ui.menu.MenuButton("Second", null, c1, mb3_subd_02_suba);
+      var mb3_subd_03 = new qx.ui.menu.MenuButton("Third", null, c1);
+
+      m3_subd.add(mb3_subd_01, mb3_subd_02, mb3_subd_03);
+      
+      var m4 = new qx.ui.menu.Menu;
+      
+      var m4_suba = new qx.ui.menu.Menu;      
+
+      var mb4_01 = new qx.ui.menu.MenuButton("View", null, c1, m4_suba);
+      var mb4_b1 = new qx.ui.menu.MenuSeparator();
+      var mb4_02 = new qx.ui.menu.MenuButton("Editor Preferences...", null, c1);
+      var mb4_03 = new qx.ui.menu.MenuButton("Editor Extensions", null, c1);
+      var mb4_04 = new qx.ui.menu.MenuButton("Framework Preferences", null, c1);
+
+      m4.add(mb4_01, mb4_b1, mb4_02, mb4_03, mb4_04);
+      
+      var mb4_suba_01 = new qx.ui.menu.MenuButton("New Window", null, c1);
+      var mb4_suba_b1 = new qx.ui.menu.MenuSeparator();
+      var mb4_suba_02 = new qx.ui.menu.MenuRadioButton("Overlapping", c1, true);
+      var mb4_suba_03 = new qx.ui.menu.MenuRadioButton("Split Horizontally", c1);
+      var mb4_suba_04 = new qx.ui.menu.MenuRadioButton("Split Vertically", c1);
+      var mb4_suba_b2 = new qx.ui.menu.MenuSeparator();
+      var mb4_suba_05 = new qx.ui.menu.MenuButton("Next Window", null, c1);
+      var mb4_suba_06 = new qx.ui.menu.MenuButton("Previous Window", null, c1);
+
+      m4_suba.add(mb4_suba_01, mb4_suba_b1, mb4_suba_02, mb4_suba_03, mb4_suba_04, mb4_suba_b2, mb4_suba_05, mb4_suba_06);
+
+      var mb4_manager = new qx.manager.selection.RadioManager("windowMode", [ mb4_suba_02, mb4_suba_03, mb4_suba_04 ]);
+
+ 
+      var m5 = new qx.ui.menu.Menu;
+      
+      var mb5_01 = new qx.ui.menu.MenuButton("Help", null, c1);
+      var mb5_02 = new qx.ui.menu.MenuButton("About", null, c1);
+      
+      m5.add(mb5_01, mb5_02);
+      
+      d.add(m1, m2, m3, m3_suba, m3_subb, m3_subc, m3_subd, mb3_subd_02_suba, m4, m4_suba, m5);
+
+
+      var mb1 = new qx.ui.toolbar.ToolBar;
+      
+      mb1.setTop(48);
+      mb1.setRight(335);
+      mb1.setLeft(20);      
+      
+      var mbb1 = new qx.ui.toolbar.ToolBarMenuButton("File", m1);
+      var mbb2 = new qx.ui.toolbar.ToolBarMenuButton("Edit", m2);
+      var mbb3 = new qx.ui.toolbar.ToolBarMenuButton("View", m3);
+      var mbb4 = new qx.ui.toolbar.ToolBarMenuButton("Options", m4);
+      var mbb5 = new qx.ui.toolbar.ToolBarMenuButton("Help", m5);
+            
+      mb1.add(mbb1, mbb2, mbb3, mbb4, mbb5);
+      
+      d.add(mb1);
+      
+      
+      
+
+      // Icon & Color Themes
+      qx.manager.object.ImageManager.getInstance().createThemeList(d, 20, 348);
+      qx.manager.object.ColorManager.getInstance().createThemeList(d, 220, 348);      
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ToolBar_4.html b/swat/apps/qooxdoo-examples/example/ToolBar_4.html
new file mode 100644
index 0000000000..c8d6b83661
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ToolBar_4.html
@@ -0,0 +1,196 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Again a nice example which shows how to use qx.ui.toolbar.ToolBar as a menubar system.</p>
+    <p>Added some parts and a new flex zone which aligns the help button to the right edge</p>
+    <p>Added some image and a qx.ui.toolbar.ToolBarCheckBox, you can event combine all these features as you can easily see here.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var d = qx.ui.core.ClientDocument.getInstance();
+
+      var c1 = new qx.client.Command();
+      c1.addEventListener("execute", function(e) {
+        this.debug("Execute: " + e.getData().getLabel());
+      });
+
+
+
+
+      var m1 = new qx.ui.menu.Menu;
+
+      var mb1_01 = new qx.ui.menu.MenuButton("New", null, c1);
+      var mb1_02 = new qx.ui.menu.MenuButton("Open", null, c1);
+      var mb1_03 = new qx.ui.menu.MenuButton("Save", null, c1);
+      var mb1_04 = new qx.ui.menu.MenuButton("Save as", null, c1);
+      var mb1_05 = new qx.ui.menu.MenuButton("Close", null, c1);
+      var mb1_06 = new qx.ui.menu.MenuButton("Restore last saved", null, c1);
+
+      m1.add(mb1_01, mb1_02, mb1_03, mb1_04, mb1_05, mb1_06);
+
+
+      var m2 = new qx.ui.menu.Menu;
+
+      var mb2_01 = new qx.ui.menu.MenuButton("Undo", null, c1);
+      var mb2_02 = new qx.ui.menu.MenuButton("Redo", null, c1);
+      var mb2_b1 = new qx.ui.menu.MenuSeparator();
+      var mb2_03 = new qx.ui.menu.MenuButton("Cut", "icon/16/edit-cut.png", c1);
+      var mb2_04 = new qx.ui.menu.MenuButton("Copy", "icon/16/edit-copy.png", c1);
+      var mb2_05 = new qx.ui.menu.MenuButton("Paste", "icon/16/edit-paste.png", c1);
+      var mb2_06 = new qx.ui.menu.MenuButton("Delete", "icon/16/edit-delete.png", c1);
+      var mb2_b2 = new qx.ui.menu.MenuSeparator();
+      var mb2_07 = new qx.ui.menu.MenuButton("Select All", null, c1);
+      var mb2_08 = new qx.ui.menu.MenuButton("Find", null, c1);
+      var mb2_09 = new qx.ui.menu.MenuButton("Find Again", null, c1);
+
+
+
+
+      mb2_05.setEnabled(false);
+      mb2_06.setEnabled(false);
+      mb2_09.setEnabled(false);
+
+      m2.add(mb2_01, mb2_02, mb2_b1, mb2_03, mb2_04, mb2_05, mb2_06, mb2_b2, mb2_07, mb2_08, mb2_09);
+
+
+      var m3 = new qx.ui.menu.Menu;
+      var m3_suba = new qx.ui.menu.Menu;
+      var m3_subb = new qx.ui.menu.Menu;
+      var m3_subc = new qx.ui.menu.Menu;
+      var m3_subd = new qx.ui.menu.Menu;
+
+      var mb3_01 = new qx.ui.menu.MenuCheckBox("File List", c1, false);
+      var mb3_02 = new qx.ui.menu.MenuCheckBox("Syntax Highlighting", c1, true);
+      var mb3_03 = new qx.ui.menu.MenuCheckBox("Statusbar", c1, true);
+      var mb3_b1 = new qx.ui.menu.MenuSeparator();
+      var mb3_04 = new qx.ui.menu.MenuButton("Printer Font", null, null, m3_suba);
+      var mb3_05 = new qx.ui.menu.MenuButton("Editor Font", null, null, m3_subb);
+      var mb3_06 = new qx.ui.menu.MenuButton("Export Font", null, null, m3_subc);
+      var mb3_b2 = new qx.ui.menu.MenuSeparator();
+      var mb3_07 = new qx.ui.menu.MenuButton("Advanced", null, null, m3_subd);
+
+      m3.add(mb3_01, mb3_02, mb3_03, mb3_b1, mb3_04, mb3_05, mb3_06, mb3_b2, mb3_07);
+
+      var mb3_suba_01 = new qx.ui.menu.MenuButton("Tahoma, 11pt", null, c1);
+      var mb3_suba_02 = new qx.ui.menu.MenuButton("Tahoma, 12pt", null, c1);
+      var mb3_suba_03 = new qx.ui.menu.MenuButton("Tahoma, 13pt", null, c1);
+      var mb3_suba_04 = new qx.ui.menu.MenuButton("Tahoma, 14pt", null, c1);
+      var mb3_suba_05 = new qx.ui.menu.MenuButton("Tahoma, 15pt", null, c1);
+
+      m3_suba.add(mb3_suba_01, mb3_suba_02, mb3_suba_03, mb3_suba_04, mb3_suba_05);
+
+      var mb3_subb_01 = new qx.ui.menu.MenuButton("Verdana, 11pt", null, c1);
+      var mb3_subb_02 = new qx.ui.menu.MenuButton("Verdana, 12pt", null, c1);
+      var mb3_subb_03 = new qx.ui.menu.MenuButton("Verdana, 13pt", null, c1);
+      var mb3_subb_04 = new qx.ui.menu.MenuButton("Verdana, 14pt", null, c1);
+      var mb3_subb_05 = new qx.ui.menu.MenuButton("Verdana, 15pt", null, c1);
+
+      m3_subb.add(mb3_subb_01, mb3_subb_02, mb3_subb_03, mb3_subb_04, mb3_subb_05);
+
+      var mb3_subc_01 = new qx.ui.menu.MenuButton("Courier, 11pt", null, c1);
+      var mb3_subc_02 = new qx.ui.menu.MenuButton("Courier, 12pt", null, c1);
+      var mb3_subc_03 = new qx.ui.menu.MenuButton("Courier, 13pt", null, c1);
+      var mb3_subc_04 = new qx.ui.menu.MenuButton("Courier, 14pt", null, c1);
+      var mb3_subc_05 = new qx.ui.menu.MenuButton("Courier, 15pt", null, c1);
+
+      m3_subc.add(mb3_subc_01, mb3_subc_02, mb3_subc_03, mb3_subc_04, mb3_subc_05);
+
+      var mb3_subd_02_suba = new qx.ui.menu.Menu();
+
+      var mb3_subd_02_suba_01 = new qx.ui.menu.MenuButton("First", null, c1);
+      var mb3_subd_02_suba_02 = new qx.ui.menu.MenuButton("Second", null, c1);
+      var mb3_subd_02_suba_03 = new qx.ui.menu.MenuButton("Third", null, c1);
+
+      mb3_subd_02_suba.add(mb3_subd_02_suba_01, mb3_subd_02_suba_02, mb3_subd_02_suba_03);
+
+      var mb3_subd_01 = new qx.ui.menu.MenuButton("First", null, c1);
+      var mb3_subd_02 = new qx.ui.menu.MenuButton("Second", null, c1, mb3_subd_02_suba);
+      var mb3_subd_03 = new qx.ui.menu.MenuButton("Third", null, c1);
+
+      m3_subd.add(mb3_subd_01, mb3_subd_02, mb3_subd_03);
+
+      var m4 = new qx.ui.menu.Menu;
+
+      var m4_suba = new qx.ui.menu.Menu;
+
+      var mb4_01 = new qx.ui.menu.MenuButton("View", null, c1, m4_suba);
+      var mb4_b1 = new qx.ui.menu.MenuSeparator();
+      var mb4_02 = new qx.ui.menu.MenuButton("Editor Preferences...", null, c1);
+      var mb4_03 = new qx.ui.menu.MenuButton("Editor Extensions", null, c1);
+      var mb4_04 = new qx.ui.menu.MenuButton("Framework Preferences", null, c1);
+
+      m4.add(mb4_01, mb4_b1, mb4_02, mb4_03, mb4_04);
+
+      var mb4_suba_01 = new qx.ui.menu.MenuButton("New Window", null, c1);
+      var mb4_suba_b1 = new qx.ui.menu.MenuSeparator();
+      var mb4_suba_02 = new qx.ui.menu.MenuRadioButton("Overlapping", c1, true);
+      var mb4_suba_03 = new qx.ui.menu.MenuRadioButton("Split Horizontally", c1);
+      var mb4_suba_04 = new qx.ui.menu.MenuRadioButton("Split Vertically", c1);
+      var mb4_suba_b2 = new qx.ui.menu.MenuSeparator();
+      var mb4_suba_05 = new qx.ui.menu.MenuButton("Next Window", null, c1);
+      var mb4_suba_06 = new qx.ui.menu.MenuButton("Previous Window", null, c1);
+
+      m4_suba.add(mb4_suba_01, mb4_suba_b1, mb4_suba_02, mb4_suba_03, mb4_suba_04, mb4_suba_b2, mb4_suba_05, mb4_suba_06);
+
+      var mb4_manager = new qx.manager.selection.RadioManager("windowMode", [ mb4_suba_02, mb4_suba_03, mb4_suba_04 ]);
+
+
+      var m5 = new qx.ui.menu.Menu;
+
+      var mb5_01 = new qx.ui.menu.MenuButton("Help", null, c1);
+      var mb5_02 = new qx.ui.menu.MenuButton("About", null, c1);
+
+      m5.add(mb5_01, mb5_02);
+
+      d.add(m1, m2, m3, m3_suba, m3_subb, m3_subc, m3_subd, mb3_subd_02_suba, m4, m4_suba, m5);
+
+
+      var mb1 = new qx.ui.toolbar.ToolBar;
+
+      mb1.setTop(48);
+      mb1.setRight(335);
+      mb1.setLeft(20);
+
+      var mp1 = new qx.ui.toolbar.ToolBarPart;
+      var mp2 = new qx.ui.toolbar.ToolBarPart;
+      var mp3 = new qx.ui.toolbar.ToolBarPart;
+
+      mb1.add(mp1, mp2, new qx.ui.basic.HorizontalSpacer, mp3);
+
+      var mbb1 = new qx.ui.toolbar.ToolBarMenuButton("File", m1, "icon/16/file-new.png");
+      var mbb2 = new qx.ui.toolbar.ToolBarMenuButton("Edit", m2, "icon/16/edit.png");
+      var mbb3 = new qx.ui.toolbar.ToolBarMenuButton("View", m3, "icon/16/appearance.png");
+      var mbb4 = new qx.ui.toolbar.ToolBarMenuButton("Options", m4, "icon/16/control-center.png");
+      var mbb5 = new qx.ui.toolbar.ToolBarMenuButton("Help", m5, "icon/16/help.png");
+
+      var tbb1 = new qx.ui.toolbar.ToolBarCheckBox("Checkbox", "icon/16/chart.png", true);
+
+      mp1.add(mbb1, mbb2);
+      mp2.add(mbb3, mbb4, tbb1);
+      mp3.add(mbb5);
+
+      d.add(mb1);
+
+
+
+
+      // Icon & Color Themes
+      qx.manager.object.ImageManager.getInstance().createThemeList(d, 20, 348);
+      qx.manager.object.ColorManager.getInstance().createThemeList(d, 220, 348);
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/ToolTip_1.html b/swat/apps/qooxdoo-examples/example/ToolTip_1.html
new file mode 100644
index 0000000000..9beebd57a1
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/ToolTip_1.html
@@ -0,0 +1,111 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Test for QxToolTips. Each qx.ui.popup.ToolTip could be assigned to any
+    instance of qx.ui.core.Widget. You could also use one qx.ui.popup.ToolTip instance
+    for multiple QxWidgets (to show the same tooltip any multiple items).</p>
+  </div>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    var c1 = new qx.ui.basic.Atom("Hover me");
+    with(c1)
+    {
+      setTop(48);
+      setLeft(20);
+      setBackgroundColor(new qx.renderer.color.Color("#BDD2EF"));
+      setWidth(100);
+      setHeight(100);
+      setTabIndex(1);
+      setBorder(qx.renderer.border.BorderPresets.getInstance().outset);
+    };
+    d.add(c1);
+
+
+
+    var c2 = new qx.ui.basic.Atom("Hover me");
+    with(c2)
+    {
+      setTop(48);
+      setLeft(140);
+      setBackgroundColor(new qx.renderer.color.Color("#D1DFAD"));
+      setWidth(100);
+      setHeight(100);
+      setTabIndex(1);
+      setBorder(qx.renderer.border.BorderPresets.getInstance().outset);
+    };
+    d.add(c2);
+
+
+    var c3 = new qx.ui.basic.Atom("Hover me");
+    with(c3)
+    {
+      setTop(48);
+      setLeft(260);
+      setBackgroundColor(new qx.renderer.color.Color("#D1A4AD"));
+      setWidth(100);
+      setHeight(100);
+      setTabIndex(1);
+      setBorder(qx.renderer.border.BorderPresets.getInstance().outset);
+    };
+    d.add(c3);
+
+
+    var c4 = new qx.ui.basic.Atom("Hover me");
+    with(c4)
+    {
+      setTop(48);
+      setLeft(380);
+      setBackgroundColor(new qx.renderer.color.Color("#F5E0BB"));
+      setWidth(100);
+      setHeight(100);
+      setTabIndex(1);
+      setBorder(qx.renderer.border.BorderPresets.getInstance().outset);
+    };
+    d.add(c4);
+
+
+    var c5 = new qx.ui.basic.Atom("Hover me", "icon/32/colors.png");
+    with(c5)
+    {
+      setTop(248);
+      setLeft(20);
+      setBackgroundColor(new qx.renderer.color.Color("#F5E0BB"));
+      setTabIndex(1);
+      setBorder(qx.renderer.border.BorderPresets.getInstance().outset);
+      setPadding(4);
+    };
+    d.add(c5);
+
+
+    var tt1 = new qx.ui.popup.ToolTip("Hello World #1");
+    c1.setToolTip(tt1);
+    c2.setToolTip(tt1);
+
+    var tt2 = new qx.ui.popup.ToolTip(null, "icon/16/help.png");
+    c3.setToolTip(tt2);
+
+    var tt3 = new qx.ui.popup.ToolTip("Hello World #3", "icon/16/help.png");
+    c4.setToolTip(tt3);
+
+    var tt4 = new qx.ui.popup.ToolTip("Such a great tooltip with a<br/>(show) timeout of 50ms.", "icon/32/bug.png");
+    c5.setToolTip(tt4);
+    tt4.setShowInterval(50);
+  });
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/swat/apps/qooxdoo-examples/example/TreeFullControl_1.html b/swat/apps/qooxdoo-examples/example/TreeFullControl_1.html
new file mode 100644
index 0000000000..e46e855dc2
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/TreeFullControl_1.html
@@ -0,0 +1,235 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Shows a tree, with user-defined icons for some nodes.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Root");
+      var t = new qx.ui.treefullcontrol.Tree(trs);
+
+      with(t)
+      {
+        setBackgroundColor(255);
+        setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+        setOverflow("scrollY");
+
+        setHeight(null);
+        setTop(48);
+        setLeft(20);
+        setWidth(200);
+        setBottom(48);
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(t);
+      // One icon for selected and one for unselected states
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Desktop", "icon/16/desktop.png", "icon/16/dictionary.png");
+      var te1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      t.add(te1);
+
+      desktop = te1;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Files");
+      var te1_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Workspace");
+      var te1_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Network");
+      var te1_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Trash");
+      var te1_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te1.add(te1_1, te1_2, te1_3, te1_4);
+
+      // One icon specified, and used for both selected unselected states
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Windows (C:)", "icon/16/harddrive.png");
+      var te1_2_1 = new qx.ui.treefullcontrol.TreeFile(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Documents (D:)", "icon/16/harddrive.png");
+      var te1_2_2 = new qx.ui.treefullcontrol.TreeFile(trs);
+
+      te1_2.add(te1_2_1, te1_2_2);
+
+      arbeitsplatz = te1_2;
+
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Inbox");
+      var te2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      posteingang = te2;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Presets");
+      var te2_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Sent");
+      var te2_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Trash", "icon/16/trash.png");
+      var te2_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Data");
+      var te2_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Edit");
+      var te2_5 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      editieren = te2_5;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Chat");
+      var te2_5_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Pustefix");
+      var te2_5_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("TINC");
+      var te2_5_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Announce");
+      var te2_5_3_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Devel");
+      var te2_5_3_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_5_3.add(te2_5_3_1, te2_5_3_2);
+
+      te2_5.add(te2_5_1, te2_5_2, te2_5_3);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Lists");
+      var te2_6 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Relations");
+      var te2_6_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Company");
+      var te2_6_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Questions");
+      var te2_6_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Internal");
+      var te2_6_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Products");
+      var te2_6_5 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Press");
+      var te2_6_6 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Development");
+      var te2_6_7 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Competition");
+      var te2_6_8 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_6.add(te2_6_1, te2_6_2, te2_6_3, te2_6_4, te2_6_5, te2_6_6, te2_6_7, te2_6_8);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Personal");
+      var te2_7 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Bugs");
+      var te2_7_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Family");
+      var te2_7_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Projects");
+      var te2_7_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Holiday");
+      var te2_7_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_7.add(te2_7_1, te2_7_2, te2_7_3, te2_7_4);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Big");
+      var te2_8 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      for (var i=0;i<50; i++) {
+        trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Item " + i);
+        te2_8.add(new qx.ui.treefullcontrol.TreeFolder(trs));
+      };
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Spam");
+      var te2_9 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      spam = te2_9;
+
+      te2.add(te2_1, te2_2, te2_3, te2_4, te2_5, te2_6, te2_7, te2_8, te2_9);
+
+      t.add(te2);
+      qx.ui.core.ClientDocument.getInstance().add(t);
+
+
+
+
+
+
+      var commandFrame = new qx.ui.groupbox.GroupBox("Control");
+
+      with(commandFrame)
+      {
+        setTop(48);
+        setLeft(250);
+
+        setWidth("auto");
+        setHeight("auto");
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(commandFrame);
+
+
+
+
+      var tCurrentLabel = new qx.ui.basic.Atom("Current Folder: ");
+
+      with(tCurrentLabel)
+      {
+        setLeft(0);
+        setTop(0);
+      };
+
+      commandFrame.add(tCurrentLabel);
+
+
+
+      var tCurrentInput = new qx.ui.form.TextField;
+
+      with(tCurrentInput)
+      {
+        setLeft(0);
+        setRight(0);
+        setTop(20);
+
+        setReadOnly(true);
+      };
+
+      commandFrame.add(tCurrentInput);
+
+      t.getManager().addEventListener("changeSelection", function(e) {
+        tCurrentInput.setValue(e.getData()[0]._labelObject.getHtml());
+      });
+
+
+
+      var tDoubleClick = new qx.ui.form.CheckBox("Use double click?");
+
+      with(tDoubleClick) {
+        setTop(60);
+        setLeft(0);
+      };
+
+      commandFrame.add(tDoubleClick);
+
+      tDoubleClick.addEventListener("changeChecked", function(e) { t.setUseDoubleClick(e.getData()); });
+
+
+
+
+      var tTreeLines = new qx.ui.form.CheckBox("Use tree lines?");
+
+      with(tTreeLines) {
+        setTop(80);
+        setLeft(0);
+        setChecked(true);
+      };
+
+      commandFrame.add(tTreeLines);
+
+      tTreeLines.addEventListener("changeChecked", function(e) { t.setUseTreeLines(e.getData()); });
+
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/TreeFullControl_2.html b/swat/apps/qooxdoo-examples/example/TreeFullControl_2.html
new file mode 100644
index 0000000000..18c7cdafa4
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/TreeFullControl_2.html
@@ -0,0 +1,270 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+<p>Shows a tree, with user-defined extra fields.  In this example, the extra
+fields include a left-justified icon, a checkbox between the node icon and the
+label, and a whole series of right-justified fields.  Additionally, the root node may be hidden. </p>
+  </div>
+
+  <script type="text/javascript">
+    var treeRowStructure;
+
+    function stuff(vLabel, vIcon, vIconSelected)
+    {
+        treeRowStructure = qx.ui.treefullcontrol.TreeRowStructure.getInstance().newRow();
+
+        // A left-justified icon
+        if (Math.floor(Math.random() * 4) == 0)
+        {
+          obj = new qx.ui.basic.Image("icon/16/alarm.png", 16);
+        }
+        else
+        {
+          obj = new qx.ui.basic.Image(null, 16);
+        }
+        treeRowStructure.addObject(obj, true);
+
+        // Here's our indentation and tree-lines
+        treeRowStructure.addIndent();
+
+        // The standard tree icon follows
+        treeRowStructure.addIcon(
+          arguments.length >= 2 ? vIcon : "icon/16/desktop.png",
+          arguments.length >= 3 ? vIconSelected : "icon/16/dictionary.png");
+
+        // A checkbox comes right after the tree icon
+        obj = new qx.ui.form.CheckBox(
+          null, 23, null, Math.floor(Math.random() * 2) == 0 ? false : true);
+        obj.setPadding(0, 0);
+        treeRowStructure.addObject(obj, true);
+
+        // The label
+        treeRowStructure.addLabel(vLabel);
+
+        // All else should be right justified
+        obj = new qx.ui.basic.HorizontalSpacer;
+        treeRowStructure.addObject(obj, true);
+
+        // Add a file size, date and mode
+        obj = new qx.ui.basic.Label(Math.round(Math.random() * 100) + "kb");
+        obj.setWidth(50);
+        treeRowStructure.addObject(obj, true);
+        obj = new qx.ui.basic.Label(
+          "May " + Math.round(Math.random() * 30 + 1) + " 2005");
+        obj.setWidth(150);
+        treeRowStructure.addObject(obj, true);
+        obj = new qx.ui.basic.Label("-rw-r--r--");
+        obj.setWidth(80);
+        treeRowStructure.addObject(obj, true);
+
+        return treeRowStructure;
+        }
+
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var x = new qx.ui.basic.Atom("Test #1", "icon/16/reload.png", 16, 16);
+        x.debug("In main");
+
+      var t = new qx.ui.treefullcontrol.Tree(stuff("Root"));
+      with(t)
+      {
+        setBackgroundColor(255);
+        setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+        setOverflow("scrollY");
+
+        setHeight(null);
+        setTop(48);
+        setLeft(20);
+        setWidth(600);
+        setBottom(48);
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(t);
+      // One icon for selected and one for unselected states
+      var te1 = new qx.ui.treefullcontrol.TreeFolder(stuff("Desktop"));
+      t.add(te1);
+
+      desktop = te1;
+
+      var te1_1 = new qx.ui.treefullcontrol.TreeFolder(stuff("Files"));
+      var te1_2 = new qx.ui.treefullcontrol.TreeFolder(stuff("Workspace"));
+      var te1_3 = new qx.ui.treefullcontrol.TreeFolder(stuff("Network"));
+      var te1_4 = new qx.ui.treefullcontrol.TreeFolder(stuff("Trash"));
+
+      te1.add(te1_1, te1_2, te1_3, te1_4);
+
+      // One icon specified, and used for both selected unselected states
+      var te1_2_1 = new qx.ui.treefullcontrol.TreeFile(stuff("Windows (C:)", "icon/16/harddrive.png"));
+      var te1_2_2 = new qx.ui.treefullcontrol.TreeFile(stuff("Documents (D:)", "icon/16/harddrive.png"));
+
+      te1_2.add(te1_2_1, te1_2_2);
+
+      arbeitsplatz = te1_2;
+
+
+      var te2 = new qx.ui.treefullcontrol.TreeFolder(stuff("Inbox"));
+      posteingang = te2;
+
+      var te2_1 = new qx.ui.treefullcontrol.TreeFolder(stuff("Presets"));
+      var te2_2 = new qx.ui.treefullcontrol.TreeFolder(stuff("Sent"));
+      var te2_3 = new qx.ui.treefullcontrol.TreeFolder(stuff("Trash", "icon/16/trash.png"));
+      var te2_4 = new qx.ui.treefullcontrol.TreeFolder(stuff("Data"));
+      var te2_5 = new qx.ui.treefullcontrol.TreeFolder(stuff("Edit"));
+
+      editieren = te2_5;
+
+      var te2_5_1 = new qx.ui.treefullcontrol.TreeFolder(stuff("Chat"));
+      var te2_5_2 = new qx.ui.treefullcontrol.TreeFolder(stuff("Pustefix"));
+      var te2_5_3 = new qx.ui.treefullcontrol.TreeFolder(stuff("TINC"));
+
+      var te2_5_3_1 = new qx.ui.treefullcontrol.TreeFolder(stuff("Announce"));
+      var te2_5_3_2 = new qx.ui.treefullcontrol.TreeFolder(stuff("Devel"));
+
+      te2_5_3.add(te2_5_3_1, te2_5_3_2);
+
+      te2_5.add(te2_5_1, te2_5_2, te2_5_3);
+
+      var te2_6 = new qx.ui.treefullcontrol.TreeFolder(stuff("Lists"));
+
+      var te2_6_1 = new qx.ui.treefullcontrol.TreeFolder(stuff("Relations"));
+      var te2_6_2 = new qx.ui.treefullcontrol.TreeFolder(stuff("Company"));
+      var te2_6_3 = new qx.ui.treefullcontrol.TreeFolder(stuff("Questions"));
+      var te2_6_4 = new qx.ui.treefullcontrol.TreeFolder(stuff("Internal"));
+      var te2_6_5 = new qx.ui.treefullcontrol.TreeFolder(stuff("Products"));
+      var te2_6_6 = new qx.ui.treefullcontrol.TreeFolder(stuff("Press"));
+      var te2_6_7 = new qx.ui.treefullcontrol.TreeFolder(stuff("Development"));
+      var te2_6_8 = new qx.ui.treefullcontrol.TreeFolder(stuff("Competition"));
+
+      te2_6.add(te2_6_1, te2_6_2, te2_6_3, te2_6_4, te2_6_5, te2_6_6, te2_6_7, te2_6_8);
+
+      var te2_7 = new qx.ui.treefullcontrol.TreeFolder(stuff("Personal"));
+
+      var te2_7_1 = new qx.ui.treefullcontrol.TreeFolder(stuff("Bugs"));
+      var te2_7_2 = new qx.ui.treefullcontrol.TreeFolder(stuff("Family"));
+      var te2_7_3 = new qx.ui.treefullcontrol.TreeFolder(stuff("Projects"));
+      var te2_7_4 = new qx.ui.treefullcontrol.TreeFolder(stuff("Holiday"));
+
+      te2_7.add(te2_7_1, te2_7_2, te2_7_3, te2_7_4);
+
+      var te2_8 = new qx.ui.treefullcontrol.TreeFolder(stuff("Big"));
+
+      for (var i=0;i<50; i++) {
+        te2_8.add(new qx.ui.treefullcontrol.TreeFolder(stuff("Item " + i)));
+      };
+
+      var te2_9 = new qx.ui.treefullcontrol.TreeFolder(stuff("Spam"));
+      spam = te2_9;
+
+      te2.add(te2_1, te2_2, te2_3, te2_4, te2_5, te2_6, te2_7, te2_8, te2_9);
+
+      t.add(te2);
+      qx.ui.core.ClientDocument.getInstance().add(t);
+
+
+
+
+
+
+      var commandFrame = new qx.ui.groupbox.GroupBox("Control");
+
+      with(commandFrame)
+      {
+        setTop(48);
+        setLeft(650);
+
+        setWidth("auto");
+        setHeight("auto");
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(commandFrame);
+
+
+
+
+      var tCurrentLabel = new qx.ui.basic.Atom("Current Folder: ");
+
+      with(tCurrentLabel)
+      {
+        setLeft(0);
+        setTop(0);
+      };
+
+      commandFrame.add(tCurrentLabel);
+
+
+
+      var tCurrentInput = new qx.ui.form.TextField;
+
+      with(tCurrentInput)
+      {
+        setLeft(0);
+        setRight(0);
+        setTop(20);
+
+        setReadOnly(true);
+      };
+
+      commandFrame.add(tCurrentInput);
+
+      t.getManager().addEventListener("changeSelection", function(e) {
+        tCurrentInput.setValue(e.getData()[0]._labelObject.getHtml());
+      });
+
+
+
+      var tDoubleClick = new qx.ui.form.CheckBox("Use double click?");
+
+      with(tDoubleClick) {
+        setTop(60);
+        setLeft(0);
+      };
+
+      commandFrame.add(tDoubleClick);
+
+      tDoubleClick.addEventListener("changeChecked", function(e) { t.setUseDoubleClick(e.getData()); });
+
+
+
+
+      var tTreeLines = new qx.ui.form.CheckBox("Use tree lines?");
+
+      with(tTreeLines) {
+        setTop(80);
+        setLeft(0);
+        setChecked(true);
+      };
+
+      commandFrame.add(tTreeLines);
+
+      tTreeLines.addEventListener("changeChecked", function(e) { t.setUseTreeLines(e.getData()); });
+
+
+
+
+      var tHideNode = new qx.ui.form.CheckBox("Hide the root node?");
+
+      with(tHideNode) {
+        setTop(100);
+        setLeft(0);
+        setChecked(false);
+      };
+
+      commandFrame.add(tHideNode);
+
+      tHideNode.addEventListener("changeChecked", function(e) { t.setHideNode(e.getData()); });
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/TreeFullControl_3.html b/swat/apps/qooxdoo-examples/example/TreeFullControl_3.html
new file mode 100644
index 0000000000..35ff8e18c0
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/TreeFullControl_3.html
@@ -0,0 +1,298 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Shows a tree, with user-defined icons for some nodes.  This tests
+    listening for tree events.  A separate alert is generated upon opening a
+    folder that has contents; when opening a folder that has no contents; and
+    closing a folder.</p><p>We also demonstrate changing the default value of
+    'allowShowPlusMinusSymbol' so that all folders initially have a plus/minus
+    symbol.  Then, upon opening an empty folder, we remove that
+    icon.</p><p>Lastly, we demonstrate in the alert presented by tree events,
+    use of the getHierarchy() method to obtain a full "path" for a tree
+    node.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      /*
+       * Reset the default of always showing the plus/minus symbol.  The
+       * default is 'false'.  We want to always display it for each folder
+       * (and then stop displaying it if we determine upon open that there are
+       * no contents).
+       *
+       * The changeProperty() function assumes that it is being called
+       * shortly after defineClass() is called.  We therefore need to kludge
+       * qx.Proto to point to the right place.
+       *
+       * TODO: There should be a mechanism to change a property attribute
+       * without having to jump through these hoops.
+       */
+      var constructor = qx.OO.classes["qx.ui.treefullcontrol.TreeFolder"];
+      qx.Proto = constructor.prototype;
+      qx.OO.changeProperty({ name : "alwaysShowPlusMinusSymbol", type : qx.constant.Type.BOOLEAN, defaultValue : true });
+
+
+      var trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Root");
+      var t = new qx.ui.treefullcontrol.Tree(trs);
+
+      /*
+       * All subtrees will use this root node's event listeners.  Create event
+       * listeners for each of the possible events.
+       */
+      t.addEventListener(qx.constant.Event.TREEOPENWITHCONTENT, function(e) {
+                           alert('treeOpenWithContent ' + e.getData().getHierarchy(new Array()).join("/"));
+                         });
+
+      t.addEventListener(qx.constant.Event.TREECLOSE, function(e) {
+                           alert('treeClose ' + e.getData().getHierarchy(new Array()).join("/"));
+                         });
+
+      /*
+       * We handle opening an empty folder specially.  We demonstrate how to
+       * disable the plus/minus sign once we've determined there's nothing in
+       * it.  This feature might be used to dynamically retrieve the contents
+       * of the folder, and if nothing is available, indicate it by removing
+       * the plus/minus sign.
+       */
+      t.addEventListener(qx.constant.Event.TREEOPENWHILEEMPTY, function(e) {
+                           alert('treeOpenWhileEmpty ' + e.getData().getHierarchy(new Array()).join("/"));
+                           e.getData().setAlwaysShowPlusMinusSymbol(false);
+                         });
+
+      with(t)
+      {
+        setBackgroundColor(255);
+        setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+        setOverflow("scrollY");
+
+        setHeight(null);
+        setTop(48);
+        setLeft(20);
+        setWidth(200);
+        setBottom(48);
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(t);
+      // One icon for selected and one for unselected states
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Desktop", "icon/16/desktop.png", "icon/16/dictionary.png");
+      var te1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      t.add(te1);
+
+      desktop = te1;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Files");
+      var te1_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Workspace");
+      var te1_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Network");
+      var te1_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Trash");
+      var te1_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te1.add(te1_1, te1_2, te1_3, te1_4);
+
+      // One icon specified, and used for both selected unselected states
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Windows (C:)", "icon/16/harddrive.png");
+      var te1_2_1 = new qx.ui.treefullcontrol.TreeFile(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Documents (D:)", "icon/16/harddrive.png");
+      var te1_2_2 = new qx.ui.treefullcontrol.TreeFile(trs);
+
+      te1_2.add(te1_2_1, te1_2_2);
+
+      arbeitsplatz = te1_2;
+
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Inbox");
+      var te2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      posteingang = te2;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Presets");
+      var te2_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Sent");
+      var te2_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Trash", "icon/16/trash.png");
+      var te2_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Data");
+      var te2_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Edit");
+      var te2_5 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      editieren = te2_5;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Chat");
+      var te2_5_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Pustefix");
+      var te2_5_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("TINC");
+      var te2_5_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Announce");
+      var te2_5_3_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Devel");
+      var te2_5_3_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_5_3.add(te2_5_3_1, te2_5_3_2);
+
+      te2_5.add(te2_5_1, te2_5_2, te2_5_3);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Lists");
+      var te2_6 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Relations");
+      var te2_6_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Company");
+      var te2_6_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Questions");
+      var te2_6_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Internal");
+      var te2_6_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Products");
+      var te2_6_5 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Press");
+      var te2_6_6 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Development");
+      var te2_6_7 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Competition");
+      var te2_6_8 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_6.add(te2_6_1, te2_6_2, te2_6_3, te2_6_4, te2_6_5, te2_6_6, te2_6_7, te2_6_8);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Personal");
+      var te2_7 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Bugs");
+      var te2_7_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Family");
+      var te2_7_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Projects");
+      var te2_7_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Holiday");
+      var te2_7_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_7.add(te2_7_1, te2_7_2, te2_7_3, te2_7_4);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Big");
+      var te2_8 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      for (var i=0;i<50; i++) {
+        trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Item " + i);
+        te2_8.add(new qx.ui.treefullcontrol.TreeFolder(trs));
+      };
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Spam");
+      var te2_9 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      spam = te2_9;
+
+      te2.add(te2_1, te2_2, te2_3, te2_4, te2_5, te2_6, te2_7, te2_8, te2_9);
+
+      t.add(te2);
+      qx.ui.core.ClientDocument.getInstance().add(t);
+
+
+
+
+
+
+      var commandFrame = new qx.ui.groupbox.GroupBox("Control");
+
+      with(commandFrame)
+      {
+        setTop(48);
+        setLeft(250);
+
+        setWidth("auto");
+        setHeight("auto");
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(commandFrame);
+
+
+
+
+      var tCurrentLabel = new qx.ui.basic.Atom("Current Folder: ");
+
+      with(tCurrentLabel)
+      {
+        setLeft(0);
+        setTop(0);
+      };
+
+      commandFrame.add(tCurrentLabel);
+
+
+
+      var tCurrentInput = new qx.ui.form.TextField;
+
+      with(tCurrentInput)
+      {
+        setLeft(0);
+        setRight(0);
+        setTop(20);
+
+        setReadOnly(true);
+      };
+
+      commandFrame.add(tCurrentInput);
+
+      t.getManager().addEventListener("changeSelection", function(e) {
+        tCurrentInput.setValue(e.getData()[0]._labelObject.getHtml());
+      });
+
+
+
+      var tDoubleClick = new qx.ui.form.CheckBox("Use double click?");
+
+      with(tDoubleClick) {
+        setTop(60);
+        setLeft(0);
+      };
+
+      commandFrame.add(tDoubleClick);
+
+      tDoubleClick.addEventListener("changeChecked", function(e) { t.setUseDoubleClick(e.getData()); });
+
+
+
+
+      var tTreeLines = new qx.ui.form.CheckBox("Use tree lines?");
+
+      with(tTreeLines) {
+        setTop(80);
+        setLeft(0);
+        setChecked(true);
+      };
+
+      commandFrame.add(tTreeLines);
+
+      tTreeLines.addEventListener("changeChecked", function(e) { t.setUseTreeLines(e.getData()); });
+
+
+      var tHideNode = new qx.ui.form.CheckBox("Hide the root node?");
+
+      with(tHideNode) {
+        setTop(100);
+        setLeft(0);
+        setChecked(false);
+      };
+
+      commandFrame.add(tHideNode);
+
+      tHideNode.addEventListener("changeChecked", function(e) { t.setHideNode(e.getData()); });
+
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/TreeFullControl_4.html b/swat/apps/qooxdoo-examples/example/TreeFullControl_4.html
new file mode 100644
index 0000000000..b3c701f01f
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/TreeFullControl_4.html
@@ -0,0 +1,384 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Shows a tree and allows playing with the settings of the Tree
+    properties <i>hideNode</i> and <i>rootOpenClose</i>.  Also demonstrates
+    manipulating display (or not) of tree lines at specific indentation
+    levels, using the <i>excludeSpecificTreeLines</i> property.</p>
+
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Root");
+      var t = new qx.ui.treefullcontrol.Tree(trs);
+
+      with(t)
+      {
+        setBackgroundColor(255);
+        setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+        setOverflow("scrollY");
+
+        setHeight(null);
+        setTop(48);
+        setLeft(20);
+        setWidth(200);
+        setBottom(48);
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(t);
+      // One icon for selected and one for unselected states
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Desktop", "icon/16/desktop.png", "icon/16/dictionary.png");
+      var te1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      t.add(te1);
+
+      desktop = te1;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Files");
+      var te1_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Workspace");
+      var te1_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Network");
+      var te1_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Trash");
+      var te1_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te1.add(te1_1, te1_2, te1_3, te1_4);
+
+      // One icon specified, and used for both selected unselected states
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Windows (C:)", "icon/16/harddrive.png");
+      var te1_2_1 = new qx.ui.treefullcontrol.TreeFile(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Documents (D:)", "icon/16/harddrive.png");
+      var te1_2_2 = new qx.ui.treefullcontrol.TreeFile(trs);
+
+      te1_2.add(te1_2_1, te1_2_2);
+
+      arbeitsplatz = te1_2;
+
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Inbox");
+      var te2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      posteingang = te2;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Presets");
+      var te2_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Sent");
+      var te2_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Trash", "icon/16/trash.png");
+      var te2_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Data");
+      var te2_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Edit");
+      var te2_5 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      editieren = te2_5;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Chat");
+      var te2_5_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Pustefix");
+      var te2_5_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("TINC");
+      var te2_5_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Announce");
+      var te2_5_3_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Devel");
+      var te2_5_3_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_5_3.add(te2_5_3_1, te2_5_3_2);
+
+      te2_5.add(te2_5_1, te2_5_2, te2_5_3);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Lists");
+      var te2_6 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Relations");
+      var te2_6_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Company");
+      var te2_6_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Questions");
+      var te2_6_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Internal");
+      var te2_6_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Products");
+      var te2_6_5 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Press");
+      var te2_6_6 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Development");
+      var te2_6_7 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Competition");
+      var te2_6_8 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_6.add(te2_6_1, te2_6_2, te2_6_3, te2_6_4, te2_6_5, te2_6_6, te2_6_7, te2_6_8);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Personal");
+      var te2_7 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Bugs");
+      var te2_7_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Family");
+      var te2_7_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Projects");
+      var te2_7_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Holiday");
+      var te2_7_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_7.add(te2_7_1, te2_7_2, te2_7_3, te2_7_4);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Big");
+      var te2_8 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      for (var i=0;i<50; i++) {
+        trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Item " + i);
+        te2_8.add(new qx.ui.treefullcontrol.TreeFolder(trs));
+      };
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Spam");
+      var te2_9 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      spam = te2_9;
+
+      te2.add(te2_1, te2_2, te2_3, te2_4, te2_5, te2_6, te2_7, te2_8, te2_9);
+
+      t.add(te2);
+      qx.ui.core.ClientDocument.getInstance().add(t);
+
+
+
+
+
+
+      var commandFrame = new qx.ui.groupbox.GroupBox("Control");
+
+      with(commandFrame)
+      {
+        setTop(48);
+        setLeft(250);
+
+        setWidth("auto");
+        setHeight("auto");
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(commandFrame);
+
+
+
+
+      var tCurrentLabel = new qx.ui.basic.Atom("Current Folder: ");
+
+      with(tCurrentLabel)
+      {
+        setLeft(0);
+        setTop(0);
+      };
+
+      commandFrame.add(tCurrentLabel);
+
+
+
+      var tCurrentInput = new qx.ui.form.TextField;
+
+      with(tCurrentInput)
+      {
+        setLeft(0);
+        setRight(0);
+        setTop(20);
+
+        setReadOnly(true);
+      };
+
+      commandFrame.add(tCurrentInput);
+
+      t.getManager().addEventListener("changeSelection", function(e) {
+        tCurrentInput.setValue(e.getData()[0]._labelObject.getHtml());
+      });
+
+
+
+      var tDoubleClick = new qx.ui.form.CheckBox("Use double click?");
+
+      with(tDoubleClick) {
+        setTop(60);
+        setLeft(0);
+      };
+
+      commandFrame.add(tDoubleClick);
+
+      tDoubleClick.addEventListener("changeChecked", function(e) { t.setUseDoubleClick(e.getData()); });
+
+
+
+
+      var tTreeLines = new qx.ui.form.CheckBox("Use tree lines?");
+
+      with(tTreeLines) {
+        setTop(80);
+        setLeft(0);
+        setChecked(true);
+      };
+
+      commandFrame.add(tTreeLines);
+
+      tTreeLines.addEventListener("changeChecked", function(e) { t.setUseTreeLines(e.getData()); });
+
+
+      var tHideNode = new qx.ui.form.CheckBox("Hide the root node?");
+
+      with(tHideNode) {
+        setTop(100);
+        setLeft(0);
+        setChecked(false);
+      };
+
+      commandFrame.add(tHideNode);
+
+      tHideNode.addEventListener("changeChecked", function(e) { t.setHideNode(e.getData()); });
+
+      var tIncludeRootOpenClose =
+        new qx.ui.form.CheckBox("Include root open/close button?");
+
+      with(tIncludeRootOpenClose) {
+        setTop(120);
+        setLeft(0);
+        setChecked(true);
+      };
+
+      commandFrame.add(tIncludeRootOpenClose);
+
+      tIncludeRootOpenClose.addEventListener("changeChecked", function(e) { t.setRootOpenClose(e.getData()); });
+
+      tExcludeTreeLines0 =
+        new qx.ui.form.CheckBox("Exclude tree lines at level 0?");
+
+      with(tExcludeTreeLines0) {
+        setTop(140);
+        setLeft(0);
+        setChecked(false);
+      };
+
+      commandFrame.add(tExcludeTreeLines0);
+
+      tExcludeTreeLines0.addEventListener(
+          "changeChecked",
+          function(e)
+          {
+              var excl = t.getExcludeSpecificTreeLines();
+              if (e.getData()) {
+                  excl[0] = true;
+              } else {
+                  delete(excl[0]);
+              }
+              t.setExcludeSpecificTreeLines(excl);
+          });
+
+      tExcludeTreeLines1 =
+        new qx.ui.form.CheckBox("Exclude tree lines at level 1?");
+
+      with(tExcludeTreeLines1) {
+        setTop(160);
+        setLeft(0);
+        setChecked(false);
+      };
+
+      commandFrame.add(tExcludeTreeLines1);
+
+      tExcludeTreeLines1.addEventListener(
+          "changeChecked",
+          function(e)
+          {
+              var excl = t.getExcludeSpecificTreeLines();
+              if (e.getData()) {
+                  excl[1] = true;
+              } else {
+                  delete(excl[1]);
+              }
+              t.setExcludeSpecificTreeLines(excl);
+          });
+
+      tExcludeTreeLines2 =
+        new qx.ui.form.CheckBox("Exclude tree lines at level 2?");
+
+      with(tExcludeTreeLines2) {
+        setTop(180);
+        setLeft(0);
+        setChecked(false);
+      };
+
+      commandFrame.add(tExcludeTreeLines2);
+
+      tExcludeTreeLines2.addEventListener(
+          "changeChecked",
+          function(e)
+          {
+              var excl = t.getExcludeSpecificTreeLines();
+              if (e.getData()) {
+                  excl[2] = true;
+              } else {
+                  delete(excl[2]);
+              }
+              t.setExcludeSpecificTreeLines(excl);
+          });
+
+      tExcludeTreeLines3 =
+        new qx.ui.form.CheckBox("Exclude tree lines at level 3?");
+
+      with(tExcludeTreeLines3) {
+        setTop(200);
+        setLeft(0);
+        setChecked(false);
+      };
+
+      commandFrame.add(tExcludeTreeLines3);
+
+      tExcludeTreeLines3.addEventListener(
+          "changeChecked",
+          function(e)
+          {
+              var excl = t.getExcludeSpecificTreeLines();
+              if (e.getData()) {
+                  excl[3] = true;
+              } else {
+                  delete(excl[3]);
+              }
+              t.setExcludeSpecificTreeLines(excl);
+          });
+
+      tExcludeTreeLines4 =
+        new qx.ui.form.CheckBox("Exclude tree lines at level 4?");
+
+      with(tExcludeTreeLines4) {
+        setTop(220);
+        setLeft(0);
+        setChecked(false);
+      };
+
+      commandFrame.add(tExcludeTreeLines4);
+
+      tExcludeTreeLines4.addEventListener(
+          "changeChecked",
+          function(e)
+          {
+              var excl = t.getExcludeSpecificTreeLines();
+              if (e.getData()) {
+                  excl[4] = true;
+              } else {
+                  delete(excl[4]);
+              }
+              t.setExcludeSpecificTreeLines(excl);
+          });
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/TreeFullControl_5.html b/swat/apps/qooxdoo-examples/example/TreeFullControl_5.html
new file mode 100644
index 0000000000..29703b06c1
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/TreeFullControl_5.html
@@ -0,0 +1,247 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Shows a tree, with user-defined icons for some nodes.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Root");
+      var t = new qx.ui.treefullcontrol.Tree(trs);
+
+      with(t)
+      {
+        setBackgroundColor(255);
+        setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+        setOverflow("scrollY");
+
+        setHeight(null);
+        setTop(48);
+        setLeft(20);
+        setWidth(200);
+        setBottom(48);
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(t);
+      // One icon for selected and one for unselected states
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Desktop", "icon/16/desktop.png", "icon/16/dictionary.png");
+      var te1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      t.add(te1);
+
+      desktop = te1;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Files");
+      var te1_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Workspace");
+      var te1_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Network");
+      var te1_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Trash");
+      var te1_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te1.add(te1_1, te1_2, te1_3, te1_4);
+
+      // One icon specified, and used for both selected unselected states
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Windows (C:)", "icon/16/harddrive.png");
+      var te1_2_1 = new qx.ui.treefullcontrol.TreeFile(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Documents (D:)", "icon/16/harddrive.png");
+      var te1_2_2 = new qx.ui.treefullcontrol.TreeFile(trs);
+
+      te1_2.add(te1_2_1, te1_2_2);
+
+      arbeitsplatz = te1_2;
+
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Inbox");
+      var te2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      posteingang = te2;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Presets");
+      var te2_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Sent");
+      var te2_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Trash", "icon/16/trash.png");
+      var te2_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Data");
+      var te2_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Edit");
+      var te2_5 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      editieren = te2_5;
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Chat");
+      var te2_5_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Pustefix");
+      var te2_5_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("TINC");
+      var te2_5_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Announce");
+      var te2_5_3_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Devel");
+      var te2_5_3_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_5_3.add(te2_5_3_1, te2_5_3_2);
+
+      te2_5.add(te2_5_1, te2_5_2, te2_5_3);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Lists");
+      var te2_6 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Relations");
+      var te2_6_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Company");
+      var te2_6_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Questions");
+      var te2_6_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Internal");
+      var te2_6_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Products");
+      var te2_6_5 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Press");
+      var te2_6_6 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Development");
+      var te2_6_7 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Competition");
+      var te2_6_8 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_6.add(te2_6_1, te2_6_2, te2_6_3, te2_6_4, te2_6_5, te2_6_6, te2_6_7, te2_6_8);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Personal");
+      var te2_7 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Bugs");
+      var te2_7_1 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Family");
+      var te2_7_2 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Projects");
+      var te2_7_3 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Holiday");
+      var te2_7_4 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      te2_7.add(te2_7_1, te2_7_2, te2_7_3, te2_7_4);
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Big");
+      var te2_8 = new qx.ui.treefullcontrol.TreeFolder(trs);
+
+      for (var i=0;i<50; i++) {
+        trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Item " + i);
+        te2_8.add(new qx.ui.treefullcontrol.TreeFolder(trs));
+      };
+
+      trs = qx.ui.treefullcontrol.TreeRowStructure.getInstance().standard("Spam");
+      var te2_9 = new qx.ui.treefullcontrol.TreeFolder(trs);
+      spam = te2_9;
+
+      te2.add(te2_1, te2_2, te2_3, te2_4, te2_5, te2_6, te2_7, te2_8, te2_9);
+
+      t.add(te2);
+      qx.ui.core.ClientDocument.getInstance().add(t);
+
+
+
+
+
+
+      var commandFrame = new qx.ui.groupbox.GroupBox("Control");
+
+      with(commandFrame)
+      {
+        setTop(48);
+        setLeft(250);
+
+        setWidth("auto");
+        setHeight("auto");
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(commandFrame);
+
+
+
+
+      var tCurrentLabel = new qx.ui.basic.Atom("Current Folder: ");
+
+      with(tCurrentLabel)
+      {
+        setLeft(0);
+        setTop(0);
+      };
+
+      commandFrame.add(tCurrentLabel);
+
+
+
+      var tCurrentInput = new qx.ui.form.TextField;
+
+      with(tCurrentInput)
+      {
+        setLeft(0);
+        setRight(0);
+        setTop(20);
+
+        setReadOnly(true);
+      };
+
+      commandFrame.add(tCurrentInput);
+
+      t.getManager().addEventListener("changeSelection", function(e) {
+        tCurrentInput.setValue(e.getData()[0]._labelObject.getHtml());
+      });
+
+
+
+      var tDoubleClick = new qx.ui.form.CheckBox("Use double click?");
+
+      with(tDoubleClick) {
+        setTop(60);
+        setLeft(0);
+      };
+
+      commandFrame.add(tDoubleClick);
+
+      tDoubleClick.addEventListener("changeChecked", function(e) { t.setUseDoubleClick(e.getData()); });
+
+
+
+
+      var tTreeLines = new qx.ui.form.CheckBox("Use tree lines?");
+
+      with(tTreeLines) {
+        setTop(80);
+        setLeft(0);
+        setChecked(true);
+      };
+
+      commandFrame.add(tTreeLines);
+
+      tTreeLines.addEventListener("changeChecked", function(e) { t.setUseTreeLines(e.getData()); });
+
+      var tGetSelectedElement = new qx.ui.form.CheckBox("Retry getSelectedElement()");
+
+      with(tGetSelectedElement) {
+        setTop(100);
+        setLeft(0);
+        setChecked(true);
+      };
+
+      commandFrame.add(tGetSelectedElement);
+
+      tGetSelectedElement.addEventListener("changeChecked", function(e) { var oo = t.getSelectedElement(); t.debug(oo); });
+
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Tree_1.html b/swat/apps/qooxdoo-examples/example/Tree_1.html
new file mode 100644
index 0000000000..ef29240538
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Tree_1.html
@@ -0,0 +1,191 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Shows a tree, with user-defined icons for some nodes.</p>
+  </div>
+
+  <script type="text/javascript">
+    qx.core.Init.getInstance().defineMain(function()
+    {
+      var t = new qx.ui.tree.Tree("Root");
+
+      with(t)
+      {
+        setBackgroundColor(255);
+        setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
+        setOverflow("scrollY");
+
+        setHeight(null);
+        setTop(48);
+        setLeft(20);
+        setWidth(200);
+        setBottom(48);
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(t);
+      // One icon for selected and one for unselected states
+      var te1 = new qx.ui.tree.TreeFolder("Desktop", "icon/16/desktop.png", "icon/16/dictionary.png");
+      t.add(te1);
+
+      var te1_1 = new qx.ui.tree.TreeFolder("Files");
+      var te1_2 = new qx.ui.tree.TreeFolder("Workspace");
+      var te1_3 = new qx.ui.tree.TreeFolder("Network");
+      var te1_4 = new qx.ui.tree.TreeFolder("Trash");
+
+      te1.add(te1_1, te1_2, te1_3, te1_4);
+
+      // One icon specified, and used for both selected unselected states
+      var te1_2_1 = new qx.ui.tree.TreeFile("Windows (C:)", "icon/16/harddrive.png");
+      var te1_2_2 = new qx.ui.tree.TreeFile("Documents (D:)", "icon/16/harddrive.png");
+
+      te1_2.add(te1_2_1, te1_2_2);
+
+
+      var te2 = new qx.ui.tree.TreeFolder("Inbox");
+
+      var te2_1 = new qx.ui.tree.TreeFolder("Presets");
+      var te2_2 = new qx.ui.tree.TreeFolder("Sent");
+      var te2_3 = new qx.ui.tree.TreeFolder("Trash", "icon/16/trash.png");
+      var te2_4 = new qx.ui.tree.TreeFolder("Data");
+      var te2_5 = new qx.ui.tree.TreeFolder("Edit");
+
+      var te2_5_1 = new qx.ui.tree.TreeFolder("Chat");
+      var te2_5_2 = new qx.ui.tree.TreeFolder("Pustefix");
+      var te2_5_3 = new qx.ui.tree.TreeFolder("TINC");
+
+      var te2_5_3_1 = new qx.ui.tree.TreeFolder("Announce");
+      var te2_5_3_2 = new qx.ui.tree.TreeFolder("Devel");
+
+      te2_5_3.add(te2_5_3_1, te2_5_3_2);
+
+      te2_5.add(te2_5_1, te2_5_2, te2_5_3);
+
+      var te2_6 = new qx.ui.tree.TreeFolder("Lists");
+
+      var te2_6_1 = new qx.ui.tree.TreeFolder("Relations");
+      var te2_6_2 = new qx.ui.tree.TreeFolder("Company");
+      var te2_6_3 = new qx.ui.tree.TreeFolder("Questions");
+      var te2_6_4 = new qx.ui.tree.TreeFolder("Internal");
+      var te2_6_5 = new qx.ui.tree.TreeFolder("Products");
+      var te2_6_6 = new qx.ui.tree.TreeFolder("Press");
+      var te2_6_7 = new qx.ui.tree.TreeFolder("Development");
+      var te2_6_8 = new qx.ui.tree.TreeFolder("Competition");
+
+      te2_6.add(te2_6_1, te2_6_2, te2_6_3, te2_6_4, te2_6_5, te2_6_6, te2_6_7, te2_6_8);
+
+      var te2_7 = new qx.ui.tree.TreeFolder("Personal");
+
+      var te2_7_1 = new qx.ui.tree.TreeFolder("Bugs");
+      var te2_7_2 = new qx.ui.tree.TreeFolder("Family");
+      var te2_7_3 = new qx.ui.tree.TreeFolder("Projects");
+      var te2_7_4 = new qx.ui.tree.TreeFolder("Holiday");
+
+      te2_7.add(te2_7_1, te2_7_2, te2_7_3, te2_7_4);
+
+      var te2_8 = new qx.ui.tree.TreeFolder("Big");
+
+      for (var i=0;i<50; i++) {
+        te2_8.add(new qx.ui.tree.TreeFolder("Item " + i));
+      };
+
+      var te2_9 = new qx.ui.tree.TreeFolder("Spam");
+
+      te2.add(te2_1, te2_2, te2_3, te2_4, te2_5, te2_6, te2_7, te2_8, te2_9);
+
+      t.add(te2);
+      qx.ui.core.ClientDocument.getInstance().add(t);
+
+
+
+
+
+
+      var commandFrame = new qx.ui.groupbox.GroupBox("Control");
+
+      with(commandFrame)
+      {
+        setTop(48);
+        setLeft(250);
+
+        setWidth("auto");
+        setHeight("auto");
+      };
+
+      qx.ui.core.ClientDocument.getInstance().add(commandFrame);
+
+
+
+
+      var tCurrentLabel = new qx.ui.basic.Atom("Current Folder: ");
+
+      with(tCurrentLabel)
+      {
+        setLeft(0);
+        setTop(0);
+      };
+
+      commandFrame.add(tCurrentLabel);
+
+
+
+      var tCurrentInput = new qx.ui.form.TextField;
+
+      with(tCurrentInput)
+      {
+        setLeft(0);
+        setRight(0);
+        setTop(20);
+
+        setReadOnly(true);
+      };
+
+      commandFrame.add(tCurrentInput);
+
+      t.getManager().addEventListener("changeSelection", function(e) {
+        tCurrentInput.setValue(e.getData()[0]._labelObject.getHtml());
+      });
+
+
+
+      var tDoubleClick = new qx.ui.form.CheckBox("Use double click?");
+
+      with(tDoubleClick) {
+        setTop(60);
+        setLeft(0);
+      };
+
+      commandFrame.add(tDoubleClick);
+
+      tDoubleClick.addEventListener("changeChecked", function(e) { t.setUseDoubleClick(e.getData()); });
+
+
+
+
+      var tTreeLines = new qx.ui.form.CheckBox("Use tree lines?");
+
+      with(tTreeLines) {
+        setTop(80);
+        setLeft(0);
+        setChecked(true);
+      };
+
+      commandFrame.add(tTreeLines);
+
+      tTreeLines.addEventListener("changeChecked", function(e) { t.setUseTreeLines(e.getData()); });
+
+
+    });
+  </script>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/Window_1.html b/swat/apps/qooxdoo-examples/example/Window_1.html
new file mode 100644
index 0000000000..0dd2bdc107
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/Window_1.html
@@ -0,0 +1,308 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <script type="text/javascript">
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+    var w1 = new qx.ui.window.Window("First Window", "icon/16/bell.png");
+    w1.setSpace(20, 400, 48, 250);
+    d.add(w1);
+
+    var w2 = new qx.ui.window.Window("Second Window", "icon/16/colors.png");
+    w2.setSpace(250, "auto", 120, "auto");
+    d.add(w2);
+
+    var w3 = new qx.ui.window.Window("Third Window", "icon/16/network.png");
+    w3.setSpace(100, 300, 200, 300);
+    w3.setMaxWidth(450);
+    w3.setMaxHeight(400);
+    d.add(w3);
+
+    var wm1 = new qx.ui.window.Window("First Modal Dialog");
+    wm1.setSpace(150, 200, 150, 200);
+    wm1.setModal(true);
+    d.add(wm1);
+
+    var wm2 = new qx.ui.window.Window("Second Modal Dialog");
+    wm2.setSpace(100, 200, 100, 150);
+    wm2.setModal(true);
+    wm2.setShowClose(false);
+    d.add(wm2);
+
+
+
+
+    var a1 = new qx.ui.basic.Atom("Welcome to your first own Window.<br/>Have fun!", "icon/32/chart.png");
+    a1.set({ top: 4, left: 4 });
+    w1.add(a1);
+
+
+
+
+    var tf1 = new qx.ui.pageview.tabview.TabView;
+    tf1.set({ left: 10, top: 52, right: 10, bottom: 10 });
+
+    var t1_1 = new qx.ui.pageview.tabview.TabViewButton("Explore");
+    var t1_2 = new qx.ui.pageview.tabview.TabViewButton("Internet");
+    var t1_3 = new qx.ui.pageview.tabview.TabViewButton("Future");
+
+    t1_1.setChecked(true);
+
+    tf1.getBar().add(t1_1, t1_2, t1_3);
+
+    var p1_1 = new qx.ui.pageview.tabview.TabViewPage(t1_1);
+    var p1_2 = new qx.ui.pageview.tabview.TabViewPage(t1_2);
+    var p1_3 = new qx.ui.pageview.tabview.TabViewPage(t1_3);
+
+    tf1.getPane().add(p1_1, p1_2, p1_3);
+
+    w1.add(tf1);
+
+
+
+    var at1 = new qx.ui.basic.Atom("Your second window", "icon/22/find.png");
+    at1.setLocation(8, 8);
+    w2.add(at1);
+
+
+
+
+    var btn1 = new qx.ui.form.Button("Open Modal Dialog 1", "icon/16/control-center.png");
+    btn1.setLocation(4, 4);
+    w3.add(btn1);
+
+    btn1.addEventListener("execute", function(e) {
+      wm1.open();
+    });
+
+
+    var btn2 = new qx.ui.form.Button("Open Modal Dialog 2", "icon/16/control-center.png");
+    btn2.setLocation(4, 4);
+    wm1.add(btn2);
+
+    btn2.addEventListener("execute", function(e) {
+      wm2.open();
+    });
+
+
+    var chkm1 = new qx.ui.form.CheckBox("Modal", null, null, true);
+    chkm1.setLocation(4, 50);
+    wm1.add(chkm1);
+
+    chkm1.addEventListener("changeChecked", function(e) {
+      wm1.setModal(e.getData());
+    });
+
+
+
+    var fs1 = new qx.ui.groupbox.GroupBox("Settings");
+    fs1.setLocation(4, 40);
+    fs1.setRight(4);
+    fs1.setBottom(4);
+
+
+    var chk1 = new qx.ui.form.CheckBox("Show Icon");
+    chk1.setLocation(0, 0);
+    chk1.setChecked(true);
+    chk1.addEventListener("changeChecked", function(e) {
+      w2.setShowIcon(e.getData());
+    });
+
+    var chk2 = new qx.ui.form.CheckBox("Show Caption");
+    chk2.setLocation(0, 20);
+    chk2.setChecked(true);
+    chk2.addEventListener("changeChecked", function(e) {
+      w2.setShowCaption(e.getData());
+    });
+
+
+
+    var chk3 = new qx.ui.form.CheckBox("Resizeable");
+    chk3.setLocation(0, 50);
+    chk3.setChecked(true);
+    chk3.addEventListener("changeChecked", function(e) {
+      w2.setResizeable(e.getData());
+    });
+
+    var chk4 = new qx.ui.form.CheckBox("Moveable");
+    chk4.setLocation(0, 70);
+    chk4.setChecked(true);
+    chk4.addEventListener("changeChecked", function(e) {
+      w2.setMoveable(e.getData());
+    });
+
+
+
+    var chk5 = new qx.ui.form.CheckBox("Show Close");
+    chk5.setLocation(140, 0);
+    chk5.setChecked(true);
+    chk5.addEventListener("changeChecked", function(e) {
+      w2.setShowClose(e.getData());
+    });
+
+    var chk6 = new qx.ui.form.CheckBox("Show Maximize/Restore");
+    chk6.setLocation(140, 20);
+    chk6.setChecked(true);
+    chk6.addEventListener("changeChecked", function(e) {
+      w2.setShowMaximize(e.getData());
+    });
+
+    var chk7 = new qx.ui.form.CheckBox("Show Minimize");
+    chk7.setLocation(140, 40);
+    chk7.setChecked(true);
+    chk7.addEventListener("changeChecked", function(e) {
+      w2.setShowMinimize(e.getData());
+    });
+
+
+
+    var chk8 = new qx.ui.form.CheckBox("Allow Close");
+    chk8.setLocation(140, 70);
+    chk8.setChecked(true);
+    chk8.addEventListener("changeChecked", function(e) {
+      w2.setAllowClose(e.getData());
+    });
+
+    var chk9 = new qx.ui.form.CheckBox("Allow Maximize");
+    chk9.setLocation(140, 90);
+    chk9.setChecked(true);
+    chk9.addEventListener("changeChecked", function(e) {
+      w2.setAllowMaximize(e.getData());
+    });
+
+    var chk10 = new qx.ui.form.CheckBox("Allow Minimize");
+    chk10.setLocation(140, 110);
+    chk10.setChecked(true);
+    chk10.addEventListener("changeChecked", function(e) {
+      w2.setAllowMinimize(e.getData());
+    });
+
+
+
+
+    var l1 = new qx.ui.basic.Atom("Move Method", "icon/16/misc.png");
+    l1.setLocation(0, 100);
+
+    var rb1 = new qx.ui.form.RadioButton("Frame", "frame");
+    rb1.setLocation(0, 120);
+
+    var rb2 = new qx.ui.form.RadioButton("Opaque", "opaque");
+    rb2.setLocation(0, 140);
+    rb2.setChecked(true);
+
+    var rb3 = new qx.ui.form.RadioButton("Translucent", "translucent");
+    rb3.setLocation(0, 160);
+
+    var rbm1 = new qx.manager.selection.RadioManager("move", [rb1, rb2, rb3]);
+
+    rbm1.addEventListener("changeSelected", function(e) {
+      w2.setMoveMethod(e.getData().getValue());
+    });
+
+
+
+
+    var l2 = new qx.ui.basic.Atom("Resize Method", "icon/16/misc.png");
+    l2.setLocation(0, 190);
+
+    var rb4 = new qx.ui.form.RadioButton("Frame", "frame");
+    rb4.setLocation(0, 210);
+    rb4.setChecked(true);
+
+    var rb5 = new qx.ui.form.RadioButton("Opaque", "opaque");
+    rb5.setLocation(0, 230);
+
+    var rb6 = new qx.ui.form.RadioButton("Lazy Opaque", "lazyopaque");
+    rb6.setLocation(0, 250);
+
+    var rb7 = new qx.ui.form.RadioButton("Translucent", "translucent");
+    rb7.setLocation(0, 270);
+
+    var rbm2 = new qx.manager.selection.RadioManager("resize", [rb4, rb5, rb6, rb7]);
+
+    rbm2.addEventListener("changeSelected", function(e) {
+      w2.setResizeMethod(e.getData().getValue());
+    });
+
+
+
+
+    var chk11 = new qx.ui.form.CheckBox("Show Statusbar");
+    chk11.setLocation(140, 140);
+    chk11.setChecked(false);
+    chk11.addEventListener("changeChecked", function(e) {
+      w2.setShowStatusbar(e.getData());
+    });
+
+
+
+
+    var btnpack = new qx.ui.form.Button("Pack Window", "icon/16/cdrom.png");
+    btnpack.setLocation(140, 170);
+    btnpack.addEventListener("execute", function(e) {
+      w2.pack();
+    });
+
+
+    fs1.add(chk1, chk2, chk3, chk4, chk5, chk6, chk7, chk8, chk9, chk10, l1, rb1, rb2, rb3, l2, rb4, rb5, rb6, rb7, chk11, btnpack);
+    w2.add(fs1);
+
+
+    var icon1 = new qx.ui.basic.Image("icon/32/error.png");
+    var warn1 = new qx.ui.basic.Label("Do you want to delete<br/>all your personal data?");
+
+    icon1.setTop(10);
+    icon1.setLeft(10);
+
+    warn1.setTop(10);
+    warn1.setLeft(48);
+
+    var btn3 = new qx.ui.form.Button("Yes", "icon/16/button-ok.png");
+    var btn4 = new qx.ui.form.Button("No", "icon/16/button-cancel.png");
+
+    btn3.addEventListener("execute", function(e) {
+      alert("Thank you!");
+      wm2.close();
+    });
+
+    btn4.addEventListener("execute", function(e) {
+      alert("Sorry, please click 'Yes'!");
+    });
+
+    btn3.set({ bottom : 10, right : 10 });
+    btn4.set({ bottom : 10, left : 10 });
+
+    wm2.add(btn3, btn4, icon1, warn1);
+
+
+
+    // Icon & Color Themes
+    //qx.manager.object.ImageManager.getInstance().createThemeList(w3, 20, 248);
+    qx.manager.object.ColorManager.getInstance().createThemeList(w3, 4, 58);
+
+
+
+
+    w1.open();
+    w2.open();
+    w3.open();
+  });
+  </script>
+
+  <div id="demoDescription">
+    <p>This is the qx.ui.window.Window widget. These should emulate the default look and behaviour of the application windows running under Microsoft Windows(TM).</p>
+  </div>
+</body>
+</html>
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file1.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file1.swf
new file mode 100644
index 0000000000..2e6d69a3fd
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file1.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file10.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file10.swf
new file mode 100644
index 0000000000..eeafa9a8f3
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file10.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file2.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file2.swf
new file mode 100644
index 0000000000..51c8f0ff76
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file2.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file3.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file3.swf
new file mode 100644
index 0000000000..0b6b56be85
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file3.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file4.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file4.swf
new file mode 100644
index 0000000000..746baa8cd9
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file4.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file5.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file5.swf
new file mode 100644
index 0000000000..a3333e1c31
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file5.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file6.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file6.swf
new file mode 100644
index 0000000000..2cad550081
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file6.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file7.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file7.swf
new file mode 100644
index 0000000000..b5f4eb4ddf
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file7.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file8.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file8.swf
new file mode 100644
index 0000000000..54c9a11edc
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file8.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/color/file9.swf b/swat/apps/qooxdoo-examples/example/image/flash/color/file9.swf
new file mode 100644
index 0000000000..cc41ff1c10
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/color/file9.swf
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/fo_tester.fla b/swat/apps/qooxdoo-examples/example/image/flash/fo_tester.fla
new file mode 100644
index 0000000000..afd4bb6134
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/fo_tester.fla
diff --git a/swat/apps/qooxdoo-examples/example/image/flash/fo_tester.swf b/swat/apps/qooxdoo-examples/example/image/flash/fo_tester.swf
new file mode 100644
index 0000000000..8e0b966bca
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/image/flash/fo_tester.swf
diff --git a/swat/apps/qooxdoo-examples/example/index.html b/swat/apps/qooxdoo-examples/example/index.html
new file mode 100644
index 0000000000..ac437542ac
--- /dev/null
+++ b/swat/apps/qooxdoo-examples/example/index.html
@@ -0,0 +1,18 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Please choose an example from above.</p>
+  </div>
+</body>
+</html>
+\ No newline at end of file
author	Derrell Lipman <derrell@samba.org>	2006-10-06 15:40:18 +0000
committer	Gerald (Jerry) Carter <jerry@samba.org>	2007-10-10 14:20:40 -0500
commit	10c06a1968dbf39d8a3790077a3537b8323f36ff (patch)
tree	f7389aac531dfe7c0d538879bdbd15cca33156e4 /swat/apps/qooxdoo-examples/example
parent	77fc14c0818498e277a79196fa4f6e15f4b607b1 (diff)
download	samba-10c06a1968dbf39d8a3790077a3537b8323f36ff.tar.gz samba-10c06a1968dbf39d8a3790077a3537b8323f36ff.tar.bz2 samba-10c06a1968dbf39d8a3790077a3537b8323f36ff.zip