-
Notifications
You must be signed in to change notification settings - Fork 1
/
useDragDiffProvider.js
66 lines (50 loc) · 1.45 KB
/
useDragDiffProvider.js
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
57
58
59
60
61
62
63
64
65
66
import {ref} from './vue/vue.js';
const useDragDiffProvider = function (props, context) {
//----- Variables ------
const downPoint = { // Where the last mousedown was; only locally used in this function
x: null,
y: null
};
const diffToDownPoint = ref({ // Differences to last mousedown; ref so one can just replace .value
x: null,
y: null
});
const isDragging = ref(false);
// ----- Util -----
const utilPointDifference = function (point1, point2) {
return {
x: point2.x - point1.x,
y: point2.y - point1.y
};
};
// ----- Event handlers ------
const diffHandlerDown = function (event) {
isDragging.value = true;
downPoint.x = event.clientX;
downPoint.y = event.clientY;
};
const diffHandlerMove = function (event) {
if (isDragging.value === true) {
diffToDownPoint.value = utilPointDifference(
downPoint,
{
x: event.clientX,
y: event.clientY
}
);
}
};
const diffHandlerUp = function (event) {
diffToDownPoint.value = {x:0, y:0};
downPoint.value = {x:0, y:0};
isDragging.value = false;
};
return {
diffToDownPoint,
isDragging,
diffHandlerDown,
diffHandlerMove,
diffHandlerUp
};
};
export {useDragDiffProvider};