group creation and deletion
parent
f2b8813fb9
commit
85ac4aac94
@ -0,0 +1,70 @@
|
|||||||
|
$(document).ready(function() {
|
||||||
|
var createEl = document.getElementById('create'),
|
||||||
|
createModal = $('#create-modal'),
|
||||||
|
createSubmitBtn = document.getElementById('create-modal-go'),
|
||||||
|
createNameEl = $('#create-group-name'),
|
||||||
|
detailsModal = $('#group-details-modal'),
|
||||||
|
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('api: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 {
|
||||||
|
createModal.modal('hide');
|
||||||
|
errorEl.addClass('hide');
|
||||||
|
createNameEl.val('');
|
||||||
|
ajaxify.go('admin/groups');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
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('api:groups.delete', gid, function(err, data) {
|
||||||
|
if (data === 'OK') ajaxify.go('admin/groups');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case 'members':
|
||||||
|
socket.emit('api:groups.get', gid, function(err, groupObj) {
|
||||||
|
console.log(groupObj);
|
||||||
|
detailsModal.modal('show');
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
@ -0,0 +1,100 @@
|
|||||||
|
<h1>Groups</h1>
|
||||||
|
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<div class="groups">
|
||||||
|
<ul id="groups-list">
|
||||||
|
<!-- BEGIN groups -->
|
||||||
|
<li data-gid="{groups.gid}">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-lg-8">
|
||||||
|
<h2>{groups.name}</h2>
|
||||||
|
<p>{groups.description}</p>
|
||||||
|
<div class="btn-group">
|
||||||
|
<button class="btn btn-default" data-action="members">Members</button>
|
||||||
|
<button class="btn btn-danger" data-action="delete">Delete Group</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-4">
|
||||||
|
<ul class="pull-right members">
|
||||||
|
<!-- BEGIN members -->
|
||||||
|
<li title="{groups.members.username}"><img src="http://www.gravatar.com/avatar/e1565907855fffe8433c31671a49f177?size=128&default=identicon&rating=pg" /></li>
|
||||||
|
<!-- END members -->
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<!-- END groups -->
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="text-center">
|
||||||
|
<button class="btn btn-primary" id="create">New Group</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script type="text/javascript" src="{relative_path}/src/forum/admin/groups.js"></script>
|
||||||
|
|
||||||
|
<div class="modal fade" id="create-modal">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||||
|
<h4 class="modal-title">Create Group</h4>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<div class="alert alert-danger hide" id="create-modal-error"></div>
|
||||||
|
<form>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="group-name">Group Name</label>
|
||||||
|
<input type="text" class="form-control" id="create-group-name" placeholder="Group Name" />
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="group-name">Description</label>
|
||||||
|
<input type="text" class="form-control" id="create-group-desc" placeholder="A short description about your group" />
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
||||||
|
<button type="button" class="btn btn-primary" id="create-modal-go">Create</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="modal fade" id="group-details-modal">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||||
|
<h4 class="modal-title">Manage Group</h4>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<div class="alert alert-danger hide" id="create-modal-error"></div>
|
||||||
|
<form>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="group-name">Group Name</label>
|
||||||
|
<input type="text" class="form-control" id="create-group-name" placeholder="Group Name" />
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="group-name">Description</label>
|
||||||
|
<input type="text" class="form-control" id="create-group-desc" placeholder="A short description about your group" />
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label>Members</label>
|
||||||
|
<ul class="members" id="group-details-members"></ul>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="add-member">Add User to Group</label>
|
||||||
|
<input type="text" class="form-control" id="group-details-search" placeholder="Search Users" />
|
||||||
|
<ul class="members" id="group-details-search-results">
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
||||||
|
<button type="button" class="btn btn-primary" id="create-modal-go">Create</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
Loading…
Reference in New Issue