Skip to content

Commit 5076757

Browse files
committed
Fix microsoft#83721. Handle pointer events in Color Picker.
1 parent 8a22996 commit 5076757

1 file changed

Lines changed: 16 additions & 7 deletions

File tree

src/vs/editor/contrib/colorPicker/colorPickerWidget.ts

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,15 @@
66
import 'vs/css!./colorPicker';
77
import { onDidChangeZoomLevel } from 'vs/base/browser/browser';
88
import * as dom from 'vs/base/browser/dom';
9-
import { GlobalMouseMoveMonitor, IStandardMouseMoveEventData, standardMouseMoveMerger } from 'vs/base/browser/globalMouseMoveMonitor';
9+
import { GlobalMouseMoveMonitor, IStandardMouseMoveEventData, standardMouseMoveMerger, GlobalPointerMoveMonitor } from 'vs/base/browser/globalMouseMoveMonitor';
1010
import { Widget } from 'vs/base/browser/ui/widget';
1111
import { Color, HSVA, RGBA } from 'vs/base/common/color';
1212
import { Emitter, Event } from 'vs/base/common/event';
1313
import { Disposable } from 'vs/base/common/lifecycle';
1414
import { ColorPickerModel } from 'vs/editor/contrib/colorPicker/colorPickerModel';
1515
import { editorHoverBackground } from 'vs/platform/theme/common/colorRegistry';
1616
import { IThemeService, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
17+
import { BrowserFeatures } from 'vs/base/browser/canIUse';
1718

1819
const $ = dom.$;
1920

@@ -150,13 +151,17 @@ class SaturationBox extends Disposable {
150151

151152
this.layout();
152153

153-
this._register(dom.addDisposableListener(this.domNode, dom.EventType.MOUSE_DOWN, e => this.onMouseDown(e)));
154+
this._register(dom.addDisposableListener(this.domNode, BrowserFeatures.pointerEvents ? dom.EventType.POINTER_DOWN : dom.EventType.MOUSE_DOWN, e => this.onMouseDown(e)));
154155
this._register(this.model.onDidChangeColor(this.onDidChangeColor, this));
155156
this.monitor = null;
156157
}
157158

158159
private onMouseDown(e: MouseEvent): void {
159-
this.monitor = this._register(new GlobalMouseMoveMonitor<IStandardMouseMoveEventData>());
160+
this.monitor = this._register(
161+
BrowserFeatures.pointerEvents
162+
? new GlobalPointerMoveMonitor<IStandardMouseMoveEventData>()
163+
: new GlobalMouseMoveMonitor<IStandardMouseMoveEventData>()
164+
);
160165
const origin = dom.getDomNodePagePosition(this.domNode);
161166

162167
if (e.target !== this.selection) {
@@ -165,7 +170,7 @@ class SaturationBox extends Disposable {
165170

166171
this.monitor.startMonitoring(standardMouseMoveMerger, event => this.onDidChangePosition(event.posx - origin.left, event.posy - origin.top), () => null);
167172

168-
const mouseUpListener = dom.addDisposableListener(document, dom.EventType.MOUSE_UP, () => {
173+
const mouseUpListener = dom.addDisposableListener(document, BrowserFeatures.pointerEvents ? dom.EventType.POINTER_UP : dom.EventType.MOUSE_UP, () => {
169174
this._onColorFlushed.fire();
170175
mouseUpListener.dispose();
171176
if (this.monitor) {
@@ -250,7 +255,7 @@ abstract class Strip extends Disposable {
250255
this.slider = dom.append(this.domNode, $('.slider'));
251256
this.slider.style.top = `0px`;
252257

253-
this._register(dom.addDisposableListener(this.domNode, dom.EventType.MOUSE_DOWN, e => this.onMouseDown(e)));
258+
this._register(dom.addDisposableListener(this.domNode, BrowserFeatures.pointerEvents ? dom.EventType.POINTER_DOWN : dom.EventType.MOUSE_DOWN, e => this.onMouseDown(e)));
254259
this.layout();
255260
}
256261

@@ -262,7 +267,11 @@ abstract class Strip extends Disposable {
262267
}
263268

264269
private onMouseDown(e: MouseEvent): void {
265-
const monitor = this._register(new GlobalMouseMoveMonitor<IStandardMouseMoveEventData>());
270+
const monitor = this._register(
271+
BrowserFeatures.pointerEvents
272+
? new GlobalPointerMoveMonitor<IStandardMouseMoveEventData>()
273+
: new GlobalMouseMoveMonitor<IStandardMouseMoveEventData>()
274+
);
266275
const origin = dom.getDomNodePagePosition(this.domNode);
267276
dom.addClass(this.domNode, 'grabbing');
268277

@@ -272,7 +281,7 @@ abstract class Strip extends Disposable {
272281

273282
monitor.startMonitoring(standardMouseMoveMerger, event => this.onDidChangeTop(event.posy - origin.top), () => null);
274283

275-
const mouseUpListener = dom.addDisposableListener(document, dom.EventType.MOUSE_UP, () => {
284+
const mouseUpListener = dom.addDisposableListener(document, BrowserFeatures.pointerEvents ? dom.EventType.POINTER_UP : dom.EventType.MOUSE_UP, () => {
276285
this._onColorFlushed.fire();
277286
mouseUpListener.dispose();
278287
monitor.stopMonitoring(true);

0 commit comments

Comments
 (0)