nodebb/public/src/forum/admin/groups.js

define(function() {
	var	Groups = {};

	Groups.init = function() {
		var createEl = document.getElementById('create'),
			createModal = $('#create-modal'),
			createSubmitBtn = document.getElementById('create-modal-go'),
			createNameEl = $('#create-group-name'),
			detailsModal = $('#group-details-modal'),
			detailsSearch = detailsModal.find('#group-details-search'),
			searchResults = detailsModal.find('#group-details-search-results'),
			groupMembersEl = detailsModal.find('ul.current_members'),
			detailsModalSave = detailsModal.find('.btn-primary'),
			searchDelay = undefined,
			listEl = $('#groups-list');

		createEl.addEventListener('click', function() {
			createModal.modal('show');
			setTimeout(function() {
				createNameEl.focus();
			}, 250);
		}, false);

		createSubmitBtn.addEventListener('click', function() {
			var submitObj = {
				name: createNameEl.val(),
				description: $('#create-group-desc').val()
			},
				errorEl = $('#create-modal-error'),
				errorText;

			socket.emit('admin.groups.create', submitObj, function(err, data) {
				if (err) {
					switch (err) {
						case 'group-exists':
							errorText = '<strong>Please choose another name</strong><p>There seems to be a group with this name already.</p>';
							break;
						case 'name-too-short':
							errorText = '<strong>Please specify a grou name</strong><p>A group name is required for administrative purposes.</p>';
							break;
						default:
							errorText = '<strong>Uh-Oh</strong><p>There was a problem creating your group. Please try again later!</p>';
							break;
					}

					errorEl.html(errorText).removeClass('hide');
				} else {
					errorEl.addClass('hide');
					createNameEl.val('');
					createModal.on('hidden.bs.modal', function() {
						ajaxify.go('admin/groups');
					});
					createModal.modal('hide');
				}
			});
		});

		listEl.on('click', 'button[data-action]', function() {
			var action = this.getAttribute('data-action'),
				gid = $(this).parents('li[data-gid]').attr('data-gid');

			switch (action) {
				case 'delete':
					bootbox.confirm('Are you sure you wish to delete this group?', function(confirm) {
						if (confirm) {
							socket.emit('admin.groups.delete', gid, function(err, data) {
								console.log(err, data);
								if(err) {
									return app.alertError(err.message);
								}

								ajaxify.go('admin/groups');
							});
						}
					});
					break;
				case 'members':
					socket.emit('admin.groups.get', gid, function(err, groupObj) {
						var formEl = detailsModal.find('form'),
							nameEl = formEl.find('#change-group-name'),
							descEl = formEl.find('#change-group-desc'),
							memberIcon = document.createElement('li'),
							numMembers = groupObj.members.length,
							membersFrag = document.createDocumentFragment(),
							memberIconImg, x;


						nameEl.val(groupObj.name);
						descEl.val(groupObj.description);

						// Member list
						memberIcon.innerHTML = '<img /><span></span>';
						memberIconImg = memberIcon.querySelector('img');
						memberIconLabel = memberIcon.querySelector('span');
						if (numMembers > 0) {
							for (x = 0; x < numMembers; x++) {
								memberIconImg.src = groupObj.members[x].picture;
								memberIconLabel.innerHTML = groupObj.members[x].username;
								memberIcon.setAttribute('data-uid', groupObj.members[x].uid);
								membersFrag.appendChild(memberIcon.cloneNode(true));
							}
							groupMembersEl.html('');
							groupMembersEl[0].appendChild(membersFrag);
						}

						detailsModal.attr('data-gid', groupObj.gid);
						detailsModal.modal('show');
					});
					break;
			}
		});

		detailsSearch.on('keyup', function() {
			var searchEl = this;

			if (searchDelay) clearTimeout(searchDelay);

			searchDelay = setTimeout(function() {
				var searchText = searchEl.value,
					resultsEl = document.getElementById('group-details-search-results'),
					foundUser = document.createElement('li'),
					foundUserImg, foundUserLabel;

				foundUser.innerHTML = '<img /><span></span>';
				foundUserImg = foundUser.getElementsByTagName('img')[0];
				foundUserLabel = foundUser.getElementsByTagName('span')[0];

				socket.emit('admin.user.search', searchText, function(err, results) {
					if (!err && results && results.length > 0) {
						var numResults = results.length,
							resultsSlug = document.createDocumentFragment(),
							x;
						if (numResults > 4) numResults = 4;
						for (x = 0; x < numResults; x++) {
							foundUserImg.src = results[x].picture;
							foundUserLabel.innerHTML = results[x].username;
							foundUser.setAttribute('title', results[x].username);
							foundUser.setAttribute('data-uid', results[x].uid);
							resultsSlug.appendChild(foundUser.cloneNode(true));
						}

						resultsEl.innerHTML = '';
						resultsEl.appendChild(resultsSlug);
					} else resultsEl.innerHTML = '<li>No Users Found</li>';
				});
			}, 200);
		});

		searchResults.on('click', 'li[data-uid]', function() {
			var userLabel = this,
				uid = parseInt(this.getAttribute('data-uid')),
				gid = detailsModal.attr('data-gid'),
				members = [];

			groupMembersEl.find('li[data-uid]').each(function() {
				members.push(parseInt(this.getAttribute('data-uid')));
			});

			if (members.indexOf(uid) === -1) {
				socket.emit('admin.groups.join', {
					gid: gid,
					uid: uid
				}, function(err, data) {
					if (!err) {
						groupMembersEl.append(userLabel.cloneNode(true));
					}
				});
			}
		});

		groupMembersEl.on('click', 'li[data-uid]', function() {
			var uid = this.getAttribute('data-uid'),
				gid = detailsModal.attr('data-gid');
			
			bootbox.confirm('Are you sure you want to remove this user?', function(confirm) {
				if (confirm){
					socket.emit('admin.groups.leave', {
						gid: gid,
						uid: uid
						}, function(err, data) {
						if (!err) {
							groupMembersEl.find('li[data-uid="' + uid + '"]').remove();
						}
					});
				}
			});
		});

		detailsModalSave.on('click', function() {
			var formEl = detailsModal.find('form'),
				nameEl = formEl.find('#change-group-name'),
				descEl = formEl.find('#change-group-desc'),
				gid = detailsModal.attr('data-gid');

			socket.emit('admin.groups.update', {
				gid: gid,
				values: {
					name: nameEl.val(),
					description: descEl.val()
				}
			}, function(err) {
				if (!err) {
					detailsModal.on('hidden.bs.modal', function() {
						ajaxify.go('admin/groups');
					});
					detailsModal.modal('hide');
				}
			});
		});
	};

	return Groups;
});