public setDomNode(domNode: FastDomNode<HTMLElement>): void { this._domNode = domNode; this._domNode.setClassName(this._invisibleClassName); // Now that the flags & the dom node are in a consistent state, ensure the Hidden/Visible configuration this.setShouldBeVisible(false); }
private _sliderMouseDown(e: ISimplifiedMouseEvent, onDragFinished: () => void): void { const initialMousePosition = this._sliderMousePosition(e); const initialMouseOrthogonalPosition = this._sliderOrthogonalMousePosition(e); const initialScrollbarState = this._scrollbarState.clone(); this.slider.toggleClassName('active', true); this._mouseMoveMonitor.startMonitoring( standardMouseMoveMerger, (mouseMoveData: IStandardMouseMoveEventData) => { const mouseOrthogonalPosition = this._sliderOrthogonalMousePosition(mouseMoveData); const mouseOrthogonalDelta = Math.abs(mouseOrthogonalPosition - initialMouseOrthogonalPosition); if (platform.isWindows && mouseOrthogonalDelta > MOUSE_DRAG_RESET_DISTANCE) { // The mouse has wondered away from the scrollbar => reset dragging this._setDesiredScrollPositionNow(initialScrollbarState.getScrollPosition()); return; } const mousePosition = this._sliderMousePosition(mouseMoveData); const mouseDelta = mousePosition - initialMousePosition; this._setDesiredScrollPositionNow(initialScrollbarState.getDesiredScrollPositionFromDelta(mouseDelta)); }, () => { this.slider.toggleClassName('active', false); this._host.onDragEnd(); onDragFinished(); } ); this._host.onDragStart(); }
private _sliderMouseDown(e: IMouseEvent): void { if (e.leftButton) { let initialMouseOrthogonalPosition = this._sliderOrthogonalMousePosition(e); let initialScrollPosition = this._getScrollPosition(); let draggingDelta = this._sliderMousePosition(e) - this._scrollbarState.getSliderPosition(); this.slider.toggleClassName('active', true); this._mouseMoveMonitor.startMonitoring( standardMouseMoveMerger, (mouseMoveData: IStandardMouseMoveEventData) => { let mouseOrthogonalPosition = this._sliderOrthogonalMousePosition(mouseMoveData); let mouseOrthogonalDelta = Math.abs(mouseOrthogonalPosition - initialMouseOrthogonalPosition); // console.log(initialMouseOrthogonalPosition + ' -> ' + mouseOrthogonalPosition + ': ' + mouseOrthogonalDelta); if (Platform.isWindows && mouseOrthogonalDelta > MOUSE_DRAG_RESET_DISTANCE) { // The mouse has wondered away from the scrollbar => reset dragging this.setDesiredScrollPosition(initialScrollPosition); } else { let desiredSliderPosition = this._sliderMousePosition(mouseMoveData) - draggingDelta; this.setDesiredScrollPosition(this._scrollbarState.convertSliderPositionToScrollPosition(desiredSliderPosition)); } }, () => { this.slider.toggleClassName('active', false); this._host.onDragEnd(); } ); e.preventDefault(); this._host.onDragStart(); } }
public render(): void { if (!this._shouldRender) { return; } this._shouldRender = false; if (this._canUseTranslate3d) { // Put the scrollbar in its own layer this.domNode.setTransform('translate3d(0px, 0px, 0px)'); } else { this.domNode.setTransform(''); } this._renderDomNode(this._scrollbarState.getRectangleLargeSize(), this._scrollbarState.getRectangleSmallSize()); this._updateSlider(this._scrollbarState.getSliderSize(), this._scrollbarState.getArrowSize() + this._scrollbarState.getSliderPosition()); }
private _hide(withFadeAway: boolean): void { this._revealTimer.cancel(); if (!this._isVisible) { return; } this._isVisible = false; this._domNode.setClassName(this._invisibleClassName + (withFadeAway ? ' fade' : '')); }
public onConfigurationChanged(e: viewEvents.ViewConfigurationChangedEvent): boolean { if (e.lineHeight) { this._zoneManager.setLineHeight(this._context.configuration.editor.lineHeight); this._render(); } if (e.pixelRatio) { this._zoneManager.setPixelRatio(this._context.configuration.editor.pixelRatio); this._domNode.setWidth(this._zoneManager.getDOMWidth()); this._domNode.setHeight(this._zoneManager.getDOMHeight()); this._domNode.domNode.width = this._zoneManager.getCanvasWidth(); this._domNode.domNode.height = this._zoneManager.getCanvasHeight(); this._render(); } return true; }
public setLayout(position: OverviewRulerPosition): void { this._domNode.setTop(position.top); this._domNode.setRight(position.right); let hasChanged = false; hasChanged = this._zoneManager.setDOMWidth(position.width) || hasChanged; hasChanged = this._zoneManager.setDOMHeight(position.height) || hasChanged; if (hasChanged) { this._domNode.setWidth(this._zoneManager.getDOMWidth()); this._domNode.setHeight(this._zoneManager.getDOMHeight()); this._domNode.domNode.width = this._zoneManager.getCanvasWidth(); this._domNode.domNode.height = this._zoneManager.getCanvasHeight(); this._render(); } }
/** * Creates the slider dom node, adds it to the container & hooks up the events */ protected _createSlider(top: number, left: number, width: number | undefined, height: number | undefined): void { this.slider = createFastDomNode(document.createElement('div')); this.slider.setClassName('slider'); this.slider.setPosition('absolute'); this.slider.setTop(top); this.slider.setLeft(left); if (typeof width === 'number') { this.slider.setWidth(width); } if (typeof height === 'number') { this.slider.setHeight(height); } this.slider.setLayerHinting(true); this.domNode.domNode.appendChild(this.slider.domNode); this.onmousedown(this.slider.domNode, (e) => { if (e.leftButton) { e.preventDefault(); this._sliderMouseDown(e, () => { /*nothing to do*/ }); } }); this.onclick(this.slider.domNode, e => { if (e.leftButton) { e.stopPropagation(); } }); }
public render(ctx: IRestrictedRenderingContext): IViewCursorRenderData { if (!this._renderData) { this._domNode.setDisplay('none'); return null; } if (this._lastRenderedContent !== this._renderData.textContent) { this._lastRenderedContent = this._renderData.textContent; this._domNode.domNode.textContent = this._lastRenderedContent; } let top = this._renderData.top + ctx.viewportTop - ctx.bigNumbersDelta; this._domNode.setDisplay('block'); this._domNode.setTop(top); this._domNode.setLeft(this._renderData.left); this._domNode.setWidth(this._renderData.width); this._domNode.setLineHeight(this._lineHeight); this._domNode.setHeight(this._lineHeight); return { domNode: this._domNode.domNode, position: this._position, contentTop: top, contentLeft: this._renderData.left, height: this._lineHeight, width: 2 }; }
public onFocusChanged(e: viewEvents.ViewFocusChangedEvent): boolean { this.domNode.toggleClassName('focused', e.isFocused); if (e.isFocused) { this.outgoingEvents.emitViewFocusGained(); } else { this.outgoingEvents.emitViewFocusLost(); } return false; }