Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Update EmAvatar.vue

Browse source
This commit is contained in:
syuilo 2024-08-23 08:33:12 +09:00
parent 9dd7b79704
commit 1b08879d11
1 changed files with 3 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
packages/embed/src/components/EmAvatar.vue
View file

@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
--> -->
<template> <template>
<component :is="link ? EmA : 'span'" v-bind="bound" class="_noSelect" :class="[$style.root, { [$style.cat]: user.isCat }]" :style="{ color }" :title="acct(user)" @click="onClick"> <component :is="link ? EmA : 'span'" v-bind="bound" class="_noSelect" :class="[$style.root, { [$style.cat]: user.isCat }]" @click="onClick">
<MkImgWithBlurhash :class="$style.inner" :src="url" :hash="user.avatarBlurhash" :cover="true" :onlyAvgColor="true"/> <MkImgWithBlurhash :class="$style.inner" :src="url" :hash="user.avatarBlurhash" :cover="true" :onlyAvgColor="true"/>
<MkUserOnlineIndicator v-if="indicator" :class="$style.indicator" :user="user"/> <MkUserOnlineIndicator v-if="indicator" :class="$style.indicator" :user="user"/>
<div v-if="user.isCat" :class="[$style.ears]"> <div v-if="user.isCat" :class="[$style.ears]">
@ -38,13 +38,11 @@ SPDX-License-Identifier: AGPL-3.0-only
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { watch, ref, computed, inject } from 'vue'; import { computed } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
import MkImgWithBlurhash from '../MkImgWithBlurhash.vue'; import MkImgWithBlurhash from '../MkImgWithBlurhash.vue';
import EmA from './EmA.vue'; import EmA from './EmA.vue';
import { getStaticImageUrl } from '@/scripts/media-proxy.js'; import { userPage } from '@/filters/user.js';
import { extractAvgColorFromBlurhash } from '@/scripts/extract-avg-color-from-blurhash.js';
import { acct, userPage } from '@/filters/user.js';
import MkUserOnlineIndicator from '@/components/MkUserOnlineIndicator.vue'; import MkUserOnlineIndicator from '@/components/MkUserOnlineIndicator.vue';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
@ -97,15 +95,6 @@ function getDecorationOffset(decoration: Omit<Misskey.entities.UserDetailed['ava
const offsetY = decoration.offsetY ?? 0; const offsetY = decoration.offsetY ?? 0;
return offsetX === 0 && offsetY === 0 ? undefined : `${offsetX * 100}% ${offsetY * 100}%`; return offsetX === 0 && offsetY === 0 ? undefined : `${offsetX * 100}% ${offsetY * 100}%`;
} }
const color = ref<string | undefined>();
watch(() => props.user.avatarBlurhash, () => {
if (props.user.avatarBlurhash == null) return;
color.value = extractAvgColorFromBlurhash(props.user.avatarBlurhash);
}, {
immediate: true,
});
</script> </script>
<style lang="scss" module> <style lang="scss" module>