tabs be working

plugins/tabs/index.coffee

@@ -1,3 +1 @@
-exports.Tabs = Tabs = require 'tabs/tabs'
-
-(new Tabs).toggle()
+module.exports = require 'tabs/tabs'

plugins/tabs/tabs.coffee

@@ -1,15 +1,11 @@
 $ = require 'jquery'
-_ = require 'underscore'
 
-Pane = require 'pane'
+Plugin = require 'plugin'
 File = require 'fs'
-{activeWindow} = require 'app'
+TabsPane = require 'tabs/tabspane'
 
 module.exports =
-class Tabs extends Pane
-  position: 'top'
-  html: require 'tabs/tabs.html'
-
+class Tabs extends Plugin
   # The Editor pane we're managing.
   editor: null
 
@@ -17,83 +13,38 @@ class Tabs extends Pane
     'Command-W': 'closeActiveTab'
     'Command-Shift-[': 'prevTab'
     'Command-Shift-]': 'nextTab'
-    'Command-1': -> @switchToTab 1
-    'Command-2': -> @switchToTab 2
-    'Command-3': -> @switchToTab 3
-    'Command-4': -> @switchToTab 4
-    'Command-5': -> @switchToTab 5
-    'Command-6': -> @switchToTab 6
-    'Command-7': -> @switchToTab 7
-    'Command-8': -> @switchToTab 8
-    'Command-9': -> @switchToTab 9
+    'Command-1': -> @pane.switchToTab 1
+    'Command-2': -> @pane.switchToTab 2
+    'Command-3': -> @pane.switchToTab 3
+    'Command-4': -> @pane.switchToTab 4
+    'Command-5': -> @pane.switchToTab 5
+    'Command-6': -> @pane.switchToTab 6
+    'Command-7': -> @pane.switchToTab 7
+    'Command-8': -> @pane.switchToTab 8
+    'Command-9': -> @pane.switchToTab 9
 
-  initialize: ->
-    @editor = activeWindow.document
+  constructor: (args...) ->
+    super args...
 
+    @pane = new TabsPane @window, @
+    @pane.toggle()
+
+    # NO! Do not use editor to handle events!
+    @editor = @window.document
     @editor.ace.on 'open', ({filename}) =>
-      # Only care about files, not directories
-      return if File.isDirectory(filename)
-      @addTab filename
-      
+      return if File.isDirectory filename  # Ignore directories
+      @pane.addTab filename
+
     @editor.ace.on 'close', ({filename}) =>
-      @removeTab filename
-
-    tab = this
-    # click tab
-    $(document).delegate '#tabs ul li', 'click', ->
-      tab.switchToTab this
-      false
-
-  addTab: (path) ->
-    existing = $("#tabs [data-path='#{path}']")
-    if existing.length
-      return @switchToTab existing
-
-    name = _.last path.split '/'
-    $('#tabs ul .active').removeClass()
-    $('#tabs ul').append """
-      <li data-path='#{path}'><a href='#'>#{name}</a></li>
-    """
-    $('#tabs ul li:last').addClass 'active'
-
-  removeTab: (path) ->
-    tab = $("#tabs li[data-path='#{path}']")
-    if tab.hasClass("active")
-      nextTab = tab.next()
-      nextTab = tab.prev() if nextTab.length == 0
-      @switchToTab nextTab if nextTab.length != 0
-    
-    tab.remove()
+      @pane.removeTab filename
 
+  # Move all of this methods below to pane? I think so
   closeActiveTab: ->
     activeTab = $('#tabs ul .active')
     @editor.close(activeTab.data 'path')
 
-  hideTabs: ->
-    $('#tabs').parents('.pane').remove()
-    $('#tabs-style').remove()
-
   nextTab: ->
     @switchToTab $('#tabs ul .active').next()
 
   prevTab: ->
     @switchToTab $('#tabs ul .active').prev()
-
-  showTabs: ->
-    activeWindow.addPane this
-    $('#tabs').parents('.pane').css height: 'inherit'
-    css = $('<style id="tabs-style"></style>').html require 'tabs/tabs.css'
-    $('head').append css
-
-  switchToTab: (tab) ->
-    tab = $('#tabs ul li').get(tab - 1) if _.isNumber tab
-    return if tab.length is 0
-    $('#tabs ul .active').removeClass()
-    $(tab).addClass 'active'
-    @editor.switchToSession $(tab).data 'path'
-
-  toggle: ->
-    if $('#tabs').length
-      @hideTabs()
-    else
-      @showTabs()

plugins/tabs/tabsPane.coffee

@@ -0,0 +1,54 @@
+$ = require 'jquery'
+_ = require 'underscore'
+
+Pane = require 'pane'
+File = require 'fs'
+
+module.exports =
+class TabsPane extends Pane
+  position: 'top'
+
+  html: $ require 'tabs/tabs.html'
+
+  constructor: (@window, @tabs) ->
+    super @window
+
+    # Style html
+    @html.parents('.pane').css height: 'inherit'
+    css = $('<style id="tabs-style"></style>').html require 'tabs/tabs.css'
+    $('head').append css
+
+    # click tab
+    tabPane = this
+    $('#tabs ul li').live 'click', ->
+      tabPane.switchToTab this
+      false
+
+  switchToTab: (tab) ->
+    tab = $("#tabs ul li").get(tab - 1) if _.isNumber tab
+    return if tab.length is 0
+
+    $("#tabs ul .active").removeClass("active")
+    $(tab).addClass 'active'
+    @tabs.editor.switchToSession $(tab).data 'path'
+
+  addTab: (path) ->
+    existing = $("#tabs [data-path='#{path}']")
+    if existing.length
+      return @switchToTab existing
+
+    name = _.last path.split '/'
+    $("#tabs ul .active").removeClass()
+    $("#tabs ul").append """
+      <li data-path='#{path}'><a href='#'>#{name}</a></li>
+    """
+    $("#tabs ul li:last").addClass 'active'
+
+  removeTab: (path) ->
+    tab = $("#tabs li[data-path='#{path}']")
+    if tab.hasClass("active")
+      nextTab = tab.next()
+      nextTab = tab.prev() if nextTab.length == 0
+      @switchToTab nextTab if nextTab.length != 0
+
+    tab.remove()