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

Revert "wip"

Browse source 
This reverts commit be97c6cb88.
This commit is contained in:
tamaina 2023-05-06 17:03:48 +00:00
parent be97c6cb88
commit 8a893cfe2a
1 changed files with 6 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
packages/frontend/src/components/MkImgWithBlurhash.vue
View file

@ -1,6 +1,8 @@
<template> <template>
<div :class="[$style.root, { [$style.cover]: cover }]" :title="title ?? ''"> <div :class="[$style.root, { [$style.cover]: cover }]" :title="title ?? ''">
<TransitionGroup <img v-if="!loaded && src" :class="$style.loader" :src="src" @load="onLoad"/>
<Transition
mode="in-out"
:enter-active-class="defaultStore.state.animation && (props.transition?.enterActiveClass ?? $style['transition_toggle_enterActive']) || undefined" :enter-active-class="defaultStore.state.animation && (props.transition?.enterActiveClass ?? $style['transition_toggle_enterActive']) || undefined"
:leave-active-class="defaultStore.state.animation && (props.transition?.leaveActiveClass ?? $style['transition_toggle_leaveActive']) || undefined" :leave-active-class="defaultStore.state.animation && (props.transition?.leaveActiveClass ?? $style['transition_toggle_leaveActive']) || undefined"
:enter-from-class="defaultStore.state.animation && props.transition?.enterFromClass || undefined" :enter-from-class="defaultStore.state.animation && props.transition?.enterFromClass || undefined"
@ -8,9 +10,9 @@
:enter-to-class="defaultStore.state.animation && (props.transition?.enterToClass ?? $style['transition_toggle_enterTo']) || undefined" :enter-to-class="defaultStore.state.animation && (props.transition?.enterToClass ?? $style['transition_toggle_enterTo']) || undefined"
:leave-from-class="defaultStore.state.animation && (props.transition?.leaveFromClass ?? $style['transition_toggle_leaveFrom']) || undefined" :leave-from-class="defaultStore.state.animation && (props.transition?.leaveFromClass ?? $style['transition_toggle_leaveFrom']) || undefined"
> >
<canvas v-show="hide" ref="canvas" :class="$style.canvas" :width="canvasWidth" :height="canvasHeight" :title="title ?? undefined"/> <canvas v-if="!loaded || forceBlurhash" ref="canvas" :class="$style.canvas" :width="canvasWidth" :height="canvasHeight" :title="title ?? undefined"/>
<img v-show="!hide" :class="$style.img" :width="props.width" :height="props.height" :src="src ?? undefined" :title="title ?? undefined" :alt="alt ?? undefined" loading="eager" @load="onLoad"/> <img v-else :class="$style.img" :width="props.width" :height="props.height" :src="src ?? undefined" :title="title ?? undefined" :alt="alt ?? undefined"/>
</TransitionGroup> </Transition>
</div> </div>
</template> </template>
@ -63,7 +65,6 @@ const offscreen = computed(() => {
let loaded = $ref(false); let loaded = $ref(false);
let canvasWidth = $ref(props.width); let canvasWidth = $ref(props.width);
let canvasHeight = $ref(props.height); let canvasHeight = $ref(props.height);
const hide = computed(() => !loaded || props.forceBlurhash);
function onLoad() { function onLoad() {
loaded = true; loaded = true;