- commit
- 966838d1a8c55c7f01972211c0920b4d483d75c8
- parent
- 20553f7cb7354f1908314b4a41cfd0876ed07fb0
- Author
- Tobias Bengfort <tobias.bengfort@posteo.de>
- Date
- 2020-10-16 15:32
add on() event helper
Diffstat
| M | static/src/voterunner.js | 50 | ++++++++++++++++++++++++-------------------------- |
| M | static/test/test.js | 18 | +++++++++++------- |
2 files changed, 35 insertions, 33 deletions
diff --git a/static/src/voterunner.js b/static/src/voterunner.js
@@ -33,6 +33,15 @@ var throttle = function(fn, timeout) {
33 33 return result;
34 34 };
35 35
-1 36 var on = function(element, eventType, selector, fn) {
-1 37 element.addEventListener(eventType, function(event) {
-1 38 var target = event.target.closest(selector);
-1 39 if (target && element.contains(target)) {
-1 40 return fn.call(target, event);
-1 41 }
-1 42 });
-1 43 };
-1 44
36 45 var getVotes = function(nodes, node) {
37 46 if (!node.votes) {
38 47 node.votes = 1 + nodes
@@ -214,33 +223,25 @@ document.addEventListener('DOMContentLoaded', function() {
214 223 }
215 224 };
216 225
217 -1 var toggleExpand = function(event) {
218 -1 var nodeElement = event.target.parentElement.parentElement.parentElement;
-1 226 var update = initVDom(document.querySelector('#tree'), nodes, ID, function() {
-1 227 updateUser();
-1 228 });
-1 229
-1 230 on(document, 'click', '.node__expand', function() {
-1 231 var nodeElement = this.parentElement.parentElement.parentElement;
219 232 var id = nodeElement.id.substr(5);
220 233 var node = getNode(id);
221 234 node.expanded = !node.expanded;
222 235 update(nodes);
223 -1 };
-1 236 });
224 237
225 -1 var setDelegate = function(event) {
226 -1 var nodeElement = event.target.parentElement.parentElement.parentElement;
-1 238 on(document, 'click', '.node__delegate', function() {
-1 239 var nodeElement = this.parentElement.parentElement.parentElement;
227 240 var id = nodeElement.id.substr(5);
228 241 socket.emit('setDelegate', id);
229 -1 };
230 -1
231 -1 var update = initVDom(document.querySelector('#tree'), nodes, ID, function() {
232 -1 updateUser();
233 -1
234 -1 document.querySelectorAll('.node__expand').forEach(function(element) {
235 -1 element.addEventListener('click', toggleExpand);
236 -1 });
237 -1
238 -1 document.querySelectorAll('.node__delegate').forEach(function(element) {
239 -1 element.addEventListener('click', setDelegate);
240 -1 });
241 242 });
242 243
243 -1 document.querySelector('.user__rm').addEventListener('click', function(event) {
-1 244 on(document, 'click', '.user__rm', function() {
244 245 if (confirm(_('Do you really want to delete this opinion?'))) {
245 246 socket.emit('rmNode');
246 247 document.querySelector('.user__name input').value = '';
@@ -248,15 +249,15 @@ document.addEventListener('DOMContentLoaded', function() {
248 249 }
249 250 });
250 251
251 -1 document.querySelector('.user__name input').addEventListener('change', function(event) {
252 -1 socket.emit('setNodeName', event.target.value);
-1 252 on(document, 'change', '.user__name input', function() {
-1 253 socket.emit('setNodeName', this.value);
253 254 });
254 255
255 -1 document.querySelector('.user__undelegate').addEventListener('click', function(event) {
-1 256 on(document, 'click', '.user__undelegate', function() {
256 257 socket.emit('rmDelegate');
257 258 });
258 259
259 -1 var pushComment = throttle(function() {
-1 260 on(document, 'input', '.user__comment textarea', throttle(function() {
260 261 var comment = document.querySelector('.user__comment textarea').value;
261 262 var node = nodes.find(n => n.id === ID);
262 263 // Do not create a new node if the comment is empty.
@@ -264,10 +265,7 @@ document.addEventListener('DOMContentLoaded', function() {
264 265 if (node || comment) {
265 266 socket.emit('setNodeComment', comment);
266 267 }
267 -1 }, 1000);
268 -1
269 -1 document.querySelector('.user__comment textarea').addEventListener('change', pushComment);
270 -1 document.querySelector('.user__comment textarea').addEventListener('keydown', pushComment);
-1 268 }, 1000));
271 269
272 270 socket.on('rmNode', function(id) {
273 271 nodes = nodes.filter(function(node) {
diff --git a/static/test/test.js b/static/test/test.js
@@ -3,6 +3,10 @@ 3 3 var TIMEOUT = 400; 4 4 var ID = 'testID'; 5 5 -1 6 var trigger = function(target, type) { -1 7 target.dispatchEvent(new Event(type, {bubbles: true})); -1 8 }; -1 9 6 10 var setUp = function(url, fn) { 7 11 var iframe = document.createElement('iframe'); 8 12 iframe.onload = function() {fn(iframe)}; @@ -65,7 +69,7 @@ describe('setName', function() { 65 69 66 70 userName = d.querySelector('.user__name input'); 67 71 userName.value = name;68 -1 userName.dispatchEvent(new Event('change'));-1 72 trigger(userName, 'change'); 69 73 70 74 setTimeout(done, TIMEOUT); 71 75 }); @@ -118,7 +122,7 @@ describe('setComment', function() { 118 122 119 123 userComment = d.querySelector('.user__comment textarea'); 120 124 userComment.value = comment;121 -1 userComment.dispatchEvent(new Event('change'));-1 125 trigger(userComment, 'input'); 122 126 123 127 setTimeout(done, TIMEOUT); 124 128 }); @@ -140,7 +144,7 @@ describe('setComment', function() { 140 144 it('should set node comment', function() { 141 145 node = d.getElementById('node-' + ID); 142 146 nodeExpand = node.querySelector('.node__expand');143 -1 nodeExpand.dispatchEvent(new Event('click'));-1 147 trigger(nodeExpand, 'click'); 144 148 nodeComment = node.querySelector('.node__comment').textContent.trim(); 145 149 expect(nodeComment).to.equal(comment); 146 150 }); @@ -153,7 +157,7 @@ describe('setComment', function() { 153 157 154 158 node = d.getElementById('node-' + ID); 155 159 nodeExpand = node.querySelector('.node__expand');156 -1 nodeExpand.dispatchEvent(new Event('click'));-1 160 trigger(nodeExpand, 'click'); 157 161 nodeComment = node.querySelector('.node__comment').textContent.trim(); 158 162 expect(nodeComment).to.equal(comment); 159 163 @@ -184,13 +188,13 @@ describe('remove', function() { 184 188 // create something to delete 185 189 userName = d.querySelector('.user__name input'); 186 190 userName.value = 'testName';187 -1 userName.dispatchEvent(new Event('change'));-1 191 trigger(userName, 'change'); 188 192 userComment = d.querySelector('.user__comment textarea'); 189 193 userComment.value = 'testComment';190 -1 userComment.dispatchEvent(new Event('change'));-1 194 trigger(userComment, 'input'); 191 195 192 196 userRemove = d.querySelector('.user__rm');193 -1 userRemove.dispatchEvent(new Event('click'));-1 197 trigger(userRemove, 'click'); 194 198 195 199 setTimeout(done, TIMEOUT); 196 200 });