user list on group edit modal

v1.18.x
Julian Lam 12 years ago
parent 5e869a5e5c
commit a6b0c2638a

@ -144,7 +144,7 @@
}
.groups {
ul {
> ul {
padding-left: 0;
li {
@ -161,12 +161,20 @@
}
.members {
padding: 1em;
li {
display: inline-block;
border: 1px solid rgb(200, 200, 200);
margin-right: 1em;
img {
width: 32px;
}
span {
padding: 0 1em;
}
}
}
}

@ -4,6 +4,8 @@ $(document).ready(function() {
createSubmitBtn = document.getElementById('create-modal-go'),
createNameEl = $('#create-group-name'),
detailsModal = $('#group-details-modal'),
detailsSearch = detailsModal.find('#group-details-search'),
searchDelay = undefined,
listEl = $('#groups-list');
createEl.addEventListener('click', function() {
@ -79,8 +81,8 @@ $(document).ready(function() {
memberIcon.innerHTML = '<img />';
memberIconImg = memberIcon.querySelector('img');
if (numMembers > 0) {
for(x=0,x<numMembers;x++) {
memberIconImg.src = groupObj.mmbers[x].picture;
for(x=0;x<numMembers;x++) {
memberIconImg.src = groupObj.members[x].picture;
membersFrag.appendChild(memberIcon.cloneNode(true));
}
membersEl.appendChild(membersFrag);
@ -91,4 +93,39 @@ $(document).ready(function() {
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('api: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);
resultsSlug.appendChild(foundUser.cloneNode(true));
}
resultsEl.innerHTML = '';
resultsEl.appendChild(resultsSlug);
} else resultsEl.innerHTML = '<li>No Users Found</li>';
});
}, 200);
});
});

@ -30,71 +30,71 @@
<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">&times;</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 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">&times;</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>
<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">&times;</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="change-group-name" placeholder="Group Name" />
</div>
<div class="form-group">
<label for="group-name">Description</label>
<input type="text" class="form-control" id="change-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 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">&times;</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="change-group-name" placeholder="Group Name" />
</div>
<div class="form-group">
<label for="group-name">Description</label>
<input type="text" class="form-control" id="change-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"></ul>
</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="group-details-save">Save</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="{relative_path}/src/forum/admin/groups.js"></script>

@ -26,7 +26,7 @@ var fs = require('fs'),
if (fs.existsSync(pluginPath)) _self.loadPlugin(pluginPath, next);
else if (fs.existsSync(modulePath)) _self.loadPlugin(modulePath, next);
else {
if (global.env === 'development') winston.info('[plugins] Plugin \'' + plugin + '\' not found');
if (global.env === 'development') winston.warn('[plugins] Plugin \'' + plugin + '\' not found');
next(); // Ignore this plugin silently
}
}, next);

@ -766,13 +766,15 @@ var SocketIO = require('socket.io').listen(global.server, { log:false }),
}
});
socket.on('api:admin.user.search', function(username) {
socket.on('api:admin.user.search', function(username, callback) {
if(uid && uid > 0) {
user.search(username, function(data) {
socket.emit('api:admin.user.search', data);
if (!callback) socket.emit('api:admin.user.search', data);
else callback(null, data);
});
} else {
socket.emit('api:admin.user.search', null);
if (!callback) socket.emit('api:admin.user.search', null);
else callback();
}
});

Loading…
Cancel
Save