[Gutter][DOM Persistence] Keep a gutter in the DOM if it is merely hidden (not destroyed)

This commit is contained in:
Jess Lin
2015-04-01 11:41:42 -07:00
parent 0d7f89467f
commit 34856d94f5
5 changed files with 32 additions and 28 deletions

View File

@@ -584,22 +584,22 @@ describe "TextEditorComponent", ->
editor.setLineNumberGutterVisible(false)
nextAnimationFrame()
expect(componentNode.querySelector('.gutter')).toBeNull()
expect(componentNode.querySelector('.gutter').style.display).toBe 'none'
atom.config.set("editor.showLineNumbers", false)
nextAnimationFrame()
expect(componentNode.querySelector('.gutter')).toBeNull()
expect(componentNode.querySelector('.gutter').style.display).toBe 'none'
editor.setLineNumberGutterVisible(true)
nextAnimationFrame()
expect(componentNode.querySelector('.gutter')).toBeNull()
expect(componentNode.querySelector('.gutter').style.display).toBe 'none'
atom.config.set("editor.showLineNumbers", true)
nextAnimationFrame()
expect(componentNode.querySelector('.gutter')).toBeDefined()
expect(componentNode.querySelector('.gutter').style.display).toBe ''
expect(component.lineNumberNodeForScreenRow(3)?).toBe true
describe "fold decorations", ->

View File

@@ -2191,10 +2191,10 @@ describe "TextEditorPresenter", ->
expect(presenter.getState().focused).toBe false
describe ".gutters", ->
describe ".sortedModels", ->
describe ".sortedDescriptions", ->
gutterDescriptionWithName = (presenter, name) ->
for gutterDesc in presenter.getState().gutters.sortedModels
return gutterDesc if gutterDesc.name is name
for gutterDesc in presenter.getState().gutters.sortedDescriptions
return gutterDesc if gutterDesc.gutter.name is name
undefined
describe "the line-number gutter", ->
@@ -2202,28 +2202,28 @@ describe "TextEditorPresenter", ->
presenter = buildPresenter()
expect(editor.isLineNumberGutterVisible()).toBe true
expect(gutterDescriptionWithName(presenter, 'line-number')).toBeDefined()
expect(gutterDescriptionWithName(presenter, 'line-number').visible).toBe true
expectStateUpdate presenter, -> editor.setMini(true)
expect(gutterDescriptionWithName(presenter, 'line-number')).toBeUndefined()
expectStateUpdate presenter, -> editor.setMini(false)
expect(gutterDescriptionWithName(presenter, 'line-number')).toBeDefined()
expect(gutterDescriptionWithName(presenter, 'line-number').visible).toBe true
expectStateUpdate presenter, -> editor.setLineNumberGutterVisible(false)
expect(gutterDescriptionWithName(presenter, 'line-number')).toBeUndefined()
expect(gutterDescriptionWithName(presenter, 'line-number').visible).toBe false
expectStateUpdate presenter, -> editor.setLineNumberGutterVisible(true)
expect(gutterDescriptionWithName(presenter, 'line-number')).toBeDefined()
expect(gutterDescriptionWithName(presenter, 'line-number').visible).toBe true
expectStateUpdate presenter, -> atom.config.set('editor.showLineNumbers', false)
expect(gutterDescriptionWithName(presenter, 'line-number')).toBeUndefined()
expect(gutterDescriptionWithName(presenter, 'line-number').visible).toBe false
it "gets updated when the editor's grammar changes", ->
presenter = buildPresenter()
atom.config.set('editor.showLineNumbers', false, scopeSelector: '.source.js')
expect(gutterDescriptionWithName(presenter, 'line-number')).toBeDefined()
expect(gutterDescriptionWithName(presenter, 'line-number').visible).toBe true
stateUpdated = false
presenter.onDidUpdateState -> stateUpdated = true
@@ -2231,26 +2231,30 @@ describe "TextEditorPresenter", ->
runs ->
expect(stateUpdated).toBe true
expect(gutterDescriptionWithName(presenter, 'line-number')).toBeUndefined()
expect(gutterDescriptionWithName(presenter, 'line-number').visible).toBe false
it "updates when gutters are added to the editor model, and keeps the gutters sorted by priority", ->
presenter = buildPresenter()
gutter1 = editor.addGutter({name: 'test-gutter-1', priority: -100, visible: true})
editor.addGutter({name: 'test-gutter-2', priority: 100, visible: false})
expectedState = [gutter1, editor.gutterWithName('line-number')]
expect(presenter.getState().gutters.sortedModels).toEqual expectedState
gutter2 = editor.addGutter({name: 'test-gutter-2', priority: 100, visible: false})
expectedState = [
{gutter: gutter1, visible: true},
{gutter: editor.gutterWithName('line-number'), visible: true},
{gutter: gutter2, visible: false},
]
expect(presenter.getState().gutters.sortedDescriptions).toEqual expectedState
it "updates when the visibility of a gutter changes", ->
presenter = buildPresenter()
gutter = editor.addGutter({name: 'test-gutter', visible: true})
expect(gutterDescriptionWithName(presenter, 'test-gutter')).toBeDefined()
expect(gutterDescriptionWithName(presenter, 'test-gutter').visible).toBe true
gutter.hide()
expect(gutterDescriptionWithName(presenter, 'test-gutter')).toBeUndefined()
expect(gutterDescriptionWithName(presenter, 'test-gutter').visible).toBe false
it "updates when a gutter is removed", ->
presenter = buildPresenter()
gutter = editor.addGutter({name: 'test-gutter', visible: true})
expect(gutterDescriptionWithName(presenter, 'test-gutter')).toBeDefined()
expect(gutterDescriptionWithName(presenter, 'test-gutter').visible).toBe true
gutter.destroy()
expect(gutterDescriptionWithName(presenter, 'test-gutter')).toBeUndefined()

