1 | require('./Activator.css');
|
2 |
|
3 | var keycharm = require('keycharm');
|
4 | var Emitter = require('component-emitter');
|
5 | var Hammer = require('../module/hammer');
|
6 | var util = require('vis-util');
|
7 |
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 | function Activator(container) {
|
19 | this.active = false;
|
20 |
|
21 | this.dom = {
|
22 | container: container
|
23 | };
|
24 |
|
25 | this.dom.overlay = document.createElement('div');
|
26 | this.dom.overlay.className = 'vis-overlay';
|
27 |
|
28 | this.dom.container.appendChild(this.dom.overlay);
|
29 |
|
30 | this.hammer = Hammer(this.dom.overlay);
|
31 | this.hammer.on('tap', this._onTapOverlay.bind(this));
|
32 |
|
33 |
|
34 | var me = this;
|
35 | var events = [
|
36 | 'tap', 'doubletap', 'press',
|
37 | 'pinch',
|
38 | 'pan', 'panstart', 'panmove', 'panend'
|
39 | ];
|
40 | events.forEach(function (event) {
|
41 | me.hammer.on(event, function (event) {
|
42 | event.stopPropagation();
|
43 | });
|
44 | });
|
45 |
|
46 |
|
47 | if (document && document.body) {
|
48 | this.onClick = function (event) {
|
49 | if (!_hasParent(event.target, container)) {
|
50 | me.deactivate();
|
51 | }
|
52 | };
|
53 | document.body.addEventListener('click', this.onClick);
|
54 | }
|
55 |
|
56 | if (this.keycharm !== undefined) {
|
57 | this.keycharm.destroy();
|
58 | }
|
59 | this.keycharm = keycharm();
|
60 |
|
61 |
|
62 | this.escListener = this.deactivate.bind(this);
|
63 | }
|
64 |
|
65 |
|
66 | Emitter(Activator.prototype);
|
67 |
|
68 |
|
69 | Activator.current = null;
|
70 |
|
71 |
|
72 |
|
73 |
|
74 | Activator.prototype.destroy = function () {
|
75 | this.deactivate();
|
76 |
|
77 |
|
78 | this.dom.overlay.parentNode.removeChild(this.dom.overlay);
|
79 |
|
80 |
|
81 | if (this.onClick) {
|
82 | document.body.removeEventListener('click', this.onClick);
|
83 | }
|
84 |
|
85 | if (this.keycharm !== undefined) {
|
86 | this.keycharm.destroy();
|
87 | }
|
88 | this.keycharm = null;
|
89 |
|
90 | this.hammer.destroy();
|
91 | this.hammer = null;
|
92 |
|
93 | };
|
94 |
|
95 |
|
96 |
|
97 |
|
98 |
|
99 | Activator.prototype.activate = function () {
|
100 |
|
101 | if (Activator.current) {
|
102 | Activator.current.deactivate();
|
103 | }
|
104 | Activator.current = this;
|
105 |
|
106 | this.active = true;
|
107 | this.dom.overlay.style.display = 'none';
|
108 | util.addClassName(this.dom.container, 'vis-active');
|
109 |
|
110 | this.emit('change');
|
111 | this.emit('activate');
|
112 |
|
113 |
|
114 |
|
115 | this.keycharm.bind('esc', this.escListener);
|
116 | };
|
117 |
|
118 |
|
119 |
|
120 |
|
121 |
|
122 | Activator.prototype.deactivate = function () {
|
123 | this.active = false;
|
124 | this.dom.overlay.style.display = '';
|
125 | util.removeClassName(this.dom.container, 'vis-active');
|
126 | this.keycharm.unbind('esc', this.escListener);
|
127 |
|
128 | this.emit('change');
|
129 | this.emit('deactivate');
|
130 | };
|
131 |
|
132 |
|
133 |
|
134 |
|
135 |
|
136 |
|
137 | Activator.prototype._onTapOverlay = function (event) {
|
138 |
|
139 | this.activate();
|
140 | event.stopPropagation();
|
141 | };
|
142 |
|
143 |
|
144 |
|
145 |
|
146 |
|
147 |
|
148 |
|
149 |
|
150 |
|
151 |
|
152 | function _hasParent(element, parent) {
|
153 | while (element) {
|
154 | if (element === parent) {
|
155 | return true
|
156 | }
|
157 | element = element.parentNode;
|
158 | }
|
159 | return false;
|
160 | }
|
161 |
|
162 | module.exports = Activator;
|