MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-19 14:53:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

Sidebar sorting dropdown

Browse Source
This commit is contained in:
Natsumi
2024-09-14 21:07:24 +12:00
parent 2cc42d48a9
commit 4a2ea2fde3
4 changed files with 175 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

211
html/src/app.js
View File

@@ -2011,7 +2011,7 @@ speechSynthesis.getVoices();
$online_for: Date.now(), $online_for: Date.now(),
$travelingToTime: Date.now(), $travelingToTime: Date.now(),
$offline_for: '', $offline_for: '',
$active_for: '', $active_for: Date.now(),
$isVRCPlus: false, $isVRCPlus: false,
$isModerator: false, $isModerator: false,
$isTroll: false, $isTroll: false,
@@ -9759,6 +9759,9 @@ speechSynthesis.getVoices();
if (typeof a.ref === 'undefined' || typeof b.ref === 'undefined') { if (typeof a.ref === 'undefined' || typeof b.ref === 'undefined') {
return 0; return 0;
} }
if (a.state !== 'online' || b.state !== 'online') {
return 0;
}
return a.ref.location.localeCompare(b.ref.location); return a.ref.location.localeCompare(b.ref.location);
} }
@@ -9779,56 +9782,57 @@ speechSynthesis.getVoices();
return 0; return 0;
} }
// online for // last active
var compareByOnlineFor = function (a, b) { var compareByLastActive = function (a, b) {
return compareByActivityField(a, b, "$online_for"); if (a.state === 'online' && b.state === 'online') {
} if (
a.ref?.$online_for &&
b.ref?.$online_for &&
a.ref.$online_for === b.ref.$online_for
) {
compareByActivityField(a, b, 'last_login');
}
return compareByActivityField(a, b, '$online_for');
}
// offline for return compareByActivityField(a, b, 'last_activity');
var compareByOfflineFor = function (a, b) { };
return compareByActivityField(a, b, "$offline_for");
}
// active for
var compareByActiveFor = function (a, b) {
return compareByActivityField(a, b, "$active_for");
}
var getFriendsSortFunction = function (sortMethods) { var getFriendsSortFunction = function (sortMethods) {
const sorts = []; const sorts = [];
for (const sortMethod of sortMethods) { for (const sortMethod of sortMethods) {
switch (sortMethod) { switch (sortMethod) {
case "Sort Private to Bottom": case 'Sort Alphabetically':
sorts.push(compareByName);
break;
case 'Sort Private to Bottom':
sorts.push(compareByPrivate); sorts.push(compareByPrivate);
break; break;
case "Sort by Status": case 'Sort by Status':
sorts.push(compareByStatus); sorts.push(compareByStatus);
break; break;
case "Sort by Name": case 'Sort by Last Active':
sorts.push(compareByStatusAndPrivate); sorts.push(compareByLastActive);
break; break;
case "Sort by Online For": case 'Sort by Time in Instance':
sorts.push(compareByOnlineFor);
break;
case "Sort by Offline For":
sorts.push(compareByOfflineFor);
break;
case "Sort by Active For":
sorts.push(compareByActiveFor);
break;
case "Sort by Time in Instance":
sorts.push((a, b) => { sorts.push((a, b) => {
if (typeof a.ref === 'undefined' || typeof b.ref === 'undefined') { if (
typeof a.ref === 'undefined' ||
typeof b.ref === 'undefined'
) {
return 0;
}
if (a.state !== 'online' || b.state !== 'online') {
return 0; return 0;
} }
return compareByLocationAt(a.ref, b.ref); return compareByLocationAt(b.ref, a.ref);
}); });
break; break;
case "Sort by Location": case 'Sort by Location':
sorts.push(compareByLocation); sorts.push(compareByLocation);
break; break;
case "None": case 'None':
sorts.push(() => 0); sorts.push(() => 0);
break; break;
} }
@@ -9843,8 +9847,8 @@ speechSynthesis.getVoices();
} }
} }
return res; return res;
} };
} };
// VIP friends // VIP friends
$app.computed.vipFriends = function () { $app.computed.vipFriends = function () {
@@ -9853,7 +9857,7 @@ speechSynthesis.getVoices();
} }
this.sortVIPFriends = false; this.sortVIPFriends = false;
this.vipFriends_.sort(getFriendsSortFunction(this.vipFriendsSortMethod)); this.vipFriends_.sort(getFriendsSortFunction(this.sidebarSortMethods));
return this.vipFriends_; return this.vipFriends_;
}; };
@@ -9864,7 +9868,9 @@ speechSynthesis.getVoices();
} }
this.sortOnlineFriends = false; this.sortOnlineFriends = false;
this.onlineFriends_.sort(getFriendsSortFunction(this.onlineFriendsSortMethod)); this.onlineFriends_.sort(
getFriendsSortFunction(this.sidebarSortMethods)
);
return this.onlineFriends_; return this.onlineFriends_;
}; };
@@ -9876,7 +9882,9 @@ speechSynthesis.getVoices();
} }
this.sortActiveFriends = false; this.sortActiveFriends = false;
this.activeFriends_.sort(getFriendsSortFunction(this.activeFriendsSortMethod)); this.activeFriends_.sort(
getFriendsSortFunction(this.sidebarSortMethods)
);
return this.activeFriends_; return this.activeFriends_;
}; };
@@ -9888,7 +9896,9 @@ speechSynthesis.getVoices();
} }
this.sortOfflineFriends = false; this.sortOfflineFriends = false;
this.offlineFriends_.sort(getFriendsSortFunction(this.offlineFriendsSortMethod)); this.offlineFriends_.sort(
getFriendsSortFunction(this.sidebarSortMethods)
);
return this.offlineFriends_; return this.offlineFriends_;
}; };
@@ -16040,72 +16050,104 @@ speechSynthesis.getVoices();
this.vrcRegistryAutoBackup this.vrcRegistryAutoBackup
); );
}; };
// TODO: FIX DEFAULTS BEFORE MEGNING PLS $app.data.sidebarSortMethod1 = '';
$app.data.vipFriendsSortMethod = JSON.parse(await configRepository.getString( $app.data.sidebarSortMethod2 = '';
'vipFriendsSortMethod', $app.data.sidebarSortMethod3 = '';
'["Default"]' $app.data.sidebarSortMethods = JSON.parse(
)); await configRepository.getString(
$app.data.onlineFriendsSortMethod = JSON.parse(await configRepository.getString( 'VRCX_sidebarSortMethods',
'onlineFriendsSortMethod', JSON.stringify(['', '', ''])
'["Default"]' )
)); );
$app.data.activeFriendsSortMethod = JSON.parse(await configRepository.getString( if ($app.data.sidebarSortMethods?.length === 3) {
'activeFriendsSortMethod', $app.data.sidebarSortMethod1 = $app.data.sidebarSortMethods[0];
'["Default"]' $app.data.sidebarSortMethod2 = $app.data.sidebarSortMethods[1];
)); $app.data.sidebarSortMethod3 = $app.data.sidebarSortMethods[2];
$app.data.offlineFriendsSortMethod = JSON.parse(await configRepository.getString( }
'offlineFriendsSortMethod',
'["Default"]'
));
// Migrate old settings // Migrate old settings
// Assume all exist if one does // Assume all exist if one does
// TODO: FIX THIS BEFORE MERGING PLS
const orderFriendsGroupPrivate = await configRepository.getBool( const orderFriendsGroupPrivate = await configRepository.getBool(
'orderFriendGroupPrivate' 'orderFriendGroupPrivate'
); );
if (orderFriendsGroupPrivate !== null) { if (orderFriendsGroupPrivate !== null) {
await configRepository.remove('orderFriendGroupPrivate'); await configRepository.remove('orderFriendGroupPrivate');
const orderFriendsGroupStatus = await configRepository.getBool( const orderFriendsGroupStatus = await configRepository.getBool(
'orderFriendsGroupStatus' 'orderFriendsGroupStatus'
); );
await configRepository.remove('orderFriendsGroupStatus'); await configRepository.remove('orderFriendsGroupStatus');
const orderFriendsGroupGPS = await configRepository.getBool( const orderFriendsGroupGPS = await configRepository.getBool(
'orderFriendGroupGPS' 'orderFriendGroupGPS'
); );
await configRepository.remove('orderFriendGroupGPS'); await configRepository.remove('orderFriendGroupGPS');
if (orderFriendsGroupGPS) { const orderOnlineFor =
$app.data.onlineAndVIPFriendsSortMethod = "Sort by Location"; await configRepository.getBool('orderFriendGroup0');
} else if (orderFriendsGroupPrivate && orderFriendsGroupStatus) { await configRepository.remove('orderFriendGroup0');
$app.data.onlineAndVIPFriendsSortMethod = "Sort by Status and Private to Bottom"; await configRepository.remove('orderFriendGroup1');
} else if (orderFriendsGroupPrivate) { await configRepository.remove('orderFriendGroup2');
$app.data.onlineAndVIPFriendsSortMethod = "Sort Private to Bottom"; await configRepository.remove('orderFriendGroup3');
} else if (orderFriendsGroupStatus) {
$app.data.onlineAndVIPFriendsSortMethod = "Sort by Status" var sortOrder = [];
if (orderFriendsGroupPrivate) {
sortOrder.push('Sort Private to Bottom');
} }
if (orderFriendsGroupStatus) {
sortOrder.push('Sort by Status');
}
if (orderOnlineFor && orderFriendsGroupGPS) {
sortOrder.push('Sort by Time in Instance');
}
if (!orderOnlineFor) {
sortOrder.push('Sort Alphabetically');
}
if (sortOrder.length > 0) {
while (sortOrder.length < 3) {
sortOrder.push('');
}
$app.data.sidebarSortMethods = sortOrder;
$app.data.sidebarSortMethod1 = sortOrder[0];
$app.data.sidebarSortMethod2 = sortOrder[1];
$app.data.sidebarSortMethod3 = sortOrder[2];
}
await configRepository.setString(
'VRCX_sidebarSortMethods',
JSON.stringify(sortOrder)
);
} }
$app.methods.saveOrderFriendGroup = async function () { $app.methods.saveSidebarSortOrder = async function () {
if (this.sidebarSortMethod1 === this.sidebarSortMethod2) {
this.sidebarSortMethod2 = '';
}
if (this.sidebarSortMethod1 === this.sidebarSortMethod3) {
this.sidebarSortMethod3 = '';
}
if (this.sidebarSortMethod2 === this.sidebarSortMethod3) {
this.sidebarSortMethod3 = '';
}
if (!this.sidebarSortMethod1) {
this.sidebarSortMethod2 = '';
}
if (!this.sidebarSortMethod2) {
this.sidebarSortMethod3 = '';
}
this.sidebarSortMethods = [
this.sidebarSortMethod1,
this.sidebarSortMethod2,
this.sidebarSortMethod3
];
await configRepository.setString( await configRepository.setString(
'vipFriendsSortMethod', 'VRCX_sidebarSortMethods',
JSON.stringify(this.vipFriendsSortMethod) JSON.stringify(this.sidebarSortMethods)
);
await configRepository.setString(
'onlineFriendsSortMethod',
JSON.stringify(this.onlineFriendsSortMethod)
);
await configRepository.setString(
'activeFriendsSortMethod',
JSON.stringify(this.activeFriendsSortMethod)
);
await configRepository.setString(
'offlineFriendsSortMethod',
JSON.stringify(this.offlineFriendsSortMethod)
); );
this.sortVIPFriends = true; this.sortVIPFriends = true;
this.sortOnlineFriends = true; this.sortOnlineFriends = true;
this.sortActiveFriends = true;
this.sortOfflineFriends = true;
}; };
$app.data.discordActive = await configRepository.getBool( $app.data.discordActive = await configRepository.getBool(
'discordActive', 'discordActive',
@@ -17867,8 +17909,10 @@ speechSynthesis.getVoices();
if (!D.dateFriended) { if (!D.dateFriended) {
if (ref2.type === 'Unfriend') { if (ref2.type === 'Unfriend') {
D.unFriended = true; D.unFriended = true;
D.dateFriended = if (!this.hideUnfriends) {
ref2.created_at; D.dateFriended =
ref2.created_at;
}
} }
if (ref2.type === 'Friend') { if (ref2.type === 'Friend') {
D.unFriended = false; D.unFriended = false;
@@ -17878,7 +17922,8 @@ speechSynthesis.getVoices();
} }
if ( if (
ref2.type === 'Friend' || ref2.type === 'Friend' ||
ref2.type === 'Unfriend' (ref2.type === 'Unfriend' &&
!this.hideUnfriends)
) { ) {
D.dateFriendedInfo.push(ref2); D.dateFriendedInfo.push(ref2);
} }

5
html/src/index.pug
View File

@@ -460,14 +460,13 @@ html
template(#content v-else) template(#content v-else)
span - span -
.detail .detail
span.name(v-if="userDialog.unFriended && !hideUnfriends") {{ $t('dialog.user.info.unfriended') }} span.name(v-if="userDialog.unFriended") {{ $t('dialog.user.info.unfriended') }}
el-tooltip(v-if="!hideTooltips" placement="top" style="margin-left:5px" :content="$t('dialog.user.info.accuracy_notice')") el-tooltip(v-if="!hideTooltips" placement="top" style="margin-left:5px" :content="$t('dialog.user.info.accuracy_notice')")
i.el-icon-warning i.el-icon-warning
span.name(v-else) {{ $t('dialog.user.info.friended') }} span.name(v-else) {{ $t('dialog.user.info.friended') }}
el-tooltip(v-if="!hideTooltips" placement="top" style="margin-left:5px" :content="$t('dialog.user.info.accuracy_notice')") el-tooltip(v-if="!hideTooltips" placement="top" style="margin-left:5px" :content="$t('dialog.user.info.accuracy_notice')")
i.el-icon-warning i.el-icon-warning
span.extra(v-if="!hideUnfriends") {{ userDialog.dateFriended | formatDate('long') }} span.extra {{ userDialog.dateFriended | formatDate('long') }}
span.extra(v-else) -
template(v-if="API.currentUser.id === userDialog.id") template(v-if="API.currentUser.id === userDialog.id")
.x-friend-item(@click="toggleAvatarCopying") .x-friend-item(@click="toggleAvatarCopying")
.detail .detail

28
html/src/localization/en/en.json
View File

@@ -292,24 +292,16 @@
"side_panel": { "side_panel": {
"header": "Side Panel", "header": "Side Panel",
"sorting": { "sorting": {
"header": "Sorting", "header": "Sort Order",
"sort_default": "Default", "alphabetical": "Alphabetical",
"sort_private_to_bottom": "Sort Private to bottom", "private_to_bottom": "Private to Bottom",
"sort_by_status": "Sort by Status", "status": "Status",
"sort_by_status_and_private_to_bottom": "Sort by Status and Private to Bottom", "status_and_private_to_bottom": "Status and Private to Bottom",
"sort_by_location": "Sort by Location", "location": "Location",
"sort_favorite_by": "Sort Favorites by", "last_active": "Last Active",
"sort_favorite_by_alphabet": "alphabetical", "time_in_instance": "Time in Instance",
"sort_favorite_by_online_time": "online for", "placeholder": "Sort Order",
"sort_online_by": "Sort Online by", "dropdown_header": "Choose Sort Order"
"sort_online_by_alphabet": "alphabetical",
"sort_online_by_online_time": "online for",
"sort_active_by": "Sort Active by",
"sort_active_by_alphabet": "alphabetical",
"sort_active_by_online_time": "online for",
"sort_offline_by": "Sort Offline by",
"sort_offline_by_alphabet": "alphabetical",
"sort_offline_by_offline_time": "offline for"
}, },
"width": "Width" "width": "Width"
}, },

62
html/src/mixins/tabs/settings.pug
View File

@@ -197,29 +197,37 @@ mixin settingsTab()
div.options-container div.options-container
span.header {{ $t('view.settings.appearance.side_panel.header') }} span.header {{ $t('view.settings.appearance.side_panel.header') }}
br br
span.sub-header {{ $t('view.settings.appearance.side_panel.sorting.header') }}
div.options-container-item div.options-container-item
el-radio-group(v-model="onlineAndVIPFriendsSortMethod" @change="saveOrderFriendGroup" size="mini") span.name {{ $t('view.settings.appearance.side_panel.sorting.header') }}
el-radio-button(label="Default") {{ $t('view.settings.appearance.side_panel.sorting.sort_default') }} el-select(v-model="sidebarSortMethod1" style="width:170px" :placeholder="$t('view.settings.appearance.side_panel.sorting.placeholder')" @change="saveSidebarSortOrder")
el-radio-button(label="Sort Private to Bottom") {{ $t('view.settings.appearance.side_panel.sorting.sort_private_to_bottom') }} el-option-group(:label="$t('view.settings.appearance.side_panel.sorting.dropdown_header')")
el-radio-button(label="Sort by Status") {{ $t('view.settings.appearance.side_panel.sorting.sort_by_status') }} el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.alphabetical')" value="Sort Alphabetically")
el-radio-button(label="Sort by Status and Private to Bottom") {{ $t('view.settings.appearance.side_panel.sorting.sort_by_status_and_private_to_bottom') }} el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.status')" value="Sort by Status")
el-radio-button(label="Sort by Location") {{ $t('view.settings.appearance.side_panel.sorting.sort_by_location') }} el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.private_to_bottom')" value="Sort Private to Bottom")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.last_active')" value="Sort by Last Active")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.time_in_instance')" value="Sort by Time in Instance")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.location')" value="Sort by Location")
i.el-icon-arrow-right(style="margin:16px 5px")
el-select(v-model="sidebarSortMethod2" :disabled="!sidebarSortMethod1" style="width:170px" clearable :placeholder="$t('view.settings.appearance.side_panel.sorting.placeholder')" @change="saveSidebarSortOrder")
el-option-group(:label="$t('view.settings.appearance.side_panel.sorting.dropdown_header')")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.alphabetical')" value="Sort Alphabetically")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.status')" value="Sort by Status")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.private_to_bottom')" value="Sort Private to Bottom")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.last_active')" value="Sort by Last Active")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.time_in_instance')" value="Sort by Time in Instance")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.location')" value="Sort by Location")
i.el-icon-arrow-right(style="margin:16px 5px")
el-select(v-model="sidebarSortMethod3" :disabled="!sidebarSortMethod2" style="width:170px" clearable :placeholder="$t('view.settings.appearance.side_panel.sorting.placeholder')" @change="saveSidebarSortOrder")
el-option-group(:label="$t('view.settings.appearance.side_panel.sorting.dropdown_header')")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.alphabetical')" value="Sort Alphabetically")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.status')" value="Sort by Status")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.private_to_bottom')" value="Sort Private to Bottom")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.last_active')" value="Sort by Last Active")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.time_in_instance')" value="Sort by Time in Instance")
el-option.x-friend-item(:label="$t('view.settings.appearance.side_panel.sorting.location')" value="Sort by Location")
div.options-container-item div.options-container-item
span.name {{ $t('view.settings.appearance.side_panel.sorting.sort_favorite_by') }} span.name(style="vertical-align:top;padding-top:10px") {{ $t('view.settings.appearance.side_panel.width') }}
el-switch(v-model="orderVIPFriends" :inactive-text="$t('view.settings.appearance.side_panel.sorting.sort_favorite_by_alphabet')" :active-text="$t('view.settings.appearance.side_panel.sorting.sort_favorite_by_online_time')" @change="saveOrderFriendGroup") el-slider(v-model="asideWidth" @input="setAsideWidth" :show-tooltip="false" :marks="{300: ''}" :min="200" :max="500" style="display:inline-block;width:300px")
div.options-container-item
span.name {{ $t('view.settings.appearance.side_panel.sorting.sort_online_by') }}
el-switch(v-model="orderOnlineFriends" :inactive-text="$t('view.settings.appearance.side_panel.sorting.sort_online_by_alphabet')" :active-text="$t('view.settings.appearance.side_panel.sorting.sort_online_by_online_time')" @change="saveOrderFriendGroup")
div.options-container-item
span.name {{ $t('view.settings.appearance.side_panel.sorting.sort_active_by') }}
el-switch(v-model="orderActiveFriends" :inactive-text="$t('view.settings.appearance.side_panel.sorting.sort_active_by_alphabet')" :active-text="$t('view.settings.appearance.side_panel.sorting.sort_active_by_online_time')" @change="saveOrderFriendGroup")
div.options-container-item
span.name {{ $t('view.settings.appearance.side_panel.sorting.sort_offline_by') }}
el-switch(v-model="orderOfflineFriends" :inactive-text="$t('view.settings.appearance.side_panel.sorting.sort_offline_by_alphabet')" :active-text="$t('view.settings.appearance.side_panel.sorting.sort_offline_by_offline_time')" @change="saveOrderFriendGroup")
span.sub-header {{ $t('view.settings.appearance.side_panel.width') }}
div.options-container-item
el-slider(v-model="asideWidth" @input="setAsideWidth" :show-tooltip="false" :marks="{300: ''}" :min="200" :max="500" style="width:300px")
//- Appearance | User Dialog //- Appearance | User Dialog
div.options-container div.options-container
span.header {{ $t('view.settings.appearance.user_dialog.header') }} span.header {{ $t('view.settings.appearance.user_dialog.header') }}
@@ -233,6 +241,12 @@ mixin settingsTab()
span.name {{ $t('view.settings.appearance.user_dialog.export_vrcx_memos_into_vrchat_notes') }} span.name {{ $t('view.settings.appearance.user_dialog.export_vrcx_memos_into_vrchat_notes') }}
br br
el-button(size="small" icon="el-icon-document-copy" @click="showNoteExportDialog") {{ $t('view.settings.appearance.user_dialog.export_notes') }} el-button(size="small" icon="el-icon-document-copy" @click="showNoteExportDialog") {{ $t('view.settings.appearance.user_dialog.export_notes') }}
//- Appearance | Friend Log
div.options-container
span.header {{ $t('view.settings.appearance.friend_log.header') }}
div.options-container-item
span.name {{ $t('view.settings.appearance.friend_log.hide_unfriends') }}
el-switch(v-model="hideUnfriends" @change="saveFriendLogOptions")
//- Appearance | User Colors //- Appearance | User Colors
div.options-container div.options-container
span.header {{ $t('view.settings.appearance.user_colors.header') }} span.header {{ $t('view.settings.appearance.user_colors.header') }}
@@ -261,12 +275,6 @@ mixin settingsTab()
div div
el-color-picker(v-model="trustColor.troll" @change="updatetrustColor" size="mini" :predefine="['#782f2f']") el-color-picker(v-model="trustColor.troll" @change="updatetrustColor" size="mini" :predefine="['#782f2f']")
span.color-picker(slot="trigger" class="x-tag-troll") Nuisance span.color-picker(slot="trigger" class="x-tag-troll") Nuisance
//- Appearance | Friend Log
div.options-container
span.header {{ $t('view.settings.appearance.friend_log.header') }}
div.options-container-item
span.name {{ $t('view.settings.appearance.friend_log.hide_unfriends') }}
el-switch(v-model="hideUnfriends" @change="saveFriendLogOptions")
//- Notifications Tab //- Notifications Tab
el-tab-pane(:label="$t('view.settings.category.notifications')") el-tab-pane(:label="$t('view.settings.category.notifications')")
//- Notifications | Notifications //- Notifications | Notifications