refactor: app.js (#1291)

* refactor: frontend

* Fix avatar gallery sort

* Update .NET dependencies

* Update npm dependencies

electron v37.1.0

* bulkRefreshFriends

* fix dark theme

* Remove crowdin

* Fix config.json dialog not updating

* VRCX log file fixes & add Cef log

* Remove SharedVariable, fix startup

* Revert init theme change

* Logging date not working? Fix WinformThemer designer error

* Add Cef request hander, no more escaping main page

* clean

* fix

* fix

* clean

* uh

* Apply thememode at startup, fixes random user colours

* Split database into files

* Instance info remove empty lines

* Open external VRC links with VRCX

* Electron fixes

* fix userdialog style

* ohhhh

* fix store

* fix store

* fix: load all group members after kicking a user

* fix: world dialog favorite button style

* fix: Clear VRCX Cache Timer input value

* clean

* Fix VR overlay

* Fix VR overlay 2

* Fix Discord discord rich presence for RPC worlds

* Clean up age verified user tags

* Fix playerList being occupied after program reload

* no `this`

* Fix login stuck loading

* writable: false

* Hide dialogs on logout

* add flush sync option

* rm LOGIN event

* rm LOGOUT event

* remove duplicate event listeners

* remove duplicate event listeners

* clean

* remove duplicate event listeners

* clean

* fix theme style

* fix t

* clearable

* clean

* fix ipcEvent

* Small changes

* Popcorn Palace support

* Remove checkActiveFriends

* Clean up

* Fix dragEnterCef

* Block API requests when not logged in

* Clear state on login & logout

* Fix worldDialog instances not updating

* use <script setup>

* Fix avatar change event, CheckGameRunning at startup

* Fix image dragging

* fix

* Remove PWI

* fix updateLoop

* add webpack-dev-server to dev environment

* rm unnecessary chunks

* use <script setup>

* webpack-dev-server changes

* use <script setup>

* use <script setup>

* Fix UGC text size

* Split login event

* t

* use <script setup>

* fix

* Update .gitignore and enable checkJs in jsconfig

* fix i18n t

* use <script setup>

* use <script setup>

* clean

* global types

* fix

* use checkJs for debugging

* Add watchState for login watchers

* fix .vue template

* type fixes

* rm Vue.filter

* Cef v138.0.170, VC++ 2022

* Settings fixes

* Remove 'USER:CURRENT'

* clean up 2FA callbacks

* remove userApply

* rm i18n import

* notification handling to use notification store methods

* refactor favorite handling to use favorite store methods and clean up event emissions

* refactor moderation handling to use dedicated functions for player moderation events

* refactor friend handling to use dedicated functions for friend events

* Fix program startup, move lang init

* Fix friend state

* Fix status change error

* Fix user notes diff

* fix

* rm group event

* rm auth event

* rm avatar event

* clean

* clean

* getUser

* getFriends

* getFavoriteWorlds, getFavoriteAvatars

* AvatarGalleryUpload btn style & package.json update

* Fix friend requests

* Apply user

* Apply world

* Fix note diff

* Fix VR overlay

* Fixes

* Update build scripts

* Apply avatar

* Apply instance

* Apply group

* update hidden VRC+ badge

* Fix sameInstance "private"

* fix 502/504 API errors

* fix 502/504 API errors

* clean

* Fix friend in same instance on orange showing twice in friends list

* Add back in broken friend state repair methods

* add types

---------

Co-authored-by: Natsumi <cmcooper123@hotmail.com>
This commit is contained in:
pa
2025-07-14 12:00:08 +09:00
committed by GitHub
parent 952fd77ed5
commit f4f78bb5ec
323 changed files with 47745 additions and 43326 deletions

View File

@@ -16,7 +16,7 @@
</el-tooltip>
<el-dropdown-menu slot="dropdown">
<template
v-for="groupAPI in API.favoriteAvatarGroups"
v-for="groupAPI in favoriteAvatarGroups"
v-if="isLocalFavorite || groupAPI.name !== group.name">
<el-dropdown-item
:key="groupAPI.name"
@@ -36,22 +36,22 @@
<el-tooltip
v-if="favorite.deleted"
placement="left"
:content="$t('view.favorite.unavailable_tooltip')">
:content="t('view.favorite.unavailable_tooltip')">
<i class="el-icon-warning" style="color: #f56c6c; margin-left: 5px"></i>
</el-tooltip>
<el-tooltip
v-if="favorite.ref.releaseStatus === 'private'"
placement="left"
:content="$t('view.favorite.private')">
:content="t('view.favorite.private')">
<i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
</el-tooltip>
<el-tooltip
v-if="favorite.ref.releaseStatus !== 'private' && !favorite.deleted"
placement="left"
:content="$t('view.favorite.select_avatar_tooltip')"
:content="t('view.favorite.select_avatar_tooltip')"
:disabled="hideTooltips">
<el-button
:disabled="API.currentUser.currentAvatar === favorite.id"
:disabled="currentUser.currentAvatar === favorite.id"
size="mini"
icon="el-icon-check"
circle
@@ -60,7 +60,7 @@
</el-tooltip>
<el-tooltip
placement="right"
:content="$t('view.favorite.unfavorite_tooltip')"
:content="t('view.favorite.unfavorite_tooltip')"
:disabled="hideTooltips">
<el-button
v-if="shiftHeld"
@@ -82,10 +82,10 @@
<template v-else>
<el-tooltip
placement="left"
:content="$t('view.favorite.select_avatar_tooltip')"
:content="t('view.favorite.select_avatar_tooltip')"
:disabled="hideTooltips">
<el-button
:disabled="API.currentUser.currentAvatar === favorite.id"
:disabled="currentUser.currentAvatar === favorite.id"
size="mini"
circle
style="margin-left: 5px"
@@ -96,7 +96,7 @@
<el-tooltip
v-if="isLocalFavorite"
placement="right"
:content="$t('view.favorite.unfavorite_tooltip')"
:content="t('view.favorite.unfavorite_tooltip')"
:disabled="hideTooltips">
<el-button
v-if="shiftHeld"
@@ -139,104 +139,84 @@
</div>
</template>
<script>
<script setup>
import { storeToRefs } from 'pinia';
import { computed } from 'vue';
import { useI18n } from 'vue-i18n-bridge';
import { favoriteRequest } from '../../../api';
import { $app } from '../../../app';
import {
useAppearanceSettingsStore,
useAvatarStore,
useFavoriteStore,
useUiStore,
useUserStore
} from '../../../stores';
export default {
name: 'FavoritesAvatarItem',
inject: ['API', 'showFavoriteDialog'],
props: {
favorite: Object,
group: [Object, String],
editFavoritesMode: Boolean,
shiftHeld: Boolean,
hideTooltips: Boolean,
isLocalFavorite: Boolean
},
computed: {
isSelected: {
get() {
return this.favorite.$selected;
},
set(value) {
this.$emit('handle-select', value);
}
},
localFavFakeRef() {
// local favorite no "ref" property
return this.isLocalFavorite ? this.favorite : this.favorite.ref;
},
tooltipContent() {
return $t(this.isLocalFavorite ? 'view.favorite.copy_tooltip' : 'view.favorite.move_tooltip');
},
smallThumbnail() {
return (
this.localFavFakeRef.thumbnailImageUrl.replace('256', '128') ||
this.localFavFakeRef.thumbnailImageUrl
);
}
},
methods: {
moveFavorite(ref, group, type) {
favoriteRequest
.deleteFavorite({
objectId: ref.id
})
.then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: ref.id,
tags: group.name
});
});
},
selectAvatarWithConfirmation() {
this.$emit('select-avatar-with-confirmation', this.favorite.id);
},
deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({
objectId
const props = defineProps({
favorite: Object,
group: [Object, String],
editFavoritesMode: Boolean,
isLocalFavorite: Boolean
});
const emit = defineEmits(['click', 'handle-select']);
const { t } = useI18n();
const { hideTooltips } = storeToRefs(useAppearanceSettingsStore());
const { favoriteAvatarGroups } = storeToRefs(useFavoriteStore());
const { removeLocalAvatarFavorite, showFavoriteDialog } = useFavoriteStore();
const { selectAvatarWithConfirmation } = useAvatarStore();
const { shiftHeld } = storeToRefs(useUiStore());
const { currentUser } = storeToRefs(useUserStore());
const isSelected = computed({
get: () => props.favorite.$selected,
set: (value) => emit('handle-select', value)
});
const localFavFakeRef = computed(() => (props.isLocalFavorite ? props.favorite : props.favorite.ref));
const tooltipContent = computed(() =>
t(props.isLocalFavorite ? 'view.favorite.copy_tooltip' : 'view.favorite.move_tooltip')
);
const smallThumbnail = computed(
() => localFavFakeRef.value.thumbnailImageUrl.replace('256', '128') || localFavFakeRef.value.thumbnailImageUrl
);
function moveFavorite(ref, group, type) {
favoriteRequest.deleteFavorite({ objectId: ref.id }).then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: ref.id,
tags: group.name
});
});
}
function deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({ objectId });
}
function addFavoriteAvatar(groupAPI) {
return favoriteRequest
.addFavorite({
type: 'avatar',
favoriteId: props.favorite.id,
tags: groupAPI.name
})
.then((args) => {
$app.$message({
message: 'Avatar added to favorites',
type: 'success'
});
// FIXME: 메시지 수정
// this.$confirm('Continue? Delete Favorite', 'Confirm', {
// confirmButtonText: 'Confirm',
// cancelButtonText: 'Cancel',
// type: 'info',
// callback: (action) => {
// if (action === 'confirm') {
// API.deleteFavorite({
// objectId
// });
// }
// }
// });
},
addFavoriteAvatar(groupAPI) {
return favoriteRequest
.addFavorite({
type: 'avatar',
favoriteId: this.favorite.id,
tags: groupAPI.name
})
.then((args) => {
this.$message({
message: 'Avatar added to favorites',
type: 'success'
});
return args;
});
}
return args;
});
},
handleDropdownItemClick(groupAPI) {
if (this.isLocalFavorite) {
this.addFavoriteAvatar(groupAPI);
} else {
this.moveFavorite(this.favorite.ref, groupAPI, 'avatar');
}
},
removeLocalAvatarFavorite() {
this.$emit('remove-local-avatar-favorite', this.favorite.id, this.group);
}
function handleDropdownItemClick(groupAPI) {
if (props.isLocalFavorite) {
addFavoriteAvatar(groupAPI);
} else {
moveFavorite(props.favorite.ref, groupAPI, 'avatar');
}
};
}
</script>

