| 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
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117 |
1×
1×
5×
5×
5×
5×
5×
1×
1×
5×
1×
1×
1×
1×
1×
1×
1×
1×
1×
2×
1×
1×
| import { hasPrimaryModifier } from '../../util/Mouse';
var HIGH_PRIORITY = 1500;
var HAND_CURSOR = 'grab';
export default function HandTool(eventBus, canvas, dragging, toolManager) {
this._dragging = dragging;
toolManager.registerTool('hand', {
tool: 'hand',
dragging: 'hand.move'
});
eventBus.on('element.mousedown', HIGH_PRIORITY, function(event) {
if (hasPrimaryModifier(event)) {
this.activateMove(event.originalEvent);
return false;
}
}, this);
eventBus.on('hand.end', function(event) {
var target = event.originalEvent.target;
// only reactive on diagram click
// on some occasions, event.hover is not set and we have to check if the target is an svg
if (!event.hover && !(target instanceof SVGElement)) {
return false;
}
eventBus.once('hand.ended', function() {
this.activateMove(event.originalEvent, { reactivate: true });
}, this);
}, this);
eventBus.on('hand.move.move', function(event) {
var scale = canvas.viewbox().scale;
canvas.scroll({
dx: event.dx * scale,
dy: event.dy * scale
});
});
eventBus.on('hand.move.end', function(event) {
var context = event.context,
reactivate = context.reactivate;
// Don't reactivate if the user is using the keyboard keybinding
Iif (!hasPrimaryModifier(event) && reactivate) {
eventBus.once('hand.move.ended', function(event) {
this.activateHand(event.originalEvent, true, true);
}, this);
}
return false;
}, this);
}
HandTool.$inject = [
'eventBus',
'canvas',
'dragging',
'toolManager'
];
HandTool.prototype.activateMove = function(event, autoActivate, context) {
Iif (typeof autoActivate === 'object') {
context = autoActivate;
autoActivate = false;
}
this._dragging.init(event, 'hand.move', {
autoActivate: autoActivate,
cursor: HAND_CURSOR,
data: {
context: context || {}
}
});
};
HandTool.prototype.activateHand = function(event, autoActivate, reactivate) {
this._dragging.init(event, 'hand', {
trapClick: false,
autoActivate: autoActivate,
cursor: HAND_CURSOR,
data: {
context: {
reactivate: reactivate
}
}
});
};
HandTool.prototype.toggle = function() {
if (this.isActive()) {
this._dragging.cancel();
} else {
this.activateHand();
}
};
HandTool.prototype.isActive = function() {
var context = this._dragging.context();
return context && /^hand/.test(context.prefix);
};
|