 
   getMessage: -> @messageInput.val()
 
+class UITab
+  tabPanels: { }
+
+  constructor: (@el) ->
+    self = this
+    @ul = @el.find('ul')
+    @ul.find('a').each (i,e) ->
+      selector = $(this).attr('href')
+      panel = self.el.find(selector)
+      panel.addClass('tab-content')
+      panel.hide()
+      self.el.trigger('addtab', panel)
+
+  addTab: (tabId, label, cb) ->
+    ul = @el.find('ul')
+    li = $('<li/>')
+    a = $('<a/>').html(label).attr({ href: '#' + tabId })
+    a.addClass('ui-link')
+    a.appendTo(li)
+    li.appendTo(ul)
+
+    panel = $('<div/>')
+    panel.appendTo( @el ).addClass('tab-content')
+    @tabPanels[ tabId ] = { handle: li, panel: panel, a: a }
+    cb panel if cb
+
+  removeTab: (tabId) ->
+    o = @tabPanels[ tabId ]
+    if o
+      o.handle.remove()
+      o.panel.remove()
+      delete(@tabPanels[tabId])
+
 class WireRoom
   plugins: {}
 

    # 3. Closing the browser window will cause the event to be triggered. 
    # 4. Even a page reload will first create an unload event.
    $(window).bind "unload", () =>
      @socket.emit "leave", {
        roomt: room
        ident: self.Identifier
        nickname: self.plugins.messageInput.getNickname()
      } for room in self.rooms

    # a channel join event.
    @socket.on "join", (data) => console.log "join",data


    @socket.on "connect", =>
      console.info "socket.io connected."
      @joinChannel(room) for room in self.rooms

      # if we don't have logs, we should ask backlog
      # XXX: see if we can get backlogs from a snapshot?
