Sort channel members
This commit is contained in:
parent
ecd253be78
commit
b16e17bae9
|
@ -13,7 +13,7 @@
|
|||
</div>
|
||||
<div v-if="channel" style="padding-left:5px;flex:1;display:flex;flex-direction:column" v-show="tab === '1'">
|
||||
<div class="users" style="flex:1;padding-left:5px">
|
||||
<h4>{{l('users.memberCount', channel.sortedMembers.length)}}</h4>
|
||||
<h4>{{l('users.memberCount', channel.sortedMembers.length)}} <a class="btn sort" @click="switchSort"><i class="fa fa-sort"></i></a></h4>
|
||||
<div v-for="member in filteredMembers" :key="member.character.name">
|
||||
<user :character="member.character" :channel="channel" :showStatus="true"></user>
|
||||
</div>
|
||||
|
@ -33,10 +33,43 @@
|
|||
import Vue from 'vue';
|
||||
import Tabs from '../components/tabs';
|
||||
import core from './core';
|
||||
import {Channel, Character, Conversation} from './interfaces';
|
||||
import { Channel, Character, Conversation } from './interfaces';
|
||||
import l from './localize';
|
||||
import Sidebar from './Sidebar.vue';
|
||||
import UserView from './UserView.vue';
|
||||
import _ from 'lodash';
|
||||
|
||||
type StatusSort = {
|
||||
[key in Character.Status]: number;
|
||||
};
|
||||
|
||||
type GenderSort = {
|
||||
[key in Character.Gender]: number;
|
||||
};
|
||||
|
||||
const statusSort: StatusSort = {
|
||||
'crown': 0,
|
||||
'looking': 1,
|
||||
'online': 2,
|
||||
'idle': 3,
|
||||
'away': 4,
|
||||
'busy': 5,
|
||||
'dnd': 6,
|
||||
'offline': 7
|
||||
};
|
||||
|
||||
const genderSort: GenderSort = {
|
||||
'Female': 0,
|
||||
'Male': 1,
|
||||
'Herm': 2,
|
||||
'Shemale': 3,
|
||||
'Cunt-boy': 4,
|
||||
'Transgender': 5,
|
||||
'Male-Herm': 6,
|
||||
'None': 7
|
||||
};
|
||||
|
||||
const availableSorts = ['normal', 'status', 'gender'] as const;
|
||||
|
||||
@Component({
|
||||
components: {user: UserView, sidebar: Sidebar, tabs: Tabs}
|
||||
|
@ -48,6 +81,8 @@
|
|||
l = l;
|
||||
sorter = (x: Character, y: Character) => (x.name < y.name ? -1 : (x.name > y.name ? 1 : 0));
|
||||
|
||||
sortType: typeof availableSorts[number] = 'normal';
|
||||
|
||||
get friends(): Character[] {
|
||||
return core.characters.friends.slice().sort(this.sorter);
|
||||
}
|
||||
|
@ -61,6 +96,46 @@
|
|||
}
|
||||
|
||||
get filteredMembers(): ReadonlyArray<Channel.Member> {
|
||||
const members = this.getFilteredMembers();
|
||||
|
||||
if (this.sortType === 'normal') {
|
||||
return members;
|
||||
}
|
||||
|
||||
const sorted = [...members];
|
||||
|
||||
switch (this.sortType) {
|
||||
case 'status':
|
||||
sorted.sort((a, b) => {
|
||||
const aVal = statusSort[a.character.status];
|
||||
const bVal = statusSort[b.character.status];
|
||||
|
||||
if (aVal - bVal === 0) {
|
||||
return a.character.name.localeCompare(b.character.name);
|
||||
}
|
||||
|
||||
return aVal - bVal;
|
||||
});
|
||||
break;
|
||||
|
||||
case 'gender':
|
||||
sorted.sort((a, b) => {
|
||||
const aVal = genderSort[(a.character.gender || 'None')];
|
||||
const bVal = genderSort[(b.character.gender || 'None')];
|
||||
|
||||
if (aVal - bVal === 0) {
|
||||
return a.character.name.localeCompare(b.character.name);
|
||||
}
|
||||
|
||||
return aVal - bVal;
|
||||
});
|
||||
break;
|
||||
}
|
||||
|
||||
return sorted;
|
||||
}
|
||||
|
||||
getFilteredMembers() {
|
||||
const members = this.prefilterMembers();
|
||||
|
||||
if (!core.state.settings.risingFilter.hideChannelMembers) {
|
||||
|
@ -75,12 +150,20 @@
|
|||
}
|
||||
|
||||
prefilterMembers(): ReadonlyArray<Channel.Member> {
|
||||
const sorted = this.channel.sortedMembers;
|
||||
|
||||
if(this.filter.length === 0)
|
||||
return this.channel.sortedMembers;
|
||||
return sorted;
|
||||
|
||||
const filter = new RegExp(this.filter.replace(/[^\w]/gi, '\\$&'), 'i');
|
||||
|
||||
return this.channel.sortedMembers.filter((member) => filter.test(member.character.name));
|
||||
return sorted.filter((member) => filter.test(member.character.name));
|
||||
}
|
||||
|
||||
switchSort() {
|
||||
const nextSortIndex = _.indexOf(availableSorts, this.sortType) + 1;
|
||||
|
||||
this.sortType = availableSorts[nextSortIndex % availableSorts.length];
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
Loading…
Reference in New Issue