1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>qooxdoo » Demo</title>
<link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
<!--[if IE]>
<link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
<![endif]-->
<script type="text/javascript" src="../../script/qx.js"></script>
</head>
<body>
<script type="text/javascript" src="../../script/layout.js"></script>
<div id="demoDescription">
<p>Again a nice example which shows how to use qx.ui.toolbar.ToolBar as a menubar system.</p>
<p>Added some parts and a new flex zone which aligns the help button to the right edge</p>
<p>Added some image and a qx.ui.toolbar.ToolBarCheckBox, you can event combine all these features as you can easily see here.</p>
</div>
<script type="text/javascript">
qx.core.Init.getInstance().defineMain(function()
{
var d = qx.ui.core.ClientDocument.getInstance();
var c1 = new qx.client.Command();
c1.addEventListener("execute", function(e) {
this.debug("Execute: " + e.getData().getLabel());
});
var m1 = new qx.ui.menu.Menu;
var mb1_01 = new qx.ui.menu.MenuButton("New", null, c1);
var mb1_02 = new qx.ui.menu.MenuButton("Open", null, c1);
var mb1_03 = new qx.ui.menu.MenuButton("Save", null, c1);
var mb1_04 = new qx.ui.menu.MenuButton("Save as", null, c1);
var mb1_05 = new qx.ui.menu.MenuButton("Close", null, c1);
var mb1_06 = new qx.ui.menu.MenuButton("Restore last saved", null, c1);
m1.add(mb1_01, mb1_02, mb1_03, mb1_04, mb1_05, mb1_06);
var m2 = new qx.ui.menu.Menu;
var mb2_01 = new qx.ui.menu.MenuButton("Undo", null, c1);
var mb2_02 = new qx.ui.menu.MenuButton("Redo", null, c1);
var mb2_b1 = new qx.ui.menu.MenuSeparator();
var mb2_03 = new qx.ui.menu.MenuButton("Cut", "icon/16/edit-cut.png", c1);
var mb2_04 = new qx.ui.menu.MenuButton("Copy", "icon/16/edit-copy.png", c1);
var mb2_05 = new qx.ui.menu.MenuButton("Paste", "icon/16/edit-paste.png", c1);
var mb2_06 = new qx.ui.menu.MenuButton("Delete", "icon/16/edit-delete.png", c1);
var mb2_b2 = new qx.ui.menu.MenuSeparator();
var mb2_07 = new qx.ui.menu.MenuButton("Select All", null, c1);
var mb2_08 = new qx.ui.menu.MenuButton("Find", null, c1);
var mb2_09 = new qx.ui.menu.MenuButton("Find Again", null, c1);
mb2_05.setEnabled(false);
mb2_06.setEnabled(false);
mb2_09.setEnabled(false);
m2.add(mb2_01, mb2_02, mb2_b1, mb2_03, mb2_04, mb2_05, mb2_06, mb2_b2, mb2_07, mb2_08, mb2_09);
var m3 = new qx.ui.menu.Menu;
var m3_suba = new qx.ui.menu.Menu;
var m3_subb = new qx.ui.menu.Menu;
var m3_subc = new qx.ui.menu.Menu;
var m3_subd = new qx.ui.menu.Menu;
var mb3_01 = new qx.ui.menu.MenuCheckBox("File List", c1, false);
var mb3_02 = new qx.ui.menu.MenuCheckBox("Syntax Highlighting", c1, true);
var mb3_03 = new qx.ui.menu.MenuCheckBox("Statusbar", c1, true);
var mb3_b1 = new qx.ui.menu.MenuSeparator();
var mb3_04 = new qx.ui.menu.MenuButton("Printer Font", null, null, m3_suba);
var mb3_05 = new qx.ui.menu.MenuButton("Editor Font", null, null, m3_subb);
var mb3_06 = new qx.ui.menu.MenuButton("Export Font", null, null, m3_subc);
var mb3_b2 = new qx.ui.menu.MenuSeparator();
var mb3_07 = new qx.ui.menu.MenuButton("Advanced", null, null, m3_subd);
m3.add(mb3_01, mb3_02, mb3_03, mb3_b1, mb3_04, mb3_05, mb3_06, mb3_b2, mb3_07);
var mb3_suba_01 = new qx.ui.menu.MenuButton("Tahoma, 11pt", null, c1);
var mb3_suba_02 = new qx.ui.menu.MenuButton("Tahoma, 12pt", null, c1);
var mb3_suba_03 = new qx.ui.menu.MenuButton("Tahoma, 13pt", null, c1);
var mb3_suba_04 = new qx.ui.menu.MenuButton("Tahoma, 14pt", null, c1);
var mb3_suba_05 = new qx.ui.menu.MenuButton("Tahoma, 15pt", null, c1);
m3_suba.add(mb3_suba_01, mb3_suba_02, mb3_suba_03, mb3_suba_04, mb3_suba_05);
var mb3_subb_01 = new qx.ui.menu.MenuButton("Verdana, 11pt", null, c1);
var mb3_subb_02 = new qx.ui.menu.MenuButton("Verdana, 12pt", null, c1);
var mb3_subb_03 = new qx.ui.menu.MenuButton("Verdana, 13pt", null, c1);
var mb3_subb_04 = new qx.ui.menu.MenuButton("Verdana, 14pt", null, c1);
var mb3_subb_05 = new qx.ui.menu.MenuButton("Verdana, 15pt", null, c1);
m3_subb.add(mb3_subb_01, mb3_subb_02, mb3_subb_03, mb3_subb_04, mb3_subb_05);
var mb3_subc_01 = new qx.ui.menu.MenuButton("Courier, 11pt", null, c1);
var mb3_subc_02 = new qx.ui.menu.MenuButton("Courier, 12pt", null, c1);
var mb3_subc_03 = new qx.ui.menu.MenuButton("Courier, 13pt", null, c1);
var mb3_subc_04 = new qx.ui.menu.MenuButton("Courier, 14pt", null, c1);
var mb3_subc_05 = new qx.ui.menu.MenuButton("Courier, 15pt", null, c1);
m3_subc.add(mb3_subc_01, mb3_subc_02, mb3_subc_03, mb3_subc_04, mb3_subc_05);
var mb3_subd_02_suba = new qx.ui.menu.Menu();
var mb3_subd_02_suba_01 = new qx.ui.menu.MenuButton("First", null, c1);
var mb3_subd_02_suba_02 = new qx.ui.menu.MenuButton("Second", null, c1);
var mb3_subd_02_suba_03 = new qx.ui.menu.MenuButton("Third", null, c1);
mb3_subd_02_suba.add(mb3_subd_02_suba_01, mb3_subd_02_suba_02, mb3_subd_02_suba_03);
var mb3_subd_01 = new qx.ui.menu.MenuButton("First", null, c1);
var mb3_subd_02 = new qx.ui.menu.MenuButton("Second", null, c1, mb3_subd_02_suba);
var mb3_subd_03 = new qx.ui.menu.MenuButton("Third", null, c1);
m3_subd.add(mb3_subd_01, mb3_subd_02, mb3_subd_03);
var m4 = new qx.ui.menu.Menu;
var m4_suba = new qx.ui.menu.Menu;
var mb4_01 = new qx.ui.menu.MenuButton("View", null, c1, m4_suba);
var mb4_b1 = new qx.ui.menu.MenuSeparator();
var mb4_02 = new qx.ui.menu.MenuButton("Editor Preferences...", null, c1);
var mb4_03 = new qx.ui.menu.MenuButton("Editor Extensions", null, c1);
var mb4_04 = new qx.ui.menu.MenuButton("Framework Preferences", null, c1);
m4.add(mb4_01, mb4_b1, mb4_02, mb4_03, mb4_04);
var mb4_suba_01 = new qx.ui.menu.MenuButton("New Window", null, c1);
var mb4_suba_b1 = new qx.ui.menu.MenuSeparator();
var mb4_suba_02 = new qx.ui.menu.MenuRadioButton("Overlapping", c1, true);
var mb4_suba_03 = new qx.ui.menu.MenuRadioButton("Split Horizontally", c1);
var mb4_suba_04 = new qx.ui.menu.MenuRadioButton("Split Vertically", c1);
var mb4_suba_b2 = new qx.ui.menu.MenuSeparator();
var mb4_suba_05 = new qx.ui.menu.MenuButton("Next Window", null, c1);
var mb4_suba_06 = new qx.ui.menu.MenuButton("Previous Window", null, c1);
m4_suba.add(mb4_suba_01, mb4_suba_b1, mb4_suba_02, mb4_suba_03, mb4_suba_04, mb4_suba_b2, mb4_suba_05, mb4_suba_06);
var mb4_manager = new qx.manager.selection.RadioManager("windowMode", [ mb4_suba_02, mb4_suba_03, mb4_suba_04 ]);
var m5 = new qx.ui.menu.Menu;
var mb5_01 = new qx.ui.menu.MenuButton("Help", null, c1);
var mb5_02 = new qx.ui.menu.MenuButton("About", null, c1);
m5.add(mb5_01, mb5_02);
d.add(m1, m2, m3, m3_suba, m3_subb, m3_subc, m3_subd, mb3_subd_02_suba, m4, m4_suba, m5);
var mb1 = new qx.ui.toolbar.ToolBar;
mb1.setTop(48);
mb1.setRight(335);
mb1.setLeft(20);
var mp1 = new qx.ui.toolbar.ToolBarPart;
var mp2 = new qx.ui.toolbar.ToolBarPart;
var mp3 = new qx.ui.toolbar.ToolBarPart;
mb1.add(mp1, mp2, new qx.ui.basic.HorizontalSpacer, mp3);
var mbb1 = new qx.ui.toolbar.ToolBarMenuButton("File", m1, "icon/16/file-new.png");
var mbb2 = new qx.ui.toolbar.ToolBarMenuButton("Edit", m2, "icon/16/edit.png");
var mbb3 = new qx.ui.toolbar.ToolBarMenuButton("View", m3, "icon/16/appearance.png");
var mbb4 = new qx.ui.toolbar.ToolBarMenuButton("Options", m4, "icon/16/control-center.png");
var mbb5 = new qx.ui.toolbar.ToolBarMenuButton("Help", m5, "icon/16/help.png");
var tbb1 = new qx.ui.toolbar.ToolBarCheckBox("Checkbox", "icon/16/chart.png", true);
mp1.add(mbb1, mbb2);
mp2.add(mbb3, mbb4, tbb1);
mp3.add(mbb5);
d.add(mb1);
// Icon & Color Themes
qx.manager.object.ImageManager.getInstance().createThemeList(d, 20, 348);
qx.manager.object.ColorManager.getInstance().createThemeList(d, 220, 348);
});
</script>
</body>
</html>
|
