lightcordwarez
/
BetterDiscordApp-v2
mirror of https://github.com/JsSucks/BetterDiscordApp
1
0
Fork 0
Code Issues 3 Releases Wiki Activity

Functional sorting

This commit is contained in:
Jiiks 2018-12-05 00:40:57 +02:00
parent 08b66d5e5a
commit e3010fcd43
2 changed files with 63 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
client/src/dev/serveremu.js
View File

@ -17,6 +17,27 @@ export default class ServerEmu {
docs = this._themes;
}
if (args.sort) {
switch (args.sort) {
case 'name':
if (args.ascending) docs = docs.sort((docA, docB) => docA.name.toUpperCase() < docB.name.toUpperCase());
else docs = docs.sort((docA, docB) => docA.name.toUpperCase() > docB.name.toUpperCase());
break;
case 'updated':
if (args.ascending) docs = docs.sort((docA, docB) => new Date(docA.updated).getTime() - new Date(docB.updated).getTime());
else docs = docs.sort((docA, docB) => new Date(docB.updated).getTime() - new Date(docA.updated).getTime());
break;
case 'installs':
if (args.ascending) docs = docs.sort((docA, docB) => docA.installs - docB.installs);
else docs = docs.sort((docA, docB) => docB.installs - docA.installs);
break;
case 'users':
if (args.ascending) docs = docs.sort((docA, docB) => docA.activeUsers - docB.activeUsers);
else docs = docs.sort((docA, docB) => docB.activeUsers - docA.activeUsers);
break;
}
}
const total = docs.length;
const pages = Math.ceil(total / 9);
@ -30,6 +51,11 @@ export default class ServerEmu {
return {
docs,
filters: {
sterm: args.sterm || '',
ascending: args.ascending || false,
sort: args.sort || 'name'
},
pagination: {
total,
pages,

60
client/src/ui/components/bd/ThemesView.vue
View File

@ -40,10 +40,10 @@
</div>
<div class="bd-flex bd-flexRow" v-if="onlineThemes && onlineThemes.docs && onlineThemes.docs.length">
<div class="bd-searchSort bd-flex bd-flexGrow">
<div class="bd-sort" @click="sortBy('name')" :class="{'bd-active': sort === 'name', 'bd-flipY': ascending}">Name<MiChevronDown v-if="sort === 'name'" size="18"/></div>
<div class="bd-sort" @click="sortBy('updated')" :class="{'bd-active': sort === 'updated', 'bd-flipY': ascending}">Updated<MiChevronDown v-if="sort === 'updated'" size="18" /></div>
<div class="bd-sort" @click="sortBy('installs')" :class="{'bd-active': sort === 'installs', 'bd-flipY': ascending}">Installs<MiChevronDown v-if="sort === 'installs'" size="18" /></div>
<div class="bd-sort" @click="sortBy('users')" :class="{'bd-active': sort === 'users', 'bd-flipY': ascending}">Users<MiChevronDown v-if="sort === 'users'" size="18" /></div>
<div class="bd-sort" @click="sortBy('name')" :class="{'bd-active': onlineThemes.filters.sort === 'name', 'bd-flipY': onlineThemes.filters.ascending}">Name<MiChevronDown v-if="onlineThemes.filters.sort === 'name'" size="18"/></div>
<div class="bd-sort" @click="sortBy('updated')" :class="{'bd-active': onlineThemes.filters.sort === 'updated', 'bd-flipY': onlineThemes.filters.ascending}">Updated<MiChevronDown v-if="onlineThemes.filters.sort === 'updated'" size="18" /></div>
<div class="bd-sort" @click="sortBy('installs')" :class="{'bd-active': onlineThemes.filters.sort === 'installs', 'bd-flipY': onlineThemes.filters.ascending}">Installs<MiChevronDown v-if="onlineThemes.filters.sort === 'installs'" size="18" /></div>
<div class="bd-sort" @click="sortBy('users')" :class="{'bd-active': onlineThemes.filters.sort === 'users', 'bd-flipY': onlineThemes.filters.ascending}">Users<MiChevronDown v-if="onlineThemes.filters.sort === 'users'" size="18" /></div>
</div>
</div>
</div>
@ -75,17 +75,23 @@
ThemeManager,
local: true,
localThemes: ThemeManager.localThemes,
onlineThemes: null,
onlineThemes: {
docs: [],
filters: {
sterm: '',
sort: 'name',
ascending: false
},
pagination: {
total: 0,
pages: 0,
limit: 9,
page: 1
}
},
loadingOnline: false,
loadingMore: false,
searchHint: '',
sterm: '',
pagination: {
page: 1,
pages: 1
},
sort: 'name',
ascending: false
searchHint: ''
};
},
components: {
@ -110,9 +116,8 @@
if (this.loadingOnline || this.loadingMore) return;
this.loadingOnline = true;
try {
const getThemes = await BdWebApi.themes.get({ sterm: this.sterm });
const getThemes = await BdWebApi.themes.get(this.onlineThemes.filters);
this.onlineThemes = getThemes;
this.pagination = this.onlineThemes.pagination;
if (!this.onlineThemes.docs) return;
this.searchHint = `${this.onlineThemes.pagination.total} Results`;
} catch (err) {
@ -150,17 +155,25 @@
},
searchInput(e) {
if (this.loadingOnline || this.loadingMore) return;
this.sterm = e.target.value;
this.onlineThemes.filters.sterm = e.target.value;
this.refreshOnline();
},
async scrollend(e) {
if (this.pagination.page >= this.pagination.pages) return;
if (this.onlineThemes.pagination.page >= this.onlineThemes.pagination.pages) return;
if (this.loadingOnline || this.loadingMore) return;
this.loadingMore = true;
try {
this.pagination.page = this.pagination.page + 1;
const getThemes = await BdWebApi.themes.get({ sterm: this.sterm, page: this.pagination.page });
const getThemes = await BdWebApi.themes.get({
sterm: this.onlineThemes.filters.sterm,
page: this.onlineThemes.pagination.page + 1,
sort: this.onlineThemes.filters.sort,
ascending: this.onlineThemes.filters.ascending
});
this.onlineThemes.docs = [...this.onlineThemes.docs, ...getThemes.docs];
this.onlineThemes.filters = getThemes.filters;
this.onlineThemes.pagination = getThemes.pagination;
} catch (err) {
Logger.err('ThemesView', err);
} finally {
@ -169,12 +182,13 @@
},
async sortBy(by) {
if (this.loadingOnline || this.loadingMore) return;
if (this.sort === by) {
this.ascending = !this.ascending;
if (this.onlineThemes.filters.sort === by) {
this.onlineThemes.filters.ascending = !this.onlineThemes.filters.ascending;
} else {
this.sort = by;
this.ascending = false;
this.onlineThemes.filters.sort = by;
this.onlineThemes.filters.ascending = false;
}
this.refreshOnline();
}
}
}