diff --git a/src/vs/editor/contrib/colorPicker/browser/colorPickerWidget.ts b/src/vs/editor/contrib/colorPicker/browser/colorPickerWidget.ts index 91eb124b9053ddacbc36bee7e8237f85088009e0..9e416c5cac35f817cd166d08dd62fd9a579da229 100644 --- a/src/vs/editor/contrib/colorPicker/browser/colorPickerWidget.ts +++ b/src/vs/editor/contrib/colorPicker/browser/colorPickerWidget.ts @@ -129,6 +129,7 @@ class SaturationBox extends Disposable { private width: number; private height: number; + private monitor: GlobalMouseMoveMonitor; private _onDidChange = new Emitter<{ s: number, v: number }>(); readonly onDidChange: Event<{ s: number, v: number }> = this._onDidChange.event; @@ -154,22 +155,24 @@ class SaturationBox extends Disposable { this._register(dom.addDisposableListener(this.domNode, dom.EventType.MOUSE_DOWN, e => this.onMouseDown(e))); this._register(this.model.onDidChangeColor(this.onDidChangeColor, this)); + this.monitor = null; } private onMouseDown(e: MouseEvent): void { - const monitor = this._register(new GlobalMouseMoveMonitor()); + this.monitor = this._register(new GlobalMouseMoveMonitor()); const origin = dom.getDomNodePagePosition(this.domNode); if (e.target !== this.selection) { this.onDidChangePosition(e.offsetX, e.offsetY); } - monitor.startMonitoring(standardMouseMoveMerger, event => this.onDidChangePosition(event.posx - origin.left, event.posy - origin.top), () => null); + this.monitor.startMonitoring(standardMouseMoveMerger, event => this.onDidChangePosition(event.posx - origin.left, event.posy - origin.top), () => null); const mouseUpListener = dom.addDisposableListener(document, dom.EventType.MOUSE_UP, () => { this._onColorFlushed.fire(); mouseUpListener.dispose(); - monitor.stopMonitoring(true); + this.monitor.stopMonitoring(true); + this.monitor = null; }, true); } @@ -221,6 +224,9 @@ class SaturationBox extends Disposable { } private onDidChangeColor(): void { + if (this.monitor && this.monitor.isMonitoring()) { + return; + } this.paint(); } }