diff --git a/src/browser/scrollable/fastDomNode.ts b/src/browser/scrollable/fastDomNode.ts index 9eba7f7f..82e53217 100644 --- a/src/browser/scrollable/fastDomNode.ts +++ b/src/browser/scrollable/fastDomNode.ts @@ -5,49 +5,21 @@ export class FastDomNode { - private _maxWidth: string = ''; private _width: string = ''; private _height: string = ''; private _top: string = ''; private _left: string = ''; private _bottom: string = ''; private _right: string = ''; - private _paddingTop: string = ''; - private _paddingLeft: string = ''; - private _paddingBottom: string = ''; - private _paddingRight: string = ''; - private _fontFamily: string = ''; - private _fontWeight: string = ''; - private _fontSize: string = ''; - private _fontStyle: string = ''; - private _fontFeatureSettings: string = ''; - private _fontVariationSettings: string = ''; - private _textDecoration: string = ''; - private _lineHeight: string = ''; - private _letterSpacing: string = ''; private _className: string = ''; - private _display: string = ''; private _position: string = ''; - private _visibility: string = ''; - private _color: string = ''; - private _backgroundColor: string = ''; private _layerHint: boolean = false; private _contain: 'none' | 'strict' | 'content' | 'size' | 'layout' | 'style' | 'paint' = 'none'; - private _boxShadow: string = ''; constructor( public readonly domNode: T ) { } - public setMaxWidth(_maxWidth: number | string): void { - const maxWidth = numberAsPixels(_maxWidth); - if (this._maxWidth === maxWidth) { - return; - } - this._maxWidth = maxWidth; - this.domNode.style.maxWidth = this._maxWidth; - } - public setWidth(_width: number | string): void { const width = numberAsPixels(_width); if (this._width === width) { @@ -102,117 +74,6 @@ export class FastDomNode { this.domNode.style.right = this._right; } - public setPaddingTop(_paddingTop: number | string): void { - const paddingTop = numberAsPixels(_paddingTop); - if (this._paddingTop === paddingTop) { - return; - } - this._paddingTop = paddingTop; - this.domNode.style.paddingTop = this._paddingTop; - } - - public setPaddingLeft(_paddingLeft: number | string): void { - const paddingLeft = numberAsPixels(_paddingLeft); - if (this._paddingLeft === paddingLeft) { - return; - } - this._paddingLeft = paddingLeft; - this.domNode.style.paddingLeft = this._paddingLeft; - } - - public setPaddingBottom(_paddingBottom: number | string): void { - const paddingBottom = numberAsPixels(_paddingBottom); - if (this._paddingBottom === paddingBottom) { - return; - } - this._paddingBottom = paddingBottom; - this.domNode.style.paddingBottom = this._paddingBottom; - } - - public setPaddingRight(_paddingRight: number | string): void { - const paddingRight = numberAsPixels(_paddingRight); - if (this._paddingRight === paddingRight) { - return; - } - this._paddingRight = paddingRight; - this.domNode.style.paddingRight = this._paddingRight; - } - - public setFontFamily(fontFamily: string): void { - if (this._fontFamily === fontFamily) { - return; - } - this._fontFamily = fontFamily; - this.domNode.style.fontFamily = this._fontFamily; - } - - public setFontWeight(fontWeight: string): void { - if (this._fontWeight === fontWeight) { - return; - } - this._fontWeight = fontWeight; - this.domNode.style.fontWeight = this._fontWeight; - } - - public setFontSize(_fontSize: number | string): void { - const fontSize = numberAsPixels(_fontSize); - if (this._fontSize === fontSize) { - return; - } - this._fontSize = fontSize; - this.domNode.style.fontSize = this._fontSize; - } - - public setFontStyle(fontStyle: string): void { - if (this._fontStyle === fontStyle) { - return; - } - this._fontStyle = fontStyle; - this.domNode.style.fontStyle = this._fontStyle; - } - - public setFontFeatureSettings(fontFeatureSettings: string): void { - if (this._fontFeatureSettings === fontFeatureSettings) { - return; - } - this._fontFeatureSettings = fontFeatureSettings; - this.domNode.style.fontFeatureSettings = this._fontFeatureSettings; - } - - public setFontVariationSettings(fontVariationSettings: string): void { - if (this._fontVariationSettings === fontVariationSettings) { - return; - } - this._fontVariationSettings = fontVariationSettings; - this.domNode.style.fontVariationSettings = this._fontVariationSettings; - } - - public setTextDecoration(textDecoration: string): void { - if (this._textDecoration === textDecoration) { - return; - } - this._textDecoration = textDecoration; - this.domNode.style.textDecoration = this._textDecoration; - } - - public setLineHeight(_lineHeight: number | string): void { - const lineHeight = numberAsPixels(_lineHeight); - if (this._lineHeight === lineHeight) { - return; - } - this._lineHeight = lineHeight; - this.domNode.style.lineHeight = this._lineHeight; - } - - public setLetterSpacing(_letterSpacing: number | string): void { - const letterSpacing = numberAsPixels(_letterSpacing); - if (this._letterSpacing === letterSpacing) { - return; - } - this._letterSpacing = letterSpacing; - this.domNode.style.letterSpacing = this._letterSpacing; - } - public setClassName(className: string): void { if (this._className === className) { return; @@ -226,14 +87,6 @@ export class FastDomNode { this._className = this.domNode.className; } - public setDisplay(display: string): void { - if (this._display === display) { - return; - } - this._display = display; - this.domNode.style.display = this._display; - } - public setPosition(position: string): void { if (this._position === position) { return; @@ -242,30 +95,6 @@ export class FastDomNode { this.domNode.style.position = this._position; } - public setVisibility(visibility: string): void { - if (this._visibility === visibility) { - return; - } - this._visibility = visibility; - this.domNode.style.visibility = this._visibility; - } - - public setColor(color: string): void { - if (this._color === color) { - return; - } - this._color = color; - this.domNode.style.color = this._color; - } - - public setBackgroundColor(backgroundColor: string): void { - if (this._backgroundColor === backgroundColor) { - return; - } - this._backgroundColor = backgroundColor; - this.domNode.style.backgroundColor = this._backgroundColor; - } - public setLayerHinting(layerHint: boolean): void { if (this._layerHint === layerHint) { return; @@ -286,29 +115,10 @@ export class FastDomNode { this.domNode.style.contain = this._contain; } - public setBoxShadow(boxShadow: string): void { - if (this._boxShadow === boxShadow) { - return; - } - this._boxShadow = boxShadow; - this.domNode.style.boxShadow = this._boxShadow; - } - public setAttribute(name: string, value: string): void { this.domNode.setAttribute(name, value); } - public removeAttribute(name: string): void { - this.domNode.removeAttribute(name); - } - - public appendChild(child: FastDomNode): void { - this.domNode.appendChild(child.domNode); - } - - public removeChild(child: FastDomNode): void { - this.domNode.removeChild(child.domNode); - } } export function createFastDomNode(domNode: T): FastDomNode { diff --git a/src/browser/scrollable/linkedList.ts b/src/browser/scrollable/linkedList.ts index a7132e29..ff8ccaf0 100644 --- a/src/browser/scrollable/linkedList.ts +++ b/src/browser/scrollable/linkedList.ts @@ -22,33 +22,6 @@ export class LinkedList { private _first: Node = Node.Undefined; private _last: Node = Node.Undefined; - private _size: number = 0; - - public get size(): number { - return this._size; - } - - public isEmpty(): boolean { - return this._first === Node.Undefined; - } - - public clear(): void { - let node = this._first; - while (node !== Node.Undefined) { - const next = node.next; - node.prev = Node.Undefined; - node.next = Node.Undefined; - node = next; - } - - this._first = Node.Undefined; - this._last = Node.Undefined; - this._size = 0; - } - - public unshift(element: E): () => void { - return this._insert(element, false); - } public push(element: E): () => void { return this._insert(element, true); @@ -74,8 +47,6 @@ export class LinkedList { newNode.next = oldFirst; oldFirst.prev = newNode; } - this._size += 1; - let didRemove = false; return () => { if (!didRemove) { @@ -85,26 +56,6 @@ export class LinkedList { }; } - public shift(): E | undefined { - if (this._first === Node.Undefined) { - return undefined; - } - const res = this._first.element; - this._remove(this._first); - return res; - - } - - public pop(): E | undefined { - if (this._last === Node.Undefined) { - return undefined; - } - const res = this._last.element; - this._remove(this._last); - return res; - - } - private _remove(node: Node): void { if (node.prev !== Node.Undefined && node.next !== Node.Undefined) { // middle @@ -129,7 +80,6 @@ export class LinkedList { } // done - this._size -= 1; } public *[Symbol.iterator](): Iterator { diff --git a/src/browser/scrollable/scrollable.ts b/src/browser/scrollable/scrollable.ts index 9e57c387..18275ffe 100644 --- a/src/browser/scrollable/scrollable.ts +++ b/src/browser/scrollable/scrollable.ts @@ -303,7 +303,7 @@ export class Scrollable extends Disposable { if (reuseAnimation) { newSmoothScrolling = new SmoothScrollingOperation(this._smoothScrolling.from, validTarget, this._smoothScrolling.startTime, this._smoothScrolling.duration); } else { - newSmoothScrolling = this._smoothScrolling.combine(this._state, validTarget, this._smoothScrollDuration); + newSmoothScrolling = SmoothScrollingOperation.start(this._state, validTarget, this._smoothScrollDuration); } this._smoothScrolling.dispose(); this._smoothScrolling = newSmoothScrolling; @@ -364,7 +364,7 @@ export class Scrollable extends Disposable { } } -export class SmoothScrollingUpdate { +class SmoothScrollingUpdate { public readonly scrollLeft: number; public readonly scrollTop: number; @@ -398,7 +398,7 @@ function createComposed(a: IAnimation, b: IAnimation, cut: number): IAnimation { }; } -export class SmoothScrollingOperation { +class SmoothScrollingOperation { public readonly from: ISmoothScrollPosition; public to: ISmoothScrollPosition; @@ -469,10 +469,6 @@ export class SmoothScrollingOperation { return new SmoothScrollingUpdate(this.to.scrollLeft, this.to.scrollTop, true); } - public combine(from: ISmoothScrollPosition, to: ISmoothScrollPosition, duration: number): SmoothScrollingOperation { - return SmoothScrollingOperation.start(from, to, duration); - } - public static start(from: ISmoothScrollPosition, to: ISmoothScrollPosition, duration: number): SmoothScrollingOperation { duration = duration + 10; const startTime = Date.now() - 10; diff --git a/src/browser/scrollable/scrollableElement.ts b/src/browser/scrollable/scrollableElement.ts index 82ba75f1..e9fc27ef 100644 --- a/src/browser/scrollable/scrollableElement.ts +++ b/src/browser/scrollable/scrollableElement.ts @@ -20,7 +20,6 @@ import { INewScrollDimensions, INewScrollPosition, IScrollDimensions, IScrollPos const HIDE_TIMEOUT = 500; const SCROLL_WHEEL_SENSITIVITY = 50; -const SCROLL_WHEEL_SMOOTH_SCROLL_ENABLED = true; class MouseWheelClassifierItem { public timestamp: number; @@ -36,7 +35,7 @@ class MouseWheelClassifierItem { } } -export class MouseWheelClassifier { +class MouseWheelClassifier { public static readonly INSTANCE = new MouseWheelClassifier(); @@ -345,9 +344,7 @@ export abstract class AbstractScrollableElement extends Widget { } const classifier = MouseWheelClassifier.INSTANCE; - if (SCROLL_WHEEL_SMOOTH_SCROLL_ENABLED) { - classifier.acceptStandardWheelEvent(e); - } + classifier.acceptStandardWheelEvent(e); let didScroll = false; @@ -399,8 +396,7 @@ export abstract class AbstractScrollableElement extends Widget { if (futureScrollPosition.scrollLeft !== desiredScrollPosition.scrollLeft || futureScrollPosition.scrollTop !== desiredScrollPosition.scrollTop) { const canPerformSmoothScroll = ( - SCROLL_WHEEL_SMOOTH_SCROLL_ENABLED - && this._options.mouseWheelSmoothScroll + this._options.mouseWheelSmoothScroll && classifier.isPhysicalMouseWheel() ); @@ -519,31 +515,25 @@ export abstract class AbstractScrollableElement extends Widget { } } -export class ScrollableElement extends AbstractScrollableElement { - - constructor(element: HTMLElement, options: IScrollableElementCreationOptions) { - options = options ?? {}; - options.mouseWheelSmoothScroll = false; - const scrollable = new Scrollable({ - forceIntegerValues: true, - smoothScrollDuration: 0, - scheduleAtNextAnimationFrame: (callback) => dom.scheduleAtNextAnimationFrame(dom.getWindow(element), callback) - }); - super(element, options, scrollable); - this._register(scrollable); - } - - public setScrollPosition(update: INewScrollPosition): void { - this._scrollable.setScrollPositionNow(update); - } - - public getScrollPosition(): IScrollPosition { - return this._scrollable.getCurrentScrollPosition(); - } -} - export class SmoothScrollableElement extends AbstractScrollableElement { + constructor(element: HTMLElement, options: IScrollableElementCreationOptions, scrollable?: Scrollable) { + options = options ?? {}; + const ownsScrollable = !scrollable; + if (!scrollable) { + options.mouseWheelSmoothScroll = false; + scrollable = new Scrollable({ + forceIntegerValues: true, + smoothScrollDuration: 0, + scheduleAtNextAnimationFrame: (callback) => dom.scheduleAtNextAnimationFrame(dom.getWindow(element), callback) + }); + } + super(element, options, scrollable); + if (ownsScrollable) { + this._register(scrollable); + } + } + public setScrollPosition(update: INewScrollPosition & { reuseAnimation?: boolean }): void { if (update.reuseAnimation) { this._scrollable.setScrollPositionSmooth(update, update.reuseAnimation); diff --git a/src/browser/scrollable/widget.ts b/src/browser/scrollable/widget.ts index f3d33797..80220c9b 100644 --- a/src/browser/scrollable/widget.ts +++ b/src/browser/scrollable/widget.ts @@ -4,10 +4,8 @@ *--------------------------------------------------------------------------------------------*/ import * as dom from '../Dom'; -import { IKeyboardEvent, StandardKeyboardEvent } from './keyboardEvent'; import { IMouseEvent, StandardMouseEvent } from './mouseEvent'; -import { Gesture } from './touch'; -import { Disposable, IDisposable } from 'common/Lifecycle'; +import { Disposable } from 'common/Lifecycle'; export abstract class Widget extends Disposable { @@ -15,10 +13,6 @@ export abstract class Widget extends Disposable { this._register(dom.addDisposableListener(domNode, dom.eventType.CLICK, (e: MouseEvent) => listener(new StandardMouseEvent(dom.getWindow(domNode), e)))); } - protected _onmousedown(domNode: HTMLElement, listener: (e: IMouseEvent) => void): void { - this._register(dom.addDisposableListener(domNode, dom.eventType.MOUSE_DOWN, (e: MouseEvent) => listener(new StandardMouseEvent(dom.getWindow(domNode), e)))); - } - protected _onmouseover(domNode: HTMLElement, listener: (e: IMouseEvent) => void): void { this._register(dom.addDisposableListener(domNode, dom.eventType.MOUSE_OVER, (e: MouseEvent) => listener(new StandardMouseEvent(dom.getWindow(domNode), e)))); } @@ -26,32 +20,4 @@ export abstract class Widget extends Disposable { protected _onmouseleave(domNode: HTMLElement, listener: (e: IMouseEvent) => void): void { this._register(dom.addDisposableListener(domNode, dom.eventType.MOUSE_LEAVE, (e: MouseEvent) => listener(new StandardMouseEvent(dom.getWindow(domNode), e)))); } - - protected _onkeydown(domNode: HTMLElement, listener: (e: IKeyboardEvent) => void): void { - this._register(dom.addDisposableListener(domNode, dom.eventType.KEY_DOWN, (e: KeyboardEvent) => listener(new StandardKeyboardEvent(e)))); - } - - protected _onkeyup(domNode: HTMLElement, listener: (e: IKeyboardEvent) => void): void { - this._register(dom.addDisposableListener(domNode, dom.eventType.KEY_UP, (e: KeyboardEvent) => listener(new StandardKeyboardEvent(e)))); - } - - protected _oninput(domNode: HTMLElement, listener: (e: Event) => void): void { - this._register(dom.addDisposableListener(domNode, dom.eventType.INPUT, listener)); - } - - protected _onblur(domNode: HTMLElement, listener: (e: Event) => void): void { - this._register(dom.addDisposableListener(domNode, dom.eventType.BLUR, listener)); - } - - protected _onfocus(domNode: HTMLElement, listener: (e: Event) => void): void { - this._register(dom.addDisposableListener(domNode, dom.eventType.FOCUS, listener)); - } - - protected _onchange(domNode: HTMLElement, listener: (e: Event) => void): void { - this._register(dom.addDisposableListener(domNode, dom.eventType.CHANGE, listener)); - } - - protected _ignoreGesture(domNode: HTMLElement): IDisposable { - return Gesture.ignoreTarget(domNode); - } }