View File

@@ -8,16 +8,16 @@
<span class="name" v-text="favorite.name"></span>
<span class="extra" v-text="favorite.authorName"></span>
</div>
<el-tooltip placement="left" :content="$t('view.favorite.select_avatar_tooltip')" :disabled="hideTooltips">
<el-tooltip placement="left" :content="t('view.favorite.select_avatar_tooltip')" :disabled="hideTooltips">
<el-button
:disabled="API.currentUser.currentAvatar === favorite.id"
:disabled="currentUser.currentAvatar === favorite.id"
size="mini"
icon="el-icon-check"
circle
style="margin-left: 5px"
@click.stop="selectAvatarWithConfirmation"></el-button>
</el-tooltip>
<template v-if="API.cachedFavoritesByObjectId.has(favorite.id)">
<template v-if="cachedFavoritesByObjectId.has(favorite.id)">
<el-tooltip placement="right" content="Unfavorite" :disabled="hideTooltips">
<el-button
type="default"
@@ -43,26 +43,28 @@
</div>
</template>
<script>
export default {
name: 'FavoritesAvatarLocalHistoryItem',
inject: ['API', 'showFavoriteDialog'],
props: {
favorite: {
type: Object,
required: true
},
hideTooltips: Boolean
},
computed: {
smallThumbnail() {
return this.favorite.thumbnailImageUrl.replace('256', '128') || this.favorite.thumbnailImageUrl;
}
},
methods: {
selectAvatarWithConfirmation() {
this.$emit('select-avatar-with-confirmation', this.favorite.id);
}
<script setup>
import { storeToRefs } from 'pinia';
import { computed } from 'vue';
import { useI18n } from 'vue-i18n-bridge';
import { useAppearanceSettingsStore, useAvatarStore, useFavoriteStore, useUserStore } from '../../../stores';
const { t } = useI18n();
const { hideTooltips } = storeToRefs(useAppearanceSettingsStore());
const { cachedFavoritesByObjectId } = storeToRefs(useFavoriteStore());
const { showFavoriteDialog } = useFavoriteStore();
const { selectAvatarWithConfirmation } = useAvatarStore();
const { currentUser } = storeToRefs(useUserStore());
const props = defineProps({
favorite: {
type: Object,
required: true
}
};
});
const smallThumbnail = computed(() => {
return props.favorite.thumbnailImageUrl.replace('256', '128') || props.favorite.thumbnailImageUrl;
});
</script>

View File

@@ -3,29 +3,29 @@
<div style="display: flex; align-items: center; justify-content: space-between">
<div>
<el-button size="small" @click="showAvatarExportDialog">
{{ $t('view.favorite.export') }}
{{ t('view.favorite.export') }}
</el-button>
<el-button size="small" style="margin-left: 5px" @click="showAvatarImportDialog">
{{ $t('view.favorite.import') }}
{{ t('view.favorite.import') }}
</el-button>
</div>
<div style="display: flex; align-items: center; font-size: 13px; margin-right: 10px">
<span class="name" style="margin-right: 5px; line-height: 10px">
{{ $t('view.favorite.sort_by') }}
{{ t('view.favorite.sort_by') }}
</span>
<el-radio-group v-model="sortFav" style="margin-right: 12px" @change="saveSortFavoritesOption">
<el-radio :label="false">
{{ $t('view.settings.appearance.appearance.sort_favorite_by_name') }}
{{ t('view.settings.appearance.appearance.sort_favorite_by_name') }}
</el-radio>
<el-radio :label="true">
{{ $t('view.settings.appearance.appearance.sort_favorite_by_date') }}
{{ t('view.settings.appearance.appearance.sort_favorite_by_date') }}
</el-radio>
</el-radio-group>
<el-input
v-model="avatarFavoriteSearch"
clearable
size="mini"
:placeholder="$t('view.favorite.avatars.search')"
:placeholder="t('view.favorite.avatars.search')"
style="width: 200px"
@input="searchAvatarFavorites" />
</div>
@@ -56,16 +56,16 @@
</div>
</div>
<span style="display: block; margin-top: 20px">
{{ $t('view.favorite.avatars.vrchat_favorites') }}
{{ t('view.favorite.avatars.vrchat_favorites') }}
</span>
<el-collapse style="border: 0">
<el-collapse-item v-for="group in API.favoriteAvatarGroups" :key="group.name">
<el-collapse-item v-for="group in favoriteAvatarGroups" :key="group.name">
<template slot="title">
<span style="font-weight: bold; font-size: 14px; margin-left: 10px" v-text="group.displayName" />
<span style="color: #909399; font-size: 12px; margin-left: 10px">
{{ group.count }}/{{ group.capacity }}
</span>
<el-tooltip placement="top" :content="$t('view.favorite.rename_tooltip')" :disabled="hideTooltips">
<el-tooltip placement="top" :content="t('view.favorite.rename_tooltip')" :disabled="hideTooltips">
<el-button
size="mini"
icon="el-icon-edit"
@@ -73,7 +73,7 @@
style="margin-left: 10px"
@click.stop="changeFavoriteGroupName(group)" />
</el-tooltip>
<el-tooltip placement="right" :content="$t('view.favorite.clear_tooltip')" :disabled="hideTooltips">
<el-tooltip placement="right" :content="t('view.favorite.clear_tooltip')" :disabled="hideTooltips">
<el-button
size="mini"
icon="el-icon-delete"
@@ -89,12 +89,9 @@
:favorite="favorite"
:group="group"
:hide-tooltips="hideTooltips"
:shift-held="shiftHeld"
:edit-favorites-mode="editFavoritesMode"
style="display: inline-block; width: 300px; margin-right: 15px"
@handle-select="favorite.$selected = $event"
@remove-local-avatar-favorite="removeLocalAvatarFavorite"
@select-avatar-with-confirmation="selectAvatarWithConfirmation"
@click="showAvatarDialog(favorite.id)" />
</div>
<div
@@ -132,7 +129,6 @@
style="display: inline-block; width: 300px; margin-right: 15px"
:favorite="favorite"
:hide-tooltips="hideTooltips"
@select-avatar-with-confirmation="selectAvatarWithConfirmation"
@click="showAvatarDialog(favorite.id)" />
</div>
<div
@@ -148,21 +144,21 @@
<span>No Data</span>
</div>
</el-collapse-item>
<span style="display: block; margin-top: 20px">{{ $t('view.favorite.avatars.local_favorites') }}</span>
<span style="display: block; margin-top: 20px">{{ t('view.favorite.avatars.local_favorites') }}</span>
<br />
<el-button size="small" :disabled="!isLocalUserVrcplusSupporter" @click="promptNewLocalAvatarFavoriteGroup">
{{ $t('view.favorite.avatars.new_group') }}
{{ t('view.favorite.avatars.new_group') }}
</el-button>
<el-button
v-if="!refreshingLocalFavorites"
size="small"
style="margin-left: 5px"
@click="refreshLocalAvatarFavorites">
{{ $t('view.favorite.avatars.refresh') }}
{{ t('view.favorite.avatars.refresh') }}
</el-button>
<el-button v-else size="small" style="margin-left: 5px" @click="refreshingLocalFavorites = false">
<i class="el-icon-loading" style="margin-right: 5px"></i>
<span>{{ $t('view.favorite.avatars.cancel_refresh') }}</span>
<span>{{ t('view.favorite.avatars.cancel_refresh') }}</span>
</el-button>
<el-collapse-item
v-for="group in localAvatarFavoriteGroups"
@@ -173,7 +169,7 @@
<span :style="{ color: '#909399', fontSize: '12px', marginLeft: '10px' }">{{
getLocalAvatarFavoriteGroupLength(group)
}}</span>
<el-tooltip placement="top" :content="$t('view.favorite.rename_tooltip')" :disabled="hideTooltips">
<el-tooltip placement="top" :content="t('view.favorite.rename_tooltip')" :disabled="hideTooltips">
<el-button
size="mini"
icon="el-icon-edit"
@@ -181,10 +177,7 @@
:style="{ marginLeft: '5px' }"
@click.stop="promptLocalAvatarFavoriteGroupRename(group)"></el-button>
</el-tooltip>
<el-tooltip
placement="right"
:content="$t('view.favorite.delete_tooltip')"
:disabled="hideTooltips">
<el-tooltip placement="right" :content="t('view.favorite.delete_tooltip')" :disabled="hideTooltips">
<el-button
size="mini"
icon="el-icon-delete"
@@ -202,11 +195,8 @@
:favorite="favorite"
:group="group"
:hide-tooltips="hideTooltips"
:shift-held="shiftHeld"
:edit-favorites-mode="editFavoritesMode"
@handle-select="favorite.$selected = $event"
@remove-local-avatar-favorite="removeLocalAvatarFavorite"
@select-avatar-with-confirmation="selectAvatarWithConfirmation"
@click="showAvatarDialog(favorite.id)" />
</div>
<div
@@ -223,178 +213,205 @@
</div>
</el-collapse-item>
</el-collapse>
<AvatarExportDialog
:avatar-export-dialog-visible.sync="avatarExportDialogVisible"
:favorite-avatars="favoriteAvatars"
:local-avatar-favorite-groups="localAvatarFavoriteGroups"
:local-avatar-favorites="localAvatarFavorites"
:local-avatar-favorites-list="localAvatarFavoritesList" />
<AvatarExportDialog :avatar-export-dialog-visible.sync="avatarExportDialogVisible" />
</div>
</template>
<script>
<script setup>
import { ref, computed, getCurrentInstance } from 'vue';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n-bridge';
import { favoriteRequest } from '../../../api';
import { useAppearanceSettingsStore, useAvatarStore, useFavoriteStore, useUserStore } from '../../../stores';
import AvatarExportDialog from '../dialogs/AvatarExportDialog.vue';
import FavoritesAvatarItem from './FavoritesAvatarItem.vue';
import FavoritesAvatarLocalHistoryItem from './FavoritesAvatarLocalHistoryItem.vue';
import AvatarExportDialog from '../dialogs/AvatarExportDialog.vue';
import { favoriteRequest } from '../../../api';
export default {
name: 'FavoritesAvatarTab',
components: { FavoritesAvatarItem, FavoritesAvatarLocalHistoryItem, AvatarExportDialog },
inject: ['API', 'showAvatarDialog'],
props: {
sortFavorites: Boolean,
hideTooltips: Boolean,
shiftHeld: Boolean,
editFavoritesMode: Boolean,
avatarHistoryArray: Array,
refreshingLocalFavorites: Boolean,
localAvatarFavoriteGroups: Array,
localAvatarFavorites: Object,
favoriteAvatars: Array,
localAvatarFavoritesList: Array
defineProps({
editFavoritesMode: {
type: Boolean,
default: false
},
data() {
return {
avatarExportDialogVisible: false,
avatarFavoriteSearch: '',
avatarFavoriteSearchResults: []
};
refreshingLocalFavorites: {
type: Boolean,
default: false
}
});
const { proxy } = getCurrentInstance();
const emit = defineEmits(['change-favorite-group-name', 'refresh-local-avatar-favorites']);
const { hideTooltips, sortFavorites } = storeToRefs(useAppearanceSettingsStore());
const { setSortFavorites } = useAppearanceSettingsStore();
const { favoriteAvatars, favoriteAvatarGroups, localAvatarFavorites, localAvatarFavoriteGroups } =
storeToRefs(useFavoriteStore());
const {
showAvatarImportDialog,
getLocalAvatarFavoriteGroupLength,
deleteLocalAvatarFavoriteGroup,
renameLocalAvatarFavoriteGroup,
newLocalAvatarFavoriteGroup,
saveSortFavoritesOption
} = useFavoriteStore();
const { avatarHistoryArray } = storeToRefs(useAvatarStore());
const { promptClearAvatarHistory, showAvatarDialog } = useAvatarStore();
const { currentUser } = storeToRefs(useUserStore());
const { t } = useI18n();
const avatarExportDialogVisible = ref(false);
const avatarFavoriteSearch = ref('');
const avatarFavoriteSearchResults = ref([]);
const sortFav = computed({
get() {
return sortFavorites.value;
},
computed: {
sortFav: {
get() {
return this.sortFavorites;
},
set(value) {
this.$emit('update:sort-favorites', value);
set() {
setSortFavorites();
}
});
const groupedByGroupKeyFavoriteAvatars = computed(() => {
const groupedByGroupKeyFavoriteAvatars = {};
favoriteAvatars.value.forEach((avatar) => {
if (avatar.groupKey) {
if (!groupedByGroupKeyFavoriteAvatars[avatar.groupKey]) {
groupedByGroupKeyFavoriteAvatars[avatar.groupKey] = [];
}
},
groupedByGroupKeyFavoriteAvatars() {
const groupedByGroupKeyFavoriteAvatars = {};
this.favoriteAvatars.forEach((avatar) => {
if (avatar.groupKey) {
if (!groupedByGroupKeyFavoriteAvatars[avatar.groupKey]) {
groupedByGroupKeyFavoriteAvatars[avatar.groupKey] = [];
}
groupedByGroupKeyFavoriteAvatars[avatar.groupKey].push(avatar);
}
});
return groupedByGroupKeyFavoriteAvatars;
},
isLocalUserVrcplusSupporter() {
return this.API.currentUser.$isVRCPlus;
groupedByGroupKeyFavoriteAvatars[avatar.groupKey].push(avatar);
}
},
methods: {
getLocalAvatarFavoriteGroupLength(group) {
const favoriteGroup = this.localAvatarFavorites[group];
if (!favoriteGroup) {
return 0;
}
return favoriteGroup.length;
},
searchAvatarFavorites() {
let ref = null;
const search = this.avatarFavoriteSearch.toLowerCase();
if (search.length < 3) {
this.avatarFavoriteSearchResults = [];
return;
}
});
const results = [];
for (let i = 0; i < this.localAvatarFavoriteGroups.length; ++i) {
const group = this.localAvatarFavoriteGroups[i];
if (!this.localAvatarFavorites[group]) {
continue;
}
for (let j = 0; j < this.localAvatarFavorites[group].length; ++j) {
ref = this.localAvatarFavorites[group][j];
if (
!ref ||
typeof ref.id === 'undefined' ||
typeof ref.name === 'undefined' ||
typeof ref.authorName === 'undefined'
) {
continue;
}
if (ref.name.toLowerCase().includes(search) || ref.authorName.toLowerCase().includes(search)) {
if (!results.some((r) => r.id === ref.id)) {
results.push(ref);
}
}
return groupedByGroupKeyFavoriteAvatars;
});
const isLocalUserVrcplusSupporter = computed(() => currentUser.value.$isVRCPlus);
function searchAvatarFavorites() {
let ref = null;
const search = avatarFavoriteSearch.value.toLowerCase();
if (search.length < 3) {
avatarFavoriteSearchResults.value = [];
return;
}
const results = [];
for (let i = 0; i < localAvatarFavoriteGroups.value.length; ++i) {
const group = localAvatarFavoriteGroups.value[i];
if (!localAvatarFavorites.value[group]) {
continue;
}
for (let j = 0; j < localAvatarFavorites.value[group].length; ++j) {
ref = localAvatarFavorites.value[group][j];
if (
!ref ||
typeof ref.id === 'undefined' ||
typeof ref.name === 'undefined' ||
typeof ref.authorName === 'undefined'
) {
continue;
}
if (ref.name.toLowerCase().includes(search) || ref.authorName.toLowerCase().includes(search)) {
if (!results.some((r) => r.id === ref.id)) {
results.push(ref);
}
}
for (let i = 0; i < this.favoriteAvatars.length; ++i) {
ref = this.favoriteAvatars[i].ref;
if (
!ref ||
typeof ref.id === 'undefined' ||
typeof ref.name === 'undefined' ||
typeof ref.authorName === 'undefined'
) {
continue;
}
if (ref.name.toLowerCase().includes(search) || ref.authorName.toLowerCase().includes(search)) {
if (!results.some((r) => r.id === ref.id)) {
results.push(ref);
}
}
}
this.avatarFavoriteSearchResults = results;
},
clearFavoriteGroup(ctx) {
// FIXME: 메시지 수정
this.$confirm('Continue? Clear Group', 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
favoriteRequest.clearFavoriteGroup({
type: ctx.type,
group: ctx.name
});
}
}
});
},
showAvatarExportDialog() {
this.avatarExportDialogVisible = true;
},
showAvatarImportDialog() {
this.$emit('show-avatar-import-dialog');
},
saveSortFavoritesOption() {
this.$emit('save-sort-favorites-option');
},
changeFavoriteGroupName(group) {
this.$emit('change-favorite-group-name', group);
},
removeLocalAvatarFavorite(id, group) {
this.$emit('remove-local-avatar-favorite', id, group);
},
selectAvatarWithConfirmation(id) {
this.$emit('select-avatar-with-confirmation', id);
},
promptClearAvatarHistory() {
this.$emit('prompt-clear-avatar-history');
},
promptNewLocalAvatarFavoriteGroup() {
this.$emit('prompt-new-local-avatar-favorite-group');
},
refreshLocalAvatarFavorites() {
this.$emit('refresh-local-avatar-favorites');
},
promptLocalAvatarFavoriteGroupRename(group) {
this.$emit('prompt-local-avatar-favorite-group-rename', group);
},
promptLocalAvatarFavoriteGroupDelete(group) {
this.$emit('prompt-local-avatar-favorite-group-delete', group);
}
}
};
for (let i = 0; i < favoriteAvatars.value.length; ++i) {
ref = favoriteAvatars.value[i].ref;
if (
!ref ||
typeof ref.id === 'undefined' ||
typeof ref.name === 'undefined' ||
typeof ref.authorName === 'undefined'
) {
continue;
}
if (ref.name.toLowerCase().includes(search) || ref.authorName.toLowerCase().includes(search)) {
if (!results.some((r) => r.id === ref.id)) {
results.push(ref);
}
}
}
avatarFavoriteSearchResults.value = results;
}
function clearFavoriteGroup(ctx) {
proxy.$confirm('Continue? Clear Group', 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
favoriteRequest.clearFavoriteGroup({
type: ctx.type,
group: ctx.name
});
}
}
});
}
function showAvatarExportDialog() {
avatarExportDialogVisible.value = true;
}
function changeFavoriteGroupName(group) {
emit('change-favorite-group-name', group);
}
function promptNewLocalAvatarFavoriteGroup() {
proxy.$prompt(t('prompt.new_local_favorite_group.description'), t('prompt.new_local_favorite_group.header'), {
distinguishCancelAndClose: true,
confirmButtonText: t('prompt.new_local_favorite_group.ok'),
cancelButtonText: t('prompt.new_local_favorite_group.cancel'),
inputPattern: /\S+/,
inputErrorMessage: t('prompt.new_local_favorite_group.input_error'),
callback: (action, instance) => {
if (action === 'confirm' && instance.inputValue) {
newLocalAvatarFavoriteGroup(instance.inputValue);
}
}
});
}
function refreshLocalAvatarFavorites() {
emit('refresh-local-avatar-favorites');
}
function promptLocalAvatarFavoriteGroupRename(group) {
proxy.$prompt(
t('prompt.local_favorite_group_rename.description'),
t('prompt.local_favorite_group_rename.header'),
{
distinguishCancelAndClose: true,
confirmButtonText: t('prompt.local_favorite_group_rename.save'),
cancelButtonText: t('prompt.local_favorite_group_rename.cancel'),
inputPattern: /\S+/,
inputErrorMessage: t('prompt.local_favorite_group_rename.input_error'),
inputValue: group,
callback: (action, instance) => {
if (action === 'confirm' && instance.inputValue) {
renameLocalAvatarFavoriteGroup(instance.inputValue, group);
}
}
}
);
}
function promptLocalAvatarFavoriteGroupDelete(group) {
proxy.$confirm(`Delete Group? ${group}`, 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
deleteLocalAvatarFavoriteGroup(group);
}
}
});
}
</script>

