]>
Commit | Line | Data |
---|---|---|
1 | qwebirc.ui.QUI = new Class({ | |
2 | Extends: qwebirc.ui.NewLoginUI, | |
3 | initialize: function(parentElement, theme) { | |
4 | this.parent(parentElement, qwebirc.ui.QUI.Window, "qui"); | |
5 | this.theme = theme; | |
6 | this.parentElement = parentElement; | |
7 | }, | |
8 | postInitialize: function() { | |
9 | this.qjsui = new qwebirc.ui.QUI.JSUI("qwebirc-qui", this.parentElement); | |
10 | ||
11 | this.qjsui.top.addClass("tabbar"); | |
12 | ||
13 | this.qjsui.bottom.addClass("input"); | |
14 | this.qjsui.right.addClass("nicklist"); | |
15 | this.qjsui.topic.addClass("topic"); | |
16 | this.qjsui.middle.addClass("lines"); | |
17 | ||
18 | this.tabs = this.qjsui.top; | |
19 | this.origtopic = this.topic = this.qjsui.topic; | |
20 | this.origlines = this.lines = this.qjsui.middle; | |
21 | this.orignicklist = this.nicklist = this.qjsui.right; | |
22 | ||
23 | this.input = this.qjsui.bottom; | |
24 | this.reflow = this.qjsui.reflow.bind(this.qjsui); | |
25 | ||
26 | this.tabs.addEvent("mousewheel", function(x) { | |
27 | var event = new Event(x); | |
28 | ||
29 | /* up */ | |
30 | if(event.wheel > 0) { | |
31 | this.nextWindow(); | |
32 | } else if(event.wheel < 0) { | |
33 | /* down */ | |
34 | this.prevWindow(); | |
35 | } | |
36 | event.stop(); | |
37 | }.bind(this)); | |
38 | ||
39 | this.createInput(); | |
40 | this.reflow(); | |
41 | }, | |
42 | createInput: function() { | |
43 | var form = new Element("form"); | |
44 | this.input.appendChild(form); | |
45 | form.addClass("input"); | |
46 | ||
47 | var inputbox = new Element("input"); | |
48 | form.appendChild(inputbox); | |
49 | this.inputbox = inputbox; | |
50 | ||
51 | form.addEvent("submit", function(e) { | |
52 | new Event(e).stop(); | |
53 | ||
54 | if(inputbox.value == "") | |
55 | return; | |
56 | ||
57 | this.getActiveWindow().historyExec(inputbox.value); | |
58 | inputbox.value = ""; | |
59 | }.bind(this)); | |
60 | ||
61 | inputbox.addEvent("keydown", function(e) { | |
62 | var resultfn; | |
63 | var cvalue = inputbox.value; | |
64 | ||
65 | if(e.key == "up") { | |
66 | resultfn = this.commandhistory.upLine; | |
67 | } else if(e.key == "down") { | |
68 | resultfn = this.commandhistory.downLine; | |
69 | } else { | |
70 | return; | |
71 | } | |
72 | ||
73 | if((cvalue != "") && (this.lastcvalue != cvalue)) | |
74 | this.commandhistory.addLine(cvalue, true); | |
75 | ||
76 | var result = resultfn.bind(this.commandhistory)(); | |
77 | ||
78 | new Event(e).stop(); | |
79 | if(!result) | |
80 | result = ""; | |
81 | this.lastcvalue = result; | |
82 | ||
83 | inputbox.value = result; | |
84 | qwebirc.util.setAtEnd(inputbox); | |
85 | }.bind(this)); | |
86 | }, | |
87 | setLines: function(lines) { | |
88 | this.lines.parentNode.replaceChild(lines, this.lines); | |
89 | this.qjsui.middle = this.lines = lines; | |
90 | }, | |
91 | setChannelItems: function(nicklist, topic) { | |
92 | if(!$defined(nicklist)) { | |
93 | nicklist = this.orignicklist; | |
94 | topic = this.origtopic; | |
95 | } | |
96 | this.nicklist.parentNode.replaceChild(nicklist, this.nicklist); | |
97 | this.qjsui.right = this.nicklist = nicklist; | |
98 | ||
99 | this.topic.parentNode.replaceChild(topic, this.topic); | |
100 | this.qjsui.topic = this.topic = topic; | |
101 | } | |
102 | }); | |
103 | ||
104 | qwebirc.ui.QUI.JSUI = new Class({ | |
105 | initialize: function(class_, parent, sizer) { | |
106 | this.parent = parent; | |
107 | this.sizer = $defined(sizer)?sizer:parent; | |
108 | ||
109 | this.class_ = class_; | |
110 | this.create(); | |
111 | ||
112 | this.reflowevent = null; | |
113 | ||
114 | window.addEvent("resize", function() { | |
115 | this.reflow(100); | |
116 | }.bind(this)); | |
117 | }, | |
118 | applyClasses: function(pos, l) { | |
119 | l.addClass("dynamicpanel"); | |
120 | l.addClass(this.class_); | |
121 | ||
122 | if(pos == "middle") { | |
123 | l.addClass("leftboundpanel"); | |
124 | } else if(pos == "top") { | |
125 | l.addClass("topboundpanel"); | |
126 | l.addClass("widepanel"); | |
127 | } else if(pos == "topic") { | |
128 | l.addClass("widepanel"); | |
129 | } else if(pos == "right") { | |
130 | l.addClass("rightboundpanel"); | |
131 | } else if(pos == "bottom") { | |
132 | l.addClass("bottomboundpanel"); | |
133 | l.addClass("widepanel"); | |
134 | } | |
135 | }, | |
136 | create: function() { | |
137 | var XE = function(pos) { | |
138 | var element = new Element("div"); | |
139 | this.applyClasses(pos, element); | |
140 | ||
141 | this.parent.appendChild(element); | |
142 | return element; | |
143 | }.bind(this); | |
144 | ||
145 | this.top = XE("top"); | |
146 | this.topic = XE("topic"); | |
147 | this.middle = XE("middle"); | |
148 | this.right = XE("right"); | |
149 | this.bottom = XE("bottom"); | |
150 | }, | |
151 | reflow: function(delay) { | |
152 | if(!delay) | |
153 | delay = 1; | |
154 | ||
155 | if(this.reflowevent) | |
156 | $clear(this.reflowevent); | |
157 | this.__reflow(); | |
158 | this.reflowevent = this.__reflow.delay(delay, this); | |
159 | }, | |
160 | __reflow: function() { | |
161 | var bottom = this.bottom; | |
162 | var middle = this.middle; | |
163 | var right = this.right; | |
164 | var topic = this.topic; | |
165 | var top = this.top; | |
166 | ||
167 | var topicsize = topic.getSize(); | |
168 | var topsize = top.getSize(); | |
169 | var rightsize = right.getSize(); | |
170 | var bottomsize = bottom.getSize(); | |
171 | var docsize = this.sizer.getSize(); | |
172 | ||
173 | var mheight = (docsize.y - topsize.y - bottomsize.y - topicsize.y); | |
174 | var mwidth = (docsize.x - rightsize.x); | |
175 | ||
176 | topic.setStyle("top", topsize.y + "px"); | |
177 | ||
178 | middle.setStyle("top", (topsize.y + topicsize.y) + "px"); | |
179 | if(mheight > 0) { | |
180 | middle.setStyle("height", mheight + "px"); | |
181 | right.setStyle("height", mheight + "px"); | |
182 | } | |
183 | ||
184 | if(mwidth > 0) | |
185 | middle.setStyle("width", mwidth + "px"); | |
186 | right.setStyle("top", (topsize.y + topicsize.y) + "px"); | |
187 | right.setStyle("left", mwidth + "px"); | |
188 | ||
189 | bottom.setStyle("top", (docsize.y - bottomsize.y) + "px"); | |
190 | }, | |
191 | showChannel: function(state) { | |
192 | var display = "none"; | |
193 | if(state) | |
194 | display = "block"; | |
195 | ||
196 | this.right.setStyle("display", display); | |
197 | this.topic.setStyle("display", display); | |
198 | }, | |
199 | showInput: function(state) { | |
200 | this.bottom.setStyle("display", state?"block":"none"); | |
201 | } | |
202 | }); | |
203 | ||
204 | qwebirc.ui.QUI.Window = new Class({ | |
205 | Extends: qwebirc.ui.Window, | |
206 | ||
207 | initialize: function(parentObject, client, type, name) { | |
208 | this.parent(parentObject, client, type, name); | |
209 | ||
210 | this.tab = new Element("a", {"href": "#"}); | |
211 | this.tab.addClass("tab"); | |
212 | this.tab.addEvent("focus", function() { this.blur() }.bind(this.tab));; | |
213 | ||
214 | parentObject.tabs.appendChild(this.tab); | |
215 | ||
216 | this.tab.appendText(name); | |
217 | this.tab.addEvent("click", function(e) { | |
218 | new Event(e).stop(); | |
219 | parentObject.selectWindow(this); | |
220 | }.bind(this)); | |
221 | ||
222 | if(type != qwebirc.ui.WINDOW_STATUS && type != qwebirc.ui.WINDOW_CONNECT) { | |
223 | var tabclose = new Element("span"); | |
224 | tabclose.set("text", "X"); | |
225 | tabclose.addClass("tabclose"); | |
226 | tabclose.addEvent("click", function(e) { | |
227 | new Event(e).stop(); | |
228 | ||
229 | if(type == qwebirc.ui.WINDOW_CHANNEL) | |
230 | this.client.exec("/PART " + name); | |
231 | ||
232 | this.close(); | |
233 | }.bind(this)); | |
234 | ||
235 | this.tab.appendChild(tabclose); | |
236 | } | |
237 | ||
238 | this.lines = new Element("div"); | |
239 | this.parentObject.qjsui.applyClasses("middle", this.lines); | |
240 | this.lines.addClass("lines"); | |
241 | ||
242 | this.lines.addEvent("scroll", function() { | |
243 | this.scrolleddown = this.scrolledDown(); | |
244 | }.bind(this)); | |
245 | ||
246 | if(type == qwebirc.ui.WINDOW_CHANNEL) { | |
247 | this.topic = new Element("div"); | |
248 | this.topic.addClass("topic"); | |
249 | this.topic.addClass("tab-invisible"); | |
250 | this.topic.set("html", " "); | |
251 | this.parentObject.qjsui.applyClasses("topic", this.topic); | |
252 | ||
253 | this.prevNick = null; | |
254 | this.nicklist = new Element("div"); | |
255 | this.nicklist.addClass("nicklist"); | |
256 | this.nicklist.addClass("tab-invisible"); | |
257 | this.nicklist.addEvent("click", this.removePrevMenu.bind(this)); | |
258 | this.parentObject.qjsui.applyClasses("nicklist", this.nicklist); | |
259 | } | |
260 | ||
261 | if(type == qwebirc.ui.WINDOW_CHANNEL) { | |
262 | this.updateTopic(""); | |
263 | } else { | |
264 | this.reflow(); | |
265 | } | |
266 | }, | |
267 | reflow: function() { | |
268 | this.parentObject.reflow(); | |
269 | }, | |
270 | onResize: function() { | |
271 | if(this.scrolleddown) | |
272 | this.scrollToBottom(); | |
273 | }, | |
274 | createMenu: function(nick, parent) { | |
275 | var e = new Element("div"); | |
276 | parent.appendChild(e); | |
277 | e.addClass("menu"); | |
278 | ||
279 | qwebirc.ui.MENU_ITEMS.forEach(function(x) { | |
280 | var e2 = new Element("a"); | |
281 | e.appendChild(e2); | |
282 | ||
283 | e2.href = "#"; | |
284 | e2.set("text", "- " + x[0]); | |
285 | ||
286 | e2.addEvent("focus", function() { this.blur() }.bind(e2)); | |
287 | e2.addEvent("click", function(ev) { new Event(ev.stop()); this.menuClick(x[1]); }.bind(this)); | |
288 | }.bind(this)); | |
289 | return e; | |
290 | }, | |
291 | menuClick: function(fn) { | |
292 | /* | |
293 | this.prevNick.removeChild(this.prevNick.menu); | |
294 | this.prevNick.menu = null; | |
295 | */ | |
296 | fn.bind(this)(this.prevNick.realNick); | |
297 | this.removePrevMenu(); | |
298 | }, | |
299 | moveMenuClass: function() { | |
300 | if(!this.prevNick) | |
301 | return; | |
302 | if(this.nicklist.firstChild == this.prevNick) { | |
303 | this.prevNick.removeClass("selected-middle"); | |
304 | } else { | |
305 | this.prevNick.addClass("selected-middle"); | |
306 | } | |
307 | }, | |
308 | removePrevMenu: function() { | |
309 | if(!this.prevNick) | |
310 | return; | |
311 | ||
312 | this.prevNick.removeClass("selected"); | |
313 | this.prevNick.removeClass("selected-middle"); | |
314 | if(this.prevNick.menu) | |
315 | this.prevNick.removeChild(this.prevNick.menu); | |
316 | this.prevNick = null; | |
317 | }, | |
318 | nickListAdd: function(nick, position) { | |
319 | var e = new Element("a"); | |
320 | qwebirc.ui.insertAt(position, this.nicklist, e); | |
321 | ||
322 | e.href = "#"; | |
323 | e.appendChild(document.createTextNode(nick)); | |
324 | ||
325 | e.realNick = this.client.stripPrefix(nick); | |
326 | ||
327 | e.addEvent("click", function(x) { | |
328 | if(this.prevNick == e) { | |
329 | this.removePrevMenu(); | |
330 | return; | |
331 | } | |
332 | ||
333 | this.removePrevMenu(); | |
334 | this.prevNick = e; | |
335 | e.addClass("selected"); | |
336 | this.moveMenuClass(); | |
337 | e.menu = this.createMenu(x.realNick, e); | |
338 | new Event(x).stop(); | |
339 | }.bind(this)); | |
340 | e.addEvent("dblclick", function(x) { | |
341 | new Event(x).stop(); | |
342 | this.client.exec("/QUERY " + e.realNick); | |
343 | }.bind(this)); | |
344 | ||
345 | e.addEvent("focus", function() { this.blur() }.bind(e)); | |
346 | this.moveMenuClass(); | |
347 | return e; | |
348 | }, | |
349 | nickListRemove: function(nick, stored) { | |
350 | this.nicklist.removeChild(stored); | |
351 | this.moveMenuClass(); | |
352 | }, | |
353 | updateTopic: function(topic) { | |
354 | var t = this.topic; | |
355 | ||
356 | while(t.firstChild) | |
357 | t.removeChild(t.firstChild); | |
358 | ||
359 | if(topic) { | |
360 | this.parent(topic, t); | |
361 | } else { | |
362 | var e = new Element("div"); | |
363 | e.set("text", "(no topic set)"); | |
364 | e.addClass("emptytopic"); | |
365 | t.appendChild(e); | |
366 | } | |
367 | this.reflow(); | |
368 | }, | |
369 | select: function() { | |
370 | var inputVisible = this.type != qwebirc.ui.WINDOW_CONNECT && this.type != qwebirc.ui.WINDOW_CUSTOM; | |
371 | ||
372 | this.tab.removeClass("tab-unselected"); | |
373 | this.tab.addClass("tab-selected"); | |
374 | ||
375 | this.parentObject.setLines(this.lines); | |
376 | this.parentObject.setChannelItems(this.nicklist, this.topic); | |
377 | this.parentObject.qjsui.showInput(inputVisible); | |
378 | this.parentObject.qjsui.showChannel($defined(this.nicklist)); | |
379 | ||
380 | this.reflow(); | |
381 | ||
382 | this.parent(); | |
383 | ||
384 | if(inputVisible) | |
385 | this.parentObject.inputbox.focus(); | |
386 | }, | |
387 | deselect: function() { | |
388 | this.parent(); | |
389 | ||
390 | this.tab.removeClass("tab-selected"); | |
391 | this.tab.addClass("tab-unselected"); | |
392 | }, | |
393 | close: function() { | |
394 | this.parent(); | |
395 | ||
396 | this.parentObject.tabs.removeChild(this.tab); | |
397 | }, | |
398 | addLine: function(type, line, colour) { | |
399 | var e = new Element("div"); | |
400 | ||
401 | if(colour) { | |
402 | e.setStyles({"background": colour}); | |
403 | } else if(this.lastcolour) { | |
404 | e.addClass("linestyle1"); | |
405 | } else { | |
406 | e.addClass("linestyle2"); | |
407 | } | |
408 | this.lastcolour = !this.lastcolour; | |
409 | ||
410 | this.parent(type, line, colour, e); | |
411 | }, | |
412 | setHilighted: function(state) { | |
413 | laststate = this.hilighted; | |
414 | ||
415 | this.parent(state); | |
416 | ||
417 | if(state == laststate) | |
418 | return; | |
419 | ||
420 | this.tab.removeClass("tab-hilight-activity"); | |
421 | this.tab.removeClass("tab-hilight-us"); | |
422 | this.tab.removeClass("tab-hilight-speech"); | |
423 | ||
424 | switch(this.hilighted) { | |
425 | case qwebirc.ui.HILIGHT_US: | |
426 | this.tab.addClass("tab-hilight-us"); | |
427 | break; | |
428 | case qwebirc.ui.HILIGHT_SPEECH: | |
429 | this.tab.addClass("tab-hilight-speech"); | |
430 | break; | |
431 | case qwebirc.ui.HILIGHT_ACTIVITY: | |
432 | this.tab.addClass("tab-hilight-activity"); | |
433 | break; | |
434 | } | |
435 | } | |
436 | }); |