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
|
// ### Manage events on elements
// rect.click(function() {
// this.fill({ color: '#f06' });
// });
[ 'click',
'dblclick',
'mousedown',
'mouseup',
'mouseover',
'mouseout',
'mousemove',
'touchstart',
'touchend',
'touchmove',
'touchcancel' ].forEach(function(event) {
/* add event to SVG.Element */
SVG.Element.prototype[event] = function(f) {
var self = this;
/* bind event to element rather than element node */
this.node['on' + event] = function() {
return f.apply(self, arguments);
};
return this;
};
});
// Add event binder in the SVG namespace
SVG.on = function(node, event, listener) {
if (node.addEventListener)
node.addEventListener(event, listener, false);
else
node.attachEvent('on' + event, listener);
};
// Add event unbinder in the SVG namespace
SVG.off = function(node, event, listener) {
if (node.removeEventListener)
node.removeEventListener(event, listener, false);
else
node.detachEvent('on' + event, listener);
};
//
SVG.extend(SVG.Element, {
// Bind given event to listener
on: function(event, listener) {
SVG.on(this.node, event, listener);
return this;
},
// Unbind event from listener
off: function(event, listener) {
SVG.off(this.node, event, listener);
return this;
}
});
|