View File

@@ -10,12 +10,12 @@
class="name"
:style="{ color: favorite.ref.$userColour }"
v-text="favorite.ref.displayName"></span>
<location
<Location
class="extra"
v-if="favorite.ref.location !== 'offline'"
:location="favorite.ref.location"
:traveling="favorite.ref.travelingToLocation"
:link="false"></location>
:link="false" />
<span v-else v-text="favorite.ref.statusDescription"></span>
</div>
<template v-if="editFavoritesMode">
@@ -27,7 +27,7 @@
<el-button type="default" icon="el-icon-back" size="mini" circle></el-button>
</el-tooltip>
<el-dropdown-menu slot="dropdown">
<template v-for="groupAPI in API.favoriteFriendGroups">
<template v-for="groupAPI in favoriteFriendGroups">
<el-dropdown-item
v-if="groupAPI.name !== group.name"
:key="groupAPI.name"
@@ -82,63 +82,36 @@
</div>
</template>
<script>
import Location from '../../../components/Location.vue';
<script setup>
import { storeToRefs } from 'pinia';
import { favoriteRequest } from '../../../api';
export default {
components: { Location },
inject: ['showUserDialog', 'userImage', 'userStatusClass', 'API', 'showFavoriteDialog'],
props: {
favorite: {
type: Object,
required: true
},
hideTooltips: {
type: Boolean,
default: false
},
shiftHeld: {
type: Boolean,
default: false
},
group: {
type: Object,
required: true
},
editFavoritesMode: Boolean
},
methods: {
moveFavorite(ref, group, type) {
favoriteRequest
.deleteFavorite({
objectId: ref.id
})
.then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: ref.id,
tags: group.name
});
});
},
deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({
objectId
});
// FIXME: 메시지 수정
// this.$confirm('Continue? Delete Favorite', 'Confirm', {
// confirmButtonText: 'Confirm',
// cancelButtonText: 'Cancel',
// type: 'info',
// callback: (action) => {
// if (action === 'confirm') {
// API.deleteFavorite({
// objectId
// });
// }
// }
// });
}
}
};
import { userImage, userStatusClass } from '../../../shared/utils';
import { useAppearanceSettingsStore, useFavoriteStore, useUiStore } from '../../../stores';
defineProps({
favorite: { type: Object, required: true },
group: { type: Object, required: true },
editFavoritesMode: Boolean
});
defineEmits(['click']);
const { hideTooltips } = storeToRefs(useAppearanceSettingsStore());
const { favoriteFriendGroups } = storeToRefs(useFavoriteStore());
const { showFavoriteDialog } = useFavoriteStore();
const { shiftHeld } = storeToRefs(useUiStore());
function moveFavorite(ref, group, type) {
favoriteRequest.deleteFavorite({ objectId: ref.id }).then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: ref.id,
tags: group.name
});
});
}
function deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({ objectId });
}
</script>

