mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-04-12 11:23:52 +02:00
Boops
This commit is contained in:
Natsumi
@@ -63,6 +63,8 @@
|
||||
<VRChatConfigDialog></VRChatConfigDialog>
|
||||
|
||||
<PrimaryPasswordDialog></PrimaryPasswordDialog>
|
||||
|
||||
<SendBoopDialog></SendBoopDialog>
|
||||
</template>
|
||||
</div>
|
||||
</el-config-provider>
|
||||
@@ -109,6 +111,7 @@
|
||||
import NavMenu from './components/NavMenu.vue';
|
||||
import PreviousInstancesInfoDialog from './components/dialogs/PreviousInstancesDialog/PreviousInstancesInfoDialog.vue';
|
||||
import PrimaryPasswordDialog from './views/Settings/dialogs/PrimaryPasswordDialog.vue';
|
||||
import SendBoopDialog from './components/dialogs/SendBoopDialog.vue';
|
||||
import Sidebar from './views/Sidebar/Sidebar.vue';
|
||||
import UserDialog from './components/dialogs/UserDialog/UserDialog.vue';
|
||||
import VRCXUpdateDialog from './components/dialogs/VRCXUpdateDialog.vue';
|
||||
|
||||
@@ -194,28 +194,29 @@ const miscReq = {
|
||||
};
|
||||
return args;
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// /**
|
||||
// * @params {{
|
||||
// userId: string,
|
||||
// emojiId: string
|
||||
// }} params
|
||||
// * @returns {Promise<{json: any, params}>}
|
||||
// */
|
||||
// sendBoop(params) {
|
||||
// return request(`users/${params.userId}/boop`, {
|
||||
// method: 'POST',
|
||||
// params
|
||||
// }).then((json) => {
|
||||
// const args = {
|
||||
// json,
|
||||
// params
|
||||
// };
|
||||
// this.$emit('BOOP:SEND', args);
|
||||
// return args;
|
||||
// });
|
||||
// }
|
||||
/**
|
||||
* @params {{
|
||||
userId: string,
|
||||
emojiId: string
|
||||
}} params
|
||||
* @returns {Promise<{json: any, params}>}
|
||||
*/
|
||||
sendBoop(params) {
|
||||
return request(`users/${params.userId}/boop`, {
|
||||
method: 'POST',
|
||||
params: {
|
||||
emojiId: params.emojiId
|
||||
}
|
||||
}).then((json) => {
|
||||
const args = {
|
||||
json,
|
||||
params
|
||||
};
|
||||
return args;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
export default miscReq;
|
||||
|
||||
@@ -611,6 +611,7 @@
|
||||
} from '../../../shared/utils';
|
||||
import { useAvatarStore, useFavoriteStore, useGalleryStore, useGameStore, useUserStore } from '../../../stores';
|
||||
import { avatarModerationRequest, avatarRequest, favoriteRequest, miscRequest } from '../../../api';
|
||||
import { AppDebug } from '../../../service/appConfig.js';
|
||||
import { database } from '../../../service/database';
|
||||
import { getNextDialogIndex } from '../../../shared/utils/base/ui';
|
||||
import { handleImageUploadInput } from '../../../shared/utils/imageUpload';
|
||||
@@ -727,7 +728,7 @@
|
||||
}
|
||||
|
||||
function getImageUrlFromImageId(imageId) {
|
||||
return `https://api.vrchat.cloud/api/1/file/${imageId}/1/`;
|
||||
return `${AppDebug.endpointDomain}/file/${imageId}/1/`;
|
||||
}
|
||||
|
||||
function handleDialogOpen() {
|
||||
|
||||
@@ -1,277 +1,250 @@
|
||||
<!--<template>-->
|
||||
<!-- <el-dialog-->
|
||||
<!-- class="x-dialog"-->
|
||||
<!-- :model-value="sendBoopDialog.visible"-->
|
||||
<!-- :title="t('dialog.boop_dialog.header')"-->
|
||||
<!-- width="450px"-->
|
||||
<!-- @close="closeDialog">-->
|
||||
<!-- <el-select-->
|
||||
<!-- v-model="sendBoopDialog.userId"-->
|
||||
<!-- :placeholder="t('dialog.new_instance.instance_creator_placeholder')"-->
|
||||
<!-- filterable-->
|
||||
<!-- style="width: 100%">-->
|
||||
<!-- <el-option-group v-if="vipFriends.length" :label="t('side_panel.favorite')">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="friend in vipFriends"-->
|
||||
<!-- :key="friend.id"-->
|
||||
<!-- class="x-friend-item"-->
|
||||
<!-- :label="friend.name"-->
|
||||
<!-- :value="friend.id"-->
|
||||
<!-- style="height: auto">-->
|
||||
<!-- <template v-if="friend.ref">-->
|
||||
<!-- <div class="avatar" :class="userStatusClass(friend.ref)">-->
|
||||
<!-- <img :src="userImage(friend.ref)" loading="lazy">-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="detail">-->
|
||||
<!-- <span-->
|
||||
<!-- class="name"-->
|
||||
<!-- :style="{ color: friend.ref.$userColour }"-->
|
||||
<!-- v-text="friend.ref.displayName"></span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
<!-- <span v-else v-text="friend.id"></span>-->
|
||||
<!-- </el-option>-->
|
||||
<!-- </el-option-group>-->
|
||||
<!-- <el-option-group v-if="onlineFriends.length" :label="t('side_panel.online')">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="friend in onlineFriends"-->
|
||||
<!-- :key="friend.id"-->
|
||||
<!-- class="x-friend-item"-->
|
||||
<!-- :label="friend.name"-->
|
||||
<!-- :value="friend.id"-->
|
||||
<!-- style="height: auto">-->
|
||||
<!-- <template v-if="friend.ref">-->
|
||||
<!-- <div class="avatar" :class="userStatusClass(friend.ref)">-->
|
||||
<!-- <img :src="userImage(friend.ref)" loading="lazy">-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="detail">-->
|
||||
<!-- <span-->
|
||||
<!-- class="name"-->
|
||||
<!-- :style="{ color: friend.ref.$userColour }"-->
|
||||
<!-- v-text="friend.ref.displayName"></span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
<!-- <span v-else v-text="friend.id"></span>-->
|
||||
<!-- </el-option>-->
|
||||
<!-- </el-option-group>-->
|
||||
<!-- <el-option-group v-if="activeFriends.length" :label="t('side_panel.active')">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="friend in activeFriends"-->
|
||||
<!-- :key="friend.id"-->
|
||||
<!-- class="x-friend-item"-->
|
||||
<!-- :label="friend.name"-->
|
||||
<!-- :value="friend.id"-->
|
||||
<!-- style="height: auto">-->
|
||||
<!-- <template v-if="friend.ref">-->
|
||||
<!-- <div class="avatar">-->
|
||||
<!-- <img :src="userImage(friend.ref)" loading="lazy">-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="detail">-->
|
||||
<!-- <span-->
|
||||
<!-- class="name"-->
|
||||
<!-- :style="{ color: friend.ref.$userColour }"-->
|
||||
<!-- v-text="friend.ref.displayName"></span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
<!-- <span v-else v-text="friend.id"></span>-->
|
||||
<!-- </el-option>-->
|
||||
<!-- </el-option-group>-->
|
||||
<!-- <el-option-group v-if="offlineFriends.length" :label="t('side_panel.offline')">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="friend in offlineFriends"-->
|
||||
<!-- :key="friend.id"-->
|
||||
<!-- class="x-friend-item"-->
|
||||
<!-- :label="friend.name"-->
|
||||
<!-- :value="friend.id"-->
|
||||
<!-- style="height: auto">-->
|
||||
<!-- <template v-if="friend.ref">-->
|
||||
<!-- <div class="avatar">-->
|
||||
<!-- <img :src="userImage(friend.ref)" loading="lazy">-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="detail">-->
|
||||
<!-- <span-->
|
||||
<!-- class="name"-->
|
||||
<!-- :style="{ color: friend.ref.$userColour }"-->
|
||||
<!-- v-text="friend.ref.displayName"></span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
<!-- <span v-else v-text="friend.id"></span>-->
|
||||
<!-- </el-option>-->
|
||||
<!-- </el-option-group>-->
|
||||
<!-- </el-select>-->
|
||||
<template>
|
||||
<el-dialog
|
||||
class="x-dialog"
|
||||
v-model="sendBoopDialog.visible"
|
||||
:title="t('dialog.boop_dialog.header')"
|
||||
width="450px"
|
||||
@close="closeDialog">
|
||||
<el-select
|
||||
v-if="sendBoopDialog.visible"
|
||||
v-model="sendBoopDialog.userId"
|
||||
:placeholder="t('dialog.new_instance.instance_creator_placeholder')"
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option-group v-if="vipFriends.length" :label="t('side_panel.favorite')">
|
||||
<el-option
|
||||
v-for="friend in vipFriends"
|
||||
:key="friend.id"
|
||||
:label="friend.name"
|
||||
:value="friend.id"
|
||||
style="height: auto"
|
||||
class="x-friend-item">
|
||||
<template v-if="friend.ref">
|
||||
<div class="avatar" :class="userStatusClass(friend.ref)">
|
||||
<img :src="userImage(friend.ref)" loading="lazy" />
|
||||
</div>
|
||||
<div class="detail">
|
||||
<span
|
||||
class="name"
|
||||
:style="{ color: friend.ref.$userColour }"
|
||||
v-text="friend.ref.displayName"></span>
|
||||
</div>
|
||||
</template>
|
||||
<span v-else v-text="friend.id"></span>
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
<el-option-group v-if="onlineFriends.length" :label="t('side_panel.online')">
|
||||
<el-option
|
||||
v-for="friend in onlineFriends"
|
||||
:key="friend.id"
|
||||
:label="friend.name"
|
||||
:value="friend.id"
|
||||
style="height: auto"
|
||||
class="x-friend-item">
|
||||
<template v-if="friend.ref">
|
||||
<div class="avatar" :class="userStatusClass(friend.ref)">
|
||||
<img :src="userImage(friend.ref)" loading="lazy" />
|
||||
</div>
|
||||
<div class="detail">
|
||||
<span
|
||||
class="name"
|
||||
:style="{ color: friend.ref.$userColour }"
|
||||
v-text="friend.ref.displayName"></span>
|
||||
</div>
|
||||
</template>
|
||||
<span v-else v-text="friend.id"></span>
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
<el-option-group v-if="activeFriends.length" :label="t('side_panel.active')">
|
||||
<el-option
|
||||
v-for="friend in activeFriends"
|
||||
:key="friend.id"
|
||||
:label="friend.name"
|
||||
:value="friend.id"
|
||||
style="height: auto"
|
||||
class="x-friend-item">
|
||||
<template v-if="friend.ref">
|
||||
<div class="avatar">
|
||||
<img :src="userImage(friend.ref)" loading="lazy" />
|
||||
</div>
|
||||
<div class="detail">
|
||||
<span
|
||||
class="name"
|
||||
:style="{ color: friend.ref.$userColour }"
|
||||
v-text="friend.ref.displayName"></span>
|
||||
</div>
|
||||
</template>
|
||||
<span v-else v-text="friend.id"></span>
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
<el-option-group v-if="offlineFriends.length" :label="t('side_panel.offline')">
|
||||
<el-option
|
||||
v-for="friend in offlineFriends"
|
||||
:key="friend.id"
|
||||
:label="friend.name"
|
||||
:value="friend.id"
|
||||
style="height: auto"
|
||||
class="x-friend-item">
|
||||
<template v-if="friend.ref">
|
||||
<div class="avatar">
|
||||
<img :src="userImage(friend.ref)" loading="lazy" />
|
||||
</div>
|
||||
<div class="detail">
|
||||
<span
|
||||
class="name"
|
||||
:style="{ color: friend.ref.$userColour }"
|
||||
v-text="friend.ref.displayName"></span>
|
||||
</div>
|
||||
</template>
|
||||
<span v-else v-text="friend.id"></span>
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
|
||||
<!-- <br />-->
|
||||
<!-- <br />-->
|
||||
<br />
|
||||
<br />
|
||||
|
||||
<!-- <el-select-->
|
||||
<!-- v-model="fileId"-->
|
||||
<!-- clearable-->
|
||||
<!-- :placeholder="t('dialog.boop_dialog.select_emoji')"-->
|
||||
<!-- size="small"-->
|
||||
<!-- style="width: 100%"-->
|
||||
<!-- popper-class="max-height-el-select">-->
|
||||
<!-- <el-option-group :label="t('dialog.boop_dialog.my_emojis')">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="image in emojiTable"-->
|
||||
<!-- v-if="image.versions && image.versions.length > 0"-->
|
||||
<!-- :key="image.id"-->
|
||||
<!-- :value="image.id"-->
|
||||
<!-- style="width: 100%; height: 100%">-->
|
||||
<!-- <div-->
|
||||
<!-- v-if="image.versions[image.versions.length - 1].file.url"-->
|
||||
<!-- class="vrcplus-icon"-->
|
||||
<!-- style="overflow: hidden; width: 200px; height: 200px; padding: 10px">-->
|
||||
<!-- <template v-if="image.frames">-->
|
||||
<!-- <div-->
|
||||
<!-- class="avatar"-->
|
||||
<!-- :style="-->
|
||||
<!-- generateEmojiStyle(-->
|
||||
<!-- image.versions[image.versions.length - 1].file.url,-->
|
||||
<!-- image.framesOverTime,-->
|
||||
<!-- image.frames,-->
|
||||
<!-- image.loopStyle-->
|
||||
<!-- )-->
|
||||
<!-- "></div>-->
|
||||
<!-- </template>-->
|
||||
<!-- <template v-else>-->
|
||||
<!-- <img-->
|
||||
<!-- :src="image.versions[image.versions.length - 1].file.url"-->
|
||||
<!-- class="avatar"-->
|
||||
<!-- style="width: 200px; height: 200px" />-->
|
||||
<!-- </template>-->
|
||||
<!-- </div>-->
|
||||
<!-- </el-option>-->
|
||||
<!-- </el-option-group>-->
|
||||
<!-- <el-option-group :label="t('dialog.boop_dialog.default_emojis')">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="emojiName in photonEmojis"-->
|
||||
<!-- :key="emojiName"-->
|
||||
<!-- :value="getEmojiValue(emojiName)"-->
|
||||
<!-- style="width: 100%; height: 100%">-->
|
||||
<!-- <span v-text="emojiName"></span>-->
|
||||
<!-- </el-option>-->
|
||||
<!-- </el-option-group>-->
|
||||
<!-- </el-select>-->
|
||||
<el-select
|
||||
v-if="sendBoopDialog.visible"
|
||||
v-model="fileId"
|
||||
clearable
|
||||
:placeholder="t('dialog.boop_dialog.select_emoji')"
|
||||
size="small"
|
||||
style="width: 100%"
|
||||
popper-class="max-height-el-select">
|
||||
<el-option-group :label="t('dialog.boop_dialog.my_emojis')">
|
||||
<el-option
|
||||
v-for="image in emojiTable"
|
||||
:key="image.id"
|
||||
:value="image.id"
|
||||
style="width: 100%; height: 100%">
|
||||
<div
|
||||
v-if="
|
||||
image.versions &&
|
||||
image.versions.length > 0 &&
|
||||
image.versions[image.versions.length - 1].file.url
|
||||
"
|
||||
class="vrcplus-icon"
|
||||
style="overflow: hidden; width: 200px; height: 200px; padding: 10px">
|
||||
<template v-if="image.frames">
|
||||
<div
|
||||
class="avatar"
|
||||
:style="
|
||||
generateEmojiStyle(
|
||||
image.versions[image.versions.length - 1].file.url,
|
||||
image.framesOverTime,
|
||||
image.frames,
|
||||
image.loopStyle
|
||||
)
|
||||
"></div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<img
|
||||
:src="image.versions[image.versions.length - 1].file.url"
|
||||
class="avatar"
|
||||
style="width: 200px; height: 200px" />
|
||||
</template>
|
||||
</div>
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
<el-option-group :label="t('dialog.boop_dialog.default_emojis')">
|
||||
<el-option
|
||||
v-for="emojiName in photonEmojis"
|
||||
:key="emojiName"
|
||||
:value="getEmojiValue(emojiName)"
|
||||
style="width: 100%; height: 100%">
|
||||
<span v-text="emojiName"></span>
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
|
||||
<!-- <template #footer>-->
|
||||
<!-- <el-button size="small" @click="showGalleryDialog(2)">{{-->
|
||||
<!-- t('dialog.boop_dialog.emoji_manager')-->
|
||||
<!-- }}</el-button>-->
|
||||
<!-- <el-button size="small" @click="closeDialog">{{ t('dialog.boop_dialog.cancel') }}</el-button>-->
|
||||
<!-- <el-button size="small" :disabled="!sendBoopDialog.userId" @click="sendBoop">{{-->
|
||||
<!-- t('dialog.boop_dialog.send')-->
|
||||
<!-- }}</el-button>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-dialog>-->
|
||||
<!--</template>-->
|
||||
<template #footer>
|
||||
<el-button
|
||||
size="small"
|
||||
@click="
|
||||
redirectToToolsTab();
|
||||
showGalleryDialog();
|
||||
"
|
||||
>{{ t('dialog.boop_dialog.emoji_manager') }}</el-button
|
||||
>
|
||||
<el-button size="small" @click="closeDialog">{{ t('dialog.boop_dialog.cancel') }}</el-button>
|
||||
<el-button size="small" :disabled="!sendBoopDialog.userId" @click="sendBoop">{{
|
||||
t('dialog.boop_dialog.send')
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<!--<script setup>-->
|
||||
<!-- import { inject, ref } from 'vue';-->
|
||||
<!-- import { useI18n } from 'vue-i18n-bridge';-->
|
||||
<!-- import { photonEmojis } from '../../composables/shared/constants/photon.js';-->
|
||||
<!-- import { notificationRequest } from '../../api';-->
|
||||
<!-- // import { miscRequest } from '../../api';-->
|
||||
<script setup>
|
||||
import { ref, watch } from 'vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
<!-- const { t } = useI18n();-->
|
||||
import { generateEmojiStyle, userImage, userStatusClass } from '../../shared/utils';
|
||||
import { miscRequest } from '../../api';
|
||||
import { notificationRequest } from '../../api';
|
||||
import { photonEmojis } from '../../shared/constants/photon.js';
|
||||
import { redirectToToolsTab } from '../../shared/utils/base/ui';
|
||||
import { useFriendStore } from '../../stores';
|
||||
import { useGalleryStore } from '../../stores';
|
||||
import { useNotificationStore } from '../../stores';
|
||||
import { useUserStore } from '../../stores/user.js';
|
||||
|
||||
<!-- const userStatusClass = inject('userStatusClass');-->
|
||||
<!-- const userImage = inject('userImage');-->
|
||||
<!-- const showGalleryDialog = inject('showGalleryDialog');-->
|
||||
const { t } = useI18n();
|
||||
|
||||
<!-- const props = defineProps({-->
|
||||
<!-- sendBoopDialog: {-->
|
||||
<!-- type: Object,-->
|
||||
<!-- required: true-->
|
||||
<!-- },-->
|
||||
<!-- emojiTable: {-->
|
||||
<!-- type: Array,-->
|
||||
<!-- required: true-->
|
||||
<!-- },-->
|
||||
<!-- vipFriends: {-->
|
||||
<!-- type: Array,-->
|
||||
<!-- required: true-->
|
||||
<!-- },-->
|
||||
<!-- onlineFriends: {-->
|
||||
<!-- type: Array,-->
|
||||
<!-- required: true-->
|
||||
<!-- },-->
|
||||
<!-- activeFriends: {-->
|
||||
<!-- type: Array,-->
|
||||
<!-- required: true-->
|
||||
<!-- },-->
|
||||
<!-- offlineFriends: {-->
|
||||
<!-- type: Array,-->
|
||||
<!-- required: true-->
|
||||
<!-- },-->
|
||||
<!-- generateEmojiStyle: {-->
|
||||
<!-- type: Function,-->
|
||||
<!-- required: true-->
|
||||
<!-- },-->
|
||||
<!-- notificationTable: {-->
|
||||
<!-- type: Object,-->
|
||||
<!-- required: true-->
|
||||
<!-- }-->
|
||||
<!-- });-->
|
||||
const { sendBoopDialog } = storeToRefs(useUserStore());
|
||||
const { notificationTable } = storeToRefs(useNotificationStore());
|
||||
const { showGalleryDialog, refreshEmojiTable } = useGalleryStore();
|
||||
const { emojiTable } = storeToRefs(useGalleryStore());
|
||||
const { vipFriends, onlineFriends, activeFriends, offlineFriends } = useFriendStore();
|
||||
|
||||
<!-- const emit = defineEmits(['update:sendBoopDialog']);-->
|
||||
const fileId = ref('');
|
||||
|
||||
<!-- const fileId = ref('');-->
|
||||
watch(
|
||||
() => sendBoopDialog.value.visible,
|
||||
(visible) => {
|
||||
if (visible && emojiTable.value.length === 0) {
|
||||
refreshEmojiTable();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
<!-- // $app.data.sendBoopDialog = {-->
|
||||
<!-- // visible: false,-->
|
||||
<!-- // userId: ''-->
|
||||
<!-- // };-->
|
||||
<!-- // $app.methods.showSendBoopDialog = function (userId) {-->
|
||||
<!-- // this.$nextTick(() =>-->
|
||||
<!-- // $app.adjustDialogZ(this.$refs.sendBoopDialog.$el)-->
|
||||
<!-- // );-->
|
||||
<!-- // const D = this.sendBoopDialog;-->
|
||||
<!-- // D.userId = userId;-->
|
||||
<!-- // D.visible = true;-->
|
||||
<!-- // if (this.emojiTable.length === 0 && API.currentUser.$isVRCPlus) {-->
|
||||
<!-- // this.refreshEmojiTable();-->
|
||||
<!-- // }-->
|
||||
<!-- // };-->
|
||||
function closeDialog() {
|
||||
sendBoopDialog.value.visible = false;
|
||||
}
|
||||
function getEmojiValue(emojiName) {
|
||||
if (!emojiName) {
|
||||
return '';
|
||||
}
|
||||
return `default_${emojiName.replace(/ /g, '_').toLowerCase()}`;
|
||||
}
|
||||
|
||||
<!-- function closeDialog() {-->
|
||||
<!-- emit('update:sendBoopDialog', {-->
|
||||
<!-- ...props.sendBoopDialog,-->
|
||||
<!-- visible: false-->
|
||||
<!-- });-->
|
||||
<!-- }-->
|
||||
<!-- function getEmojiValue(emojiName) {-->
|
||||
<!-- if (!emojiName) {-->
|
||||
<!-- return '';-->
|
||||
<!-- }-->
|
||||
<!-- return `vrchat_${emojiName.replace(/ /g, '_').toLowerCase()}`;-->
|
||||
<!-- }-->
|
||||
function sendBoop() {
|
||||
const D = sendBoopDialog.value;
|
||||
dismissBoop(D.userId);
|
||||
const params = {
|
||||
userId: D.userId
|
||||
};
|
||||
if (fileId.value) {
|
||||
params.emojiId = fileId.value;
|
||||
}
|
||||
miscRequest.sendBoop(params);
|
||||
D.visible = false;
|
||||
}
|
||||
|
||||
<!-- function sendBoop() {-->
|
||||
<!-- const D = props.sendBoopDialog;-->
|
||||
<!-- dismissBoop(D.userId);-->
|
||||
<!-- const params = {-->
|
||||
<!-- userId: D.userId-->
|
||||
<!-- };-->
|
||||
<!-- if (fileId.value) {-->
|
||||
<!-- params.emojiId = fileId.value;-->
|
||||
<!-- }-->
|
||||
<!-- // miscRequest.sendBoop(params);-->
|
||||
<!-- D.visible = false;-->
|
||||
<!-- }-->
|
||||
|
||||
<!-- function dismissBoop(userId) {-->
|
||||
<!-- // JANK: This is a hack to remove boop notifications when responding-->
|
||||
<!-- const array = props.notificationTable.data;-->
|
||||
<!-- for (let i = array.length - 1; i >= 0; i--) {-->
|
||||
<!-- const ref = array[i];-->
|
||||
<!-- if (ref.type !== 'boop' || ref.$isExpired || ref.senderUserId !== userId) {-->
|
||||
<!-- continue;-->
|
||||
<!-- }-->
|
||||
<!-- notificationRequest.sendNotificationResponse({-->
|
||||
<!-- notificationId: ref.id,-->
|
||||
<!-- responseType: 'delete',-->
|
||||
<!-- responseData: ''-->
|
||||
<!-- });-->
|
||||
<!-- }-->
|
||||
<!-- }-->
|
||||
<!--</script>-->
|
||||
function dismissBoop(userId) {
|
||||
// JANK: This is a hack to remove boop notifications when responding
|
||||
const array = notificationTable.value.data;
|
||||
for (let i = array.length - 1; i >= 0; i--) {
|
||||
const ref = array[i];
|
||||
if (ref.type !== 'boop' || ref.$isExpired || ref.senderUserId !== userId) {
|
||||
continue;
|
||||
}
|
||||
notificationRequest.sendNotificationResponse({
|
||||
notificationId: ref.id,
|
||||
responseType: 'delete',
|
||||
responseData: ''
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -108,6 +108,12 @@
|
||||
<el-dropdown-item v-else :icon="Plus" command="Send Friend Request">{{
|
||||
t('dialog.user.actions.send_friend_request')
|
||||
}}</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
:disabled="!currentUser.isBoopingEnabled"
|
||||
:icon="Pointer"
|
||||
command="Send Boop"
|
||||
>{{ t('dialog.user.actions.send_boop') }}</el-dropdown-item
|
||||
>
|
||||
<el-dropdown-item :icon="Message" command="Invite To Group">{{
|
||||
t('dialog.user.actions.invite_to_group')
|
||||
}}</el-dropdown-item>
|
||||
|
||||
@@ -423,11 +423,17 @@
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<!--//- .x-friend-item(@click="toggleAllowBooping")-->
|
||||
<!--//- .detail-->
|
||||
<!--//- span.name {{ t('dialog.user.info.booping') }}-->
|
||||
<!--//- span.extra(v-if="currentUser.isBoopingEnabled" style="color:#67C23A") {{ t('dialog.user.info.avatar_cloning_allow') }}-->
|
||||
<!--//- span.extra(v-else style="color:#F56C6C") {{ t('dialog.user.info.avatar_cloning_deny') }}-->
|
||||
<div class="x-friend-item" @click="toggleAllowBooping">
|
||||
<div class="detail">
|
||||
<span class="name">{{ t('dialog.user.info.booping') }}</span>
|
||||
<span v-if="currentUser.isBoopingEnabled" class="extra" style="color: #67c23a">{{
|
||||
t('dialog.user.info.avatar_cloning_allow')
|
||||
}}</span>
|
||||
<span v-else class="extra" style="color: #f56c6c">{{
|
||||
t('dialog.user.info.avatar_cloning_deny')
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="x-friend-item" style="cursor: default">
|
||||
@@ -1302,8 +1308,14 @@
|
||||
const { hideUserNotes, hideUserMemos } = storeToRefs(useAppearanceSettingsStore());
|
||||
const { avatarRemoteDatabase } = storeToRefs(useAdvancedSettingsStore());
|
||||
const { userDialog, languageDialog, currentUser, isLocalUserVrcPlusSupporter } = storeToRefs(useUserStore());
|
||||
const { cachedUsers, showUserDialog, sortUserDialogAvatars, refreshUserDialogAvatars, refreshUserDialogTreeData } =
|
||||
useUserStore();
|
||||
const {
|
||||
cachedUsers,
|
||||
showUserDialog,
|
||||
sortUserDialogAvatars,
|
||||
refreshUserDialogAvatars,
|
||||
refreshUserDialogTreeData,
|
||||
showSendBoopDialog
|
||||
} = useUserStore();
|
||||
const { favoriteLimits } = storeToRefs(useFavoriteStore());
|
||||
const { showFavoriteDialog, handleFavoriteWorldList } = useFavoriteStore();
|
||||
const { showAvatarDialog, lookupAvatars, showAvatarAuthorDialog } = useAvatarStore();
|
||||
@@ -1749,8 +1761,8 @@
|
||||
redirectToToolsTab();
|
||||
} else if (command === 'Invite To Group') {
|
||||
showInviteGroupDialog('', D.id);
|
||||
// } else if (command === 'Send Boop') {
|
||||
// this.showSendBoopDialog(D.id);
|
||||
} else if (command === 'Send Boop') {
|
||||
showSendBoopDialog(D.id);
|
||||
} else if (command === 'Group Moderation') {
|
||||
showModerateGroupDialog(D.id);
|
||||
} else if (command === 'Hide Avatar') {
|
||||
@@ -2273,6 +2285,12 @@
|
||||
});
|
||||
}
|
||||
|
||||
function toggleAllowBooping() {
|
||||
userRequest.saveCurrentUser({
|
||||
isBoopingEnabled: !currentUser.value.isBoopingEnabled
|
||||
});
|
||||
}
|
||||
|
||||
function resetHome() {
|
||||
ElMessageBox.confirm('Continue? Reset Home', 'Confirm', {
|
||||
confirmButtonText: 'Confirm',
|
||||
|
||||
@@ -9,6 +9,7 @@ import {
|
||||
useSearchStore,
|
||||
useWorldStore
|
||||
} from '../../stores';
|
||||
import { AppDebug } from '../../service/appConfig.js';
|
||||
import { compareUnityVersion } from './avatar';
|
||||
import { escapeTag } from './base/string';
|
||||
import { miscRequest } from '../../api';
|
||||
@@ -213,7 +214,7 @@ function convertFileUrlToImageUrl(url, resolution = 128) {
|
||||
if (match) {
|
||||
const fileId = match[1];
|
||||
const version = match[2];
|
||||
return `https://api.vrchat.cloud/api/1/image/file_${fileId}/${version}/${resolution}`;
|
||||
return `${AppDebug.endpointDomain}/image/file_${fileId}/${version}/${resolution}`;
|
||||
}
|
||||
// no match return origin url
|
||||
return url;
|
||||
|
||||
@@ -54,4 +54,34 @@ function getEmojiFileName(emoji) {
|
||||
}
|
||||
}
|
||||
|
||||
export { getPrintLocalDate, getPrintFileName, getEmojiFileName };
|
||||
/**
|
||||
* @param {string} url
|
||||
* @param {number} fps
|
||||
* @param {number} frameCount
|
||||
* @param {string} loopStyle
|
||||
*/
|
||||
function generateEmojiStyle(url, fps, frameCount, loopStyle) {
|
||||
let framesPerLine = 2;
|
||||
if (frameCount > 4) framesPerLine = 4;
|
||||
if (frameCount > 16) framesPerLine = 8;
|
||||
const animationDurationMs = (1000 / fps) * frameCount;
|
||||
const frameSize = 1024 / framesPerLine;
|
||||
const scale = 100 / (frameSize / 200);
|
||||
const animStyle = loopStyle === 'pingpong' ? 'alternate' : 'none';
|
||||
const style = `
|
||||
transform: scale(${scale / 100});
|
||||
transform-origin: top left;
|
||||
width: ${frameSize}px;
|
||||
height: ${frameSize}px;
|
||||
background: url('${url}') 0 0;
|
||||
animation: ${animationDurationMs}ms steps(1) 0s infinite ${animStyle} running animated-emoji-${frameCount};
|
||||
`;
|
||||
return style;
|
||||
}
|
||||
|
||||
export {
|
||||
getPrintLocalDate,
|
||||
getPrintFileName,
|
||||
getEmojiFileName,
|
||||
generateEmojiStyle
|
||||
};
|
||||
|
||||
@@ -413,6 +413,15 @@ export const useNotificationStore = defineStore('Notification', () => {
|
||||
}
|
||||
ref.details = details;
|
||||
}
|
||||
if (ref.type === 'boop') {
|
||||
ref.message = ref.title;
|
||||
if (ref.details?.emojiId.startsWith('default_')) {
|
||||
ref.details.imageUrl = ref.details.emojiId;
|
||||
ref.message += ` ${ref.details.emojiId.replace('default_', '')}`;
|
||||
} else {
|
||||
ref.details.imageUrl = `${AppDebug.endpointDomain}/file/${ref.details.emojiId}/${ref.details.emojiVersion}`;
|
||||
}
|
||||
}
|
||||
return ref;
|
||||
}
|
||||
|
||||
|
||||
@@ -1115,7 +1115,7 @@ export const usePhotonStore = defineStore('Photon', () => {
|
||||
} else if (type === 1) {
|
||||
emojiName = 'Custom';
|
||||
var fileId = data.Parameters[245][1];
|
||||
imageUrl = `https://api.vrchat.cloud/api/1/file/${fileId}/1/`;
|
||||
imageUrl = `${AppDebug.endpointDomain}/file/${fileId}/1/`;
|
||||
}
|
||||
addEntryPhotonEvent({
|
||||
photonId,
|
||||
|
||||
@@ -269,6 +269,10 @@ export const useUserStore = defineStore('User', () => {
|
||||
languageChoice: false,
|
||||
languages: []
|
||||
});
|
||||
const sendBoopDialog = ref({
|
||||
visible: false,
|
||||
userId: ''
|
||||
});
|
||||
const pastDisplayNameTable = ref({
|
||||
data: [],
|
||||
tableProps: {
|
||||
@@ -1960,6 +1964,11 @@ export const useUserStore = defineStore('User', () => {
|
||||
return ref;
|
||||
}
|
||||
|
||||
function showSendBoopDialog(userId) {
|
||||
sendBoopDialog.value.userId = userId;
|
||||
sendBoopDialog.value.visible = true;
|
||||
}
|
||||
|
||||
return {
|
||||
state,
|
||||
|
||||
@@ -1968,6 +1977,7 @@ export const useUserStore = defineStore('User', () => {
|
||||
userDialog,
|
||||
subsetOfLanguages,
|
||||
languageDialog,
|
||||
sendBoopDialog,
|
||||
pastDisplayNameTable,
|
||||
showUserDialogHistory,
|
||||
customUserTags,
|
||||
@@ -1986,7 +1996,7 @@ export const useUserStore = defineStore('User', () => {
|
||||
initUserNotes,
|
||||
getCurrentUser,
|
||||
handleConfig,
|
||||
|
||||
showSendBoopDialog,
|
||||
checkNote
|
||||
};
|
||||
});
|
||||
|
||||
@@ -125,7 +125,16 @@
|
||||
|
||||
<el-table-column :label="t('table.notification.photo')" width="100" prop="photo">
|
||||
<template #default="scope">
|
||||
<template v-if="scope.row.details && scope.row.details.imageUrl">
|
||||
<template v-if="scope.row.type === 'boop'">
|
||||
<img
|
||||
v-if="!scope.row.details.imageUrl.startsWith('default_')"
|
||||
class="x-link"
|
||||
:src="getSmallThumbnailUrl(scope.row.details.imageUrl)"
|
||||
style="flex: none; height: 50px; border-radius: 4px"
|
||||
@click="showFullscreenImageDialog(scope.row.details.imageUrl)"
|
||||
loading="lazy" />
|
||||
</template>
|
||||
<template v-else-if="scope.row.details && scope.row.details.imageUrl">
|
||||
<img
|
||||
class="x-link"
|
||||
:src="getSmallThumbnailUrl(scope.row.details.imageUrl)"
|
||||
@@ -224,7 +233,14 @@
|
||||
<template v-for="response in scope.row.responses" :key="response.text">
|
||||
<el-tooltip placement="top" :content="response.text">
|
||||
<el-button
|
||||
v-if="response.icon === 'check'"
|
||||
v-if="response.type === 'link'"
|
||||
type="text"
|
||||
:icon="Link"
|
||||
size="small"
|
||||
:class="['button-pd-0', 'ml-5']"
|
||||
@click="openNotificationLink(response.data)" />
|
||||
<el-button
|
||||
v-else-if="response.icon === 'check'"
|
||||
type="text"
|
||||
:icon="Check"
|
||||
size="small"
|
||||
@@ -259,13 +275,13 @@
|
||||
@click="
|
||||
sendNotificationResponse(scope.row.id, scope.row.responses, response.type)
|
||||
" />
|
||||
<!--//el-button(-->
|
||||
<!--// v-else-if='response.icon === "reply" && scope.row.type === "boop"'-->
|
||||
<!--// type='text'-->
|
||||
<!--// icon='el-icon-chat-line-square'-->
|
||||
<!--// size='mini'-->
|
||||
<!--// style='margin-left: 5px'-->
|
||||
<!--// @click='showSendBoopDialog(scope.row.senderUserId)')-->
|
||||
<el-button
|
||||
v-else-if="response.icon === 'reply' && scope.row.type === 'boop'"
|
||||
type="text"
|
||||
:icon="ChatLineSquare"
|
||||
size="small"
|
||||
:class="['button-pd-0', 'ml-5']"
|
||||
@click="showSendBoopDialog(scope.row.senderUserId)" />
|
||||
<el-button
|
||||
v-else-if="response.icon === 'reply'"
|
||||
type="text"
|
||||
@@ -384,6 +400,7 @@
|
||||
Close,
|
||||
CollectionTag,
|
||||
Delete,
|
||||
Link,
|
||||
Refresh
|
||||
} from '@element-plus/icons-vue';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
@@ -419,7 +436,7 @@
|
||||
import SendInviteResponseDialog from './dialogs/SendInviteResponseDialog.vue';
|
||||
import configRepository from '../../service/config';
|
||||
|
||||
const { showUserDialog } = useUserStore();
|
||||
const { showUserDialog, showSendBoopDialog } = useUserStore();
|
||||
const { showWorldDialog } = useWorldStore();
|
||||
const { showGroupDialog } = useGroupStore();
|
||||
const { lastLocation, lastLocationDestination } = storeToRefs(useLocationStore());
|
||||
|
||||
@@ -550,8 +550,14 @@
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import {
|
||||
extractFileId,
|
||||
formatDateFilter,
|
||||
generateEmojiStyle,
|
||||
getEmojiFileName,
|
||||
getPrintFileName
|
||||
} from '../../../shared/utils';
|
||||
import { inventoryRequest, miscRequest, userRequest, vrcPlusIconRequest, vrcPlusImageRequest } from '../../../api';
|
||||
import { extractFileId, formatDateFilter, getEmojiFileName, getPrintFileName } from '../../../shared/utils';
|
||||
import { useAdvancedSettingsStore, useAuthStore, useGalleryStore, useUserStore } from '../../../stores';
|
||||
import { emojiAnimationStyleList, emojiAnimationStyleUrl } from '../../../shared/constants';
|
||||
import { AppDebug } from '../../../service/appConfig';
|
||||
@@ -905,25 +911,6 @@
|
||||
document.getElementById('EmojiUploadButton').click();
|
||||
}
|
||||
|
||||
function generateEmojiStyle(url, fps, frameCount, loopStyle) {
|
||||
let framesPerLine = 2;
|
||||
if (frameCount > 4) framesPerLine = 4;
|
||||
if (frameCount > 16) framesPerLine = 8;
|
||||
const animationDurationMs = (1000 / fps) * frameCount;
|
||||
const frameSize = 1024 / framesPerLine;
|
||||
const scale = 100 / (frameSize / 200);
|
||||
const animStyle = loopStyle === 'pingpong' ? 'alternate' : 'none';
|
||||
const style = `
|
||||
transform: scale(${scale / 100});
|
||||
transform-origin: top left;
|
||||
width: ${frameSize}px;
|
||||
height: ${frameSize}px;
|
||||
background: url('${url}') 0 0;
|
||||
animation: ${animationDurationMs}ms steps(1) 0s infinite ${animStyle} running animated-emoji-${frameCount};
|
||||
`;
|
||||
return style;
|
||||
}
|
||||
|
||||
function deleteEmoji(fileId) {
|
||||
miscRequest.deleteFile(fileId).then((args) => {
|
||||
const array = emojiTable.value;
|
||||
|
||||
Reference in New Issue
Block a user