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
118
119
120
121
122
123
124
125
126
127
128
129
|
/*
usage:
base.mouse = new mouse({
el: document.querySelector("#map"),
down: function(e, cursor){
// do something with val
// cursor.x.a
// cursor.y.a
},
move: function(e, cursor, delta){
// delta.a (x)
// delta.b (y)
},
up: function(e, cursor, new_cursor){
// cursor.x.a
// cursor.y.a
},
})
*/
function mouse (opt) {
var base = this
opt = defaults(opt, {
el: document,
down: null,
move: null,
drag: null,
up: null,
rightclick: null,
propagate: false,
locked: false,
val: 0,
})
base.down = false
base.creating = false
base.dragging = false
base.cursor = new Rect(0,0,0,0)
base.tube = new Tube ()
opt.down && base.tube.on("down", opt.down)
opt.move && base.tube.on("move", opt.move)
opt.drag && base.tube.on("drag", opt.drag)
opt.up && base.tube.on("up", opt.up)
opt.rightclick && base.tube.on("rightclick", opt.rightclick)
var offset = opt.el.getBoundingClientRect()
base.init = function (){
base.bind()
}
base.bind = function(){
opt.el.addEventListener("mousedown", base.mousedown)
window.addEventListener("mousemove", base.mousemove)
window.addEventListener("mouseup", base.mouseup)
opt.el.addEventListener("contextmenu", base.contextmenu)
}
function positionFromMouse(e) {
var mx = offset.left - e.pageX
var my = e.pageY - offset.top
return new vec2(mx, my)
}
base.mousedown = function(e){
e.stopPropagation()
offset = opt.el.getBoundingClientRect()
var pos = positionFromMouse(e)
var x = pos.a, y = pos.b
base.cursor = new Rect (x,y, x,y)
base.down = true
base.tube("down", e, base.cursor)
}
base.mousemove = function(e){
e.stopPropagation()
if (! offset) return;
var pos = positionFromMouse(e)
if (e.shiftKey) {
pos.quantize(10)
}
var x = pos.a, y = pos.b
if (base.down) {
base.cursor.x.b = x
base.cursor.y.b = y
base.tube("drag", e, base.cursor)
}
else {
base.cursor.x.a = base.cursor.x.b = x
base.cursor.y.a = base.cursor.y.b = y
base.tube("move", e, base.cursor)
}
}
base.mouseup = function(e){
e.stopPropagation()
var pos, new_cursor
if (base.down) {
base.down = false
pos = positionFromMouse(e)
new_cursor = new Rect (pos.a, pos.b)
base.tube("up", e, base.cursor, new_cursor)
base.cursor = new_cursor
}
}
base.contextmenu = function(e){
e.preventDefault()
base.tube("rightclick", e, base.cursor)
}
base.init()
}
|
