Uses jquery icon for close. Callback for delete now being called; Channel deletion WIP

Signed-off-by: Akash Manohar J <akash@akash.im>

Author: HashNuke

app/assets/javascripts/backbone/helpers/channels.js.coffee

@@ -3,11 +3,6 @@ class Kandan.Helpers.Channels
   @options:
     autoScrollThreshold: 0.90
 
-  @templates:
-    addChannelButton: _.template '''
-        <span class="delete_channel">[x]</span>
-      '''
-
   @replaceCreateButton: ()->
     $tabNav = $(".create_channel").parent().parent()
     $createButton = $(".create_channel").parent().html()
@@ -65,7 +60,7 @@ class Kandan.Helpers.Channels
     channel_area = "#channels-#{channel.get('id')}"
     totalTabs = $("#channels").tabs("length")
 
-    $("#channels").tabs('add', channel_area, "#{channel.get("name")}#{@templates.addChannelButton()}", totalTabs)
+    $("#channels").tabs('add', channel_area, "#{channel.get("name")}", totalTabs)
     Kandan.Helpers.Channels.replaceCreateButton()
     view = new Kandan.Views.ListActivities({channel: channel})
     $(channel_area).html $(view.render().el).html()

app/assets/javascripts/backbone/kandan.js.coffee

@@ -70,12 +70,26 @@ window.Kandan =
           $(".main-area").html(chat_area.render().el)
           chatbox = new Kandan.Views.Chatbox()
           $(".main-area").append(chatbox.render().el)
-          $('#channels').tabs({select: (event, ui)->
-            $(document).data('active_channel_id',
-              Kandan.Helpers.Channels.get_channel_id_from_tab_index(ui.index))
-            console.log "channel changed to index", ui.index
-            Kandan.Data.Channels.run_callbacks('change')
+          $('#channels').tabs({
+            # tabTemplate: '''
+            #   <li>
+            #     <a href="#{href}">#{label}</a>
+            #     Dude<span class="ui-icon ui-icon-close">Remove Tab</span>
+            #   </li>
+            # ''',
+
+            select: (event, ui)->
+              $(document).data('active_channel_id',
+                Kandan.Helpers.Channels.get_channel_id_from_tab_index(ui.index))
+              console.log "channel changed to index", ui.index
+              Kandan.Data.Channels.run_callbacks('change')
           })
+          $("#channels").tabs('option', 'tabTemplate', '''
+              <li>
+                <a href="#{href}">#{label}</a>
+                <span class="ui-icon ui-icon-close">x</span>
+              </li>
+            ''')
 
           Kandan.Widgets.init_all()
       })

app/assets/javascripts/backbone/models/channel.js.coffee

@@ -1,5 +1,7 @@
 class Kandan.Models.Channel extends Backbone.Model
-  urlRoot: '/channels'
+  urlRoot: ()->
+    console.log "called urlRoot"
+    '/channels'
 
   # initialize: ()->
     # console.log @activities

app/assets/javascripts/backbone/views/chatarea.js.coffee

@@ -4,8 +4,8 @@ class Kandan.Views.ChatArea extends Backbone.View
   # className: 'channels'
 
   events:
-    "click .delete_channel": "deleteChannel"
-    "click .create_channel"   : "createChannel"
+    "click .ui-icon-close" : "deleteChannel"
+    "click .create_channel": "createChannel"
 
   render: ->
     $(@el).html(@template({channels: @options.channels}))

app/assets/templates/chatarea.jst.eco

@@ -1,7 +1,7 @@
 <ul>
   <% for channel in @channels.models: %>
     <li>
-      <a href="#<%= "channels-#{channel.get('id')}" %>"><%= channel.get('name') %></a><span class="delete_channel">[x]</span>
+      <a href="#<%= "channels-#{channel.get('id')}" %>"><%= channel.get('name') %></a><span class="ui-icon ui-icon-close">x</span>
     </li>
   <% end %>
   <li><div class="create_channel">+</div></li>