diff --git a/html/src/app.js b/html/src/app.js index 427a28e3..3e4824d0 100644 --- a/html/src/app.js +++ b/html/src/app.js @@ -15148,6 +15148,26 @@ speechSynthesis.getVoices(); return false; }; + $app.methods.userImage = function (user) { + if (this.displayVRCPlusIconsAsAvatar && user.userIcon) { + return user.userIcon; + } + if (user.profilePicOverride) { + return user.profilePicOverride; + } + return user.currentAvatarThumbnailImageUrl; + }; + + $app.methods.userImageFull = function (user) { + if (this.displayVRCPlusIconsAsAvatar && user.userIcon) { + return user.userIcon; + } + if (user.profilePicOverride) { + return user.profilePicOverride; + } + return user.currentAvatarImageUrl; + }; + $app = new Vue($app); window.$app = $app; })(); diff --git a/html/src/index.pug b/html/src/index.pug index 630e0227..1b723c79 100644 --- a/html/src/index.pug +++ b/html/src/index.pug @@ -22,9 +22,7 @@ html .x-friend-item(v-for="user in loginForm.savedCredentials" :key="user.user.id") .x-friend-item(@click="relogin(user)" style="width:202px;padding:0") .avatar - img(v-if="user.user.profilePicOverride" v-lazy="user.user.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && user.user.userIcon" v-lazy="user.user.userIcon") - img(v-else v-lazy="user.user.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(user.user)") .detail span.name(v-text="user.user.displayName") span.extra(v-text="user.user.username") @@ -231,8 +229,7 @@ html .x-friend-item(v-for="user in searchUserResults" :key="user.id" @click="showUserDialog(user.id)") template(v-once) .avatar - img(v-if="user.userIcon" v-lazy="user.userIcon") - img(v-lazy="user.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(user)") .detail span.name(v-text="user.displayName" :class="user.trustClass") span.extra(v-text="user.username" style="font-family:monospace") @@ -297,9 +294,7 @@ html .x-friend-item template(v-if="favorite.ref") .avatar(:class="userStatusClass(favorite.ref)") - img(v-if="favorite.ref.profilePicOverride" v-lazy="favorite.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && favorite.ref.userIcon" v-lazy="favorite.ref.userIcon") - img(v-else v-lazy="favorite.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(favorite.ref)") .detail span.name(v-text="favorite.ref.displayName" :class="favorite.ref.$trustColor") location.extra(v-if="favorite.ref.location !== 'offline'" :location="favorite.ref.location" :link="false") @@ -491,9 +486,7 @@ html .x-friend-list(style="margin-top:10px") .x-friend-item(@click="showUserDialog(API.currentUser.id)") .avatar - img(v-if="API.currentUser.profilePicOverride" v-lazy="API.currentUser.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && API.currentUser.userIcon" v-lazy="API.currentUser.userIcon") - img(v-else v-lazy="API.currentUser.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(API.currentUser)") .detail span.name(v-text="API.currentUser.displayName") span.extra(v-text="API.currentUser.username") @@ -522,7 +515,6 @@ html span.header Direct Access div(style="margin-top:10px") el-button-group - el-button(size="small" @click="promptUsernameDialog()") Username el-button(size="small" @click="promptUserIdDialog()") User ID el-button(size="small" @click="promptWorldDialog()") World/Instance @@ -645,15 +637,9 @@ html el-table-column(label="No." width="70" prop="$friendNum" sortable="custom") el-table-column(label="Avatar" width="70" prop="photo") template(v-once #default="scope") - el-popover(v-if="scope.row.profilePicOverride" placement="right" height="500px" trigger="hover") - img.friends-list-avatar(slot="reference" v-lazy="scope.row.profilePicOverride") - img.friends-list-avatar(v-lazy="scope.row.profilePicOverride" style="height:500px;cursor:pointer" @click="openExternalLink(scope.row.profilePicOverride)") - el-popover(v-else-if="displayVRCPlusIconsAsAvatar && scope.row.userIcon" placement="right" height="500px" trigger="hover") - img.friends-list-avatar(slot="reference" v-lazy="scope.row.userIcon") - img.friends-list-avatar(v-lazy="scope.row.userIcon" style="height:500px;cursor:pointer" @click="openExternalLink(scope.row.userIcon)") - el-popover(v-else placement="right" height="500px" trigger="hover") - img.friends-list-avatar(slot="reference" v-lazy="scope.row.currentAvatarThumbnailImageUrl") - img.friends-list-avatar(v-lazy="scope.row.currentAvatarImageUrl" style="height:500px;cursor:pointer" @click="openExternalLink(scope.row.currentAvatarImageUrl)") + el-popover(placement="right" height="500px" trigger="hover") + img.friends-list-avatar(slot="reference" v-lazy="userImage(scope.row)") + img.friends-list-avatar(v-lazy="userImageFull(scope.row)" style="height:500px;cursor:pointer" @click="openExternalLink(userImageFull(scope.row))") el-table-column(label="Display Name" min-width="130" prop="displayName" sortable :sort-method="(a, b) => sortAlphabetically(a, b, 'displayName')") el-table-column(label="User Name" min-width="120" prop="username" sortable :sort-method="(a, b) => sortAlphabetically(a, b, 'username')") el-table-column(label="Rank" width="110" prop="$trustSortNum" sortable="custom") @@ -957,9 +943,7 @@ html .detail span.name(v-text="item.ref.displayName" :class="item.ref.$trustColor") location.extra(:location="item.ref.location" :link="false") - img.avatar(v-if="item.ref.profilePicOverride" v-lazy="item.ref.profilePicOverride") - img.avatar(v-else-if="displayVRCPlusIconsAsAvatar && item.ref.userIcon" v-lazy="item.ref.userIcon") - img.avatar(v-else v-lazy="item.ref.currentAvatarThumbnailImageUrl") + img.avatar(v-lazy="userImage(item.ref)") span(v-else) Search More: #[span(v-text="item.label" style="font-weight:bold")] el-tooltip(placement="bottom" content="Direct access ID/URL" :disabled="hideTooltips") el-button(type="default" @click="promptOmniDirectDialog()" size="mini" icon="el-icon-discover" circle) @@ -972,9 +956,7 @@ html div(v-show="isFriendsGroupMe") .x-friend-item(:key="API.currentUser.id" @click="showUserDialog(API.currentUser.id)") .avatar(:class="userStatusClass(API.currentUser)") - img(v-if="API.currentUser.profilePicOverride" v-lazy="API.currentUser.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && API.currentUser.userIcon" v-lazy="API.currentUser.userIcon") - img(v-else v-lazy="API.currentUser.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(API.currentUser)") .detail span.name(v-text="API.currentUser.displayName" :class="API.currentUser.$trustColor") location.extra(v-if="isGameRunning === true" :location="lastLocation.location" :link="false") @@ -986,9 +968,7 @@ html .x-friend-item(v-for="friend in friendsGroup0" :key="friend.id" @click="showUserDialog(friend.id)") template(v-if="friend.ref") .avatar(:class="userStatusClass(friend.ref)") - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-if="friend.memo" :class="friend.ref.$trustColor") {{ friend.ref.displayName }} ({{ friend.memo }}) span.name(v-else v-text="friend.ref.displayName" :class="friend.ref.$trustColor") @@ -1003,9 +983,7 @@ html .x-friend-item(v-for="friend in friendsGroup1" :key="friend.id" @click="showUserDialog(friend.id)") template(v-if="friend.ref") .avatar(:class="userStatusClass(friend.ref)") - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-if="friend.memo" :class="friend.ref.$trustColor") {{ friend.ref.displayName }} ({{ friend.memo }}) span.name(v-else v-text="friend.ref.displayName" :class="friend.ref.$trustColor") @@ -1020,9 +998,7 @@ html .x-friend-item(v-for="friend in friendsGroup2" :key="friend.id" @click="showUserDialog(friend.id)") template(v-if="friend.ref") .avatar - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-if="friend.memo" :class="friend.ref.$trustColor") {{ friend.ref.displayName }} ({{ friend.memo }}) span.name(v-else v-text="friend.ref.displayName" :class="friend.ref.$trustColor") @@ -1037,9 +1013,7 @@ html .x-friend-item(v-for="friend in friendsGroup3" :key="friend.id" @click="showUserDialog(friend.id)") template(v-if="friend.ref") .avatar - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-if="friend.memo" :class="friend.ref.$trustColor") {{ friend.ref.displayName }} ({{ friend.memo }}) span.name(v-else v-text="friend.ref.displayName" :class="friend.ref.$trustColor") @@ -1152,18 +1126,14 @@ html .x-friend-item(v-if="userDialog.$location.userId" @click="showUserDialog(userDialog.$location.userId)") template(v-if="userDialog.$location.user") .avatar(:class="userStatusClass(userDialog.$location.user)") - img(v-if="userDialog.$location.user.profilePicOverride" v-lazy="userDialog.$location.user.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && userDialog.$location.user.userIcon" v-lazy="userDialog.$location.user.userIcon") - img(v-else v-lazy="userDialog.$location.user.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(userDialog.$location.user)") .detail span.name(v-text="userDialog.$location.user.displayName" :class="userDialog.$location.user.$trustColor") span.extra Instance Creator span(v-else v-text="userDialog.$location.userId") .x-friend-item(v-for="user in userDialog.users" :key="user.id" @click="showUserDialog(user.id)") .avatar(:class="userStatusClass(user)") - img(v-if="user.profilePicOverride" v-lazy="user.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && user.userIcon" v-lazy="user.userIcon") - img(v-else v-lazy="user.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(user)") .detail span.name(v-text="user.displayName" :class="user.$trustColor") span.extra @@ -1341,18 +1311,14 @@ html .x-friend-item(v-if="room.$location.userId" @click="showUserDialog(room.$location.userId)") template(v-if="room.$location.user") .avatar(:class="userStatusClass(room.$location.user)") - img(v-if="room.$location.user.profilePicOverride" v-lazy="room.$location.user.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && room.$location.user.userIcon" v-lazy="room.$location.user.userIcon") - img(v-else v-lazy="room.$location.user.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(room.$location.user)") .detail span.name(v-text="room.$location.user.displayName" :class="room.$location.user.$trustColor") span.extra Instance Creator span(v-else v-text="room.$location.userId") .x-friend-item(v-for="user in room.users" :key="user.id" @click="showUserDialog(user.id)") .avatar(:class="userStatusClass(user)") - img(v-if="user.profilePicOverride" v-lazy="user.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && user.userIcon" v-lazy="user.userIcon") - img(v-else v-lazy="user.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(user)") .detail span.name(v-text="user.displayName" :class="user.$trustColor") span.extra @@ -1511,18 +1477,14 @@ html el-option-group(v-if="API.currentUser" label="ME") el-option.x-friend-item(:label="API.currentUser.displayName" :value="API.currentUser.id" style="height:auto") .avatar(:class="userStatusClass(API.currentUser)") - img(v-if="API.currentUser.profilePicOverride" v-lazy="API.currentUser.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && API.currentUser.userIcon" v-lazy="API.currentUser.userIcon") - img(v-else v-lazy="API.currentUser.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(API.currentUser)") .detail span.name(v-text="API.currentUser.displayName") el-option-group(v-if="friendsGroup0.length" label="VIP") el-option.x-friend-item(v-for="friend in friendsGroup0" :key="friend.id" :label="friend.name" :value="friend.id" style="height:auto") template(v-if="friend.ref") .avatar(:class="userStatusClass(friend.ref)") - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-text="friend.ref.displayName" :class="friend.ref.$trustColor") span(v-else v-text="friend.id") @@ -1530,9 +1492,7 @@ html el-option.x-friend-item(v-for="friend in friendsGroup1" :key="friend.id" :label="friend.name" :value="friend.id" style="height:auto") template(v-if="friend.ref") .avatar(:class="userStatusClass(friend.ref)") - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-text="friend.ref.displayName" :class="friend.ref.$trustColor") span(v-else v-text="friend.id") @@ -1540,9 +1500,7 @@ html el-option.x-friend-item(v-for="friend in friendsGroup2" :key="friend.id" :label="friend.name" :value="friend.id" style="height:auto") template(v-if="friend.ref") .avatar - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-text="friend.ref.displayName" :class="friend.ref.$trustColor") span(v-else v-text="friend.id") @@ -1627,18 +1585,14 @@ html el-option-group(v-if="API.currentUser" label="ME") el-option.x-friend-item(:label="API.currentUser.displayName" :value="API.currentUser.id" style="height:auto") .avatar(:class="userStatusClass(API.currentUser)") - img(v-if="API.currentUser.profilePicOverride" v-lazy="API.currentUser.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && API.currentUser.userIcon" v-lazy="API.currentUser.userIcon") - img(v-else v-lazy="API.currentUser.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(API.currentUser)") .detail span.name(v-text="API.currentUser.displayName") el-option-group(v-if="friendsGroup0.length" label="VIP") el-option.x-friend-item(v-for="friend in friendsGroup0" :key="friend.id" :label="friend.name" :value="friend.id" style="height:auto") template(v-if="friend.ref") .avatar(:class="userStatusClass(friend.ref)") - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-text="friend.ref.displayName" :class="friend.ref.$trustColor") span(v-else v-text="friend.id") @@ -1646,9 +1600,7 @@ html el-option.x-friend-item(v-for="friend in friendsGroup1" :key="friend.id" :label="friend.name" :value="friend.id" style="height:auto") template(v-if="friend.ref") .avatar(:class="userStatusClass(friend.ref)") - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-text="friend.ref.displayName" :class="friend.ref.$trustColor") span(v-else v-text="friend.id") @@ -1656,9 +1608,7 @@ html el-option.x-friend-item(v-for="friend in friendsGroup2" :key="friend.id" :label="friend.name" :value="friend.id" style="height:auto") template(v-if="friend.ref") .avatar - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-text="friend.ref.displayName" :class="friend.ref.$trustColor") span(v-else v-text="friend.id") @@ -1666,9 +1616,7 @@ html el-option.x-friend-item(v-for="friend in friendsGroup3" :key="friend.id" :label="friend.name" :value="friend.id" style="height:auto") template(v-if="friend.ref") .avatar - img(v-if="friend.ref.profilePicOverride" v-lazy="friend.ref.profilePicOverride") - img(v-else-if="displayVRCPlusIconsAsAvatar && friend.ref.userIcon" v-lazy="friend.ref.userIcon") - img(v-else v-lazy="friend.ref.currentAvatarThumbnailImageUrl") + img(v-lazy="userImage(friend.ref)") .detail span.name(v-text="friend.ref.displayName" :class="friend.ref.$trustColor") span(v-else v-text="friend.id")