qwebirc.ui.QUI = new Class({
- Extends: qwebirc.ui.NewLoginUI,
+ Extends: qwebirc.ui.RootUI,
initialize: function(parentElement, theme, options) {
this.parent(parentElement, qwebirc.ui.QUI.Window, "qui", options);
this.theme = theme;
if($defined(w))
w.onResize();
}.bind(this));
- this.qjsui.top.addClass("tabbar");
+ this.qjsui.top.addClass("outertabbar");
this.qjsui.bottom.addClass("input");
this.qjsui.right.addClass("nicklist");
this.qjsui.topic.addClass("topic");
this.qjsui.middle.addClass("lines");
- this.tabs = this.qjsui.top;
+ this.outerTabs = this.qjsui.top;
+
+ this.tabs = new Element("div");
+ this.tabs.addClass("tabbar");
+
+ this.__createDropdownMenu();
+
+ this.outerTabs.appendChild(this.tabs);
this.origtopic = this.topic = this.qjsui.topic;
this.origlines = this.lines = this.qjsui.middle;
this.orignicklist = this.nicklist = this.qjsui.right;
this.createInput();
this.reflow();
+ this.reflow.delay(100); /* Konqueror fix */
+
+ /* HACK, in Chrome this should work immediately but doesn't */
+ this.__createDropdownHint.delay(100, this);
+ },
+ __createDropdownMenu: function() {
+ var dropdownMenu = new Element("span");
+ dropdownMenu.addClass("dropdownmenu");
+
+ dropdownMenu.hide = function() {
+ dropdownMenu.setStyle("display", "none");
+ dropdownMenu.visible = false;
+ document.removeEvent("mousedown", hideEvent);
+ }.bind(this);
+ var hideEvent = function() { dropdownMenu.hide(); };
+
+ dropdownMenu.hide();
+ this.parentElement.appendChild(dropdownMenu);
+
+ this.UICommands.forEach(function(x) {
+ var text = x[0];
+ var fn = this[x[1] + "Window"].bind(this);
+ var e = new Element("a");
+ e.addEvent("mousedown", function(e) { new Event(e).stop(); });
+ e.addEvent("click", function() {
+ dropdownMenu.hide();
+ fn();
+ });
+ e.set("text", text);
+ dropdownMenu.appendChild(e);
+ }.bind(this));
+
+ var dropdown = new Element("div");
+ dropdown.addClass("dropdown-tab");
+ dropdown.appendChild(new Element("img", {src: "images/favicon.png", title: "menu", alt: "menu"}));
+ dropdown.setStyle("opacity", 1);
+
+ var dropdownEffect = new Fx.Tween(dropdown, {duration: "long", property: "opacity", link: "chain"});
+ dropdownEffect.start(0.25);
+ dropdownEffect.start(1);
+ dropdownEffect.start(0.33);
+ dropdownEffect.start(1);
+
+ this.outerTabs.appendChild(dropdown);
+ dropdownMenu.show = function(x) {
+ new Event(x).stop();
+ this.hideHint();
+
+ if(dropdownMenu.visible) {
+ dropdownMenu.hide();
+ return;
+ }
+ var top = this.outerTabs.getSize().y;
+
+ dropdownMenu.setStyle("left", 0);
+ dropdownMenu.setStyle("top", top-1); /* -1 == top border */
+ dropdownMenu.setStyle("display", "inline-block");
+ dropdownMenu.visible = true;
+
+ document.addEvent("mousedown", hideEvent);
+ }.bind(this);
+ dropdown.addEvent("mousedown", function(e) { new Event(e).stop(); });
+ dropdown.addEvent("click", dropdownMenu.show);
+ },
+ __createDropdownHint: function() {
+ var dropdownhint = new Element("div");
+ dropdownhint.addClass("dropdownhint");
+ dropdownhint.set("text", "Click the icon for the main menu.");
+ dropdownhint.setStyle("top", this.outerTabs.getSize().y + 5);
+
+ this.parentElement.appendChild(dropdownhint);
+ new Fx.Morph(dropdownhint, {duration: "normal", transition: Fx.Transitions.Sine.easeOut}).start({left: [900, 5]});
+
+ var hider = function() {
+ new Fx.Morph(dropdownhint, {duration: "long"}).start({left: [5, -900]});
+ }.delay(4000, this);
+
+ var hider2 = function() {
+ if(dropdownhint.hidden)
+ return;
+ this.parentElement.removeChild(dropdownhint);
+ dropdownhint.hidden = 1;
+ }.bind(this);
+ hider2.delay(4000);
+ this.hideHint = hider2;
+
+ document.addEvent("mousedown", hider2);
+ document.addEvent("keypress", hider2);
},
createInput: function() {
var form = new Element("form");
this.input.appendChild(form);
+
form.addClass("input");
var inputbox = new Element("input");
form.appendChild(inputbox);
this.inputbox = inputbox;
-
- form.addEvent("submit", function(e) {
- new Event(e).stop();
-
+ this.inputbox.maxLength = 512;
+
+ var sendInput = function() {
if(inputbox.value == "")
return;
this.resetTabComplete();
this.getActiveWindow().historyExec(inputbox.value);
inputbox.value = "";
- }.bind(this));
+ }.bind(this);
+
+ if(!qwebirc.util.deviceHasKeyboard()) {
+ inputbox.addClass("mobile-input");
+ var inputButton = new Element("input", {type: "button"});
+ inputButton.addClass("mobile-button");
+ inputButton.addEvent("click", function() {
+ sendInput();
+ inputbox.focus();
+ });
+ inputButton.value = ">";
+ this.input.appendChild(inputButton);
+ var reflowButton = function() {
+ var containerSize = this.input.getSize();
+ var buttonSize = inputButton.getSize();
+
+ var buttonLeft = containerSize.x - buttonSize.x - 5; /* lovely 5 */
+
+ inputButton.setStyle("left", buttonLeft);
+ inputbox.setStyle("width", buttonLeft - 5);
+ inputButton.setStyle("height", containerSize.y);
+ }.bind(this);
+ this.qjsui.addEvent("reflow", reflowButton);
+ } else {
+ inputbox.addClass("keyboard-input");
+ }
+
+ form.addEvent("submit", function(e) {
+ new Event(e).stop();
+ sendInput();
+ });
inputbox.addEvent("focus", this.resetTabComplete.bind(this));
inputbox.addEvent("mousedown", this.resetTabComplete.bind(this));
var mheight = (docsize.y - topsize.y - bottomsize.y - topicsize.y);
var mwidth = (docsize.x - rightsize.x);
- topic.setStyle("top", topsize.y + "px");
+ topic.setStyle("top", topsize.y);
- middle.setStyle("top", (topsize.y + topicsize.y) + "px");
+ middle.setStyle("top", (topsize.y + topicsize.y));
if(mheight > 0) {
- middle.setStyle("height", mheight + "px");
- right.setStyle("height", mheight + "px");
+ middle.setStyle("height", mheight);
+ right.setStyle("height", mheight);
}
if(mwidth > 0)
- middle.setStyle("width", mwidth + "px");
- right.setStyle("top", (topsize.y + topicsize.y) + "px");
- right.setStyle("left", mwidth + "px");
+ middle.setStyle("width", mwidth);
+ right.setStyle("top", (topsize.y + topicsize.y));
+ right.setStyle("left", mwidth);
- bottom.setStyle("top", (docsize.y - bottomsize.y) + "px");
+ bottom.setStyle("top", (docsize.y - bottomsize.y));
this.fireEvent("reflow");
},
showChannel: function(state) {
this.topic.setStyle("display", display);
},
showInput: function(state) {
+ this.bottom.isVisible = state;
this.bottom.setStyle("display", state?"block":"none");
}
});
this.close();
- parentObject.inputbox.focus();
+ //parentObject.inputbox.focus();
}.bind(this);
tabclose.addEvent("click", close);
this.topic.addClass("topic");
this.topic.addClass("tab-invisible");
this.topic.set("html", " ");
+ this.topic.addEvent("click", this.editTopic.bind(this));
this.parentObject.qjsui.applyClasses("topic", this.topic);
this.prevNick = null;
this.reflow();
}
},
+ editTopic: function() {
+ if(!this.client.nickOnChanHasPrefix(this.client.nickname, this.name, "@")) {
+/* var cmodes = this.client.getChannelModes(channel);
+ if(cmodes.indexOf("t")) {*/
+ alert("Sorry, you need to be opped to change the topic!");
+ return;
+ /*}*/
+ }
+ var newTopic = prompt("Change topic of " + this.name + " to:", this.topic.topicText);
+ if(newTopic === null)
+ return;
+
+ this.client.exec("/TOPIC " + newTopic);
+ },
reflow: function() {
this.parentObject.reflow();
},
parent.appendChild(e);
e.addClass("menu");
+ var nickArray = [nick];
qwebirc.ui.MENU_ITEMS.forEach(function(x) {
+ if(!x.predicate || x.predicate !== true && !x.predicate.apply(this, nickArray))
+ return;
+
var e2 = new Element("a");
e.appendChild(e2);
-
+
e2.href = "#";
- e2.set("text", "- " + x[0]);
-
+ e2.set("text", "- " + x.text);
+
e2.addEvent("focus", function() { this.blur() }.bind(e2));
- e2.addEvent("click", function(ev) { new Event(ev.stop()); this.menuClick(x[1]); }.bind(this));
+ e2.addEvent("click", function(ev) { new Event(ev.stop()); this.menuClick(x.fn); }.bind(this));
}.bind(this));
return e;
},
this.prevNick = e;
e.addClass("selected");
this.moveMenuClass();
- e.menu = this.createMenu(x.realNick, e);
- new Event(x).stop();
- }.bind(this));
- e.addEvent("dblclick", function(x) {
+ e.menu = this.createMenu(e.realNick, e);
new Event(x).stop();
- this.client.exec("/QUERY " + e.realNick);
}.bind(this));
e.addEvent("focus", function() { this.blur() }.bind(e));
t.removeChild(t.firstChild);
if(topic) {
+ t.topicText = topic;
this.parent(topic, t);
} else {
+ t.topicText = topic;
var e = new Element("div");
e.set("text", "(no topic set)");
e.addClass("emptytopic");
this.parent(type, line, colourClass, e);
},
setHilighted: function(state) {
- laststate = this.hilighted;
+ var laststate = this.hilighted;
this.parent(state);