summaryrefslogtreecommitdiff
path: root/swat/apps/qooxdoo-examples/example
diff options
context:
space:
mode:
authorDerrell Lipman <derrell@samba.org>2006-10-06 15:40:18 +0000
committerGerald (Jerry) Carter <jerry@samba.org>2007-10-10 14:20:40 -0500
commit10c06a1968dbf39d8a3790077a3537b8323f36ff (patch)
treef7389aac531dfe7c0d538879bdbd15cca33156e4 /swat/apps/qooxdoo-examples/example
parent77fc14c0818498e277a79196fa4f6e15f4b607b1 (diff)
downloadsamba-10c06a1968dbf39d8a3790077a3537b8323f36ff.tar.gz
samba-10c06a1968dbf39d8a3790077a3537b8323f36ff.tar.bz2
samba-10c06a1968dbf39d8a3790077a3537b8323f36ff.zip
r19141: add a reasonable subset of the qooxdoo runtime environment, and example applications
(This used to be commit ff28ab7314ff1eebcd62f387678b816091af8121)
Diffstat (limited to 'swat/apps/qooxdoo-examples/example')
-rw-r--r--swat/apps/qooxdoo-examples/example/Atom_1.html73
-rw-r--r--swat/apps/qooxdoo-examples/example/Atom_2.html172
-rw-r--r--swat/apps/qooxdoo-examples/example/Atom_3.html39
-rw-r--r--swat/apps/qooxdoo-examples/example/ButtonView_1.html89
-rw-r--r--swat/apps/qooxdoo-examples/example/ButtonView_2.html98
-rw-r--r--swat/apps/qooxdoo-examples/example/Button_1.html73
-rw-r--r--swat/apps/qooxdoo-examples/example/CheckBox_1.html104
-rw-r--r--swat/apps/qooxdoo-examples/example/ColorPopup_1.html83
-rw-r--r--swat/apps/qooxdoo-examples/example/ColorSelector_1.html29
-rw-r--r--swat/apps/qooxdoo-examples/example/ColorSelector_2.html30
-rw-r--r--swat/apps/qooxdoo-examples/example/ComboBox_1.html101
-rw-r--r--swat/apps/qooxdoo-examples/example/DateChooser_1.html31
-rw-r--r--swat/apps/qooxdoo-examples/example/Drag_1.html57
-rw-r--r--swat/apps/qooxdoo-examples/example/Fields_1.html107
-rw-r--r--swat/apps/qooxdoo-examples/example/Flash_1.html53
-rw-r--r--swat/apps/qooxdoo-examples/example/GalleryList_1.html129
-rw-r--r--swat/apps/qooxdoo-examples/example/Gallery_1.html116
-rw-r--r--swat/apps/qooxdoo-examples/example/GroupBox_1.html107
-rw-r--r--swat/apps/qooxdoo-examples/example/GroupBox_2.html153
-rw-r--r--swat/apps/qooxdoo-examples/example/GroupBox_3.html160
-rw-r--r--swat/apps/qooxdoo-examples/example/Iframe_1.html71
-rw-r--r--swat/apps/qooxdoo-examples/example/Inline_1.html260
-rw-r--r--swat/apps/qooxdoo-examples/example/ListView_1.html67
-rw-r--r--swat/apps/qooxdoo-examples/example/ListView_2.html53
-rw-r--r--swat/apps/qooxdoo-examples/example/ListView_3.html51
-rw-r--r--swat/apps/qooxdoo-examples/example/ListView_4.html58
-rw-r--r--swat/apps/qooxdoo-examples/example/List_1.html127
-rw-r--r--swat/apps/qooxdoo-examples/example/Menu_1.html193
-rw-r--r--swat/apps/qooxdoo-examples/example/NativeWindow_1.html190
-rw-r--r--swat/apps/qooxdoo-examples/example/RadioButton_1.html114
-rw-r--r--swat/apps/qooxdoo-examples/example/RepeatButton_1.html73
-rw-r--r--swat/apps/qooxdoo-examples/example/RpcTreeFullControl_1.html192
-rw-r--r--swat/apps/qooxdoo-examples/example/Spinner_1.html106
-rw-r--r--swat/apps/qooxdoo-examples/example/SplitPane_1.html70
-rw-r--r--swat/apps/qooxdoo-examples/example/SplitPane_2.html72
-rw-r--r--swat/apps/qooxdoo-examples/example/TabView_1.html152
-rw-r--r--swat/apps/qooxdoo-examples/example/TabView_2.html127
-rw-r--r--swat/apps/qooxdoo-examples/example/Table_1.html52
-rw-r--r--swat/apps/qooxdoo-examples/example/ToolBar_1.html252
-rw-r--r--swat/apps/qooxdoo-examples/example/ToolBar_2.html269
-rw-r--r--swat/apps/qooxdoo-examples/example/ToolBar_3.html184
-rw-r--r--swat/apps/qooxdoo-examples/example/ToolBar_4.html196
-rw-r--r--swat/apps/qooxdoo-examples/example/ToolTip_1.html111
-rw-r--r--swat/apps/qooxdoo-examples/example/TreeFullControl_1.html235
-rw-r--r--swat/apps/qooxdoo-examples/example/TreeFullControl_2.html270
-rw-r--r--swat/apps/qooxdoo-examples/example/TreeFullControl_3.html298
-rw-r--r--swat/apps/qooxdoo-examples/example/TreeFullControl_4.html384
-rw-r--r--swat/apps/qooxdoo-examples/example/TreeFullControl_5.html247
-rw-r--r--swat/apps/qooxdoo-examples/example/Tree_1.html191
-rw-r--r--swat/apps/qooxdoo-examples/example/Window_1.html308
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file1.swfbin0 -> 354 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file10.swfbin0 -> 354 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file2.swfbin0 -> 354 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file3.swfbin0 -> 353 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file4.swfbin0 -> 354 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file5.swfbin0 -> 354 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file6.swfbin0 -> 353 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file7.swfbin0 -> 353 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file8.swfbin0 -> 354 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/color/file9.swfbin0 -> 354 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/fo_tester.flabin0 -> 58368 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/image/flash/fo_tester.swfbin0 -> 10210 bytes
-rw-r--r--swat/apps/qooxdoo-examples/example/index.html18
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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
Binary files differ
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