View File

@@ -21,7 +21,7 @@
</div>
<span style="display: block; margin-top: 30px">{{ $t('view.favorite.avatars.vrchat_favorites') }}</span>
<el-collapse style="border: 0">
<el-collapse-item v-for="group in API.favoriteFriendGroups" :key="group.name">
<el-collapse-item v-for="group in favoriteFriendGroups" :key="group.name">
<template slot="title">
<span
style="font-weight: bold; font-size: 14px; margin-left: 10px"
@@ -70,73 +70,67 @@
</div>
</el-collapse-item>
</el-collapse>
<FriendExportDialog
:friend-export-dialog-visible.sync="friendExportDialogVisible"
:favorite-friends="favoriteFriends" />
<FriendExportDialog :friend-export-dialog-visible.sync="friendExportDialogVisible" />
</div>
</template>
<script>
import FavoritesFriendItem from './FavoritesFriendItem.vue';
import FriendExportDialog from '../dialogs/FriendExportDialog.vue';
<script setup>
import { ref, getCurrentInstance, computed } from 'vue';
import { storeToRefs } from 'pinia';
import { favoriteRequest } from '../../../api';
import { useAppearanceSettingsStore, useFavoriteStore, useUserStore } from '../../../stores';
import FriendExportDialog from '../dialogs/FriendExportDialog.vue';
import FavoritesFriendItem from './FavoritesFriendItem.vue';
export default {
name: 'FavoritesFriendTab',
components: { FriendExportDialog, FavoritesFriendItem },
inject: ['showUserDialog', 'API'],
props: {
favoriteFriends: Array,
sortFavorites: Boolean,
hideTooltips: Boolean,
groupedByGroupKeyFavoriteFriends: Object,
editFavoritesMode: Boolean
defineProps({
editFavoritesMode: {
type: Boolean,
default: false
}
});
const emit = defineEmits(['change-favorite-group-name']);
const { proxy } = getCurrentInstance();
const { hideTooltips, sortFavorites } = storeToRefs(useAppearanceSettingsStore());
const { setSortFavorites } = useAppearanceSettingsStore();
const { showUserDialog } = useUserStore();
const { favoriteFriendGroups, groupedByGroupKeyFavoriteFriends } = storeToRefs(useFavoriteStore());
const { showFriendImportDialog, saveSortFavoritesOption } = useFavoriteStore();
const friendExportDialogVisible = ref(false);
const sortFav = computed({
get() {
return sortFavorites.value;
},
data() {
return {
friendExportDialogVisible: false
};
},
computed: {
sortFav: {
get() {
return this.sortFavorites;
},
set(value) {
this.$emit('update:sort-favorites', value);
set(value) {
setSortFavorites(value);
}
});
function showFriendExportDialog() {
friendExportDialogVisible.value = true;
}
function clearFavoriteGroup(ctx) {
proxy.$confirm('Continue? Clear Group', 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
favoriteRequest.clearFavoriteGroup({
type: ctx.type,
group: ctx.name
});
}
}
},
methods: {
showFriendExportDialog() {
this.friendExportDialogVisible = true;
},
showFriendImportDialog() {
this.$emit('show-friend-import-dialog');
},
saveSortFavoritesOption() {
this.$emit('save-sort-favorites-option');
},
});
}
clearFavoriteGroup(ctx) {
// FIXME: 메시지 수정
this.$confirm('Continue? Clear Group', 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
favoriteRequest.clearFavoriteGroup({
type: ctx.type,
group: ctx.name
});
}
}
});
},
changeFavoriteGroupName(group) {
this.$emit('change-favorite-group-name', group);
}
}
};
function changeFavoriteGroupName(group) {
emit('change-favorite-group-name', group);
}
</script>

