1  {CompositeDisposable} = require 'event-kit'
 2  PaneResizeHandleElement = require './pane-resize-handle-element'
 3  
 4  class PaneAxisElement extends HTMLElement
 5    attachedCallback: ->
 6      @subscriptions ?= @subscribeToModel()
 7      @childAdded({child, index}) for child, index in @model.getChildren()
 8  
 9    detachedCallback: ->
10      @subscriptions.dispose()
11      @subscriptions = null
12      @childRemoved({child}) for child in @model.getChildren()
13  
14    initialize: (@model, @viewRegistry) ->
15      @subscriptions ?= @subscribeToModel()
16      @childAdded({child, index}) for child, index in @model.getChildren()
17  
18      switch @model.getOrientation()
19        when 'horizontal'
20          @classList.add('horizontal', 'pane-row')
21        when 'vertical'
22          @classList.add('vertical', 'pane-column')
23      this
24  
25    subscribeToModel: ->
26      subscriptions = new CompositeDisposable
27      subscriptions.add @model.onDidAddChild(@childAdded.bind(this))
28      subscriptions.add @model.onDidRemoveChild(@childRemoved.bind(this))
29      subscriptions.add @model.onDidReplaceChild(@childReplaced.bind(this))
30      subscriptions.add @model.observeFlexScale(@flexScaleChanged.bind(this))
31      subscriptions
32  
33    isPaneResizeHandleElement: (element) ->
34      element?.nodeName.toLowerCase() is 'atom-pane-resize-handle'
35  
36    childAdded: ({child, index}) ->
37      view = @viewRegistry.getView(child)
38      @insertBefore(view, @children[index * 2])
39  
40      prevElement = view.previousSibling
41      # if previous element is not pane resize element, then insert new resize element
42      if prevElement? and not @isPaneResizeHandleElement(prevElement)
43        resizeHandle = document.createElement('atom-pane-resize-handle')
44        @insertBefore(resizeHandle, view)
45  
46      nextElement = view.nextSibling
47      # if next element isnot resize element, then insert new resize element
48      if nextElement? and not @isPaneResizeHandleElement(nextElement)
49        resizeHandle = document.createElement('atom-pane-resize-handle')
50        @insertBefore(resizeHandle, nextElement)
51  
52    childRemoved: ({child}) ->
53      view = @viewRegistry.getView(child)
54      siblingView = view.previousSibling
55      # make sure next sibling view is pane resize view
56      if siblingView? and @isPaneResizeHandleElement(siblingView)
57        siblingView.remove()
58      view.remove()
59  
60    childReplaced: ({index, oldChild, newChild}) ->
61      focusedElement = document.activeElement if @hasFocus()
62      @childRemoved({child: oldChild, index})
63      @childAdded({child: newChild, index})
64      focusedElement?.focus() if document.activeElement is document.body
65  
66    flexScaleChanged: (flexScale) -> @style.flexGrow = flexScale
67  
68    hasFocus: ->
69      this is document.activeElement or @contains(document.activeElement)
70  
71  module.exports = PaneAxisElement = document.registerElement 'atom-pane-axis', prototype: PaneAxisElement.prototype