Correctly update user list and search filtering on user updates

This commit is contained in:
Pavel Djundik 2017-04-22 15:49:01 +03:00 committed by Jérémie Astori
parent b1e9a7ffda
commit c583d6edf9
5 changed files with 43 additions and 38 deletions

View File

@ -768,6 +768,9 @@ kbd {
overflow: auto;
-webkit-overflow-scrolling: touch;
position: absolute;
}
#chat .channel .chat {
right: 180px;
}
@ -791,18 +794,6 @@ kbd {
transform: translateZ(0);
}
#chat .lobby .chat,
#chat .special .chat,
#chat .query .chat {
right: 0;
}
#chat .lobby .sidebar,
#chat .special .sidebar,
#chat .query .sidebar {
display: none;
}
#chat .show-more {
display: none;
padding: 10px;
@ -1180,6 +1171,10 @@ kbd {
width: 100%;
}
#chat .names-filtered {
display: none;
}
#chat .names .user {
display: block;
line-height: 1.6;

View File

@ -1,5 +0,0 @@
"use strict";
module.exports = function(count) {
return count + " " + (count === 1 ? "user" : "users");
};

View File

@ -258,7 +258,10 @@ $(function() {
function renderChannel(data) {
renderChannelMessages(data);
renderChannelUsers(data);
if (data.type === "channel") {
renderChannelUsers(data);
}
}
function renderChannelMessages(data) {
@ -318,7 +321,19 @@ $(function() {
return (oldSortOrder[a] || Number.MAX_VALUE) - (oldSortOrder[b] || Number.MAX_VALUE);
});
users.html(templates.user(data)).data("nicks", nicks);
const search = users
.find(".search")
.attr("placeholder", nicks.length + " " + (nicks.length === 1 ? "user" : "users"));
users
.find(".names-original")
.html(templates.user(data))
.data("nicks", nicks);
// Refresh user search
if (search.val().length) {
search.trigger("input");
}
}
function renderNetworks(data) {

View File

@ -19,8 +19,16 @@
</div>
<div class="messages"></div>
</div>
{{#equal type "channel"}}
<aside class="sidebar">
<div class="users"></div>
<div class="users">
<div class="count">
<input type="search" class="search" aria-label="Search among the user list">
</div>
<div class="names names-filtered"></div>
<div class="names names-original"></div>
</div>
</aside>
{{/equal}}
</div>
{{/each}}

View File

@ -1,19 +1,11 @@
{{#if users.length}}
<div class="count">
<input class="search" placeholder="{{users users.length}}" aria-label="Search among the user list">
</div>
<div class="names names-filtered"></div>
{{/if}}
<div class="names names-original">
{{#diff "reset"}}{{/diff}}
{{#each users}}
{{#diff mode}}
{{#unless @first}}
</div>
{{/unless}}
<div class="user-mode {{modes mode}}">
{{/diff}}
<span role="button" class="user {{colorClass name}}" data-name="{{name}}">{{mode}}{{name}}</span>
{{/each}}
</div>
{{#diff "reset"}}{{/diff}}
{{#each users}}
{{#diff mode}}
{{#unless @first}}
</div>
{{/unless}}
<div class="user-mode {{modes mode}}">
{{/diff}}
<span role="button" class="user {{colorClass name}}" data-name="{{name}}">{{mode}}{{name}}</span>
{{/each}}
</div>