View File

@@ -6,11 +6,11 @@
<img v-lazy="smallThumbnail" />
</div>
<div class="detail">
<span class="name">{{ localFavFakeRef.name }}</span>
<span v-if="localFavFakeRef.occupants" class="extra"
<span class="name" v-once>{{ localFavFakeRef.name }}</span>
<span v-if="localFavFakeRef.occupants" class="extra" v-once
>{{ localFavFakeRef.authorName }} ({{ localFavFakeRef.occupants }})</span
>
<span v-else class="extra">{{ localFavFakeRef.authorName }}</span>
<span v-else class="extra" v-once>{{ localFavFakeRef.authorName }}</span>
</div>
<template v-if="editFavoritesMode">
<el-dropdown trigger="click" size="mini" style="margin-left: 5px" @click.native.stop>
@@ -21,7 +21,7 @@
<el-button type="default" icon="el-icon-back" size="mini" circle></el-button>
</el-tooltip>
<el-dropdown-menu slot="dropdown">
<template v-for="groupAPI in API.favoriteWorldGroups">
<template v-for="groupAPI in favoriteWorldGroups">
<el-dropdown-item
v-if="isLocalFavorite || groupAPI.name !== group.name"
:key="groupAPI.name"
@@ -59,7 +59,7 @@
size="mini"
icon="el-icon-message"
style="margin-left: 5px"
@click.stop="$emit('new-instance-self-invite', favorite.id)"
@click.stop="newInstanceSelfInvite(favorite.id)"
circle></el-button>
</el-tooltip>
<el-tooltip
@@ -109,7 +109,7 @@
<template v-else>
<div class="avatar"></div>
<div class="detail">
<span>{{ favorite.name || favorite.id }}</span>
<span v-once>{{ favorite.name || favorite.id }}</span>
<el-tooltip
v-if="!isLocalFavorite && favorite.deleted"
placement="left"
@@ -128,104 +128,82 @@
</div>
</template>
<script>
<script setup>
import { storeToRefs } from 'pinia';
import { computed, getCurrentInstance } from 'vue';
import { favoriteRequest } from '../../../api';
import { useAppearanceSettingsStore, useFavoriteStore, useInviteStore, useUiStore } from '../../../stores';
export default {
name: 'FavoritesWorldItem',
inject: ['API', 'showFavoriteDialog'],
props: {
group: [Object, String],
favorite: Object,
editFavoritesMode: Boolean,
hideTooltips: Boolean,
shiftHeld: Boolean,
isLocalFavorite: { type: Boolean, required: false }
},
computed: {
isSelected: {
get() {
return this.favorite.$selected;
},
set(value) {
this.$emit('handle-select', value);
}
},
localFavFakeRef() {
// local favorite no "ref" property
return this.isLocalFavorite ? this.favorite : this.favorite.ref;
},
smallThumbnail() {
return (
this.localFavFakeRef.thumbnailImageUrl.replace('256', '128') ||
this.localFavFakeRef.thumbnailImageUrl
);
}
},
methods: {
handleDropdownItemClick(groupAPI) {
if (this.isLocalFavorite) {
this.addFavoriteWorld(this.localFavFakeRef, groupAPI, true);
} else {
this.moveFavorite(this.localFavFakeRef, groupAPI, 'world');
}
},
handleDeleteFavorite() {
if (this.isLocalFavorite) {
this.$emit('remove-local-world-favorite', this.favorite.id, this.group);
} else {
this.deleteFavorite(this.favorite.id);
}
},
moveFavorite(ref, group, type) {
favoriteRequest
.deleteFavorite({
objectId: ref.id
})
.then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: ref.id,
tags: group.name
});
});
},
deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({
objectId
});
// FIXME: 메시지 수정
// this.$confirm('Continue? Delete Favorite', 'Confirm', {
// confirmButtonText: 'Confirm',
// cancelButtonText: 'Cancel',
// type: 'info',
// callback: (action) => {
// if (action === 'confirm') {
// API.deleteFavorite({
// objectId
// });
// }
// }
// });
},
addFavoriteWorld(ref, group, message) {
// wait API splitting PR Merged
return favoriteRequest
.addFavorite({
type: 'world',
favoriteId: ref.id,
tags: group.name
})
.then((args) => {
if (message) {
this.$message({
message: 'World added to favorites',
type: 'success'
});
}
return args;
});
}
const props = defineProps({
group: [Object, String],
favorite: Object,
editFavoritesMode: Boolean,
isLocalFavorite: { type: Boolean, default: false }
});
const emit = defineEmits(['handle-select', 'remove-local-world-favorite', 'click']);
const { proxy } = getCurrentInstance();
const { hideTooltips } = storeToRefs(useAppearanceSettingsStore());
const { favoriteWorldGroups } = storeToRefs(useFavoriteStore());
const { showFavoriteDialog } = useFavoriteStore();
const { newInstanceSelfInvite } = useInviteStore();
const { shiftHeld } = storeToRefs(useUiStore());
const isSelected = computed({
get: () => props.favorite.$selected,
set: (value) => emit('handle-select', value)
});
const localFavFakeRef = computed(() => (props.isLocalFavorite ? props.favorite : props.favorite.ref));
const smallThumbnail = computed(() => {
const url = localFavFakeRef.value.thumbnailImageUrl.replace('256', '128');
return url || localFavFakeRef.value.thumbnailImageUrl;
});
function handleDropdownItemClick(groupAPI) {
if (props.isLocalFavorite) {
addFavoriteWorld(localFavFakeRef.value, groupAPI, true);
} else {
moveFavorite(localFavFakeRef.value, groupAPI, 'world');
}
};
}
function handleDeleteFavorite() {
if (props.isLocalFavorite) {
emit('remove-local-world-favorite', props.favorite.id, props.group);
} else {
deleteFavorite(props.favorite.id);
}
}
function moveFavorite(refObj, group, type) {
favoriteRequest.deleteFavorite({ objectId: refObj.id }).then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: refObj.id,
tags: group.name
});
});
}
function deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({ objectId });
}
function addFavoriteWorld(refObj, group, message) {
return favoriteRequest
.addFavorite({
type: 'world',
favoriteId: refObj.id,
tags: group.name
})
.then((args) => {
if (message) {
proxy.$message({ message: 'World added to favorites', type: 'success' });
}
return args;
});
}
</script>

