Integrate the pane containers into the workspace

spec/workspace-spec.coffee

@@ -462,9 +462,33 @@ describe "Workspace", ->
       constructior: ->
 
     describe '::addLeftPanel(model)', ->
-      it 'emits an onDidAddPanel event and returns a panel', ->
-        atom.workspace.onDidAddPanel addPanelSpy = jasmine.createSpy()
+      it 'adds a panel to the correct panel container', ->
+        atom.workspace.panelContainers.left.onDidAddPanel addPanelSpy = jasmine.createSpy()
         panel = atom.workspace.addLeftPanel(item: new TestPanel())
 
         expect(panel).toBeDefined()
-        expect(addPanelSpy).toHaveBeenCalledWith(panel)
+        expect(addPanelSpy).toHaveBeenCalledWith({panel, index: 0})
+
+    describe '::addRightPanel(model)', ->
+      it 'adds a panel to the correct panel container', ->
+        atom.workspace.panelContainers.right.onDidAddPanel addPanelSpy = jasmine.createSpy()
+        panel = atom.workspace.addRightPanel(item: new TestPanel())
+
+        expect(panel).toBeDefined()
+        expect(addPanelSpy).toHaveBeenCalledWith({panel, index: 0})
+
+    describe '::addTopPanel(model)', ->
+      it 'adds a panel to the correct panel container', ->
+        atom.workspace.panelContainers.top.onDidAddPanel addPanelSpy = jasmine.createSpy()
+        panel = atom.workspace.addTopPanel(item: new TestPanel())
+
+        expect(panel).toBeDefined()
+        expect(addPanelSpy).toHaveBeenCalledWith({panel, index: 0})
+
+    describe '::addBottomPanel(model)', ->
+      it 'adds a panel to the correct panel container', ->
+        atom.workspace.panelContainers.bottom.onDidAddPanel addPanelSpy = jasmine.createSpy()
+        panel = atom.workspace.addBottomPanel(item: new TestPanel())
+
+        expect(panel).toBeDefined()
+        expect(addPanelSpy).toHaveBeenCalledWith({panel, index: 0})

spec/workspace-view-spec.coffee

@@ -271,39 +271,18 @@ describe "WorkspaceView", ->
       expect(getComputedStyle(editorNode).lineHeight).toBe atom.config.get('editor.lineHeight')
       expect(editor.getLineHeightInPixels()).not.toBe initialLineHeight
 
-  describe 'adding panels', ->
+  describe 'panel containers', ->
     workspaceElement = null
-    class TestPanel
-      constructior: ->
-
-    class TestPanelElement extends HTMLElement
-      createdCallback: ->
-        @classList.add('test-root')
-      setModel: (@model) ->
-    TestPanelElement = document.registerElement 'atom-test-element', prototype: TestPanelElement.prototype
-
     beforeEach ->
       workspaceElement = atom.workspace.getView(atom.workspace)
-      atom.workspace.addViewProvider
-        modelConstructor: TestPanel
-        viewConstructor: TestPanelElement
 
-    describe 'Workspace::addLeftPanel(panel)', ->
-      it 'adds an atom-panel and removes it when Panel::destroy() is called', ->
-        panelNode = workspaceElement.querySelector('atom-panel')
-        expect(panelNode).toBe null
+    it 'inserts panel container elements in the correct places in the DOM', ->
+      leftContainer = workspaceElement.querySelector('atom-panel-container[orientation="left"]')
+      rightContainer = workspaceElement.querySelector('atom-panel-container[orientation="right"]')
+      expect(leftContainer.nextSibling).toBe workspaceElement.verticalAxis
+      expect(rightContainer.previousSibling).toBe workspaceElement.verticalAxis
 
-        panel = atom.workspace.addLeftPanel(item: new TestPanel())
-
-        panelNode = workspaceElement.querySelector('atom-panel')
-        expect(panelNode instanceof HTMLElement).toBe true
-        expect(panelNode.childNodes[0]).toHaveClass 'test-root'
-
-        panel.destroy()
-        panelNode = workspaceElement.querySelector('atom-panel')
-        expect(panelNode).toBe null
-
-      it 'adds the panel before the vertical axis', ->
-        panel = atom.workspace.addLeftPanel(item: new TestPanel())
-        panelNode = workspaceElement.querySelector('atom-panel')
-        expect(panelNode.nextSibling).toBe workspaceElement.verticalAxis
+      topContainer = workspaceElement.querySelector('atom-panel-container[orientation="top"]')
+      bottomContainer = workspaceElement.querySelector('atom-panel-container[orientation="bottom"]')
+      expect(topContainer.nextSibling).toBe workspaceElement.paneContainer
+      expect(bottomContainer.previousSibling).toBe workspaceElement.paneContainer

src/panel-container.coffee

