Add close icon to tabs

src/app/editor.coffee

@@ -408,12 +408,15 @@ class Editor extends View
   getBuffer: -> @activeEditSession.buffer
 
   destroyActiveEditSession: ->
+    @destroyEditSessionIndex(@getActiveEditSessionIndex())
+
+  destroyEditSessionIndex: (index) ->
     if @editSessions.length == 1
       @remove()
     else
-      editSession = @activeEditSession
-      index = @getActiveEditSessionIndex()
-      @loadPreviousEditSession()
+      editSession = @editSessions[index]
+      if index is @getActiveEditSessionIndex()
+        @loadPreviousEditSession()
       _.remove(@editSessions, editSession)
       editSession.destroy()
       @trigger 'editor:edit-session-removed', [editSession, index]

src/extensions/tabs/spec/tabs-spec.coffee

@@ -95,3 +95,18 @@ describe "Tabs", ->
       fs.move(oldPath, newPath)
       waitsFor "file to be renamed", ->
         tabFileName.text() == "renamed-file.txt"
+
+  describe "when the close icon is clicked", ->
+    it "closes the selected non-active edit session", ->
+      activeSession = editor.activeEditSession
+      expect(editor.getActiveEditSessionIndex()).toBe 1
+      tabs.find('.tab .close-icon:eq(0)').click()
+      expect(editor.getActiveEditSessionIndex()).toBe 0
+      expect(editor.activeEditSession).toBe activeSession
+
+    it "closes the selected active edit session", ->
+      firstSession = editor.getEditSessions()[0]
+      expect(editor.getActiveEditSessionIndex()).toBe 1
+      tabs.find('.tab .close-icon:eq(1)').click()
+      expect(editor.getActiveEditSessionIndex()).toBe 0
+      expect(editor.activeEditSession).toBe firstSession

src/extensions/tabs/src/tab.coffee

@@ -4,7 +4,8 @@ module.exports =
 class Tab extends View
   @content: (editSession) ->
     @div class: 'tab', =>
-      @div class: 'file-name', outlet: 'fileName'
+      @span class: 'file-name', outlet: 'fileName'
+      @span class: 'close-icon'
 
   initialize: (@editSession) ->
     @updateFileName()

src/extensions/tabs/src/tabs.coffee

@@ -32,6 +32,11 @@ class Tabs extends View
     @on 'click', '.tab', (e) =>
       @editor.setActiveEditSessionIndex($(e.target).closest('.tab').index())
 
+    @on 'click', '.tab .close-icon', (e) =>
+      index = $(e.target).closest('.tab').index()
+      @editor.destroyEditSessionIndex(index)
+      false
+
   addTabForEditSession: (editSession) ->
     @append(new Tab(editSession))
 

src/extensions/tabs/src/tabs.css

@@ -23,4 +23,24 @@
 
 .tab:last-child {
   margin-right: 4px;
-}
+}
+
+.tab .file-name {
+  margin-right: 5px;
+}
+
+.tab .close-icon {
+  font-family: 'Octicons Regular';
+  font-size: 14px;
+  width: 14px;
+  height: 14px;
+  color: #aaa;
+}
+
+.tab .close-icon:before {
+  content: "\f050";
+}
+
+.tab .close-icon:hover {
+  color: white;
+}