Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2025-11-10 07:55:46 +01:00
Code Issues Packages Projects Releases Wiki Activity

now /users looks as it should. made some tweaks to user search to improve UX as well

Browse Source
This commit is contained in:
psychobunny
2013-08-24 01:11:50 +08:00
parent 2427724868
commit d62f36c6a0
3 changed files with 34 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
public/css/style.less
View File

@@ -262,6 +262,9 @@ footer.footer {
word-wrap: break-word; word-wrap: break-word;
} }
#users-container {
padding: 0;
}
.users-box{ .users-box{
display: inline-block; display: inline-block;
margin-top: 20px; margin-top: 20px;

40
public/src/forum/users.js
View File

@@ -8,6 +8,8 @@
parts = url.split('/'), parts = url.split('/'),
active = parts[parts.length-1]; active = parts[parts.length-1];
var lastSearch = null;
app.addCommasToNumbers(); app.addCommasToNumbers();
jQuery('.nav-pills li').removeClass('active'); jQuery('.nav-pills li').removeClass('active');
@@ -27,22 +29,30 @@
timeoutId = setTimeout(function() { timeoutId = setTimeout(function() {
var username = $('#search-user').val(); var username = $('#search-user').val();
jQuery('.icon-spinner').removeClass('none'); if (username == '') {
socket.emit('api:admin.user.search', username); jQuery('#user-notfound-notify').html('<i class="icon icon-circle-blank"></i>');
jQuery('#user-notfound-notify').parent().removeClass('btn-warning label-warning btn-success label-success');
return;
}
if (lastSearch === username) return;
lastSearch = username;
jQuery('#user-notfound-notify').html('<i class="icon-spinner icon-spin"></i>');
setTimeout(function() {
socket.emit('api:admin.user.search', username);
}, 500); //replace this with global throttling function/constant
}, 250); }, 250);
}); });
socket.removeAllListeners('api:admin.user.search'); socket.removeAllListeners('api:admin.user.search');
socket.on('api:admin.user.search', function(data) { socket.on('api:admin.user.search', function(data) {
jQuery('.icon-spinner').addClass('none');
if(data === null) { if(data === null) {
$('#user-notfound-notify').html('You need to be logged in to search!') $('#user-notfound-notify').html('You need to be logged in to search!');
.show() $('#user-notfound-notify').parent().addClass('btn-warning label-warning');
.addClass('label-danger')
.removeClass('label-success');
return; return;
} }
@@ -55,16 +65,12 @@
if(data && data.length === 0) { if(data && data.length === 0) {
$('#user-notfound-notify').html('User not found!') $('#user-notfound-notify').html('User not found!');
.show() $('#user-notfound-notify').parent().addClass('btn-warning label-warning');
.addClass('label-danger')
.removeClass('label-success');
} }
else { else {
$('#user-notfound-notify').html(data.length + ' user'+(data.length>1?'s':'') + ' found!') $('#user-notfound-notify').html(data.length + ' user'+(data.length>1?'s':'') + ' found!');
.show() $('#user-notfound-notify').parent().addClass('btn-success label-success');
.addClass('label-success')
.removeClass('label-danger');
} }
}); });

12
public/templates/users.tpl
View File

@@ -7,11 +7,15 @@
<li class=''><a href='/users-search'>Search</a></li> <li class=''><a href='/users-search'>Search</a></li>
</ul> </ul>
<br />
<div class="search {search_display} well"> <div class="search {search_display} well">
<input id="search-user" type="text" placeholder="Enter a username to search"/><br />
<i class="icon-spinner icon-spin none"></i> <div class="input-group">
<span id="user-notfound-notify" class="label label-danger hide">User not found!</span><br/> <input class="form-control" id="search-user" type="text" placeholder="Enter a username to search"/>
<span class="input-group-addon">
<span id="user-notfound-notify"><i class="icon icon-circle-blank"></i></span>
</span>
</div>
</div> </div>
<ul id="users-container" class="users"> <ul id="users-container" class="users">