Completed
Pull Request — master (#125)
by Blizzz
02:20
created

nav.initElementsAddMemberNavigation   A

Complexity

Conditions 2
Paths 2

Size

Total Lines 9

Duplication

Lines 0
Ratio 0 %

Importance

Changes 1
Bugs 1 Features 1
Metric Value
cc 2
c 1
b 1
f 1
nc 2
nop 0
dl 0
loc 9
rs 9.6666
1
/*
2
 * Circles - Bring cloud-users closer together.
3
 *
4
 * This file is licensed under the Affero General Public License version 3 or
5
 * later. See the COPYING file.
6
 *
7
 * @author Maxence Lange <[email protected]>
8
 * @copyright 2017
9
 * @license GNU AGPL version 3 or any later version
10
 *
11
 * This program is free software: you can redistribute it and/or modify
12
 * it under the terms of the GNU Affero General Public License as
13
 * published by the Free Software Foundation, either version 3 of the
14
 * License, or (at your option) any later version.
15
 *
16
 * This program is distributed in the hope that it will be useful,
17
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
18
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
19
 * GNU Affero General Public License for more details.
20
 *
21
 * You should have received a copy of the GNU Affero General Public License
22
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
23
 *
24
 */
25
26
/** global: OC */
27
/** global: OCA */
28
/** global: Notyf */
29
30
/** global: actions */
31
/** global: nav */
32
/** global: elements */
33
/** global: settings */
34
/** global: resultCircles */
35
/** global: resultMembers */
36
/** global: resultGroups */
37
/** global: resultLinks */
38
/** global: curr */
39
/** global: api */
40
/** global: define */
41
42
var nav = {
43
44
	initNavigation: function () {
45
		this.initElementsAddMemberNavigation();
46
		this.initElementsLinkCircleNavigation();
47
		this.initElementsCircleNavigation();
48
49
		this.displayCirclesList('all');
50
	},
51
52
53
	initElementsAddMemberNavigation: function () {
54
55
		elements.addMember.hide();
56
		elements.addMember.on('input propertychange paste focus', function () {
57
			var search = $(this).val().trim();
58
			if (search === '') {
59
				elements.membersSearchResult.fadeOut(curr.animationMenuSpeed);
60
				return;
61
			}
62
63
			if(!_.isUndefined(elements.searchTimeoutID)) {
0 ignored issues
show
Bug introduced by
The variable _ seems to be never declared. If this is a global, consider adding a /** global: _ */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
64
				clearTimeout(elements.searchTimeoutID);
65
			}
66
			elements.searchTimeoutID = _.delay(function () {
67
				actions.searchMembersRequest(search);
68
				if (elements.membersSearchResult.children().length === 0) {
69
					elements.membersSearchResult.fadeOut(curr.animationMenuSpeed);
70
				} else {
71
					elements.membersSearchResult.fadeIn(curr.animationMenuSpeed);
72
73
				}
74
			}, 500);
75
		}).blur(function () {
76
			setTimeout(function () {
77
				elements.membersSearchResult.fadeOut(curr.animationMenuSpeed);
78
				nav.circlesActionReturn();
79
			}, 100);
80
		});
81
		elements.addMember.on('keydown', function (e) {
82
			if (e.keyCode === 27) {
83
				nav.circlesActionReturn();
84
			}
85
			if (e.keyCode === 13) {
86
87
				if (curr.exactMemberSearchType === 'group') {
88
89
					OC.dialogs.confirm(
90
						t('circles',
91
							'This operation will add/invite all members of the group to the circle'),
92
						t('circles', 'Please confirm'),
93
						function (e) {
94
							if (e === true) {
95
								api.addMember(curr.circle, elements.addMember.val(), define.typeGroup,
96
									resultMembers.addMemberResult);
97
							}
98
						});
99
				} else {
100
					if (actions.validateEmail(elements.addMember.val())) {
101
						api.addMember(curr.circle, elements.addMember.val(), define.typeMail,
102
							resultMembers.addMemberResult);
103
					} else {
104
						api.addMember(curr.circle, elements.addMember.val(), define.typeUser,
105
							resultMembers.addMemberResult);
106
					}
107
				}
108
			}
109
		});
110
111
112
		elements.linkGroup.on('input propertychange paste focus', function () {
113
			var search = $(this).val().trim();
114
			if (search === '') {
115
				elements.groupsSearchResult.fadeOut(curr.animationMenuSpeed);
116
				return;
117
			}
118
119
			actions.searchGroupsRequest(search);
120
			if (elements.groupsSearchResult.children().length === 0) {
121
				elements.groupsSearchResult.fadeOut(curr.animationMenuSpeed);
122
			} else {
123
				elements.groupsSearchResult.fadeIn(curr.animationMenuSpeed);
124
			}
125
		}).blur(function () {
126
			setTimeout(function () {
127
				elements.groupsSearchResult.fadeOut(curr.animationMenuSpeed);
128
				nav.circlesActionReturn();
129
			}, 100);
130
		});
131
		elements.linkGroup.on('keydown', function (e) {
132
			if (e.keyCode === 27) {
133
				nav.circlesActionReturn();
134
			}
135
			if (e.keyCode === 13) {
136
				api.linkGroup(curr.circle, $(this).val(), resultGroups.linkGroupResult);
137
			}
138
		});
139
	},
140
141
142
	initElementsLinkCircleNavigation: function () {
143
144
		elements.linkCircle.hide();
145
		elements.linkCircle.on('keydown', function (e) {
146
147
			if (e.keyCode === 27) {
148
				nav.circlesActionReturn();
149
			}
150
			if (e.keyCode !== 13) {
151
				return;
152
			}
153
154
			api.linkCircle(curr.circle, elements.linkCircle.val().trim(),
155
				resultLinks.linkCircleResult);
156
		}).blur(function () {
157
			nav.circlesActionReturn();
158
		});
159
	},
160
161
162
	initElementsCircleNavigation: function () {
163
164
		elements.joinCircle.hide();
165
		elements.joinCircle.on('click', function () {
166
			api.joinCircle(curr.circle, resultCircles.joinCircleResult);
167
			nav.circlesActionReturn();
168
		});
169
170
		elements.leaveCircle.hide();
171
		elements.leaveCircle.on('click', function () {
172
			OC.dialogs.confirm(
173
				t('circles', 'Are you sure you want to leave this circle?'),
174
				t('circles', 'Please confirm'),
175
				function (e) {
176
					if (e === true) {
177
						api.leaveCircle(curr.circle, resultCircles.leaveCircleResult);
178
						nav.circlesActionReturn();
179
					}
180
				});
181
		});
182
183
		elements.destroyCircle.on('click', function () {
184
			OC.dialogs.confirm(
185
				t('circles', 'Are you sure you want to delete this circle?'),
186
				t('circles', 'This action is irreversible'),
187
				function (e) {
188
					if (e === true) {
189
						api.destroyCircle(curr.circle, resultCircles.destroyCircleResult);
190
					}
191
				});
192
		});
193
194
		elements.joinCircleAccept.on('click', function () {
195
			api.joinCircle(curr.circle, resultCircles.joinCircleResult);
196
		});
197
198
		elements.joinCircleReject.on('click', function () {
199
			api.leaveCircle(curr.circle, resultCircles.leaveCircleResult);
200
		});
201
	},
202
203
204
	displayCirclesList: function (type) {
205
206
		curr.circlesType = type;
207
		curr.searchCircle = '';
208
		curr.searchUser = '';
209
210
		curr.circle = 0;
211
		curr.circleLevel = 0;
212
213
		elements.navigation.show('slide', 800);
214
		elements.emptyContent.show(800);
215
		elements.mainUI.fadeOut(800);
216
217
		elements.circlesSearch.val('');
218
		elements.addMember.val('');
219
		elements.linkCircle.val('');
220
221
		this.resetCirclesTypeSelection(type);
222
		elements.resetCirclesList();
223
		api.listCircles(type, '', curr.searchFilter, resultCircles.listCirclesResult);
224
	},
225
226
227
	resetCirclesTypeSelection: function (type) {
228
		elements.circlesList.children('div').removeClass('selected');
229
		elements.circlesList.children().each(function () {
230
			if ($(this).attr('circle-type') === type.toLowerCase()) {
231
				$(this).addClass('selected');
232
			}
233
		});
234
	},
235
236
	circlesActionReturn: function () {
237
		nav.displayCircleButtons(true);
238
		settings.displaySettings(false);
239
		nav.displayAddMemberInput(false);
240
		nav.displayLinkGroupInput(false);
241
		nav.displayLinkCircleInput(false);
242
		nav.displayJoinCircleButton(false);
243
		nav.displayInviteCircleButtons(false);
244
	},
245
246
	joinCircleAction: function () {
247
		nav.displayCircleButtons(false);
248
		nav.displayAddMemberInput(false);
249
		nav.displayLinkCircleInput(false);
250
		nav.displayLinkGroupInput(false);
251
		nav.displayJoinCircleButton(true);
252
	},
253
254
	displayCircleButtons: function (display) {
255
		if (display) {
256
			elements.buttonCircleActionReturn.hide(define.animationMenuSpeed);
257
			elements.buttonCircleActions.delay(define.animationMenuSpeed).show(
258
				define.animationMenuSpeed);
259
		} else {
260
			elements.buttonCircleActions.hide(define.animationMenuSpeed);
261
			elements.buttonCircleActionReturn.delay(define.animationMenuSpeed).show(
262
				define.animationMenuSpeed);
263
		}
264
	},
265
266
	displayAddMemberInput: function (display) {
267
		if (display) {
268
			elements.addMember.val('');
269
			elements.addMember.delay(define.animationMenuSpeed).show(define.animationMenuSpeed,
270
				function () {
271
					$(this).focus();
272
				});
273
		} else {
274
			elements.addMember.hide(define.animationMenuSpeed);
275
		}
276
	},
277
278
	displayLinkGroupInput: function (display) {
279
		if (display) {
280
			elements.linkGroup.val('');
281
			elements.linkGroup.delay(define.animationMenuSpeed).show(define.animationMenuSpeed,
282
				function () {
283
					$(this).focus();
284
				});
285
		} else {
286
			elements.linkGroup.hide(define.animationMenuSpeed);
287
		}
288
	},
289
290
	displayLinkCircleInput: function (display) {
291
		if (display) {
292
			elements.linkCircle.val('');
293
			elements.linkCircle.delay(define.animationMenuSpeed).show(define.animationMenuSpeed,
294
				function () {
295
					$(this).focus();
296
				});
297
		} else {
298
			elements.linkCircle.hide(define.animationMenuSpeed);
299
		}
300
	},
301
302
303
	displayInviteCircleButtons: function (display) {
304
		if (display) {
305
			elements.joinCircleAccept.show(define.animationMenuSpeed);
306
			elements.joinCircleReject.delay(define.animationMenuSpeed).show(
307
				define.animationMenuSpeed);
308
		} else {
309
			elements.joinCircleAccept.hide(define.animationMenuSpeed);
310
			elements.joinCircleReject.hide(define.animationMenuSpeed);
311
		}
312
	},
313
314
	displayJoinCircleButton: function (display) {
315
		if (display) {
316
			if (curr.circleStatus === 'Invited') {
317
				elements.joinCircle.hide(define.animationMenuSpeed);
318
				elements.leaveCircle.hide(define.animationMenuSpeed);
319
				nav.displayInviteCircleButtons(true);
320
321
			} else {
322
				nav.displayInviteCircleButtons(false);
323
324
				if (curr.circleDetails.user.level === 0 && curr.circleStatus !== 'Requesting') {
325
					elements.joinCircle.delay(define.animationMenuSpeed).show(
326
						define.animationMenuSpeed);
327
					elements.leaveCircle.hide(define.animationMenuSpeed);
328
					elements.joinCircleAccept.hide(define.animationMenuSpeed);
329
					elements.joinCircleReject.hide(define.animationMenuSpeed);
330
331
				}
332
				else {
333
					elements.leaveCircle.delay(define.animationMenuSpeed).show(
334
						define.animationMenuSpeed);
335
					elements.joinCircle.hide(define.animationMenuSpeed);
336
				}
337
			}
338
		} else {
339
			elements.joinCircle.hide(define.animationMenuSpeed);
340
			elements.leaveCircle.hide(define.animationMenuSpeed);
341
		}
342
	},
343
344
345
	/**
346
	 *
347
	 * @param display
348
	 */
349
	displayOptionsNewCircle: function (display) {
350
		if (display) {
351
			elements.newType.fadeIn(300);
352
			elements.newSubmit.fadeIn(500);
353
			elements.newTypeDefinition.fadeIn(700);
354
		}
355
		else {
356
			elements.newType.fadeOut(700);
357
			elements.newSubmit.fadeOut(500);
358
			elements.newTypeDefinition.fadeOut(300);
359
		}
360
	},
361
362
363
	displayMembers: function (members) {
364
		if (members === '') {
365
			members = curr.circleMembers;
366
		} else {
367
			curr.circleMembers = members;
368
		}
369
370
		elements.mainUIMembersTable.emptyTable();
371
		if (members === null) {
372
			elements.mainUIMembersTable.hide(200);
373
			return;
374
		}
375
376
		elements.mainUIMembersTable.show(200);
377
		for (var i = 0; i < members.length; i++) {
378
			var tmpl = elements.generateTmplMember(members[i]);
379
			elements.mainUIMembersTable.append(tmpl);
380
		}
381
382
		for (i = 0; i < 10; i++) {
383
			if (curr.circleLevel < 9 && curr.circleLevel <= i
384
				|| curr.circleDetails.type === define.typePersonal) {
0 ignored issues
show
Bug introduced by
There seems to be a bad line break before ||.
Loading history...
385
				$('.level-select option[value="' + i + '"]').attr('disabled', 'disabled');
386
			}
387
		}
388
389
390
		elements.mainUIMembersTable.children('tr.entry').each(function () {
391
392
				var userId = $(this).attr('member-id');
393
				var userType = Number($(this).attr('member-type'));
394
395
				if (userId === curr.userId && userType === define.typeUser) {
396
					$(this).find('td.username').css('font-weight', 'bold').css('font-style', 'italic');
397
					$(this).css('background', '#e0e0e0');
398
				} else {
399
					$(this).css('background', '#fff');
400
				}
401
402
				//
403
				// level
404
				if (curr.circleDetails.type === define.typePersonal) {
405
					var levelString = $(this).attr('member-levelString');
406
					$(this).find('.level').text(levelString);
407
				} else {
408
					var level = Number($(this).attr('member-level'));
409
					var levelSelect = $(this).find('.level-select');
410
					if (level === 0) {
411
						levelSelect.hide();
412
					}
413
					else {
414
						levelSelect.show(200).val(level);
415
					}
416
					levelSelect.on('change', function () {
417
						actions.changeMemberLevel(userId, userType, $(this).val());
418
					});
419
				}
420
421
				//
422
				// status
423
				var status = $(this).attr('member-status');
424
				var statusSelect = $(this).find('.status-select');
425
426
				statusSelect.on('change', function () {
427
					actions.changeMemberStatus(userId, userType, $(this).val());
428
				});
429
				if (userType === define.typeUser) {
430
					statusSelect.append($('<option>', {
431
						value: status,
432
						text: t('circles', status)
433
					})).val(status);
434
				}
435
436
				if (userType === define.typeMail) {
437
					statusSelect.append($('<option>', {
438
						value: status,
439
						text: t('circles', 'Mail Address')
440
					})).val(status);
441
				}
442
443
				if (userType === define.typeContact) {
444
					statusSelect.append($('<option>', {
445
						value: status,
446
						text: t('circles', 'Contact')
447
					})).val(status);
448
				}
449
450
				if (curr.circleLevel <= $(this).attr('member-level')) {
451
					return;
452
				}
453
454
				if (status === 'Member' || status === 'Invited') {
455
					statusSelect.append($('<option>', {
456
						value: 'remove_member',
457
						text: t('circles', 'Kick this member')
458
					}));
459
				}
460
461
				if (status === 'Requesting') {
462
					statusSelect.append($('<option>', {
463
						value: 'accept_request',
464
						text: t('circles', 'Accept the request')
465
					}));
466
					statusSelect.append($('<option>', {
467
						value: 'dismiss_request',
468
						text: t('circles', 'Dismiss the request')
469
					}));
470
				}
471
472
			}
473
		);
474
	},
475
476
477
	displayGroups: function (groups) {
478
		if (groups === '') {
479
			groups = curr.circleGroups;
480
		} else {
481
			curr.circleGroups = groups;
482
		}
483
484
		if (groups === null || groups.length === 0) {
485
			elements.mainUIGroupsTable.hide(curr.animationSpeed);
486
			return;
487
		}
488
489
		elements.mainUIGroupsTable.emptyTable();
490
		elements.mainUIGroupsTable.show(200);
491
		for (var i = 0; i < groups.length; i++) {
492
			var tmpl = elements.generateTmplGroup(groups[i]);
493
			elements.mainUIGroupsTable.append(tmpl);
494
		}
495
496
		for (i = 0; i < 10; i++) {
497
			if (curr.circleLevel < 9 && curr.circleLevel <= i) {
498
				$('.level-select option[value="' + i + '"]').attr('disabled', 'disabled');
499
			}
500
			if (i > define.levelMember && curr.circleDetails.type === define.typePersonal) {
501
				$('.level-select option[value="' + i + '"]').remove();
502
			}
503
		}
504
505
		elements.mainUIGroupsTable.children('tr.entry').each(function () {
506
507
				var groupId = $(this).attr('group-id');
508
				if (curr.circleDetails.group !== null &&
509
					groupId === curr.circleDetails.group.user_id) {
510
					$(this).find('td.username').css('font-weight', 'bold').css('font-style', 'italic');
511
					$(this).css('background', '#e0e0e0');
512
				} else {
513
					$(this).css('background', '#fff');
514
				}
515
516
				var level = Number($(this).attr('group-level'));
517
				var levelSelect = $(this).find('.level-select');
518
				if (level === 0) {
519
					levelSelect.hide();
520
				}
521
				else {
522
					levelSelect.show(200).val(level);
523
				}
524
				levelSelect.append($('<option>', {
525
					value: 'remove_group',
526
					text: t('circles', 'Unlink this group')
527
				}));
528
529
				levelSelect.on('change', function () {
530
					actions.changeGroupLevel(groupId, $(this).val());
531
				});
532
			}
533
		);
534
	},
535
536
537
	displayLinks: function (links) {
538
539
		if (links === '') {
540
			links = curr.circleLinks;
541
		} else {
542
			curr.circleLinks = links;
543
		}
544
545
		elements.mainUILinksTable.hide(curr.animationSpeed);
546
		elements.mainUILinksTable.emptyTable();
547
		if (links === null || links.length === 0) {
548
			return;
549
		}
550
551
		elements.mainUILinksTable.show(curr.animationSpeed);
552
		for (var i = 0; i < links.length; i++) {
553
			var tmpl = elements.generateTmplLink(links[i]);
554
			elements.mainUILinksTable.append(tmpl);
555
		}
556
557
558
		elements.mainUILinksTable.children('tr.entry').each(function () {
559
560
			var linkId = $(this).attr('link-id');
561
			var status = parseInt($(this).attr('link-status'));
562
563
			var statusSelect = $(this).find('.link-status-select');
564
565
			statusSelect.on('change', function () {
566
				actions.changeLinkStatus(linkId, $(this).val());
567
			});
568
			statusSelect.append($('<option>', {
569
				value: status,
570
				text: define.linkStatus(status)
571
			})).val(status);
572
573
			if (curr.circleLevel < define.levelAdmin) {
574
				return;
575
			}
576
577
			if (status === define.linkSetup || status === define.linkRefused ||
578
				status === define.linkUp || status === define.linkDown) {
579
				statusSelect.append($('<option>', {
580
					value: define.linkRemove,
581
					text: t('circles', 'Remove this link')
582
				}));
583
			}
584
585
			if (status === define.linkRequestSent) {
586
				statusSelect.append($('<option>', {
587
					value: define.linkRemove,
588
					text: t('circles', 'Cancel the link request')
589
				}));
590
			}
591
592
			if (status === define.linkRequested) {
593
				statusSelect.append($('<option>', {
594
					value: define.linkUp,
595
					text: t('circles', 'Accept the link request')
596
				}));
597
				statusSelect.append($('<option>', {
598
					value: define.linkRemove,
599
					text: t('circles', 'Reject the link request')
600
				}));
601
			}
602
		});
603
	},
604
605
606
	displayCircleDetails: function (details) {
607
		elements.circleDetails.children('#name').text(details.name);
608
		elements.circleDesc.text(details.description);
609
610
		elements.circleDetails.children('#type').text(t('circles', details.type_long_string));
611
		if (details.description !== '') {
612
			elements.circleDesc.html(
613
				escapeHTML(details.description).replace(/\n/g, '&nbsp;<br />')).show(
614
				define.animationSpeed);
615
		}
616
		else {
617
			elements.circleDesc.text('').hide(define.animationSpeed);
618
		}
619
620
		elements.buttonCircleActions.show(300);
621
		elements.addMember.hide(300);
622
	},
623
624
625
	displayMembersInteraction: function (details) {
626
		if (details.viewer.level < define.levelModerator) {
627
			elements.buttonAddMember.hide();
628
		} else {
629
			elements.buttonAddMember.show();
630
		}
631
632
		nav.displayMemberInteractionCircleLinks(details);
633
		nav.displayMemberInteractionGroupLinks(details);
634
635
		elements.joinCircleInteraction.hide();
636
		elements.buttonJoinCircle.show();
637
638
		this.displayNonMemberInteraction(details);
639
640
		if (details.viewer.level === define.levelOwner) {
641
			elements.destroyCircle.show();
642
			elements.buttonCircleSettings.show();
643
			elements.buttonJoinCircle.hide();
644
		}
645
	},
646
647
648
	displayMemberInteractionGroupLinks: function (details) {
649
		if (curr.allowed_linked_groups === '0' ||
650
			details.viewer.level < define.levelAdmin
651
		) {
652
			elements.buttonLinkGroup.hide();
653
		}
654
		else {
655
			elements.buttonLinkGroup.show();
656
		}
657
	},
658
659
660
	displayMemberInteractionCircleLinks: function (details) {
661
		if (curr.allowed_federated_circles === '0' ||
662
			curr.circleSettings['allow_links'] !== 'true' ||
0 ignored issues
show
Coding Style introduced by
['allow_links'] could be written in dot notation.

You can rewrite this statement in dot notation:

var obj = { };
obj['foo'] = 'bar'; // Bad
obj.foo = 'bar'; // Good
Loading history...
663
			details.type === define.typePersonal ||
664
			details.viewer.level < define.levelAdmin
665
		) {
666
			elements.buttonLinkCircle.hide();
667
		}
668
		else {
669
			elements.buttonLinkCircle.show();
670
		}
671
	},
672
673
674
	displayNonMemberInteraction: function (details) {
675
		elements.joinCircleAccept.hide();
676
		elements.joinCircleReject.hide();
677
		elements.joinCircleRequest.hide();
678
		elements.joinCircleInvite.hide();
679
		elements.buttonCircleSettings.hide();
680
		elements.destroyCircle.hide();
681
682
		if (details.user.status === 'Requesting') {
683
			elements.joinCircleRequest.show();
684
			return;
685
		}
686
687
		if (details.user.status === 'Invited') {
688
			elements.joinCircleInvite.show();
689
			return;
690
		}
691
692
		if (details.viewer.level > 0) {
693
			return;
694
		}
695
696
		setTimeout(function () {
697
			nav.joinCircleAction();
698
		}, 200);
699
	}
700
701
};
702
703