Completed
Push — master ( 835a38...42194a )
by Maxence
02:30
created

nav.displayGroups   B

Complexity

Conditions 3
Paths 4

Size

Total Lines 27

Duplication

Lines 0
Ratio 0 %

Importance

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