summaryrefslogtreecommitdiff
path: root/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example
diff options
context:
space:
mode:
Diffstat (limited to 'webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example')
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_1.html73
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_2.html172
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_3.html39
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ButtonView_1.html89
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ButtonView_2.html98
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Button_1.html73
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/CheckBox_1.html104
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorPopup_1.html83
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorSelector_1.html29
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorSelector_2.html30
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ComboBoxEx_1.html230
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ComboBox_1.html101
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Command_1.html141
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Command_2.html186
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/DateChooser_1.html31
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Drag_1.html57
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fields_1.html107
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Flash_1.html53
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1.html26
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/fsm.js297
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/gui.js95
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/main.js11
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GalleryList_1.html129
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Gallery_1.html116
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_1.html107
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_2.html153
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_3.html160
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Iframe_1.html71
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Inline_1.html260
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_1.html67
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_2.html53
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_3.html51
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_4.html58
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/List_1.html127
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Menu_1.html193
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/NativeWindow_1.html198
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RadioButton_1.html114
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RepeatButton_1.html73
-rwxr-xr-xwebapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Resizer_1.html63
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RpcTreeFullControl_1.html194
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Spinner_1.html106
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/SplitPane_1.html72
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/SplitPane_2.html75
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TabView_1.html152
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TabView_2.html127
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Table_1.html107
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Table_2.html50
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_1.html252
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_2.html269
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_3.html184
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_4.html196
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolTip_1.html111
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_1.html235
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_2.html270
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_3.html298
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_4.html384
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Tree_1.html191
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Window_1.html308
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file1.swfbin0 -> 354 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file10.swfbin0 -> 354 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file2.swfbin0 -> 354 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file3.swfbin0 -> 353 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file4.swfbin0 -> 354 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file5.swfbin0 -> 354 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file6.swfbin0 -> 353 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file7.swfbin0 -> 353 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file8.swfbin0 -> 354 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file9.swfbin0 -> 354 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/fo_tester.flabin0 -> 58368 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/fo_tester.swfbin0 -> 10210 bytes
-rw-r--r--webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/index.html18
71 files changed, 7717 insertions, 0 deletions
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_1.html
new file mode 100644
index 0000000000..4dff79cf3d
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_2.html
new file mode 100644
index 0000000000..db698a7232
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_3.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Atom_3.html
new file mode 100644
index 0000000000..4a5db8e9bf
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ButtonView_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ButtonView_1.html
new file mode 100644
index 0000000000..19c7c6f118
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Button("Display", "icon/32/display.png");
+ var bsb2 = new qx.ui.pageview.buttonview.Button("Penguin", "icon/32/penguin.png");
+ var bsb3 = new qx.ui.pageview.buttonview.Button("Colors", "icon/32/colors.png");
+ var bsb4 = new qx.ui.pageview.buttonview.Button("Icons", "icon/32/icons.png");
+ var bsb5 = new qx.ui.pageview.buttonview.Button("Paint", "icon/32/paint.png");
+ var bsb6 = new qx.ui.pageview.buttonview.Button("Applications", "icon/32/run.png");
+ var bsb7 = new qx.ui.pageview.buttonview.Button("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.Page(bsb1);
+ var p2 = new qx.ui.pageview.buttonview.Page(bsb2);
+ var p3 = new qx.ui.pageview.buttonview.Page(bsb3);
+ var p4 = new qx.ui.pageview.buttonview.Page(bsb4);
+ var p5 = new qx.ui.pageview.buttonview.Page(bsb5);
+ var p6 = new qx.ui.pageview.buttonview.Page(bsb6);
+ var p7 = new qx.ui.pageview.buttonview.Page(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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ButtonView_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ButtonView_2.html
new file mode 100644
index 0000000000..722827a894
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Button("Display", "icon/16/display.png");
+ var bsb2 = new qx.ui.pageview.buttonview.Button("Organizer", "icon/16/organizer.png");
+ var bsb3 = new qx.ui.pageview.buttonview.Button("Colorize", "icon/16/colors.png");
+ var bsb4 = new qx.ui.pageview.buttonview.Button("Icons", "icon/16/icons.png");
+ var bsb5 = new qx.ui.pageview.buttonview.Button("Paint", "icon/16/paint.png");
+ var bsb6 = new qx.ui.pageview.buttonview.Button("Applications", "icon/16/run.png");
+ var bsb7 = new qx.ui.pageview.buttonview.Button("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.Page(bsb1);
+ var p2 = new qx.ui.pageview.buttonview.Page(bsb2);
+ var p3 = new qx.ui.pageview.buttonview.Page(bsb3);
+ var p4 = new qx.ui.pageview.buttonview.Page(bsb4);
+ var p5 = new qx.ui.pageview.buttonview.Page(bsb5);
+ var p6 = new qx.ui.pageview.buttonview.Page(bsb6);
+ var p7 = new qx.ui.pageview.buttonview.Page(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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Button_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Button_1.html
new file mode 100644
index 0000000000..7f26c3325c
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/CheckBox_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/CheckBox_1.html
new file mode 100644
index 0000000000..9073dc7098
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorPopup_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorPopup_1.html
new file mode 100644
index 0000000000..269d863fb1
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Location.getPageBoxBottom(this.getElement()));
+ mypop.setLeft(qx.dom.Location.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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorSelector_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorSelector_1.html
new file mode 100644
index 0000000000..a54005fbd9
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorSelector_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ColorSelector_2.html
new file mode 100644
index 0000000000..1fbf822822
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ComboBoxEx_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ComboBoxEx_1.html
new file mode 100644
index 0000000000..ea628b89be
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ComboBoxEx_1.html
@@ -0,0 +1,230 @@
+<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>
+ <script type="text/javascript">
+
+function getTestData() {
+ var testData = [
+ [ '1', 'One' ],
+ [ '2', 'Two' ],
+ [ '3', 'Three' ],
+ [ '4', 'Four' ],
+ [ '5', 'Five' ],
+ [ '6', 'Six' ],
+ [ '7', 'Seven' ],
+ [ '8', 'Eight' ],
+ [ '9', 'Nine' ],
+ [ '10', 'Ten' ],
+ [ '11', 'Eleven' ],
+ [ '12', 'Twelve' ],
+ [ '13', 'Thirteen' ],
+ [ '14', 'Fourteen' ],
+ [ '15', 'Fiveteen' ],
+ [ '16', 'Sixteen' ],
+ [ '17', 'Seventeen' ],
+ // Test of a long string
+ [ '1921', 'One thousand nine hundred twenty one' ]
+ ];
+ for (var i = 0; i < testData.length; i++) {
+ testData[i].push('widget/arrows/'+(i % 2 ? 'up':'down')+'_small.gif');
+ testData[i].push('Extra data '+i);
+ }
+ return testData;
+}
+
+qx.OO.defineClass('Box', qx.ui.layout.BoxLayout, function() {
+ qx.ui.layout.BoxLayout.apply(this, arguments);
+ this.auto();
+});
+
+qx.OO.defineClass('GroupBox', qx.ui.groupbox.GroupBox, function() {
+ qx.ui.groupbox.GroupBox.apply(this, arguments);
+ this.auto();
+});
+
+qx.core.Init.getInstance().defineMain(function() {
+ // Shortcuts
+ var form = qx.ui.form;
+ Label = qx.ui.basic.Label;
+ var testData = getTestData();
+
+ //###1st row: combo
+
+ combo = new form.ComboBoxEx;
+ var butSize = new form.Button('Size text field to content');
+ butSize.addEventListener('execute', function() {
+ combo.sizeTextFieldToContent();
+ });
+
+ var boxCombo2 = new Box;
+ with (boxCombo2) {
+ setSpacing(10);
+ add(combo, butSize);
+ }
+ var boxCombo = new GroupBox('This is the ComboBoxEx under test');
+ boxCombo.add(boxCombo2);
+
+ //###2nd row: Test of simple properties
+ var cEd = new form.CheckBox('Editable');
+ cEd.setChecked(combo.getEditable());
+ cEd.addEventListener('changeChecked', function() {
+ combo.setEditable(cEd.isChecked());
+ });
+
+ var cEnsure = new form.CheckBox('Ensure something selected');
+ cEnsure.setChecked(combo.getEnsureSomethingSelected());
+ cEnsure.addEventListener('changeChecked', function() {
+ combo.setEnsureSomethingSelected(cEnsure.isChecked());
+ });
+
+ var cAllowSearch = new form.CheckBox('Allow searching');
+ cAllowSearch.setChecked(combo.getAllowSearch());
+ cAllowSearch.addEventListener('changeChecked', function() {
+ combo.setAllowSearch(cAllowSearch.isChecked());
+ });
+
+ var cIdCol = new form.CheckBox('ID column visible');
+ cIdCol.setChecked(combo.isIdColumnVisible());
+ cIdCol.addEventListener('changeChecked', function() {
+ combo.setIdColumnVisible(cIdCol.isChecked());
+ });
+
+ var fieldItems = new form.Spinner(0, 0, testData.length);
+ fieldItems._manager.addEventListener('changeValue', function() {
+ var sel = [], count = fieldItems.getValue();
+ for (var i = 0; i < count; i++) {
+ sel.push(testData[i]);
+ }
+ combo.setSelection(sel);
+ });
+ fieldItems.setValue(15);
+
+ var boxProp2 = new Box;
+ with (boxProp2) {
+ setSpacing(10);
+ add(cEd, cEnsure, cAllowSearch, cIdCol, new Label('Number of items in list'), fieldItems);
+ }
+ var boxProp = new GroupBox('Test of simple properties');
+ boxProp.add(boxProp2);
+
+ //###Test of headers
+ var allHeaders = [ 'ID', 'Description', 'Img', 'Extra info' ];
+ var rb1 = new form.RadioButton('1', '1');
+ var rb2 = new form.RadioButton('2', '2');
+ rb2.setChecked(true);
+ var rb3 = new form.RadioButton('3', '3');
+ var rb4 = new form.RadioButton('4', '4');
+
+ var fieldHeaders = new qx.manager.selection.RadioManager('headers', [ rb1, rb2, rb3, rb4 ]);
+ fieldHeaders.addEventListener("changeSelected", function(e) {
+ var headers = [], count = Number(e.getData().getValue());
+ for (var i = 0; i < count; i++) {
+ headers.push(allHeaders[i]);
+ }
+ combo.setColumnHeaders(headers);
+ });
+
+ var butChangeHeaders = new form.Button('Add * to headers');
+ // This tests changing the headers, but not the number of columns
+ butChangeHeaders.addEventListener('execute', function() {
+ var headers = combo.getColumnHeaders();
+ for (var i = 0; i < headers.length; i++) {
+ headers[i] += '*';
+ }
+ combo.setColumnHeaders(headers);
+ });
+
+ var boxHeaders2 = new Box;
+ with (boxHeaders2) {
+ setSpacing(10);
+ add(new Label('# of headers'), rb1, rb2, rb3, rb4, butChangeHeaders);
+ }
+ var boxHeaders = new GroupBox('Test headers');
+ boxHeaders.add(boxHeaders2);
+
+ var fieldMaxRows = new form.Spinner(2, combo.getMaxVisibleRows(), 20);
+ fieldMaxRows._manager.addEventListener('changeValue', function() {
+ combo.setMaxVisibleRows(fieldMaxRows.getValue());
+ });
+ var boxMaxRows = new GroupBox('Max. number of visible rows');
+ boxMaxRows.add(fieldMaxRows);
+
+ var boxRow3 = new Box;
+ boxRow3.add(boxHeaders, boxMaxRows);
+
+ //###Test of showOnTextField
+ var rbDesc = new form.RadioButton('Description', 'description');
+ rbDesc.setChecked(true);
+ var rbIdAndDesc = new form.RadioButton('ID and description', 'idAndDescription');
+ var fieldShowOn = new qx.manager.selection.RadioManager("showOnTextField", [ rbDesc, rbIdAndDesc ]);
+ fieldShowOn.addEventListener("changeSelected", function(e) {
+ combo.setShowOnTextField(e.getData().getValue());
+ });
+
+ var fieldSeparator = new form.TextField;
+ fieldSeparator.setValue(combo.getIdDescriptionSeparator());
+ fieldSeparator.setWidth(50);
+ fieldSeparator.addEventListener('changeValue', function() {
+ combo.setIdDescriptionSeparator(fieldSeparator.getValue());
+ });
+ var boxShowOn2 = new Box;
+ with (boxShowOn2) {
+ setSpacing(10);
+ add(new Label('Show on text field:'), rbDesc, rbIdAndDesc, new Label('Separator between ID and description:'), fieldSeparator);
+ }
+ var boxShowOn = new GroupBox('Test showOnTextField property');
+ boxShowOn.add(boxShowOn2);
+
+ //###Test of get/setValue
+ var fieldValue = new form.TextField;
+ var butSetValue = new form.Button('Set');
+ butSetValue.addEventListener('execute', function() {
+ combo.setValue(fieldValue.getValue());
+ });
+ var butGetValue = new form.Button('Get');
+ butGetValue.addEventListener('execute', function() {
+ fieldValue.setValue(combo.getValue());
+ });
+ var boxVal2 = new Box;
+ with (boxVal2) {
+ setSpacing(10);
+ add(fieldValue, butSetValue, butGetValue);
+ }
+ var boxVal = new GroupBox('Test value property');
+ boxVal.add(boxVal2);
+
+ //###Main box
+ var vbox = new Box('vertical');
+ with (vbox) {
+ setSpacing(10);
+ setTop(50);
+ setLeft(30);
+ add(boxCombo, boxProp, boxRow3, boxShowOn, boxVal);
+ addToDocument();
+ }
+ combo.focus();
+});
+ </script>
+</head>
+<body>
+ <script type="text/javascript" src="../../script/layout.js"></script>
+ <script type="text/javascript">
+if (console.debug) {
+ with (qx.dev.log.Logger.ROOT_LOGGER) {
+ removeAllAppenders();
+ addAppender(new qx.dev.log.FireBugAppender);
+ setMinLevel(qx.dev.log.Logger.LEVEL_WARN);
+ }
+}
+ </script>
+ <div id="demoDescription">
+ <p>ComboBoxEx is an enhanced version of ComboBox</p>
+ </div>
+</body>
+</html> \ No newline at end of file
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ComboBox_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ComboBox_1.html
new file mode 100644
index 0000000000..682b17229e
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Command_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Command_1.html
new file mode 100644
index 0000000000..9cf2b0ee36
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Command_1.html
@@ -0,0 +1,141 @@
+<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>An example showing global shortcut commands in action. The commands are linked with menu-items, but
+ could also be executed with the corresponding shortcut.</p>
+ </div>
+
+ <script type="text/javascript">
+ qx.core.Init.getInstance().defineMain(function()
+ {
+ var d = qx.ui.core.ClientDocument.getInstance();
+
+ /* comamnds */
+ var undo_cmd = new qx.client.Command("Ctrl+Z");
+ undo_cmd.addEventListener("execute", function(){ this.debug("undo Command executed"); }, this);
+
+ var redo_cmd = new qx.client.Command("Ctrl+Y");
+ redo_cmd.addEventListener("execute", function(){ this.debug("redo Command executed"); }, this);
+
+ var cut_cmd = new qx.client.Command("Ctrl+X");
+ cut_cmd.addEventListener("execute", function(){ this.debug("cut Command executed"); }, this);
+
+ var copy_cmd = new qx.client.Command("Ctrl+C");
+ copy_cmd.addEventListener("execute", function(){ this.debug("copy Command executed"); }, this);
+
+ var paste_cmd = new qx.client.Command("Ctrl+V");
+ paste_cmd.addEventListener("execute", function(){ this.debug("paste Command executed"); }, this);
+
+ var delete_cmd = new qx.client.Command("Del");
+ delete_cmd.addEventListener("execute", function(){ this.debug("delete Command executed"); }, this);
+
+ var select_all_cmd = new qx.client.Command("Ctrl+A");
+ select_all_cmd.addEventListener("execute", function(){ this.debug("select all Command executed"); }, this);
+
+ var search_cmd = new qx.client.Command("Ctrl+F");
+ search_cmd.addEventListener("execute", function(){ this.debug("search Command executed"); }, this);
+
+ var search_again_cmd = new qx.client.Command("F3");
+ search_again_cmd.addEventListener("execute", function(){ this.debug("search again Command executed"); }, this);
+
+ /* building the menu */
+ var m2 = new qx.ui.menu.Menu;
+
+ var mb2_01 = new qx.ui.menu.Button("New Window");
+ var mb2_02 = new qx.ui.menu.Button("Overlapping");
+ var mb2_03 = new qx.ui.menu.Button("Split Vertical");
+ var mb2_04 = new qx.ui.menu.Button("Split Horizontal");
+ var mb2_05 = new qx.ui.menu.Button("Next Window");
+ var mb2_06 = new qx.ui.menu.Button("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.Button("Tahoma, 11pt");
+ var mb3_02 = new qx.ui.menu.Button("Tahoma, 12pt");
+ var mb3_03 = new qx.ui.menu.Button("Tahoma, 13pt");
+ var mb3_04 = new qx.ui.menu.Button("Tahoma, 14pt");
+ var mb3_05 = new qx.ui.menu.Button("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.Button("View/Lists");
+ var mb1_02 = new qx.ui.menu.Button("Syntax Highlighting");
+ var ms1 = new qx.ui.menu.Separator();
+ var mb1_03 = new qx.ui.menu.Button("Window Font");
+ var mb1_04 = new qx.ui.menu.Button("Printer Font", null, null, m3);
+ var ms2 = new qx.ui.menu.Separator();
+ var mb1_05 = new qx.ui.menu.Button("Undo", null, undo_cmd);
+ var mb1_06 = new qx.ui.menu.Button("Redo", null, redo_cmd);
+ var ms3 = new qx.ui.menu.Separator();
+ var mb1_07 = new qx.ui.menu.Button("Cut", "icon/16/edit-cut.png", cut_cmd);
+ var mb1_08 = new qx.ui.menu.Button("Copy", "icon/16/edit-copy.png", copy_cmd);
+ var mb1_09 = new qx.ui.menu.Button("Paste", "icon/16/edit-paste.png", paste_cmd);
+ var mb1_10 = new qx.ui.menu.Button("Delete", "icon/16/edit-delete.png", delete_cmd);
+ var mb1_11 = new qx.ui.menu.Button("Select All", null, select_all_cmd);
+ var ms4 = new qx.ui.menu.Separator();
+ var mb1_12 = new qx.ui.menu.Button("Search", null, search_cmd);
+ var mb1_13 = new qx.ui.menu.Button("Search Again", null, search_again_cmd);
+ var ms5 = new qx.ui.menu.Separator();
+ var mb1_14 = new qx.ui.menu.Button("View", null, null, m2);
+ var mb1_15 = new qx.ui.menu.Button("Editor Settings...");
+ var mb1_16 = new qx.ui.menu.Button("Editor Plugins");
+ var mb1_17 = new qx.ui.menu.Button("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.Location.getPageBoxLeft(el));
+ m1.setTop(qx.dom.Location.getPageBoxBottom(el));
+
+ m1.show();
+ };
+
+ e.setPropagationStopped(true);
+ });
+
+ w1.addEventListener("mousedown", function(e)
+ {
+ e.setPropagationStopped(true);
+ });
+
+
+ d.add(w1);
+ });
+ </script>
+</body>
+</html>
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Command_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Command_2.html
new file mode 100644
index 0000000000..46b490e9eb
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Command_2.html
@@ -0,0 +1,186 @@
+<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>An example showing global shortcut commands in action. The commands are linked with menu-items, but
+ could also be executed with the corresponding shortcut.</p>
+ <p>An objectmanager is used to disable/enable a specific command (del-Key) to make available for text-editing
+ in the textfield of the window. When the window is closed the command gets re-enabled.</p>
+ </div>
+
+ <script type="text/javascript">
+ qx.core.Init.getInstance().defineMain(function()
+ {
+ var d = qx.ui.core.ClientDocument.getInstance();
+
+ /* comamnds */
+ var undo_cmd = new qx.client.Command("Ctrl+Z");
+ undo_cmd.addEventListener("execute", function(){ this.debug("undo Command executed"); }, this);
+
+ var redo_cmd = new qx.client.Command("Ctrl+Y");
+ redo_cmd.addEventListener("execute", function(){ this.debug("redo Command executed"); }, this);
+
+ var cut_cmd = new qx.client.Command("Ctrl+X");
+ cut_cmd.addEventListener("execute", function(){ this.debug("cut Command executed"); }, this);
+
+ var copy_cmd = new qx.client.Command("Ctrl+C");
+ copy_cmd.addEventListener("execute", function(){ this.debug("copy Command executed"); }, this);
+
+ var paste_cmd = new qx.client.Command("Ctrl+V");
+ paste_cmd.addEventListener("execute", function(){ this.debug("paste Command executed"); }, this);
+
+ var delete_cmd = new qx.client.Command("Del");
+ delete_cmd.addEventListener("execute", function(){ this.debug("delete Command executed"); }, this);
+
+ var select_all_cmd = new qx.client.Command("Ctrl+A");
+ select_all_cmd.addEventListener("execute", function(){ this.debug("select all Command executed"); }, this);
+
+ var search_cmd = new qx.client.Command("Ctrl+F");
+ search_cmd.addEventListener("execute", function(){ this.debug("search Command executed"); }, this);
+
+ var search_again_cmd = new qx.client.Command("F3");
+ search_again_cmd.addEventListener("execute", function(){ this.debug("search again Command executed"); }, this);
+
+
+ /* objectmanager for all commands which should be disabled when opening the window */
+ var cmd_manager = new qx.manager.object.ObjectManager;
+ cmd_manager.add(delete_cmd);
+
+
+ /* building the menu */
+ var m2 = new qx.ui.menu.Menu;
+
+ var mb2_01 = new qx.ui.menu.Button("New Window");
+ var mb2_02 = new qx.ui.menu.Button("Overlapping");
+ var mb2_03 = new qx.ui.menu.Button("Split Vertical");
+ var mb2_04 = new qx.ui.menu.Button("Split Horizontal");
+ var mb2_05 = new qx.ui.menu.Button("Next Window");
+ var mb2_06 = new qx.ui.menu.Button("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.Button("Tahoma, 11pt");
+ var mb3_02 = new qx.ui.menu.Button("Tahoma, 12pt");
+ var mb3_03 = new qx.ui.menu.Button("Tahoma, 13pt");
+ var mb3_04 = new qx.ui.menu.Button("Tahoma, 14pt");
+ var mb3_05 = new qx.ui.menu.Button("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.Button("View/Lists");
+ var mb1_02 = new qx.ui.menu.Button("Syntax Highlighting");
+ var ms1 = new qx.ui.menu.Separator();
+ var mb1_03 = new qx.ui.menu.Button("Window Font");
+ var mb1_04 = new qx.ui.menu.Button("Printer Font", null, null, m3);
+ var ms2 = new qx.ui.menu.Separator();
+ var mb1_05 = new qx.ui.menu.Button("Undo", null, undo_cmd);
+ var mb1_06 = new qx.ui.menu.Button("Redo", null, redo_cmd);
+ var ms3 = new qx.ui.menu.Separator();
+ var mb1_07 = new qx.ui.menu.Button("Cut", "icon/16/edit-cut.png", cut_cmd);
+ var mb1_08 = new qx.ui.menu.Button("Copy", "icon/16/edit-copy.png", copy_cmd);
+ var mb1_09 = new qx.ui.menu.Button("Paste", "icon/16/edit-paste.png", paste_cmd);
+ var mb1_10 = new qx.ui.menu.Button("Delete", "icon/16/edit-delete.png", delete_cmd);
+ var mb1_11 = new qx.ui.menu.Button("Select All", null, select_all_cmd);
+ var ms4 = new qx.ui.menu.Separator();
+ var mb1_12 = new qx.ui.menu.Button("Search", null, search_cmd);
+ var mb1_13 = new qx.ui.menu.Button("Search Again", null, search_again_cmd);
+ var ms5 = new qx.ui.menu.Separator();
+ var mb1_14 = new qx.ui.menu.Button("View", null, null, m2);
+ var mb1_15 = new qx.ui.menu.Button("Editor Settings...");
+ var mb1_16 = new qx.ui.menu.Button("Editor Plugins");
+ var mb1_17 = new qx.ui.menu.Button("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);
+
+
+ /* button to open menu */
+ 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.Location.getPageBoxLeft(el));
+ m1.setTop(qx.dom.Location.getPageBoxBottom(el));
+
+ m1.show();
+ };
+
+ e.setPropagationStopped(true);
+ });
+
+ w1.addEventListener("mousedown", function(e)
+ {
+ e.setPropagationStopped(true);
+ });
+
+
+ /* window */
+ var window1 = new qx.ui.window.Window("Test");
+ window1.set({ top: 100, left: 100, width: 300, height: 200, allowMaximize: false, allowMinimize: false });
+
+ window1.addEventListener("beforeAppear", function(e){
+ textField.setValue("");
+ });
+
+ window1.addEventListener("beforeDisappear", function(e){
+ cmd_manager.enableAll();
+ });
+
+ /* label */
+ var label1 = new qx.ui.basic.Label("Please enter your Name");
+ label1.setTop(20);
+ label1.setLeft(8);
+
+ /* textfield */
+ var textField = new qx.ui.form.TextField;
+ textField.setTop(20);
+ textField.setLeft(140);
+
+ window1.add(label1, textField);
+
+
+ /* button to open window */
+ var w2 = new qx.ui.form.Button("Open Window");
+ w2.setTop(48);
+ w2.setLeft(100);
+
+ w2.addEventListener("execute", function(e){
+ cmd_manager.disableAll();
+ window1.open();
+ });
+
+
+ d.add(w1, window1, w2);
+ });
+ </script>
+</body>
+</html>
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/DateChooser_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/DateChooser_1.html
new file mode 100644
index 0000000000..582ca8b386
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Drag_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Drag_1.html
new file mode 100644
index 0000000000..3347f13020
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fields_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fields_1.html
new file mode 100644
index 0000000000..96e86a4c19
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.getKeyIdentifier());
+ });
+
+ d.add(t6);
+ });
+ </script>
+</body>
+</html>
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Flash_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Flash_1.html
new file mode 100644
index 0000000000..3e2f0ceca8
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1.html
new file mode 100644
index 0000000000..81d745cded
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1.html
@@ -0,0 +1,26 @@
+<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 of a finite state machine. This is a sufficiently simple
+ application that using a finite state machine really doesn't make sense,
+ but it is illustrative of how to use it. This FSM has two states.
+ </p>
+ </div>
+
+ <script type="text/javascript" src="Fsm_1/main.js"></script>
+ <script type="text/javascript" src="Fsm_1/fsm.js"></script>
+ <script type="text/javascript" src="Fsm_1/gui.js"></script>
+</body>
+</html>
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/fsm.js b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/fsm.js
new file mode 100644
index 0000000000..50cdc25ccb
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/fsm.js
@@ -0,0 +1,297 @@
+/*
+ * Initialize the finite state machine.
+ *
+ * This finite state machine has two states: Idle and AwaitRpcResult.
+ *
+ * In the Idle state, the Send button is enabled, the Abort button is
+ * disabled, and the three color bars are blue. In the AwaitRpcResult state,
+ * the Send button is disabled, the Abort button is enabled, and three color
+ * bars are red. All of these changes occur via automatic, table-driven
+ * function calls in autoActionsXXX() objects, not via explicit code. This
+ * demonstrates how groups of objects can all be manipulated together without
+ * having to write lots of code to do so. Just as these color blocks change
+ * color, numerous widgets could be disabled/hidden/etc., without writing code
+ * to futz with all of them.
+ */
+function initFsm()
+{
+ // Create a new finite state machine
+ var fsm = new qx.util.fsm.FiniteStateMachine("Fsm_1");
+
+ // For this simple example application, show all debug messages.
+ qx.Settings.setCustomOfClass(
+ "qx.util.fsm.FiniteStateMachine",
+ "debugFlags",
+ (qx.util.fsm.FiniteStateMachine.DebugFlags.EVENTS |
+ qx.util.fsm.FiniteStateMachine.DebugFlags.TRANSITIONS |
+ qx.util.fsm.FiniteStateMachine.DebugFlags.FUNCTION_DETAIL |
+ qx.util.fsm.FiniteStateMachine.DebugFlags.OBJECT_NOT_FOUND));
+
+ /*
+ * State: Idle
+ *
+ * Actions upon entry:
+ * button_send.setEnabled(true);
+ * button_abort.setEnabled(false);
+ * change background of objects in group "group_color_change" to blue
+ *
+ * Transition on:
+ * "execute" on button_send
+ */
+ var state = new qx.util.fsm.State(
+ "State_Idle",
+ {
+ "autoActionsBeforeOnentry" :
+ {
+ // The name of a function.
+ "setEnabled" :
+ [
+ {
+ // We want to enable the 'send' button
+ "parameters" : [ true ],
+
+ // Call this.getObject("button_send").setEnabled(true)
+ "objects" : [ "button_send" ]
+ },
+
+ {
+ // We want to disable the 'abort' button
+ "parameters" : [ false ],
+
+ // Call this.getObject("button_abort").setEnabled(false)
+ "objects" : [ "button_abort" ]
+ }
+ ],
+
+ // The name of a function.
+ "setBackgroundColor" :
+ [
+ {
+ // We want to change the atoms' background color to blue
+ "parameters" :
+ [
+ // We want the color oject created when needed, not "now"
+ // Providing a function as a parameter allows the value to be
+ // determined later.
+ function (fsm) { return new qx.renderer.color.Color("blue"); }
+ ],
+
+ // Call this.getObject(<object>).seBackgroundcolor("blue") on
+ // state entry, for each <object> in the group called
+ // "group_color_change".
+ "groups" : [ "group_color_change" ]
+ }
+ ]
+ },
+
+ "events" :
+ {
+ // If the send button is pressed, go to new state state where we
+ // will await the RPC result
+ "execute" :
+ {
+ "button_send" :
+ "Transition_Idle_to_AwaitRpcResult_via_button_send"
+ }
+ }
+ });
+ fsm.addState(state);
+
+ /*
+ * Transition: Idle to AwaitRpcResult
+ *
+ * Cause: "execute" on button_send
+ *
+ * Action:
+ * Issue RPC request with coalesced failure events
+ */
+ var trans = new qx.util.fsm.Transition(
+ "Transition_Idle_to_AwaitRpcResult_via_button_send",
+ {
+ "nextState" :
+ "State_AwaitRpcResult",
+
+ "ontransition" :
+ function(fsm, event)
+ {
+ var rpc = fsm.getObject("rpc");
+
+ rpc.setUrl(fsm.getObject("text_url").getValue());
+ rpc.setServiceName(fsm.getObject("text_service").getValue());
+
+ var request =
+ rpc.callAsyncListeners(true, // coalesce failure events
+ fsm.getObject("text_method").getValue(),
+ fsm.getObject("text_message").getValue());
+ fsm.addObject("request", request);
+ }
+ });
+ state.addTransition(trans);
+
+
+ /*
+ * State: AwaitRpcResult
+ *
+ * Actions upon entry:
+ * button_send.setEnabled(false);
+ * button_abort.setEnabled(true);
+ * change background of objects in group "group_color_change" to red
+ *
+ * Transition on:
+ * "completed" (on RPC)
+ * "failed" (on RPC)
+ * "execute on button_abort
+ */
+ var state = new qx.util.fsm.State(
+ "State_AwaitRpcResult",
+ {
+ "autoActionsBeforeOnentry" :
+ {
+ // The name of a function.
+ "setEnabled" :
+ [
+ {
+ // We want to disable the 'send' button
+ "parameters" : [ false ],
+
+ // Call this.getObject("send").setEnabled(false)
+ "objects" : [ "button_send" ]
+ },
+
+ {
+ // We want to enable the 'abort' button
+ "parameters" : [ true ],
+
+ // Call this.getObject("abort").setEnabled(true)
+ "objects" : [ "button_abort" ]
+ }
+ ],
+
+ // The name of a function.
+ "setBackgroundColor" :
+ [
+ {
+ // We want to change the atoms' background color to red
+ "parameters" :
+ [
+ // We want the color oject created when needed, not "now"
+ // Providing a function as a parameter allows the value to be
+ // determined later.
+ function (fsm) { return new qx.renderer.color.Color("red"); }
+ ],
+
+ // Call this.getObject(<object>).seBackgroundcolor("red"), for
+ // each <object> in the group called "group_color_change".
+ "groups" : [ "group_color_change" ]
+ }
+ ]
+ },
+
+ "events" :
+ {
+ "execute" :
+ {
+ "button_abort" :
+ "Transition_AwaitRpcResult_to_AwaitRpcResult_via_button_abort"
+ },
+
+ "completed" :
+ "Transition_AwaitRpcResult_to_Idle_via_complete",
+
+ "failed" :
+ "Transition_AwaitRpcResult_to_Idle_via_failed"
+ },
+
+ "onentry" :
+ function(fsm, state)
+ {
+ var message = fsm.getObject("text_result");
+ message.setValue("");
+ }
+
+ });
+ fsm.addState(state);
+
+ /*
+ * Transition: AwaitRpcResult to AwaitRpcResult
+ *
+ * Cause: "execute" on button_abort
+ */
+ var trans = new qx.util.fsm.Transition(
+ "Transition_AwaitRpcResult_to_AwaitRpcResult_via_button_abort",
+ {
+ "nextState" :
+ "State_AwaitRpcResult",
+
+ "ontransition" :
+ function(fsm, event)
+ {
+ // Get the request object
+ var request = fsm.getObject("request");
+
+ // Issue an abort for the pending request
+ request.abort();
+
+ var message = fsm.getObject("text_result");
+ message.setValue("Abort requested...");
+ }
+ });
+ state.addTransition(trans);
+
+ /*
+ * Transition: AwaitRpcResult to Idle
+ *
+ * Cause: "complete" (on RPC)
+ */
+ var trans = new qx.util.fsm.Transition(
+ "Transition_AwaitRpcResult_to_Idle_via_complete",
+ {
+ "nextState" :
+ "State_Idle",
+
+ "ontransition" :
+ function(fsm, event)
+ {
+ var message = fsm.getObject("text_result");
+ message.setValue("Got result: " + event.getData());
+
+ // The request has completed, so remove the object reference
+ fsm.removeObject("request");
+ }
+ });
+ state.addTransition(trans);
+
+ /*
+ * Transition: AwaitRpcResult to Idle
+ *
+ * Cause: "failed" (on RPC)
+ */
+ var trans = new qx.util.fsm.Transition(
+ "Transition_AwaitRpcResult_to_Idle_via_failed",
+ {
+ "nextState" :
+ "State_Idle",
+
+ "ontransition" :
+ function(fsm, event)
+ {
+ var message = fsm.getObject("text_result");
+ message.setValue("Got failure: " + event.getData());
+
+ // The request has completed, so remove the object reference
+ fsm.removeObject("request");
+ }
+ });
+ state.addTransition(trans);
+
+ // Allocate an RPC object
+ o = new qx.io.remote.Rpc();
+ o.setTimeout(10000);
+ o.addEventListener("completed", fsm.eventListener, fsm);
+ o.addEventListener("failed", fsm.eventListener, fsm);
+ o.addEventListener("timeout", fsm.eventListener, fsm);
+ o.addEventListener("aborted", fsm.eventListener, fsm);
+ fsm.addObject("rpc", o);
+
+ return fsm;
+}
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/gui.js b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/gui.js
new file mode 100644
index 0000000000..0ba443a629
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/gui.js
@@ -0,0 +1,95 @@
+function initGui(fsm)
+{
+ var o;
+ var d = qx.ui.core.ClientDocument.getInstance();
+
+ var vLayout = new qx.ui.layout.VerticalBoxLayout();
+ vLayout.setTop(40);
+ vLayout.setLeft(20);
+ vLayout.setSpacing(4);
+
+ vLayout.add(new qx.ui.basic.Label("URL:"));
+ var defaultURL = qx.io.remote.Rpc.makeServerURL();
+ if (defaultURL == null)
+ {
+ defaultURL = "/services/";
+ }
+ o = new qx.ui.form.TextField(defaultURL);
+ vLayout.add(o);
+ fsm.addObject("text_url", o);
+
+ vLayout.add(new qx.ui.basic.Label("Service:"));
+ o = new qx.ui.form.TextField("qooxdoo.test");
+ vLayout.add(o);
+ fsm.addObject("text_service", o);
+
+ vLayout.add(new qx.ui.basic.Label("Method:"));
+ o = new qx.ui.form.TextField("sleep");
+ vLayout.add(o);
+ fsm.addObject("text_method", o);
+
+ var hLayout = new qx.ui.layout.HorizontalBoxLayout();
+ hLayout.setHeight("auto");
+ hLayout.setVerticalChildrenAlign("middle");
+ hLayout.setSpacing(4);
+
+ o = new qx.ui.form.TextField("2");
+ o.setWidth(200);
+ hLayout.add(o);
+ fsm.addObject("text_message", o);
+
+ o = new qx.ui.form.Button("Send to server");
+ o.addEventListener("execute", fsm.eventListener, fsm);
+ hLayout.add(o);
+ fsm.addObject("button_send", o);
+
+ o = new qx.ui.form.Button("Abort");
+ o.setEnabled(false);
+ o.addEventListener("execute", fsm.eventListener, fsm);
+ hLayout.add(o);
+ fsm.addObject("button_abort", o);
+
+ vLayout.add(hLayout);
+
+ vLayout.add(new qx.ui.basic.Label("Result:"));
+ o = new qx.ui.form.TextField("");
+ o.setWidth(600);
+ vLayout.add(o);
+ fsm.addObject("text_result", o);
+
+ var hLayout = new qx.ui.layout.HorizontalBoxLayout();
+ hLayout.setHeight("auto");
+ hLayout.setVerticalChildrenAlign("middle");
+ hLayout.setSpacing(4);
+
+ var o = new qx.ui.basic.Atom("Idle=blue, RPC=red");
+ o.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+ o.setColor(new qx.renderer.color.Color("white"));
+ o.setWidth(200);
+ o.setHeight(30);
+ o.setPadding(4);
+ hLayout.add(o);
+ fsm.addObject("atom_1", o, "group_color_change");
+
+ var o = new qx.ui.basic.Atom("Idle=blue, RPC=red");
+ o.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+ o.setColor(new qx.renderer.color.Color("white"));
+ o.setWidth(200);
+ o.setHeight(30);
+ o.setPadding(4);
+ hLayout.add(o);
+ fsm.addObject("atom_2", o, "group_color_change");
+
+ var o = new qx.ui.basic.Atom("Idle=blue, RPC=red");
+ o.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
+ o.setColor(new qx.renderer.color.Color("white"));
+ o.setWidth(200);
+ o.setHeight(30);
+ o.setPadding(4);
+ hLayout.add(o);
+ fsm.addObject("atom_3", o, "group_color_change");
+
+ vLayout.add(hLayout);
+
+ d.add(vLayout);
+}
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/main.js b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/main.js
new file mode 100644
index 0000000000..56a53ac484
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Fsm_1/main.js
@@ -0,0 +1,11 @@
+qx.core.Init.getInstance().defineMain(function()
+{
+ // Initialize the finite state machine
+ fsm = initFsm();
+
+ // Initialize the GUI
+ initGui(fsm);
+
+ // Start the finite state machine
+ fsm.start();
+});
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GalleryList_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GalleryList_1.html
new file mode 100644
index 0000000000..3973623338
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Gallery_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Gallery_1.html
new file mode 100644
index 0000000000..3252d3d1de
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_1.html
new file mode 100644
index 0000000000..39c2eafd00
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_2.html
new file mode 100644
index 0000000000..117732caf4
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_3.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/GroupBox_3.html
new file mode 100644
index 0000000000..e9a77c64bf
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Iframe_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Iframe_1.html
new file mode 100644
index 0000000000..90d87e1d9b
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Inline_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Inline_1.html
new file mode 100644
index 0000000000..bfec3e773f
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Button("New");
+ var mb1_02 = new qx.ui.menu.Button("Open");
+ var mb1_03 = new qx.ui.menu.Button("Save");
+ var mb1_04 = new qx.ui.menu.Button("Save as");
+ var mb1_05 = new qx.ui.menu.Button("Close");
+ var mb1_06 = new qx.ui.menu.Button("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.Button("Undo");
+ var mb2_02 = new qx.ui.menu.Button("Redo");
+ var mb2_b1 = new qx.ui.menu.Separator();
+ var mb2_03 = new qx.ui.menu.Button("Cut", "icon/16/edit-cut.png");
+ var mb2_04 = new qx.ui.menu.Button("Copy", "icon/16/edit-copy.png");
+ var mb2_05 = new qx.ui.menu.Button("Paste", "icon/16/edit-paste.png");
+ var mb2_06 = new qx.ui.menu.Button("Delete", "icon/16/edit-delete.png");
+ var mb2_b2 = new qx.ui.menu.Separator();
+ var mb2_07 = new qx.ui.menu.Button("Select All");
+ var mb2_08 = new qx.ui.menu.Button("Find");
+ var mb2_09 = new qx.ui.menu.Button("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.CheckBox("File List", null, false);
+ var mb3_02 = new qx.ui.menu.CheckBox("Syntax Highlighting", null, true);
+ var mb3_03 = new qx.ui.menu.CheckBox("Statusbar", null, true);
+ var mb3_b1 = new qx.ui.menu.Separator();
+ var mb3_04 = new qx.ui.menu.Button("Printer Font", null, null, m3_suba);
+ var mb3_05 = new qx.ui.menu.Button("Editor Font", null, null, m3_subb);
+ var mb3_06 = new qx.ui.menu.Button("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.Button("Tahoma, 11pt");
+ var mb3_suba_02 = new qx.ui.menu.Button("Tahoma, 12pt");
+ var mb3_suba_03 = new qx.ui.menu.Button("Tahoma, 13pt");
+ var mb3_suba_04 = new qx.ui.menu.Button("Tahoma, 14pt");
+ var mb3_suba_05 = new qx.ui.menu.Button("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.Button("Verdana, 11pt");
+ var mb3_subb_02 = new qx.ui.menu.Button("Verdana, 12pt");
+ var mb3_subb_03 = new qx.ui.menu.Button("Verdana, 13pt");
+ var mb3_subb_04 = new qx.ui.menu.Button("Verdana, 14pt");
+ var mb3_subb_05 = new qx.ui.menu.Button("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.Button("Courier, 11pt");
+ var mb3_subc_02 = new qx.ui.menu.Button("Courier, 12pt");
+ var mb3_subc_03 = new qx.ui.menu.Button("Courier, 13pt");
+ var mb3_subc_04 = new qx.ui.menu.Button("Courier, 14pt");
+ var mb3_subc_05 = new qx.ui.menu.Button("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.Button("View", null, null, m4_suba);
+ var mb4_b1 = new qx.ui.menu.Separator();
+ var mb4_02 = new qx.ui.menu.Button("Editor Preferences...");
+ var mb4_03 = new qx.ui.menu.Button("Editor Extensions");
+ var mb4_04 = new qx.ui.menu.Button("Framework Preferences");
+
+ m4.add(mb4_01, mb4_b1, mb4_02, mb4_03, mb4_04);
+
+ var mb4_suba_01 = new qx.ui.menu.Button("New Window");
+ var mb4_suba_b1 = new qx.ui.menu.Separator();
+ var mb4_suba_02 = new qx.ui.menu.RadioButton("Overlapping", null, true);
+ var mb4_suba_03 = new qx.ui.menu.RadioButton("Split Horizontally", null);
+ var mb4_suba_04 = new qx.ui.menu.RadioButton("Split Vertically", null);
+ var mb4_suba_b2 = new qx.ui.menu.Separator();
+ var mb4_suba_05 = new qx.ui.menu.Button("Next Window");
+ var mb4_suba_06 = new qx.ui.menu.Button("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.Button("Help");
+ var mb5_02 = new qx.ui.menu.Button("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.MenuButton("File", m1);
+ var mbb2 = new qx.ui.toolbar.MenuButton("Edit", m2);
+ var mbb3 = new qx.ui.toolbar.MenuButton("View", m3);
+ var mbb4 = new qx.ui.toolbar.MenuButton("Options", m4);
+ var mbb5 = new qx.ui.toolbar.MenuButton("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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_1.html
new file mode 100644
index 0000000000..661c4a8030
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_2.html
new file mode 100644
index 0000000000..14df77b47e
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_3.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_3.html
new file mode 100644
index 0000000000..89bfc6b086
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_4.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ListView_4.html
new file mode 100644
index 0000000000..f673bacc90
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/List_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/List_1.html
new file mode 100644
index 0000000000..17981e6f0c
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Menu_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Menu_1.html
new file mode 100644
index 0000000000..66fd0c8687
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Button("New Window");
+ var mb2_02 = new qx.ui.menu.Button("Overlapping");
+ var mb2_03 = new qx.ui.menu.Button("Split Vertical");
+ var mb2_04 = new qx.ui.menu.Button("Split Horizontal");
+ var mb2_05 = new qx.ui.menu.Button("Next Window");
+ var mb2_06 = new qx.ui.menu.Button("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.Button("Tahoma, 11pt");
+ var mb3_02 = new qx.ui.menu.Button("Tahoma, 12pt");
+ var mb3_03 = new qx.ui.menu.Button("Tahoma, 13pt");
+ var mb3_04 = new qx.ui.menu.Button("Tahoma, 14pt");
+ var mb3_05 = new qx.ui.menu.Button("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.Button("View/Lists", null, q12);
+ var mb1_02 = new qx.ui.menu.Button("Syntax Highlighting", null, q10);
+ var ms1 = new qx.ui.menu.Separator();
+ var mb1_03 = new qx.ui.menu.Button("Window Font", null, q11);
+ var mb1_04 = new qx.ui.menu.Button("Printer Font", null, null, m3);
+ var ms2 = new qx.ui.menu.Separator();
+ var mb1_05 = new qx.ui.menu.Button("Undo", null, q1);
+ var mb1_06 = new qx.ui.menu.Button("Redo", null, q2);
+ var ms3 = new qx.ui.menu.Separator();
+ var mb1_07 = new qx.ui.menu.Button("Cut", "icon/16/edit-cut.png", q3);
+ var mb1_08 = new qx.ui.menu.Button("Copy", "icon/16/edit-copy.png", q4);
+ var mb1_09 = new qx.ui.menu.Button("Paste", "icon/16/edit-paste.png", q5);
+ var mb1_10 = new qx.ui.menu.Button("Delete", "icon/16/edit-delete.png", q6);
+ var mb1_11 = new qx.ui.menu.Button("Select All", null, q7);
+ var ms4 = new qx.ui.menu.Separator();
+ var mb1_12 = new qx.ui.menu.Button("Search", null, q8);
+ var mb1_13 = new qx.ui.menu.Button("Search Again", null, q9);
+ var ms5 = new qx.ui.menu.Separator();
+ var mb1_14 = new qx.ui.menu.Button("View", null, null, m2);
+ var mb1_15 = new qx.ui.menu.Button("Editor Settings...");
+ var mb1_16 = new qx.ui.menu.Button("Editor Plugins");
+ var mb1_17 = new qx.ui.menu.Button("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.Location.getPageBoxLeft(el));
+ m1.setTop(qx.dom.Location.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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/NativeWindow_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/NativeWindow_1.html
new file mode 100644
index 0000000000..4d607a4424
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/NativeWindow_1.html
@@ -0,0 +1,198 @@
+<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);
+
+
+ w1.addEventListener("load", function(e) {
+ this.debug("Content loaded: " + this.isLoaded());
+ });
+
+ w1.addEventListener("close", function(e) {
+ this.debug("Window closed: " + this.isClosed());
+ });
+
+
+
+
+ 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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RadioButton_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RadioButton_1.html
new file mode 100644
index 0000000000..6976cb5fbf
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RepeatButton_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RepeatButton_1.html
new file mode 100644
index 0000000000..3858e7594a
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Resizer_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Resizer_1.html
new file mode 100755
index 0000000000..05ed00b7ce
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Resizer_1.html
@@ -0,0 +1,63 @@
+<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.resizer.Rezizer.</p>
+ <p>
+ The Resizer widget acts as a wrapper of another widget. It allows the child widget to be resized by the end user.
+ </p>
+ </div>
+
+ <script type="text/javascript">
+ function newResizer() {
+ var tArea = new qx.ui.form.TextArea;
+ tArea.setValue("Resize me\nI'm resizable");
+ tArea.set({
+ minWidth: 100,
+ minHeight: 50,
+ width: 200,
+ height: 100
+ });
+ return new qx.ui.resizer.Resizer(tArea);
+ }
+
+ function newHBox() {
+ var hBox = new qx.ui.layout.BoxLayout;
+ hBox.set({
+ spacing: 10
+ });
+ hBox.auto();
+ hBox.add(newResizer(), newResizer());
+ return hBox;
+ }
+
+ qx.core.Init.getInstance().defineMain(function() {
+ var vBox = new qx.ui.layout.VerticalBoxLayout;
+ var list = new qx.ui.form.List;
+ list.set({width: 100, height: 200, minWidth: 50, minHeight: 100, overflow: 'auto'});
+ for (var i = 0; i < 100; i++) {
+ list.add(new qx.ui.form.ListItem('Option number '+i));
+ }
+ vBox.add(new qx.ui.resizer.Resizer(list));
+ vBox.set({
+ spacing: 10,
+ top: 50,
+ left: 30
+ });
+ vBox.auto();
+ vBox.add(newHBox(), newHBox());
+ vBox.addToDocument();
+ });
+ </script>
+</body>
+</html>
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RpcTreeFullControl_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RpcTreeFullControl_1.html
new file mode 100644
index 0000000000..3bd0fed749
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/RpcTreeFullControl_1.html
@@ -0,0 +1,194 @@
+<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><strong>Only works together with a RPC backend!</strong></p>
+ <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.
+ </p>
+ </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 : "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(
+ "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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Spinner_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Spinner_1.html
new file mode 100644
index 0000000000..05406d5c53
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/SplitPane_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/SplitPane_1.html
new file mode 100644
index 0000000000..2f965c16bd
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/SplitPane_1.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 normal width Splitpane, no holding knobs, live resize enabled.</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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/SplitPane_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/SplitPane_2.html
new file mode 100644
index 0000000000..29f07fe558
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/SplitPane_2.html
@@ -0,0 +1,75 @@
+<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 extra slim Splitpane, with holding knobs.</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.setSplitterSize(1);
+ splitpane.setShowKnob(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.setSplitterSize(1);
+ rightWidget.setShowKnob(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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TabView_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TabView_1.html
new file mode 100644
index 0000000000..0179891e00
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Button("Edit");
+ var t1_2 = new qx.ui.pageview.tabview.Button("Find");
+ var t1_3 = new qx.ui.pageview.tabview.Button("Backup");
+
+ t1_1.setChecked(true);
+
+ tf1.getBar().add(t1_1, t1_2, t1_3);
+
+ var p1_1 = new qx.ui.pageview.tabview.Page(t1_1);
+ var p1_2 = new qx.ui.pageview.tabview.Page(t1_2);
+ var p1_3 = new qx.ui.pageview.tabview.Page(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.Button("Search for Files", "icon/16/file-open.png");
+ var t2_2 = new qx.ui.pageview.tabview.Button("Search the Web", "icon/16/network.png");
+ var t2_3 = new qx.ui.pageview.tabview.Button("Search for Text", "icon/16/contents.png");
+ var t2_4 = new qx.ui.pageview.tabview.Button("Search for Persons", "icon/16/emoticon.png");
+ var t2_5 = new qx.ui.pageview.tabview.Button("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.Page(t2_1);
+ var p2_2 = new qx.ui.pageview.tabview.Page(t2_2);
+ var p2_3 = new qx.ui.pageview.tabview.Page(t2_3);
+ var p2_4 = new qx.ui.pageview.tabview.Page(t2_4);
+ var p2_5 = new qx.ui.pageview.tabview.Page(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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TabView_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TabView_2.html
new file mode 100644
index 0000000000..0599a12103
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Button("Edit");
+ var t1_2 = new qx.ui.pageview.tabview.Button("Find");
+ var t1_3 = new qx.ui.pageview.tabview.Button("Backup");
+ var t1_4 = new qx.ui.pageview.tabview.Button("System");
+ var t1_5 = new qx.ui.pageview.tabview.Button("Tools");
+ var t1_6 = new qx.ui.pageview.tabview.Button("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.Page(t1_1);
+ var p1_2 = new qx.ui.pageview.tabview.Page(t1_2);
+ var p1_3 = new qx.ui.pageview.tabview.Page(t1_3);
+ var p1_4 = new qx.ui.pageview.tabview.Page(t1_4);
+ var p1_5 = new qx.ui.pageview.tabview.Page(t1_5);
+ var p1_6 = new qx.ui.pageview.tabview.Page(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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Table_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Table_1.html
new file mode 100644
index 0000000000..1fcf4b09c2
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Table_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>A table with virtual scrolling, model-view-controller, renderers,
+ 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();
+
+ var main = new qx.ui.layout.VerticalBoxLayout();
+ main.set({ left:10, top:30, right:300, bottom:30, spacing:5 });
+
+ var nextId = 0;
+ var createRandomRows = function(rowCount) {
+ var rowData = [];
+ var now = new Date().getTime();
+ var dateRange = 400 * 24 * 60 * 60 * 1000; // 400 days
+ for (var row = 0; row < rowCount; row++) {
+ var date = new Date(now + Math.random() * dateRange - dateRange / 2);
+ rowData.push([ nextId++, Math.random() * 10000, date, (Math.random() > 0.5) ]);
+ }
+ return rowData;
+ };
+
+ // Create the initial data
+ var rowData = createRandomRows(50);
+
+ // Add some encoding relevant stuff
+ rowData[15][1] = "<b>A html &amp; entities escaping test</b>";
+
+ // table model
+ var tableModel = new qx.ui.table.SimpleTableModel();
+ tableModel.setColumns([ "ID", "A number", "A date", "Boolean test" ]);
+ tableModel.setData(rowData);
+ tableModel.setColumnEditable(1, true);
+ tableModel.setColumnEditable(2, true);
+
+ // table
+ var table = new qx.ui.table.Table(tableModel);
+ with (table) {
+ set({ width:"100%", height:"1*", border:qx.renderer.border.BorderPresets.getInstance().thinInset });
+ getSelectionModel().setSelectionMode(qx.ui.table.SelectionModel.MULTIPLE_INTERVAL_SELECTION);
+ getTableColumnModel().setDataCellRenderer(3, new qx.ui.table.BooleanDataCellRenderer());
+ setColumnWidth(0, 80);
+ setColumnWidth(1, 200);
+ setColumnWidth(2, 150);
+ };
+ main.add(table);
+
+ var buttonBar = new qx.ui.layout.HorizontalBoxLayout();
+ buttonBar.set({ width:"100%", height:"auto", spacing:5 });
+ main.add(buttonBar);
+
+ var button = new qx.ui.form.Button("Change row with ID 10");
+ button.addEventListener("execute", function(evt) {
+ var rowData = createRandomRows(1);
+ for (var i = 1; i < tableModel.getColumnCount(); i++) {
+ tableModel.setValue(i, 10, rowData[0][i]);
+ }
+ this.info("Row 10 changed");
+ });
+ buttonBar.add(button);
+
+ var button = new qx.ui.form.Button("Add 10 rows");
+ button.addEventListener("execute", function(evt) {
+ var rowData = createRandomRows(10);
+ tableModel.addRows(rowData);
+ this.info("10 rows added");
+ });
+ buttonBar.add(button);
+
+ var button = new qx.ui.form.Button("Remove 5 rows");
+ button.addEventListener("execute", function(evt) {
+ var rowCount = tableModel.getRowCount();
+ tableModel.removeRows(rowCount-5, 5);
+ this.info("5 rows removed");
+ });
+ buttonBar.add(button);
+
+ var checkBox = new qx.ui.form.CheckBox("keepFirstVisibleRowComplete", null, null, table.getKeepFirstVisibleRowComplete());
+ checkBox.setToolTip(new qx.ui.popup.ToolTip("Whether the the first visible row should be rendered completely when scrolling."));
+ checkBox.addEventListener("changeChecked", function(evt) {
+ table.setKeepFirstVisibleRowComplete(checkBox.getChecked());
+ this.info("Set keepFirstVisibleRowComplete to: " + checkBox.getChecked());
+ });
+ buttonBar.add(checkBox);
+
+ d.add(main);
+ });
+ </script>
+</body>
+</html> \ No newline at end of file
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Table_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Table_2.html
new file mode 100644
index 0000000000..d09cc85a96
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Table_2.html
@@ -0,0 +1,50 @@
+<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 fixed columns.</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, width:350, height:300, border:qx.renderer.border.BorderPresets.getInstance().thinInset });
+ 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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_1.html
new file mode 100644
index 0000000000..5fdd1836f5
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Separator 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.Part;
+ };
+
+ for (var i=0; i<btns.length; i++)
+ {
+ var btn = btns[i];
+
+ switch(btn.type)
+ {
+ case "separator":
+ var o = new qx.ui.toolbar.Separator;
+ break;
+
+ case "button":
+ var o = new qx.ui.toolbar.Button(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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_2.html
new file mode 100644
index 0000000000..13ccd5ba41
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.CheckBox and qx.ui.toolbar.RadioButton.</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.Part;
+ tb.add(tbp1);
+
+ var tbp2 = new qx.ui.toolbar.Part;
+ tb.add(tbp2);
+
+ var tbp3 = new qx.ui.toolbar.Part;
+ tb.add(tbp3);
+
+ var tbp4 = new qx.ui.toolbar.Part;
+ tb.add(tbp4);
+
+
+
+ // Default
+ var tbd1 = new qx.ui.toolbar.Button("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.CheckBox("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.RadioButton("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.RadioButton("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.RadioButton("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.RadioButton("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.RadioButton("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.RadioButton("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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_3.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_3.html
new file mode 100644
index 0000000000..7cb8745991
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.Button("New", null, c1);
+ var mb1_02 = new qx.ui.menu.Button("Open", null, c1);
+ var mb1_03 = new qx.ui.menu.Button("Save", null, c1);
+ var mb1_04 = new qx.ui.menu.Button("Save as", null, c1);
+ var mb1_05 = new qx.ui.menu.Button("Close", null, c1);
+ var mb1_06 = new qx.ui.menu.Button("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.Button("Undo", null, c1);
+ var mb2_02 = new qx.ui.menu.Button("Redo", null, c1);
+ var mb2_b1 = new qx.ui.menu.Separator();
+ var mb2_03 = new qx.ui.menu.Button("Cut", "icon/16/edit-cut.png", c1);
+ var mb2_04 = new qx.ui.menu.Button("Copy", "icon/16/edit-copy.png", c1);
+ var mb2_05 = new qx.ui.menu.Button("Paste", "icon/16/edit-paste.png", c1);
+ var mb2_06 = new qx.ui.menu.Button("Delete", "icon/16/edit-delete.png", c1);
+ var mb2_b2 = new qx.ui.menu.Separator();
+ var mb2_07 = new qx.ui.menu.Button("Select All", null, c1);
+ var mb2_08 = new qx.ui.menu.Button("Find", null, c1);
+ var mb2_09 = new qx.ui.menu.Button("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.CheckBox("File List", c1, false);
+ var mb3_02 = new qx.ui.menu.CheckBox("Syntax Highlighting", c1, true);
+ var mb3_03 = new qx.ui.menu.CheckBox("Statusbar", c1, true);
+ var mb3_b1 = new qx.ui.menu.Separator();
+ var mb3_04 = new qx.ui.menu.Button("Printer Font", null, null, m3_suba);
+ var mb3_05 = new qx.ui.menu.Button("Editor Font", null, null, m3_subb);
+ var mb3_06 = new qx.ui.menu.Button("Export Font", null, null, m3_subc);
+ var mb3_b2 = new qx.ui.menu.Separator();
+ var mb3_07 = new qx.ui.menu.Button("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.Button("Tahoma, 11pt", null, c1);
+ var mb3_suba_02 = new qx.ui.menu.Button("Tahoma, 12pt", null, c1);
+ var mb3_suba_03 = new qx.ui.menu.Button("Tahoma, 13pt", null, c1);
+ var mb3_suba_04 = new qx.ui.menu.Button("Tahoma, 14pt", null, c1);
+ var mb3_suba_05 = new qx.ui.menu.Button("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.Button("Verdana, 11pt", null, c1);
+ var mb3_subb_02 = new qx.ui.menu.Button("Verdana, 12pt", null, c1);
+ var mb3_subb_03 = new qx.ui.menu.Button("Verdana, 13pt", null, c1);
+ var mb3_subb_04 = new qx.ui.menu.Button("Verdana, 14pt", null, c1);
+ var mb3_subb_05 = new qx.ui.menu.Button("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.Button("Courier, 11pt", null, c1);
+ var mb3_subc_02 = new qx.ui.menu.Button("Courier, 12pt", null, c1);
+ var mb3_subc_03 = new qx.ui.menu.Button("Courier, 13pt", null, c1);
+ var mb3_subc_04 = new qx.ui.menu.Button("Courier, 14pt", null, c1);
+ var mb3_subc_05 = new qx.ui.menu.Button("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.Button("First", null, c1);
+ var mb3_subd_02_suba_02 = new qx.ui.menu.Button("Second", null, c1);
+ var mb3_subd_02_suba_03 = new qx.ui.menu.Button("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.Button("First", null, c1);
+ var mb3_subd_02 = new qx.ui.menu.Button("Second", null, c1, mb3_subd_02_suba);
+ var mb3_subd_03 = new qx.ui.menu.Button("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.Button("View", null, c1, m4_suba);
+ var mb4_b1 = new qx.ui.menu.Separator();
+ var mb4_02 = new qx.ui.menu.Button("Editor Preferences...", null, c1);
+ var mb4_03 = new qx.ui.menu.Button("Editor Extensions", null, c1);
+ var mb4_04 = new qx.ui.menu.Button("Framework Preferences", null, c1);
+
+ m4.add(mb4_01, mb4_b1, mb4_02, mb4_03, mb4_04);
+
+ var mb4_suba_01 = new qx.ui.menu.Button("New Window", null, c1);
+ var mb4_suba_b1 = new qx.ui.menu.Separator();
+ var mb4_suba_02 = new qx.ui.menu.RadioButton("Overlapping", c1, true);
+ var mb4_suba_03 = new qx.ui.menu.RadioButton("Split Horizontally", c1);
+ var mb4_suba_04 = new qx.ui.menu.RadioButton("Split Vertically", c1);
+ var mb4_suba_b2 = new qx.ui.menu.Separator();
+ var mb4_suba_05 = new qx.ui.menu.Button("Next Window", null, c1);
+ var mb4_suba_06 = new qx.ui.menu.Button("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.Button("Help", null, c1);
+ var mb5_02 = new qx.ui.menu.Button("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.MenuButton("File", m1);
+ var mbb2 = new qx.ui.toolbar.MenuButton("Edit", m2);
+ var mbb3 = new qx.ui.toolbar.MenuButton("View", m3);
+ var mbb4 = new qx.ui.toolbar.MenuButton("Options", m4);
+ var mbb5 = new qx.ui.toolbar.MenuButton("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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_4.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolBar_4.html
new file mode 100644
index 0000000000..28aff3030f
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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.CheckBox, 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.Button("New", null, c1);
+ var mb1_02 = new qx.ui.menu.Button("Open", null, c1);
+ var mb1_03 = new qx.ui.menu.Button("Save", null, c1);
+ var mb1_04 = new qx.ui.menu.Button("Save as", null, c1);
+ var mb1_05 = new qx.ui.menu.Button("Close", null, c1);
+ var mb1_06 = new qx.ui.menu.Button("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.Button("Undo", null, c1);
+ var mb2_02 = new qx.ui.menu.Button("Redo", null, c1);
+ var mb2_b1 = new qx.ui.menu.Separator();
+ var mb2_03 = new qx.ui.menu.Button("Cut", "icon/16/edit-cut.png", c1);
+ var mb2_04 = new qx.ui.menu.Button("Copy", "icon/16/edit-copy.png", c1);
+ var mb2_05 = new qx.ui.menu.Button("Paste", "icon/16/edit-paste.png", c1);
+ var mb2_06 = new qx.ui.menu.Button("Delete", "icon/16/edit-delete.png", c1);
+ var mb2_b2 = new qx.ui.menu.Separator();
+ var mb2_07 = new qx.ui.menu.Button("Select All", null, c1);
+ var mb2_08 = new qx.ui.menu.Button("Find", null, c1);
+ var mb2_09 = new qx.ui.menu.Button("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.CheckBox("File List", c1, false);
+ var mb3_02 = new qx.ui.menu.CheckBox("Syntax Highlighting", c1, true);
+ var mb3_03 = new qx.ui.menu.CheckBox("Statusbar", c1, true);
+ var mb3_b1 = new qx.ui.menu.Separator();
+ var mb3_04 = new qx.ui.menu.Button("Printer Font", null, null, m3_suba);
+ var mb3_05 = new qx.ui.menu.Button("Editor Font", null, null, m3_subb);
+ var mb3_06 = new qx.ui.menu.Button("Export Font", null, null, m3_subc);
+ var mb3_b2 = new qx.ui.menu.Separator();
+ var mb3_07 = new qx.ui.menu.Button("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.Button("Tahoma, 11pt", null, c1);
+ var mb3_suba_02 = new qx.ui.menu.Button("Tahoma, 12pt", null, c1);
+ var mb3_suba_03 = new qx.ui.menu.Button("Tahoma, 13pt", null, c1);
+ var mb3_suba_04 = new qx.ui.menu.Button("Tahoma, 14pt", null, c1);
+ var mb3_suba_05 = new qx.ui.menu.Button("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.Button("Verdana, 11pt", null, c1);
+ var mb3_subb_02 = new qx.ui.menu.Button("Verdana, 12pt", null, c1);
+ var mb3_subb_03 = new qx.ui.menu.Button("Verdana, 13pt", null, c1);
+ var mb3_subb_04 = new qx.ui.menu.Button("Verdana, 14pt", null, c1);
+ var mb3_subb_05 = new qx.ui.menu.Button("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.Button("Courier, 11pt", null, c1);
+ var mb3_subc_02 = new qx.ui.menu.Button("Courier, 12pt", null, c1);
+ var mb3_subc_03 = new qx.ui.menu.Button("Courier, 13pt", null, c1);
+ var mb3_subc_04 = new qx.ui.menu.Button("Courier, 14pt", null, c1);
+ var mb3_subc_05 = new qx.ui.menu.Button("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.Button("First", null, c1);
+ var mb3_subd_02_suba_02 = new qx.ui.menu.Button("Second", null, c1);
+ var mb3_subd_02_suba_03 = new qx.ui.menu.Button("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.Button("First", null, c1);
+ var mb3_subd_02 = new qx.ui.menu.Button("Second", null, c1, mb3_subd_02_suba);
+ var mb3_subd_03 = new qx.ui.menu.Button("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.Button("View", null, c1, m4_suba);
+ var mb4_b1 = new qx.ui.menu.Separator();
+ var mb4_02 = new qx.ui.menu.Button("Editor Preferences...", null, c1);
+ var mb4_03 = new qx.ui.menu.Button("Editor Extensions", null, c1);
+ var mb4_04 = new qx.ui.menu.Button("Framework Preferences", null, c1);
+
+ m4.add(mb4_01, mb4_b1, mb4_02, mb4_03, mb4_04);
+
+ var mb4_suba_01 = new qx.ui.menu.Button("New Window", null, c1);
+ var mb4_suba_b1 = new qx.ui.menu.Separator();
+ var mb4_suba_02 = new qx.ui.menu.RadioButton("Overlapping", c1, true);
+ var mb4_suba_03 = new qx.ui.menu.RadioButton("Split Horizontally", c1);
+ var mb4_suba_04 = new qx.ui.menu.RadioButton("Split Vertically", c1);
+ var mb4_suba_b2 = new qx.ui.menu.Separator();
+ var mb4_suba_05 = new qx.ui.menu.Button("Next Window", null, c1);
+ var mb4_suba_06 = new qx.ui.menu.Button("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.Button("Help", null, c1);
+ var mb5_02 = new qx.ui.menu.Button("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.Part;
+ var mp2 = new qx.ui.toolbar.Part;
+ var mp3 = new qx.ui.toolbar.Part;
+
+ mb1.add(mp1, mp2, new qx.ui.basic.HorizontalSpacer, mp3);
+
+ var mbb1 = new qx.ui.toolbar.MenuButton("File", m1, "icon/16/file-new.png");
+ var mbb2 = new qx.ui.toolbar.MenuButton("Edit", m2, "icon/16/edit.png");
+ var mbb3 = new qx.ui.toolbar.MenuButton("View", m3, "icon/16/appearance.png");
+ var mbb4 = new qx.ui.toolbar.MenuButton("Options", m4, "icon/16/control-center.png");
+ var mbb5 = new qx.ui.toolbar.MenuButton("Help", m5, "icon/16/help.png");
+
+ var tbb1 = new qx.ui.toolbar.CheckBox("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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolTip_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/ToolTip_1.html
new file mode 100644
index 0000000000..9beebd57a1
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_1.html
new file mode 100644
index 0000000000..e46e855dc2
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_2.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_2.html
new file mode 100644
index 0000000000..18c7cdafa4
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_3.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_3.html
new file mode 100644
index 0000000000..cbbf442732
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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 : "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("treeOpenWithContent", function(e) {
+ alert('treeOpenWithContent ' + e.getData().getHierarchy(new Array()).join("/"));
+ });
+
+ t.addEventListener("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("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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_4.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/TreeFullControl_4.html
new file mode 100644
index 0000000000..b3c701f01f
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Tree_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Tree_1.html
new file mode 100644
index 0000000000..ef29240538
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Window_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/Window_1.html
new file mode 100644
index 0000000000..6d877611ba
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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>
+
+ <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>
+
+ <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.Button("Explore");
+ var t1_2 = new qx.ui.pageview.tabview.Button("Internet");
+ var t1_3 = new qx.ui.pageview.tabview.Button("Future");
+
+ t1_1.setChecked(true);
+
+ tf1.getBar().add(t1_1, t1_2, t1_3);
+
+ var p1_1 = new qx.ui.pageview.tabview.Page(t1_1);
+ var p1_2 = new qx.ui.pageview.tabview.Page(t1_2);
+ var p1_3 = new qx.ui.pageview.tabview.Page(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>
+</body>
+</html>
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file1.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file1.swf
new file mode 100644
index 0000000000..2e6d69a3fd
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file1.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file10.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file10.swf
new file mode 100644
index 0000000000..eeafa9a8f3
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file10.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file2.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file2.swf
new file mode 100644
index 0000000000..51c8f0ff76
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file2.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file3.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file3.swf
new file mode 100644
index 0000000000..0b6b56be85
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file3.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file4.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file4.swf
new file mode 100644
index 0000000000..746baa8cd9
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file4.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file5.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file5.swf
new file mode 100644
index 0000000000..a3333e1c31
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file5.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file6.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file6.swf
new file mode 100644
index 0000000000..2cad550081
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file6.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file7.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file7.swf
new file mode 100644
index 0000000000..b5f4eb4ddf
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file7.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file8.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file8.swf
new file mode 100644
index 0000000000..54c9a11edc
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file8.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file9.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file9.swf
new file mode 100644
index 0000000000..cc41ff1c10
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/color/file9.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/fo_tester.fla b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/fo_tester.fla
new file mode 100644
index 0000000000..afd4bb6134
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/fo_tester.fla
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/fo_tester.swf b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/fo_tester.swf
new file mode 100644
index 0000000000..8e0b966bca
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/image/flash/fo_tester.swf
Binary files differ
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/index.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/example/index.html
new file mode 100644
index 0000000000..ac437542ac
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/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