Reorganise.

[irc/quakenet/qwebirc.git] / js / ui / uglyui.js

var UglyUIWindow = new Class({\r
  Extends: UIWindow,\r
  \r
  initialize: function(parentObject, client, type, name) {\r
    this.parent(parentObject, client, type, name);\r
        \r
    this.outerContainer = new Element("div", { "styles": { "display": "none", "font-family": "Lucida Console" } });\r
    parentObject.container.appendChild(this.outerContainer);\r
    \r
    if(type == WINDOW_CHANNEL) {\r
      this.nicklist = new Element("div", {"styles": { "border-left": "1px solid black", "width": "125px", "float": "right", "height": "480px", "clear": "both", "overflow": "auto", "background": "white"} });\r
      this.outerContainer.appendChild(this.nicklist);\r
    }\r
    \r
    var innerContainer = new Element("div", {"styles": { "height": "480px" }});\r
    this.outerContainer.appendChild(innerContainer);\r
    \r
    if(type == WINDOW_CHANNEL) {\r
      this.topic = new Element("div", {"styles": { "background": "#fef", "height": "20px" } });\r
      innerContainer.appendChild(this.topic);\r
    }\r
    \r
    this.lines = new Element("div", {"styles": { "height": "460px", "overflow": "auto", "word-wrap": "break-word" }});\r
    innerContainer.appendChild(this.lines);\r
    \r
    this.tab = new Element("span", {"styles": { "border": "1px black solid", "padding": "2px", "cursor": "default", "margin-right": "2px", "background": "#eee", "clear": "both" } });\r
    this.tab.appendText(name);\r
    this.tab.addEvent("click", function() {\r
      parentObject.selectWindow(this);\r
    }.bind(this));\r
\r
    parentObject.tabs.appendChild(this.tab);\r
    \r
    if(type != WINDOW_STATUS) {\r
      tabclose = new Element("span", {"styles": { "border": "1px black solid", "margin-left": "5px", "padding": "2px", "font-size": "0.5em" } });\r
      tabclose.addEvent("click", function(e) {\r
        new Event(e).stop();\r
        \r
        if(type == WINDOW_CHANNEL)\r
          this.client.exec("/PART " + name);\r
\r
        this.close();\r
      }.bind(this));\r
      tabclose.set("text", "X");\r
      this.tab.appendChild(tabclose);\r
    }\r
  },\r
  updateNickList: function(nicks) {\r
    this.parent(nicks);\r
    \r
    var n = this.nicklist;\r
    while(n.firstChild)\r
      n.removeChild(n.firstChild);\r
\r
    nicks.each(function(nick) {\r
      var e = new Element("div");\r
      n.appendChild(e);\r
      e.appendChild(document.createTextNode(nick));\r
    });\r
  },\r
  updateTopic: function(topic) {\r
    this.parent(topic);\r
    \r
    var t = this.topic;\r
    \r
    while(t.firstChild)\r
      t.removeChild(t.firstChild);\r
\r
    Colourise(topic, t);\r
  },\r
  select: function() {\r
    this.parent();\r
    \r
    this.outerContainer.setStyle("display", "block");\r
    this.tab.setStyle("background", "#dff");\r
    this.tab.setStyle("color", "");\r
  },\r
  deselect: function() {\r
    this.parent();\r
    \r
    this.outerContainer.setStyle("display", "none");\r
    this.tab.setStyle("background", "#eee");\r
  },\r
  close: function() {\r
    this.parent();\r
    \r
    this.parentObject.container.removeChild(this.outerContainer);\r
    this.parentObject.tabs.removeChild(this.tab);\r
  },\r
  addLine: function(type, line, colour) {\r
    this.parent(type, line, colour);\r
    \r
    var c;\r
    if(colour) {\r
      c = colour;\r
    } else if(this.lastcolour) {\r
      c = "#efefef";\r
    } else {\r
      c = "#eeffff";\r
    }\r
    \r
    var e = new Element("div", { "styles": { "background": c } });\r
    if(type)\r
      line = this.parentObject.theme.message(type, line);\r
    \r
    Colourise(IRCTimestamp(new Date()) + " " + line, e);\r
    \r
    this.lastcolour = !this.lastcolour;\r
    \r
    var prev = this.lines.getScroll();\r
    var prevbottom = this.lines.getScrollSize().y;\r
    var prevsize = this.lines.getSize();\r
    this.lines.appendChild(e);\r
    \r
    if(prev.y + prevsize.y == prevbottom)\r
      this.lines.scrollTo(prev.x, this.lines.getScrollSize().y);\r
      \r
    if(!this.active)\r
      this.tab.setStyle("color", "red");\r
  }\r
});\r
\r
var UglyUI = new Class({\r
  Extends: UI,\r
  initialize: function(parentElement, theme) {\r
    this.parent(UglyUIWindow);\r
    \r
    this.parentElement = parentElement;\r
    this.theme = theme;\r
    \r
    this.tabs = new Element("div", {"styles": { "border": "1px solid black", "padding": "4px", "font-family": "Lucida Console" } });\r
    parentElement.appendChild(this.tabs);\r
    \r
    this.container = new Element("div", {"styles": { "border": "1px solid black", "margin": "2px 0px 0px 0px", "height": "480px" } });\r
    parentElement.appendChild(this.container);\r
  \r
    var form = new Element("form");\r
    var inputbox = new Element("input", {"styles": { "width": "400px", "border": "1px solid black", "margin": "2px 0px 0px 0px"} });\r
  \r
    form.addEvent("submit", function(e) {\r
      new Event(e).stop();\r
    \r
      this.getActiveWindow().client.exec(inputbox.value);\r
      inputbox.value = "";\r
    }.bind(this));\r
    parentElement.appendChild(form);  \r
    form.appendChild(inputbox);\r
    inputbox.focus();\r
  }\r
});