View File

@@ -25,11 +25,11 @@ class GutterContainerComponent
updateSync: (state) ->
# The GutterContainerComponent expects the gutters to be sorted in the order
# they should appear.
newState = state.gutters.sortedModels
newState = state.gutters.sortedDescriptions
newGutterComponents = []
newGutterComponentsByGutterName = {}
for gutter in newState
for {gutter, visible} in newState
gutterComponent = @gutterComponentsByGutterName[gutter.name]
if !gutterComponent
if gutter.name is 'line-number'
@@ -37,6 +37,7 @@ class GutterContainerComponent
@lineNumberGutterComponent = gutterComponent
else
gutterComponent = new CustomGutterComponent({gutter})
if visible then gutterComponent.showNode() else gutterComponent.hideNode()
newGutterComponents.push(gutterComponent)
newGutterComponentsByGutterName[gutter.name] = gutterComponent

View File

@@ -70,7 +70,7 @@ class TextEditorComponent
@scrollViewNode.classList.add('scroll-view')
@domNode.appendChild(@scrollViewNode)
@mountGutterContainerComponent() if @presenter.getState().gutters.sortedModels.length
@mountGutterContainerComponent() if @presenter.getState().gutters.sortedDescriptions.length
@hiddenInputComponent = new InputComponent
@scrollViewNode.appendChild(@hiddenInputComponent.domNode)
@@ -134,7 +134,7 @@ class TextEditorComponent
else
@domNode.style.height = ''
if @newState.gutters.sortedModels.length
if @newState.gutters.sortedDescriptions.length
@mountGutterContainerComponent() unless @gutterContainerComponent?
@gutterContainerComponent.updateSync(@newState)
else

View File

@@ -182,7 +182,7 @@ class TextEditorPresenter
lineNumberGutter:
lineNumbers: {}
gutters:
sortedModels: []
sortedDescriptions: []
customDecorations: {}
@updateState()
@@ -405,15 +405,14 @@ class TextEditorPresenter
# For now, just match the background color of the line-number gutter.
# TODO: Allow gutters to have different background colors. (?)
@state.gutters.backgroundColor = @getGutterBackgroundColor()
@state.gutters.sortedModels = []
@state.gutters.sortedDescriptions = []
if @model.isMini()
return
for gutter in @model.getGutters()
isVisible = gutter.isVisible()
if gutter.name is 'line-number'
isVisible = isVisible && @showLineNumbers
if isVisible
@state.gutters.sortedModels.push(gutter)
@state.gutters.sortedDescriptions.push({gutter, visible: isVisible})
# Updates the decoration state for the gutter with the given gutterName.
# @state.gutters.customDecorations is an {Object}, with the form: