• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1// Copyright (C) 2018 The Android Open Source Project
2//
3// Licensed under the Apache License, Version 2.0 (the "License");
4// you may not use this file except in compliance with the License.
5// You may obtain a copy of the License at
6//
7//      http://www.apache.org/licenses/LICENSE-2.0
8//
9// Unless required by applicable law or agreed to in writing, software
10// distributed under the License is distributed on an "AS IS" BASIS,
11// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12// See the License for the specific language governing permissions and
13// limitations under the License.
14
15export class DragGestureHandler {
16  private readonly boundOnMouseDown = this.onMouseDown.bind(this);
17  private readonly boundOnMouseMove = this.onMouseMove.bind(this);
18  private readonly boundOnMouseUp = this.onMouseUp.bind(this);
19  private clientRect?: DOMRect;
20
21  constructor(
22      private element: HTMLElement,
23      private onDrag: (x: number, y: number) => void,
24      private onDragStarted: (x: number, y: number) => void = () => {},
25      private onDragFinished = () => {}) {
26    element.addEventListener('mousedown', this.boundOnMouseDown);
27  }
28
29  private onMouseDown(e: MouseEvent) {
30    document.body.addEventListener('mousemove', this.boundOnMouseMove);
31    document.body.addEventListener('mouseup', this.boundOnMouseUp);
32    this.clientRect = this.element.getBoundingClientRect() as DOMRect;
33    this.onDragStarted(
34        e.clientX - this.clientRect.left, e.clientY - this.clientRect.top);
35
36    // Prevent interactions with other DragGestureHandlers and event listeners
37    e.stopPropagation();
38  }
39
40  private onMouseMove(e: MouseEvent) {
41    if (e.buttons === 0) {
42      return this.onMouseUp(e);
43    }
44    this.onDrag(
45        e.clientX - this.clientRect!.left, e.clientY - this.clientRect!.top);
46    e.stopPropagation();
47  }
48
49  private onMouseUp(e: MouseEvent) {
50    document.body.removeEventListener('mousemove', this.boundOnMouseMove);
51    document.body.removeEventListener('mouseup', this.boundOnMouseUp);
52    this.onDragFinished();
53    e.stopPropagation();
54  }
55}
56