mirror of
https://github.com/atom/atom.git
synced 2026-01-24 14:28:14 -05:00
133 lines
4.3 KiB
CoffeeScript
133 lines
4.3 KiB
CoffeeScript
{CompositeDisposable} = require 'event-kit'
|
|
{$, callAttachHooks, callRemoveHooks} = require './space-pen-extensions'
|
|
PaneView = require './pane-view'
|
|
|
|
class PaneElement extends HTMLElement
|
|
attached: false
|
|
|
|
createdCallback: ->
|
|
@attached = false
|
|
@subscriptions = new CompositeDisposable
|
|
@inlineDisplayStyles = new WeakMap
|
|
|
|
@initializeContent()
|
|
@subscribeToDOMEvents()
|
|
@createSpacePenShim()
|
|
|
|
attachedCallback: ->
|
|
@attached = true
|
|
@focus() if @model.isFocused()
|
|
|
|
detachedCallback: ->
|
|
@attached = false
|
|
|
|
initializeContent: ->
|
|
@setAttribute 'class', 'pane'
|
|
@setAttribute 'tabindex', -1
|
|
@appendChild @itemViews = document.createElement('div')
|
|
@itemViews.setAttribute 'class', 'item-views'
|
|
|
|
subscribeToDOMEvents: ->
|
|
handleFocus = (event) =>
|
|
@model.focus()
|
|
if event.target is this and view = @getActiveView()
|
|
view.focus()
|
|
event.stopPropagation()
|
|
|
|
handleBlur = (event) =>
|
|
@model.blur() unless @contains(event.relatedTarget)
|
|
|
|
@addEventListener 'focus', handleFocus, true
|
|
@addEventListener 'blur', handleBlur, true
|
|
|
|
createSpacePenShim: ->
|
|
@__spacePenView = new PaneView(this)
|
|
|
|
initialize: (@model) ->
|
|
@subscriptions.add @model.onDidActivate(@activated.bind(this))
|
|
@subscriptions.add @model.observeActive(@activeStatusChanged.bind(this))
|
|
@subscriptions.add @model.observeActiveItem(@activeItemChanged.bind(this))
|
|
@subscriptions.add @model.onDidRemoveItem(@itemRemoved.bind(this))
|
|
@subscriptions.add @model.onDidDestroy(@paneDestroyed.bind(this))
|
|
@__spacePenView.setModel(@model)
|
|
this
|
|
|
|
getModel: -> @model
|
|
|
|
activated: ->
|
|
@focus()
|
|
|
|
activeStatusChanged: (active) ->
|
|
if active
|
|
@classList.add('active')
|
|
else
|
|
@classList.remove('active')
|
|
|
|
activeItemChanged: (item) ->
|
|
return unless item?
|
|
|
|
hasFocus = @hasFocus()
|
|
itemView = atom.views.getView(item)
|
|
|
|
unless @itemViews.contains(itemView)
|
|
@itemViews.appendChild(itemView)
|
|
callAttachHooks(itemView)
|
|
|
|
for child in @itemViews.children
|
|
if child is itemView
|
|
@showItemView(child) if @attached
|
|
else
|
|
@hideItemView(child)
|
|
|
|
itemView.focus() if hasFocus
|
|
|
|
showItemView: (itemView) ->
|
|
inlineDisplayStyle = @inlineDisplayStyles.get(itemView)
|
|
if inlineDisplayStyle?
|
|
itemView.style.display = inlineDisplayStyle
|
|
else
|
|
itemView.style.display = ''
|
|
|
|
hideItemView: (itemView) ->
|
|
inlineDisplayStyle = itemView.style.display
|
|
unless inlineDisplayStyle is 'none'
|
|
@inlineDisplayStyles.set(itemView, inlineDisplayStyle) if inlineDisplayStyle?
|
|
itemView.style.display = 'none'
|
|
|
|
itemRemoved: ({item, index, destroyed}) ->
|
|
if viewToRemove = atom.views.getView(item)
|
|
callRemoveHooks(viewToRemove) if destroyed
|
|
viewToRemove.remove()
|
|
|
|
paneDestroyed: ->
|
|
@subscriptions.dispose()
|
|
|
|
getActiveView: -> atom.views.getView(@model.getActiveItem())
|
|
|
|
hasFocus: ->
|
|
this is document.activeElement or @contains(document.activeElement)
|
|
|
|
atom.commands.add 'atom-pane',
|
|
'pane:save-items': -> @getModel().saveItems()
|
|
'pane:show-next-item': -> @getModel().activateNextItem()
|
|
'pane:show-previous-item': -> @getModel().activatePreviousItem()
|
|
'pane:show-item-1': -> @getModel().activateItemAtIndex(0)
|
|
'pane:show-item-2': -> @getModel().activateItemAtIndex(1)
|
|
'pane:show-item-3': -> @getModel().activateItemAtIndex(2)
|
|
'pane:show-item-4': -> @getModel().activateItemAtIndex(3)
|
|
'pane:show-item-5': -> @getModel().activateItemAtIndex(4)
|
|
'pane:show-item-6': -> @getModel().activateItemAtIndex(5)
|
|
'pane:show-item-7': -> @getModel().activateItemAtIndex(6)
|
|
'pane:show-item-8': -> @getModel().activateItemAtIndex(7)
|
|
'pane:show-item-9': -> @getModel().activateItemAtIndex(8)
|
|
'pane:move-item-right': -> @getModel().moveItemRight()
|
|
'pane:move-item-left': -> @getModel().moveItemLeft()
|
|
'pane:split-left': -> @getModel().splitLeft(copyActiveItem: true)
|
|
'pane:split-right': -> @getModel().splitRight(copyActiveItem: true)
|
|
'pane:split-up': -> @getModel().splitUp(copyActiveItem: true)
|
|
'pane:split-down': -> @getModel().splitDown(copyActiveItem: true)
|
|
'pane:close': -> @getModel().close()
|
|
'pane:close-other-items': -> @getModel().destroyInactiveItems()
|
|
|
|
module.exports = PaneElement = document.registerElement 'atom-pane', prototype: PaneElement.prototype
|