Files
VRCX/html/src/mixins/tabs/favorites.pug
2024-03-16 04:08:05 +13:00

218 lines
23 KiB
Plaintext

mixin favoritesTab()
.x-container(v-show="$refs.menu && $refs.menu.activeIndex === 'favorite'")
div(style="font-size:13px;position:absolute;right:0;z-index:1")
div(v-if="bulkUnfavoriteMode" style="display:inline-block;margin-right:10px")
el-button(size="small" @click="showBulkUnfavoriteSelectionConfirm") {{ $t('view.favorite.bulk_unfavorite_selection') }}
div(style="display:inline-block;margin-right:10px")
span.name {{ $t('view.favorite.bulk_unfavorite_mode') }}
el-switch(v-model="bulkUnfavoriteMode" style="margin-left:5px")
el-tooltip(placement="bottom" :content="$t('view.favorite.refresh_tooltip')" :disabled="hideTooltips")
el-button(type="default" :loading="API.isFavoriteLoading" @click="API.refreshFavorites(); getLocalWorldFavorites()" size="small" icon="el-icon-refresh" circle)
el-tabs(ref="favoriteTabRef" type="card" v-loading="API.isFavoriteLoading" style="height:100%")
el-tab-pane(:label="$t('view.favorite.friends.header')")
el-collapse(v-if="$refs.menu && $refs.menu.activeIndex === 'favorite' && $refs.favoriteTabRef && $refs.favoriteTabRef.currentName === '0'" style="border:0")
el-button(size="small" @click="showFriendExportDialog") {{ $t('view.favorite.export') }}
el-button(size="small" @click="showFriendImportDialog") {{ $t('view.favorite.import') }}
div(style="display:inline-block;float:right;font-size:13px;margin-right:10px")
span.name(style="margin-right:5px") {{ $t('view.favorite.sort_by') }}
el-switch(v-model="sortFavorites" :inactive-text="$t('view.settings.appearance.appearance.sort_favorite_by_name')" :active-text="$t('view.settings.appearance.appearance.sort_favorite_by_date')" @change="saveSortFavoritesOption")
el-collapse-item(v-for="group in API.favoriteFriendGroups" :key="group.name")
template(slot="title")
span(v-text="group.displayName ? group.displayName : group.name" style="font-weight:bold;font-size:14px;margin-left:10px")
span(style="color:#909399;font-size:12px;margin-left:10px") {{ group.count }}/{{ group.capacity }}
el-tooltip(placement="top" :content="$t('view.favorite.rename_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="changeFavoriteGroupName(group)" size="mini" icon="el-icon-edit" circle style="margin-left:10px")
el-tooltip(placement="right" :content="$t('view.favorite.clear_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="clearFavoriteGroup(group)" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
.x-friend-list(v-if="group.count" style="margin-top:10px")
div(style="display:inline-block;width:300px;margin-right:15px" v-for="favorite in favoriteFriends" v-if="favorite.groupKey === group.key" :key="favorite.id" @click="showUserDialog(favorite.id)")
.x-friend-item
template(v-if="favorite.ref")
.avatar(:class="userStatusClass(favorite.ref)")
img(v-lazy="userImage(favorite.ref)")
.detail
span.name(v-text="favorite.ref.displayName" :style="{'color':favorite.ref.$userColour}")
location.extra(v-if="favorite.ref.location !== 'offline'" :location="favorite.ref.location" :traveling="favorite.ref.travelingToLocation" :link="false")
span(v-else v-text="favorite.ref.statusDescription")
template(v-if="bulkUnfavoriteMode")
el-button(type="text" size="mini" @click.stop style="margin-left:5px")
el-checkbox(v-model="favorite.$selected")
template(v-else-if="favorite.ref")
el-tooltip(placement="left" :content="$t('view.favorite.move_tooltip')" :disabled="hideTooltips")
el-dropdown(trigger="click" @click.native.stop size="mini" style="margin-left:5px")
el-button(type="default" icon="el-icon-back" size="mini" circle)
el-dropdown-menu(#default="dropdown")
template(v-if="groupAPI.name !== group.name" v-for="groupAPI in API.favoriteFriendGroups" :key="groupAPI.name")
el-dropdown-item(style="display:block;margin:10px 0" @click.native="moveFavorite(favorite.ref, groupAPI, 'friend')" :disabled="groupAPI.count >= groupAPI.capacity") {{ groupAPI.displayName }} ({{ groupAPI.count }} / {{ groupAPI.capacity }})
el-tooltip(placement="right" :content="$t('view.favorite.unfavorite_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="deleteFavorite(favorite.id)" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
template(v-else)
.avatar
.detail
span(v-text="favorite.name || favorite.id")
el-button(type="text" icon="el-icon-close" size="mini" @click.stop="deleteFavorite(favorite.id)" style="margin-left:5px")
el-tab-pane(:label="$t('view.favorite.worlds.header')")
el-collapse(v-if="$refs.menu && $refs.menu.activeIndex === 'favorite' && $refs.favoriteTabRef && $refs.favoriteTabRef.currentName === '1'" style="border:0")
el-button(size="small" @click="showWorldExportDialog") {{ $t('view.favorite.export') }}
el-button(size="small" @click="showWorldImportDialog") {{ $t('view.favorite.import') }}
div(style="display:inline-block;float:right;font-size:13px;margin-right:10px")
span.name(style="margin-right:5px") {{ $t('view.favorite.sort_by') }}
el-switch(v-model="sortFavorites" :inactive-text="$t('view.settings.appearance.appearance.sort_favorite_by_name')" :active-text="$t('view.settings.appearance.appearance.sort_favorite_by_date')" @change="saveSortFavoritesOption")
span(style="display:block;margin-top:20px") {{ $t('view.favorite.worlds.search') }}
el-input(v-model="worldFavoriteSearch" @input="searchWorldFavorites" clearable size="mini" :placeholder="$t('view.favorite.worlds.search')" style="width:300px;margin-top:10px")
.x-friend-list(style="margin-top:10px")
div(style="display:inline-block;width:300px;margin-right:15px" v-for="favorite in worldFavoriteSearchResults" :key="favorite.id" @click="showWorldDialog(favorite.id)")
.x-friend-item
template(v-if="favorite.name")
.avatar
img(v-lazy="favorite.thumbnailImageUrl")
.detail
span.name(v-text="favorite.name")
span.extra(v-if="favorite.occupants") {{ favorite.authorName }} ({{ favorite.occupants }})
span.extra(v-else v-text="favorite.authorName")
template(v-else)
.avatar
.detail
span(v-text="favorite.id")
span(style="display:block;margin-top:20px") {{ $t('view.favorite.worlds.vrchat_favorites') }}
el-collapse-item(v-for="group in API.favoriteWorldGroups" :key="group.name")
template(slot="title")
span(v-text="group.displayName ? group.displayName : group.name" style="font-weight:bold;font-size:14px;margin-left:10px")
i.x-user-status(style="margin-left:5px" :class="userFavoriteWorldsStatus(group.visibility)")
span(style="color:#909399;font-size:12px;margin-left:10px") {{ group.count }}/{{ group.capacity }}
el-tooltip(placement="top" :content="$t('view.favorite.visibility_tooltip')" :disabled="hideTooltips")
el-dropdown(trigger="click" @click.native.stop size="mini" style="margin-left:10px")
el-button(type="default" icon="el-icon-view" size="mini" circle)
el-dropdown-menu(#default="dropdown")
el-dropdown-item(v-if="group.visibility !== visibility" v-for="visibility in worldGroupVisibilityOptions" :key="visibility" style="display:block;margin:10px 0" v-text="visibility" @click.native="changeWorldGroupVisibility(group.name, visibility)")
el-tooltip(placement="top" :content="$t('view.favorite.rename_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="changeFavoriteGroupName(group)" size="mini" icon="el-icon-edit" circle style="margin-left:5px")
el-tooltip(placement="right" :content="$t('view.favorite.clear_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="clearFavoriteGroup(group)" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
.x-friend-list(v-if="group.count" style="margin-top:10px")
div(style="display:inline-block;width:300px;margin-right:15px" v-for="favorite in favoriteWorlds" v-if="favorite.groupKey === group.key" :key="favorite.id" @click="showWorldDialog(favorite.id)")
.x-friend-item
template(v-if="favorite.ref")
.avatar
img(v-lazy="favorite.ref.thumbnailImageUrl")
.detail
span.name(v-text="favorite.ref.name")
span.extra(v-if="favorite.ref.occupants") {{ favorite.ref.authorName }} ({{ favorite.ref.occupants }})
span.extra(v-else v-text="favorite.ref.authorName")
template(v-if="bulkUnfavoriteMode")
el-button(type="text" size="mini" @click.stop style="margin-left:5px")
el-checkbox(v-model="favorite.$selected")
template(v-else-if="favorite.ref")
el-tooltip(v-if="favorite.deleted" placement="left" :content="$t('view.favorite.unavailable_tooltip')")
i.el-icon-warning(style="color:#f56c6c;margin-left:5px")
el-tooltip(v-if="favorite.ref.releaseStatus === 'private'" placement="left" :content="$t('view.favorite.private')")
i.el-icon-warning(style="color:#e6a23c;margin-left:5px")
el-tooltip(placement="left" :content="$t('view.favorite.move_tooltip')" :disabled="hideTooltips")
el-dropdown(trigger="click" @click.native.stop size="mini" style="margin-left:5px")
el-button(type="default" icon="el-icon-back" size="mini" circle)
el-dropdown-menu(#default="dropdown")
template(v-if="groupAPI.name !== group.name" v-for="groupAPI in API.favoriteWorldGroups" :key="groupAPI.name")
el-dropdown-item(style="display:block;margin:10px 0" @click.native="moveFavorite(favorite.ref, groupAPI, 'world')" :disabled="groupAPI.count >= groupAPI.capacity") {{ groupAPI.displayName }} ({{ groupAPI.count }} / {{ groupAPI.capacity }})
el-tooltip(placement="right" :content="$t('view.favorite.unfavorite_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="deleteFavorite(favorite.id)" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
template(v-else)
.avatar
.detail
span(v-text="favorite.name || favorite.id")
el-tooltip(v-if="favorite.deleted" placement="left" :content="$t('view.favorite.unavailable_tooltip')")
i.el-icon-warning(style="color:#f56c6c;margin-left:5px")
el-button(type="text" icon="el-icon-close" size="mini" @click.stop="deleteFavorite(favorite.id)" style="margin-left:5px")
span(style="display:block;margin-top:20px") {{ $t('view.favorite.worlds.local_favorites') }}
el-button(size="small" @click="promptNewLocalWorldFavoriteGroup" style="display:block;margin-top:10px") {{ $t('view.favorite.worlds.new_group') }}
el-collapse-item(v-for="group in localWorldFavoriteGroups" v-if="localWorldFavorites[group]" :key="group")
template(slot="title")
span(v-text="group" style="font-weight:bold;font-size:14px;margin-left:10px")
span(style="color:#909399;font-size:12px;margin-left:10px") {{ getLocalWorldFavoriteGroupLength(group) }}
el-tooltip(placement="top" :content="$t('view.favorite.rename_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="promptLocalWorldFavoriteGroupRename(group)" size="mini" icon="el-icon-edit" circle style="margin-left:10px")
el-tooltip(placement="right" :content="$t('view.favorite.delete_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="promptLocalWorldFavoriteGroupDelete(group)" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
.x-friend-list(style="margin-top:10px")
div(style="display:inline-block;width:300px;margin-right:15px" v-for="favorite in localWorldFavorites[group]" :key="favorite.id" @click="showWorldDialog(favorite.id)")
.x-friend-item
template(v-if="favorite.name")
.avatar
img(v-lazy="favorite.thumbnailImageUrl")
.detail
span.name(v-text="favorite.name")
span.extra(v-if="favorite.occupants") {{ favorite.authorName }} ({{ favorite.occupants }})
span.extra(v-else v-text="favorite.authorName")
el-tooltip(placement="right" :content="$t('view.favorite.unfavorite_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="removeLocalWorldFavorite(favorite.id, group)" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
template(v-else)
.avatar
.detail
span(v-text="favorite.id")
el-button(type="text" icon="el-icon-close" size="mini" @click.stop="removeLocalWorldFavorite(favorite.id, group)" style="margin-left:5px")
el-tab-pane(:label="$t('view.favorite.avatars.header')")
el-collapse(v-if="$refs.menu && $refs.menu.activeIndex === 'favorite' && $refs.favoriteTabRef && $refs.favoriteTabRef.currentName === '2'" style="border:0")
el-button(size="small" @click="showAvatarExportDialog") {{ $t('view.favorite.export') }}
el-button(size="small" @click="showAvatarImportDialog") {{ $t('view.favorite.import') }}
div(style="display:inline-block;float:right;font-size:13px;margin-right:10px")
span.name(style="margin-right:5px") {{ $t('view.favorite.sort_by') }}
el-switch(v-model="sortFavorites" :inactive-text="$t('view.settings.appearance.appearance.sort_favorite_by_name')" :active-text="$t('view.settings.appearance.appearance.sort_favorite_by_date')" @change="saveSortFavoritesOption")
el-collapse-item(v-for="group in API.favoriteAvatarGroups" :key="group.name")
template(slot="title")
span(v-text="group.displayName ? group.displayName : group.name" style="font-weight:bold;font-size:14px;margin-left:10px")
span(style="color:#909399;font-size:12px;margin-left:10px") {{ group.count }}/{{ group.capacity }}
el-tooltip(placement="top" :content="$t('view.favorite.rename_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="changeFavoriteGroupName(group)" size="mini" icon="el-icon-edit" circle style="margin-left:10px")
el-tooltip(placement="right" :content="$t('view.favorite.clear_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="clearFavoriteGroup(group)" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
.x-friend-list(v-if="group.count" style="margin-top:10px")
div(style="display:inline-block;width:300px;margin-right:15px" v-for="favorite in favoriteAvatars" v-if="favorite.groupKey === group.key" :key="favorite.id" @click="showAvatarDialog(favorite.id)")
.x-friend-item
template(v-if="favorite.ref")
.avatar
img(v-lazy="favorite.ref.thumbnailImageUrl")
.detail
span.name(v-text="favorite.ref.name")
span.extra(v-text="favorite.ref.authorName")
template(v-if="bulkUnfavoriteMode")
el-button(type="text" size="mini" @click.stop style="margin-left:5px")
el-checkbox(v-model="favorite.$selected")
template(v-else-if="favorite.ref")
el-tooltip(v-if="favorite.deleted" placement="left" :content="$t('view.favorite.unavailable_tooltip')")
i.el-icon-warning(style="color:#f56c6c;margin-left:5px")
el-tooltip(v-if="favorite.ref.releaseStatus === 'private'" placement="left" :content="$t('view.favorite.private')")
i.el-icon-warning(style="color:#e6a23c;margin-left:5px")
el-tooltip(placement="left" :content="$t('view.favorite.move_tooltip')" :disabled="hideTooltips")
el-dropdown(trigger="click" @click.native.stop size="mini" style="margin-left:5px")
el-button(type="default" icon="el-icon-back" size="mini" circle)
el-dropdown-menu(#default="dropdown")
template(v-if="groupAPI.name !== group.name" v-for="groupAPI in API.favoriteAvatarGroups" :key="groupAPI.name")
el-dropdown-item(style="display:block;margin:10px 0" @click.native="moveFavorite(favorite.ref, groupAPI, 'avatar')" :disabled="groupAPI.count >= groupAPI.capacity") {{ groupAPI.displayName }} ({{ groupAPI.count }} / {{ groupAPI.capacity }})
el-tooltip(placement="right" :content="$t('view.favorite.unfavorite_tooltip')" :disabled="hideTooltips")
el-button(@click.stop="deleteFavorite(favorite.id)" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
template(v-else)
.avatar
.detail
span.name(v-text="favorite.name || favorite.id")
el-button(type="text" icon="el-icon-close" size="mini" @click.stop="deleteFavorite(favorite.id)" style="margin-left:5px")
el-collapse-item
template(slot="title")
span(style="font-weight:bold;font-size:14px;margin-left:10px") Local History
span(style="color:#909399;font-size:12px;margin-left:10px") {{ avatarHistoryArray.length }}/100
el-tooltip(placement="right" content="Clear" :disabled="hideTooltips")
el-button(@click.stop="promptClearAvatarHistory" size="mini" icon="el-icon-delete" circle style="margin-left:5px")
.x-friend-list(v-if="avatarHistoryArray.length" style="margin-top:10px")
div(style="display:inline-block;width:300px;margin-right:15px" v-for="favorite in avatarHistoryArray" :key="favorite.id" @click="showAvatarDialog(favorite.id)")
.x-friend-item
.avatar
img(v-lazy="favorite.thumbnailImageUrl")
.detail
span.name(v-text="favorite.name")
span.extra(v-text="favorite.authorName")
template(v-if="API.cachedFavoritesByObjectId.has(favorite.id)")
el-tooltip(placement="left" content="Unfavorite" :disabled="hideTooltips")
el-button(@click.stop="deleteFavorite(favorite.id)" type="default" icon="el-icon-star-on" size="mini" circle)
template(v-else)
el-tooltip(placement="left" content="Favorite" :disabled="hideTooltips")
el-button(@click.stop="showFavoriteDialog('avatar', favorite.id)" type="default" icon="el-icon-star-off" size="mini" circle)