3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
4 <title>qooxdoo » Demo</title>
5 <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
7 <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
9 <script type="text/javascript" src="../../script/qx.js"></script>
12 <script type="text/javascript" src="../../script/layout.js"></script>
14 <div id="demoDescription">
15 <p>Introducing qx.ui.tree.Tree. A first small example.</p>
18 <script type="text/javascript">
19 qx.core.Init.getInstance().defineMain(function()
21 var t = new qx.ui.tree.Tree("Root");
25 setBackgroundColor(255);
26 setBorder(qx.renderer.border.BorderPresets.getInstance().inset);
27 setOverflow("scrollY");
36 qx.ui.core.ClientDocument.getInstance().add(t);
39 var te1 = new qx.ui.tree.TreeFolder("Desktop");
44 var te1_1 = new qx.ui.tree.TreeFolder("Files");
45 var te1_2 = new qx.ui.tree.TreeFolder("Workspace");
46 var te1_3 = new qx.ui.tree.TreeFolder("Network");
47 var te1_4 = new qx.ui.tree.TreeFolder("Trash");
49 te1.add(te1_1, te1_2, te1_3, te1_4);
52 var te1_2_1 = new qx.ui.tree.TreeFile("Windows (C:)");
53 var te1_2_2 = new qx.ui.tree.TreeFile("Documents (D:)");
55 te1_2.add(te1_2_1, te1_2_2);
60 var te2 = new qx.ui.tree.TreeFolder("Inbox");
63 var te2_1 = new qx.ui.tree.TreeFolder("Presets");
64 var te2_2 = new qx.ui.tree.TreeFolder("Sent");
65 var te2_3 = new qx.ui.tree.TreeFolder("Trash");
66 var te2_4 = new qx.ui.tree.TreeFolder("Data");
67 var te2_5 = new qx.ui.tree.TreeFolder("Edit");
72 qx.ui.core.ClientDocument.getInstance().add(t);
79 var commandFrame = new qx.ui.groupbox.GroupBox("Control");
90 qx.ui.core.ClientDocument.getInstance().add(commandFrame);
95 var tCurrentLabel = new qx.ui.basic.Atom("Current Folder: ");
103 commandFrame.add(tCurrentLabel);
107 var tCurrentInput = new qx.ui.form.TextField;
118 commandFrame.add(tCurrentInput);
120 t.getManager().addEventListener("changeSelection", function(e) {
121 tCurrentInput.setValue(e.getData()[0]._labelObject.getHtml());
126 var tDoubleClick = new qx.ui.form.CheckBox("Use double click?");
133 commandFrame.add(tDoubleClick);
135 tDoubleClick.addEventListener("changeChecked", function(e) { t.setUseDoubleClick(e.getData()); });
139 var tTreeLines = new qx.ui.form.CheckBox("Use tree lines?");
147 commandFrame.add(tTreeLines);
149 tTreeLines.addEventListener("changeChecked", function(e) { t.setUseTreeLines(e.getData()); });
154 var vShowItems = new qx.ui.form.Button("Show Items");
161 commandFrame.add(vShowItems);
163 vShowItems.addEventListener("execute", function(e) {