View File

@@ -3,16 +3,13 @@
<div style="display: flex; align-items: center; justify-content: space-between">
<div>
<el-button size="small" @click="showExportDialog">{{ $t('view.favorite.export') }}</el-button>
<el-button size="small" style="margin-left: 5px" @click="$emit('show-world-import-dialog')">{{
<el-button size="small" style="margin-left: 5px" @click="showWorldImportDialog">{{
$t('view.favorite.import')
}}</el-button>
</div>
<div style="display: flex; align-items: center; font-size: 13px; margin-right: 10px">
<span class="name" style="margin-right: 5px; line-height: 10px">{{ $t('view.favorite.sort_by') }}</span>
<el-radio-group
v-model="sortFav"
style="margin-right: 12px"
@change="$emit('save-sort-favorites-option')">
<el-radio-group v-model="sortFav" style="margin-right: 12px" @change="saveSortFavoritesOption">
<el-radio :label="false">{{
$t('view.settings.appearance.appearance.sort_favorite_by_name')
}}</el-radio>
@@ -59,7 +56,7 @@
</div>
<span style="display: block; margin-top: 20px">{{ $t('view.favorite.worlds.vrchat_favorites') }}</span>
<el-collapse style="border: 0">
<el-collapse-item v-for="group in API.favoriteWorldGroups" :key="group.name">
<el-collapse-item v-for="group in favoriteWorldGroups" :key="group.name">
<template slot="title">
<div style="display: flex; align-items: center">
<span
@@ -125,10 +122,8 @@
:favorite="favorite"
:edit-favorites-mode="editFavoritesMode"
:hide-tooltips="hideTooltips"
:shift-held="shiftHeld"
@click="showWorldDialog(favorite.id)"
@handle-select="favorite.$selected = $event"
@new-instance-self-invite="newInstanceSelfInvite" />
@handle-select="favorite.$selected = $event" />
</div>
<div
v-else
@@ -153,7 +148,7 @@
v-if="!refreshingLocalFavorites"
size="small"
style="margin-left: 5px"
@click="$emit('refresh-local-world-favorite')"
@click="refreshLocalWorldFavorite"
>{{ $t('view.favorite.worlds.refresh') }}</el-button
>
<el-button v-else size="small" style="margin-left: 5px" @click="refreshingLocalFavorites = false">
@@ -196,9 +191,7 @@
:favorite="favorite"
:edit-favorites-mode="editFavoritesMode"
:hide-tooltips="hideTooltips"
:shift-held="shiftHeld"
@click="showWorldDialog(favorite.id)"
@new-instance-self-invite="newInstanceSelfInvite"
@remove-local-world-favorite="removeLocalWorldFavorite" />
</div>
<div
@@ -215,236 +208,247 @@
</div>
</el-collapse-item>
</el-collapse>
<WorldExportDialog
:favorite-worlds="favoriteWorlds"
:world-export-dialog-visible.sync="worldExportDialogVisible"
:local-world-favorites="localWorldFavorites"
:local-world-favorite-groups="localWorldFavoriteGroups"
:local-world-favorites-list="localWorldFavoritesList" />
<WorldExportDialog :world-export-dialog-visible.sync="worldExportDialogVisible" />
</div>
</template>
<script>
import FavoritesWorldItem from './FavoritesWorldItem.vue';
import WorldExportDialog from '../dialogs/WorldExportDialog.vue';
<script setup>
import { computed, ref, getCurrentInstance } from 'vue';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n-bridge';
import { favoriteRequest } from '../../../api';
import { useAppearanceSettingsStore, useFavoriteStore, useWorldStore } from '../../../stores';
import WorldExportDialog from '../dialogs/WorldExportDialog.vue';
import FavoritesWorldItem from './FavoritesWorldItem.vue';
export default {
name: 'FavoritesWorldTab',
components: {
FavoritesWorldItem,
WorldExportDialog
defineProps({
editFavoritesMode: {
type: Boolean,
default: false
},
inject: ['API', 'showWorldDialog'],
props: {
sortFavorites: Boolean,
hideTooltips: Boolean,
favoriteWorlds: Array,
editFavoritesMode: Boolean,
shiftHeld: Boolean,
refreshingLocalFavorites: Boolean,
localWorldFavoriteGroups: Array,
localWorldFavorites: Object,
localWorldFavoritesList: Array
},
data() {
return {
worldGroupVisibilityOptions: ['private', 'friends', 'public'],
worldFavoriteSearch: '',
worldExportDialogVisible: false,
worldFavoriteSearchResults: []
};
},
computed: {
groupedByGroupKeyFavoriteWorlds() {
const groupedByGroupKeyFavoriteWorlds = {};
refreshingLocalFavorites: {
type: Boolean,
default: false
}
});
this.favoriteWorlds.forEach((world) => {
if (world.groupKey) {
if (!groupedByGroupKeyFavoriteWorlds[world.groupKey]) {
groupedByGroupKeyFavoriteWorlds[world.groupKey] = [];
}
groupedByGroupKeyFavoriteWorlds[world.groupKey].push(world);
}
});
const emit = defineEmits([
'change-favorite-group-name',
'save-sort-favorites-option',
'refresh-local-world-favorite'
]);
return groupedByGroupKeyFavoriteWorlds;
},
sortFav: {
get() {
return this.sortFavorites;
},
set(value) {
this.$emit('update:sort-favorites', value);
const { proxy } = getCurrentInstance();
const { t } = useI18n();
const { hideTooltips, sortFavorites } = storeToRefs(useAppearanceSettingsStore());
const { setSortFavorites } = useAppearanceSettingsStore();
const { favoriteWorlds, favoriteWorldGroups, localWorldFavorites, localWorldFavoriteGroups } =
storeToRefs(useFavoriteStore());
const {
showWorldImportDialog,
getLocalWorldFavoriteGroupLength,
deleteLocalWorldFavoriteGroup,
renameLocalWorldFavoriteGroup,
removeLocalWorldFavorite,
newLocalWorldFavoriteGroup,
handleFavoriteGroup
} = useFavoriteStore();
const { showWorldDialog } = useWorldStore();
const worldGroupVisibilityOptions = ref(['private', 'friends', 'public']);
const worldExportDialogVisible = ref(false);
const worldFavoriteSearch = ref('');
const worldFavoriteSearchResults = ref([]);
const groupedByGroupKeyFavoriteWorlds = computed(() => {
const groupedByGroupKeyFavoriteWorlds = {};
favoriteWorlds.value.forEach((world) => {
if (world.groupKey) {
if (!groupedByGroupKeyFavoriteWorlds[world.groupKey]) {
groupedByGroupKeyFavoriteWorlds[world.groupKey] = [];
}
groupedByGroupKeyFavoriteWorlds[world.groupKey].push(world);
}
});
return groupedByGroupKeyFavoriteWorlds;
});
const sortFav = computed({
get() {
return sortFavorites.value;
},
set() {
setSortFavorites();
}
});
function showExportDialog() {
worldExportDialogVisible.value = true;
}
function userFavoriteWorldsStatusForFavTab(visibility) {
let style = '';
if (visibility === 'public') {
style = '';
} else if (visibility === 'friends') {
style = 'success';
} else {
style = 'info';
}
return style;
}
function changeWorldGroupVisibility(name, visibility) {
const params = {
type: 'world',
group: name,
visibility
};
favoriteRequest.saveFavoriteGroup(params).then((args) => {
handleFavoriteGroup({
json: args.json,
params: {
favoriteGroupId: args.json.id
}
});
proxy.$message({
message: 'Group visibility changed',
type: 'success'
});
return args;
});
}
function promptNewLocalWorldFavoriteGroup() {
proxy.$prompt(t('prompt.new_local_favorite_group.description'), t('prompt.new_local_favorite_group.header'), {
distinguishCancelAndClose: true,
confirmButtonText: t('prompt.new_local_favorite_group.ok'),
cancelButtonText: t('prompt.new_local_favorite_group.cancel'),
inputPattern: /\S+/,
inputErrorMessage: t('prompt.new_local_favorite_group.input_error'),
callback: (action, instance) => {
if (action === 'confirm' && instance.inputValue) {
newLocalWorldFavoriteGroup(instance.inputValue);
}
}
},
methods: {
showExportDialog() {
this.worldExportDialogVisible = true;
},
});
}
userFavoriteWorldsStatusForFavTab(visibility) {
let style = '';
if (visibility === 'public') {
style = '';
} else if (visibility === 'friends') {
style = 'success';
} else {
style = 'info';
function promptLocalWorldFavoriteGroupRename(group) {
proxy.$prompt(
t('prompt.local_favorite_group_rename.description'),
t('prompt.local_favorite_group_rename.header'),
{
distinguishCancelAndClose: true,
confirmButtonText: t('prompt.local_favorite_group_rename.save'),
cancelButtonText: t('prompt.local_favorite_group_rename.cancel'),
inputPattern: /\S+/,
inputErrorMessage: t('prompt.local_favorite_group_rename.input_error'),
inputValue: group,
callback: (action, instance) => {
if (action === 'confirm' && instance.inputValue) {
renameLocalWorldFavoriteGroup(instance.inputValue, group);
}
}
return style;
},
changeWorldGroupVisibility(name, visibility) {
const params = {
type: 'world',
group: name,
visibility
};
favoriteRequest.saveFavoriteGroup(params).then((args) => {
this.$message({
message: 'Group visibility changed',
type: 'success'
}
);
}
function promptLocalWorldFavoriteGroupDelete(group) {
proxy.$confirm(`Delete Group? ${group}`, 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
deleteLocalWorldFavoriteGroup(group);
}
}
});
}
function clearFavoriteGroup(ctx) {
proxy.$confirm('Continue? Clear Group', 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
favoriteRequest.clearFavoriteGroup({
type: ctx.type,
group: ctx.name
});
return args;
});
},
promptNewLocalWorldFavoriteGroup() {
this.$prompt(
$t('prompt.new_local_favorite_group.description'),
$t('prompt.new_local_favorite_group.header'),
{
distinguishCancelAndClose: true,
confirmButtonText: $t('prompt.new_local_favorite_group.ok'),
cancelButtonText: $t('prompt.new_local_favorite_group.cancel'),
inputPattern: /\S+/,
inputErrorMessage: $t('prompt.new_local_favorite_group.input_error'),
callback: (action, instance) => {
if (action === 'confirm' && instance.inputValue) {
this.$emit('new-local-world-favorite-group', instance.inputValue);
}
}
}
);
},
promptLocalWorldFavoriteGroupRename(group) {
this.$prompt(
$t('prompt.local_favorite_group_rename.description'),
$t('prompt.local_favorite_group_rename.header'),
{
distinguishCancelAndClose: true,
confirmButtonText: $t('prompt.local_favorite_group_rename.save'),
cancelButtonText: $t('prompt.local_favorite_group_rename.cancel'),
inputPattern: /\S+/,
inputErrorMessage: $t('prompt.local_favorite_group_rename.input_error'),
inputValue: group,
callback: (action, instance) => {
if (action === 'confirm' && instance.inputValue) {
this.$emit('rename-local-world-favorite-group', instance.inputValue, group);
}
}
}
);
},
promptLocalWorldFavoriteGroupDelete(group) {
this.$confirm(`Delete Group? ${group}`, 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
this.$emit('delete-local-world-favorite-group', group);
}
}
});
},
getLocalWorldFavoriteGroupLength(group) {
const favoriteGroup = this.localWorldFavorites[group];
if (!favoriteGroup) {
return 0;
}
return favoriteGroup.length;
},
}
});
}
clearFavoriteGroup(ctx) {
// FIXME: 메시지 수정
this.$confirm('Continue? Clear Group', 'Confirm', {
confirmButtonText: 'Confirm',
cancelButtonText: 'Cancel',
type: 'info',
callback: (action) => {
if (action === 'confirm') {
favoriteRequest.clearFavoriteGroup({
type: ctx.type,
group: ctx.name
});
}
}
});
},
searchWorldFavorites(worldFavoriteSearch) {
let ref = null;
const search = worldFavoriteSearch.toLowerCase();
if (search.length < 3) {
this.worldFavoriteSearchResults = [];
return;
function searchWorldFavorites(worldFavoriteSearch) {
let ref = null;
const search = worldFavoriteSearch.toLowerCase();
if (search.length < 3) {
worldFavoriteSearchResults.value = [];
return;
}
const results = [];
for (let i = 0; i < localWorldFavoriteGroups.value.length; ++i) {
const group = localWorldFavoriteGroups.value[i];
if (!localWorldFavorites.value[group]) {
continue;
}
for (let j = 0; j < localWorldFavorites.value[group].length; ++j) {
ref = localWorldFavorites.value[group][j];
if (
!ref ||
typeof ref.id === 'undefined' ||
typeof ref.name === 'undefined' ||
typeof ref.authorName === 'undefined'
) {
continue;
}
const results = [];
for (let i = 0; i < this.localWorldFavoriteGroups.length; ++i) {
const group = this.localWorldFavoriteGroups[i];
if (!this.localWorldFavorites[group]) {
continue;
}
for (let j = 0; j < this.localWorldFavorites[group].length; ++j) {
ref = this.localWorldFavorites[group][j];
if (
!ref ||
typeof ref.id === 'undefined' ||
typeof ref.name === 'undefined' ||
typeof ref.authorName === 'undefined'
) {
continue;
}
if (ref.name.toLowerCase().includes(search) || ref.authorName.toLowerCase().includes(search)) {
if (!results.some((r) => r.id === ref.id)) {
results.push(ref);
}
}
if (ref.name.toLowerCase().includes(search) || ref.authorName.toLowerCase().includes(search)) {
if (!results.some((r) => r.id === ref.id)) {
results.push(ref);
}
}
for (let i = 0; i < this.favoriteWorlds.length; ++i) {
ref = this.favoriteWorlds[i].ref;
if (
!ref ||
typeof ref.id === 'undefined' ||
typeof ref.name === 'undefined' ||
typeof ref.authorName === 'undefined'
) {
continue;
}
if (ref.name.toLowerCase().includes(search) || ref.authorName.toLowerCase().includes(search)) {
if (!results.some((r) => r.id === ref.id)) {
results.push(ref);
}
}
}
this.worldFavoriteSearchResults = results;
},
changeFavoriteGroupName(group) {
this.$emit('change-favorite-group-name', group);
},
newInstanceSelfInvite(event) {
this.$emit('new-instance-self-invite', event);
},
removeLocalWorldFavorite(param1, param2) {
this.$emit('remove-local-world-favorite', param1, param2);
}
}
};
for (let i = 0; i < favoriteWorlds.value.length; ++i) {
ref = favoriteWorlds.value[i].ref;
if (
!ref ||
typeof ref.id === 'undefined' ||
typeof ref.name === 'undefined' ||
typeof ref.authorName === 'undefined'
) {
continue;
}
if (ref.name.toLowerCase().includes(search) || ref.authorName.toLowerCase().includes(search)) {
if (!results.some((r) => r.id === ref.id)) {
results.push(ref);
}
}
}
worldFavoriteSearchResults.value = results;
}
function changeFavoriteGroupName(group) {
emit('change-favorite-group-name', group);
}
function refreshLocalWorldFavorite() {
emit('refresh-local-world-favorite');
}
function saveSortFavoritesOption() {
emit('save-sort-favorites-option');
}
</script>
<style scoped></style>