-
Notifications
You must be signed in to change notification settings - Fork 0
/
fixed.ts
56 lines (48 loc) · 1.7 KB
/
fixed.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
import throttle from 'lodash.throttle';
import Dragging from './dragging';
import {insertShape, shiftBy, getCords, findPolygon, getDist} from '../lib';
import {Optional, IDragging} from '../types';
class Fixed extends Dragging {
protected pending: Optional<IDragging> = null;
constructor(id, initDoc) {
super(id, initDoc);
}
protected bindEvents() {
super.bindEvents();
const handleMouseMove = throttle(e => {
this.handleMouseMove(getCords(e, this.canvas));
return false;
}, 16);
this.canvas.addEventListener('mousemove', handleMouseMove);
}
protected handleMouseDown(cords) {
const shape = findPolygon(this.doc, cords);
if (shape) {
this.pending = { // pending'setting get discarded;
shape,
startPos: cords
};
}
return null;
}
protected handleMouseMove(cords) {
if (this.pending === null) {
return null;
}
const dist = getDist(cords.x, cords.y, this.pending.startPos.x, this.pending.startPos.y);
if (this.pending === null || dist <= 5) {//Potential source of bugs: explicit state check
return null;
}
this.dragging = this.pending; // two property get the same reference!
const dx = cords.x - this.dragging.startPos.x;
const dy = cords.y - this.dragging.startPos.y;
this.doc = insertShape(this.doc, shiftBy(this.dragging.shape, dx, dy));
return null;
}
protected handleMouseUp(cords) {
super.handleMouseUp(cords);
this.pending = null; // pending'setting get discarded;
return null;
}
}
export default Fixed;