From 79b460a0ca8cd09790fdacf470238e7d7dab5aaa Mon Sep 17 00:00:00 2001 From: Jess Lin Date: Sat, 18 Apr 2015 16:23:30 -0700 Subject: [PATCH] [Gutter] Add ::getDomNode method to all 'components' --- spec/text-editor-component-spec.coffee | 6 ++--- src/cursors-component.coffee | 3 +++ src/highlights-component.coffee | 3 +++ src/input-component.coffee | 3 +++ src/lines-component.coffee | 7 ++++-- src/scrollbar-component.coffee | 3 +++ src/scrollbar-corner-component.coffee | 3 +++ src/text-editor-component.coffee | 31 ++++++++++++++------------ src/text-editor-element.coffee | 8 +++---- src/text-editor-view.coffee | 2 +- 10 files changed, 45 insertions(+), 24 deletions(-) diff --git a/spec/text-editor-component-spec.coffee b/spec/text-editor-component-spec.coffee index 31dff8450..a89bee1fc 100644 --- a/spec/text-editor-component-spec.coffee +++ b/spec/text-editor-component-spec.coffee @@ -46,7 +46,7 @@ describe "TextEditorComponent", -> lineHeightInPixels = editor.getLineHeightInPixels() charWidth = editor.getDefaultCharWidth() - componentNode = component.domNode + componentNode = component.getDomNode() verticalScrollbarNode = componentNode.querySelector('.vertical-scrollbar') horizontalScrollbarNode = componentNode.querySelector('.horizontal-scrollbar') @@ -2392,7 +2392,7 @@ describe "TextEditorComponent", -> wrapperView.appendTo(hiddenParent) {component} = wrapperView - componentNode = component.domNode + componentNode = component.getDomNode() expect(componentNode.querySelectorAll('.line').length).toBe 0 hiddenParent.style.display = 'block' @@ -2599,7 +2599,7 @@ describe "TextEditorComponent", -> expect(wrapperNode.classList.contains('mini')).toBe true it "does not have an opaque background on lines", -> - expect(component.linesComponent.domNode.getAttribute('style')).not.toContain 'background-color' + expect(component.linesComponent.getDomNode().getAttribute('style')).not.toContain 'background-color' it "does not render invisible characters", -> atom.config.set('editor.invisibles', eol: 'E') diff --git a/src/cursors-component.coffee b/src/cursors-component.coffee index bd530ce2b..2de4f1ede 100644 --- a/src/cursors-component.coffee +++ b/src/cursors-component.coffee @@ -7,6 +7,9 @@ class CursorsComponent @domNode = document.createElement('div') @domNode.classList.add('cursors') + getDomNode: -> + @domNode + updateSync: (state) -> newState = state.content @oldState ?= {cursors: {}} diff --git a/src/highlights-component.coffee b/src/highlights-component.coffee index e2c629cb9..5a5747d4c 100644 --- a/src/highlights-component.coffee +++ b/src/highlights-component.coffee @@ -17,6 +17,9 @@ class HighlightsComponent insertionPoint.setAttribute('select', '.underlayer') @domNode.appendChild(insertionPoint) + getDomNode: -> + @domNode + updateSync: (state) -> newState = state.content.highlights @oldState ?= {} diff --git a/src/input-component.coffee b/src/input-component.coffee index f6f8917f6..88c1cf480 100644 --- a/src/input-component.coffee +++ b/src/input-component.coffee @@ -7,6 +7,9 @@ class InputComponent @domNode.style['-webkit-transform'] = 'translateZ(0)' @domNode.addEventListener 'paste', (event) -> event.preventDefault() + getDomNode: -> + @domNode + updateSync: (state) -> @oldState ?= {} newState = state.hiddenInput diff --git a/src/lines-component.coffee b/src/lines-component.coffee index 5004d4060..fbec40b79 100644 --- a/src/lines-component.coffee +++ b/src/lines-component.coffee @@ -29,16 +29,19 @@ class LinesComponent @domNode.classList.add('lines') @cursorsComponent = new CursorsComponent(@presenter) - @domNode.appendChild(@cursorsComponent.domNode) + @domNode.appendChild(@cursorsComponent.getDomNode()) @highlightsComponent = new HighlightsComponent(@presenter) - @domNode.appendChild(@highlightsComponent.domNode) + @domNode.appendChild(@highlightsComponent.getDomNode()) if @useShadowDOM insertionPoint = document.createElement('content') insertionPoint.setAttribute('select', '.overlayer') @domNode.appendChild(insertionPoint) + getDomNode: -> + @domNode + updateSync: (state) -> @newState = state.content @oldState ?= {lines: {}} diff --git a/src/scrollbar-component.coffee b/src/scrollbar-component.coffee index 3a63a33ed..45cfbd240 100644 --- a/src/scrollbar-component.coffee +++ b/src/scrollbar-component.coffee @@ -12,6 +12,9 @@ class ScrollbarComponent @domNode.addEventListener 'scroll', @onScrollCallback + getDomNode: -> + @domNode + updateSync: (state) -> @oldState ?= {} switch @orientation diff --git a/src/scrollbar-corner-component.coffee b/src/scrollbar-corner-component.coffee index 986d28f17..bc059f12c 100644 --- a/src/scrollbar-corner-component.coffee +++ b/src/scrollbar-corner-component.coffee @@ -7,6 +7,9 @@ class ScrollbarCornerComponent @contentNode = document.createElement('div') @domNode.appendChild(@contentNode) + getDomNode: -> + @domNode + updateSync: (state) -> @oldState ?= {} @newState ?= {} diff --git a/src/text-editor-component.coffee b/src/text-editor-component.coffee index 89f541775..136656dcc 100644 --- a/src/text-editor-component.coffee +++ b/src/text-editor-component.coffee @@ -73,19 +73,19 @@ class TextEditorComponent @mountGutterContainerComponent() if @presenter.getState().gutters.sortedDescriptions.length @hiddenInputComponent = new InputComponent - @scrollViewNode.appendChild(@hiddenInputComponent.domNode) + @scrollViewNode.appendChild(@hiddenInputComponent.getDomNode()) @linesComponent = new LinesComponent({@presenter, @hostElement, @useShadowDOM}) - @scrollViewNode.appendChild(@linesComponent.domNode) + @scrollViewNode.appendChild(@linesComponent.getDomNode()) @horizontalScrollbarComponent = new ScrollbarComponent({orientation: 'horizontal', onScroll: @onHorizontalScroll}) - @scrollViewNode.appendChild(@horizontalScrollbarComponent.domNode) + @scrollViewNode.appendChild(@horizontalScrollbarComponent.getDomNode()) @verticalScrollbarComponent = new ScrollbarComponent({orientation: 'vertical', onScroll: @onVerticalScroll}) - @domNode.appendChild(@verticalScrollbarComponent.domNode) + @domNode.appendChild(@verticalScrollbarComponent.getDomNode()) @scrollbarCornerComponent = new ScrollbarCornerComponent - @domNode.appendChild(@scrollbarCornerComponent.domNode) + @domNode.appendChild(@scrollbarCornerComponent.getDomNode()) @observeEditor() @listenForDOMEvents() @@ -108,6 +108,9 @@ class TextEditorComponent @presenter.destroy() window.removeEventListener 'resize', @requestHeightAndWidthMeasurement + getDomNode: -> + @domNode + updateSync: -> @oldState ?= {} @newState = @presenter.getState() @@ -138,7 +141,7 @@ class TextEditorComponent @mountGutterContainerComponent() unless @gutterContainerComponent? @gutterContainerComponent.updateSync(@newState) else - @gutterContainerComponent?.domNode?.remove() + @gutterContainerComponent?.getDomNode()?.remove() @gutterContainerComponent = null @hiddenInputComponent.updateSync(@newState) @@ -163,7 +166,7 @@ class TextEditorComponent mountGutterContainerComponent: -> @gutterContainerComponent = new GutterContainerComponent({@editor, @onLineNumberGutterMouseDown}) - @domNode.insertBefore(@gutterContainerComponent.domNode, @domNode.firstChild) + @domNode.insertBefore(@gutterContainerComponent.getDomNode(), @domNode.firstChild) becameVisible: -> @updatesPaused = true @@ -282,7 +285,7 @@ class TextEditorComponent focused: -> if @mounted @presenter.setFocused(true) - @hiddenInputComponent.domNode.focus() + @hiddenInputComponent.getDomNode().focus() blurred: -> if @mounted @@ -646,7 +649,7 @@ class TextEditorComponent lineNumberGutter = @gutterContainerComponent?.getLineNumberGutterComponent() if lineNumberGutter - gutterBackgroundColor = getComputedStyle(lineNumberGutter.domNode).backgroundColor + gutterBackgroundColor = getComputedStyle(lineNumberGutter.getDomNode()).backgroundColor @presenter.setGutterBackgroundColor(gutterBackgroundColor) measureLineHeightAndDefaultCharWidth: -> @@ -666,7 +669,7 @@ class TextEditorComponent measureScrollbars: -> @measureScrollbarsWhenShown = false - cornerNode = @scrollbarCornerComponent.domNode + cornerNode = @scrollbarCornerComponent.getDomNode() originalDisplayValue = cornerNode.style.display cornerNode.style.display = 'block' @@ -692,9 +695,9 @@ class TextEditorComponent @measureScrollbarsWhenShown = true return - verticalNode = @verticalScrollbarComponent.domNode - horizontalNode = @horizontalScrollbarComponent.domNode - cornerNode = @scrollbarCornerComponent.domNode + verticalNode = @verticalScrollbarComponent.getDomNode() + horizontalNode = @horizontalScrollbarComponent.getDomNode() + cornerNode = @scrollbarCornerComponent.getDomNode() originalVerticalDisplayValue = verticalNode.style.display originalHorizontalDisplayValue = horizontalNode.style.display @@ -764,7 +767,7 @@ class TextEditorComponent pixelPositionForMouseEvent: (event) -> {clientX, clientY} = event - linesClientRect = @linesComponent.domNode.getBoundingClientRect() + linesClientRect = @linesComponent.getDomNode().getBoundingClientRect() top = clientY - linesClientRect.top left = clientX - linesClientRect.left {top, left} diff --git a/src/text-editor-element.coffee b/src/text-editor-element.coffee index 0884b4248..95c60f9a0 100644 --- a/src/text-editor-element.coffee +++ b/src/text-editor-element.coffee @@ -113,12 +113,12 @@ class TextEditorElement extends HTMLElement lineOverdrawMargin: @lineOverdrawMargin useShadowDOM: @useShadowDOM ) - @rootElement.appendChild(@component.domNode) + @rootElement.appendChild(@component.getDomNode()) if @useShadowDOM @shadowRoot.addEventListener('blur', @shadowRootBlurred.bind(this), true) else - inputNode = @component.hiddenInputComponent.domNode + inputNode = @component.hiddenInputComponent.getDomNode() inputNode.addEventListener 'focus', @focused.bind(this) inputNode.addEventListener 'blur', => @dispatchEvent(new FocusEvent('blur', bubbles: false)) @@ -126,7 +126,7 @@ class TextEditorElement extends HTMLElement callRemoveHooks(this) if @component? @component.destroy() - @component.domNode.remove() + @component.getDomNode().remove() @component = null focused: -> @@ -134,7 +134,7 @@ class TextEditorElement extends HTMLElement blurred: (event) -> unless @useShadowDOM - if event.relatedTarget is @component.hiddenInputComponent.domNode + if event.relatedTarget is @component.hiddenInputComponent.getDomNode() event.stopImmediatePropagation() return diff --git a/src/text-editor-view.coffee b/src/text-editor-view.coffee index e75b6609b..b86367ef4 100644 --- a/src/text-editor-view.coffee +++ b/src/text-editor-view.coffee @@ -125,7 +125,7 @@ class TextEditorView extends View Object.defineProperty @::, 'firstRenderedScreenRow', get: -> @component.getRenderedRowRange()[0] Object.defineProperty @::, 'lastRenderedScreenRow', get: -> @component.getRenderedRowRange()[1] Object.defineProperty @::, 'active', get: -> @is(@getPaneView()?.activeView) - Object.defineProperty @::, 'isFocused', get: -> document.activeElement is @element or document.activeElement is @element.component?.hiddenInputComponent?.domNode + Object.defineProperty @::, 'isFocused', get: -> document.activeElement is @element or document.activeElement is @element.component?.hiddenInputComponent?.getDomNode() Object.defineProperty @::, 'mini', get: -> @model?.isMini() Object.defineProperty @::, 'component', get: -> @element?.component