@@ -42,6 +42,7 @@ class PanelContainer
     index = @panels.length
     @panels.push(panel)
     @emitter.emit 'did-add-panel', {panel, index}
+    panel
 
   panelDestoryed: (panel) ->
     index = @panels.indexOf(panel)

src/panel.coffee

@@ -3,7 +3,7 @@
 # Public:
 module.exports =
 class Panel
-  constructor: ({@viewRegistry, @item, @orientation}) ->
+  constructor: ({@viewRegistry, @item}) ->
     @emitter = new Emitter
 
   destroy: ->
@@ -11,8 +11,6 @@ class Panel
 
   getView: -> @viewRegistry.getView(@item)
 
-  getOrientation: -> @orientation
-
   ###
   Section: Event Subscription
   ###

src/workspace-element.coffee

@@ -65,7 +65,17 @@ class WorkspaceElement extends HTMLElement
     window.addEventListener 'focus', handleWindowFocus
     @subscriptions.add(new Disposable -> window.removeEventListener 'focus', handleWindowFocus)
 
-    @subscriptions.add @model.onDidAddPanel(@panelAdded.bind(this))
+    @panelContainers =
+      top: @model.panelContainers.top.getView()
+      left: @model.panelContainers.left.getView()
+      right: @model.panelContainers.right.getView()
+      bottom: @model.panelContainers.bottom.getView()
+
+    @horizontalAxis.insertBefore(@panelContainers.left, @verticalAxis)
+    @horizontalAxis.appendChild(@panelContainers.right)
+
+    @verticalAxis.insertBefore(@panelContainers.top, @paneContainer)
+    @verticalAxis.appendChild(@panelContainers.bottom)
 
     @__spacePenView.setModel(@model)
 
@@ -92,13 +102,6 @@ class WorkspaceElement extends HTMLElement
 
   focusPaneViewOnRight: -> @paneContainer.focusPaneViewOnRight()
 
-  panelAdded: (panel) ->
-    panelView = @model.getView(panel)
-
-    switch panel.getOrientation()
-      when 'left'
-        @horizontalAxis.insertBefore(panelView, @verticalAxis)
-
 atom.commands.add 'atom-workspace',
   'window:increase-font-size': -> @getModel().increaseFontSize()
   'window:decrease-font-size': -> @getModel().decreaseFontSize()

src/workspace.coffee

@@ -12,6 +12,8 @@ PaneContainer = require './pane-container'
 Pane = require './pane'
 Panel = require './panel'
 PanelElement = require './panel-element'
+PanelContainer = require './panel-container'
+PanelContainerElement = require './panel-container-element'
 ViewRegistry = require './view-registry'
 WorkspaceElement = require './workspace-element'
 
@@ -47,6 +49,12 @@ class Workspace extends Model
     @paneContainer ?= new PaneContainer({@viewRegistry})
     @paneContainer.onDidDestroyPaneItem(@onPaneItemDestroyed)
 
+    @panelContainers =
+      top: new PanelContainer({@viewRegistry, orientation: 'top'})
+      left: new PanelContainer({@viewRegistry, orientation: 'left'})
+      right: new PanelContainer({@viewRegistry, orientation: 'right'})
+      bottom: new PanelContainer({@viewRegistry, orientation: 'bottom'})
+
     @subscribeToActiveItem()
 
     @addOpener (filePath) =>
@@ -64,6 +72,10 @@ class Workspace extends Model
       modelConstructor: Workspace
       viewConstructor: WorkspaceElement
 
+    @addViewProvider
+      modelConstructor: PanelContainer
+      viewConstructor: PanelContainerElement
+
     @addViewProvider
       modelConstructor: Panel
       viewConstructor: PanelElement
@@ -283,9 +295,6 @@ class Workspace extends Model
     @onDidAddPaneItem ({item, pane, index}) ->
       callback({textEditor: item, pane, index}) if item instanceof TextEditor
 
-  onDidAddPanel: (callback) ->
-    @emitter.on 'did-add-panel', callback
-
   eachEditor: (callback) ->
     deprecate("Use Workspace::observeTextEditors instead")
 
@@ -673,7 +682,19 @@ class Workspace extends Model
   Section: Panels
   ###
 
+  addTopPanel: (options) ->
+    @addPanel('top', options)
+
+  addBottomPanel: (options) ->
+    @addPanel('bottom', options)
+
   addLeftPanel: (options) ->
-    panel = new Panel(_.extend(options, {@viewRegistry, orientation: 'left'}))
-    @emitter.emit('did-add-panel', panel)
-    panel
+    @addPanel('left', options)
+
+  addRightPanel: (options) ->
+    @addPanel('right', options)
+
+  addPanel: (orientation, options) ->
+    options ?= {}
+    options.viewRegistry = @viewRegistry
+    @panelContainers[orientation].addPanel(new Panel(options))