heartles/egirlskey
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

🎨

Browse source
This commit is contained in:
syuilo 2023-01-08 14:28:14 +09:00
parent 1cfdd4c41a
commit dcca2350dd
1 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
packages/frontend/src/components/MkReactionsViewer.reaction.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<button <button
ref="buttonRef" ref="buttonEl"
v-ripple="canToggle" v-ripple="canToggle"
class="hkzvhatu _button" class="hkzvhatu _button"
:class="{ reacted: note.myReaction == reaction, canToggle }" :class="{ reacted: note.myReaction == reaction, canToggle }"
@ -28,7 +28,7 @@ const props = defineProps<{
note: misskey.entities.Note; note: misskey.entities.Note;
}>(); }>();
const buttonRef = shallowRef<HTMLElement>(); const buttonEl = shallowRef<HTMLElement>();
const canToggle = computed(() => !props.reaction.match(/@\w/) && $i); const canToggle = computed(() => !props.reaction.match(/@\w/) && $i);
@ -58,9 +58,9 @@ const toggleReaction = () => {
const anime = () => { const anime = () => {
if (document.hidden) return; if (document.hidden) return;
const rect = buttonRef.value.getBoundingClientRect(); const rect = buttonEl.value.getBoundingClientRect();
const x = rect.left + (buttonRef.value.offsetWidth / 2); const x = rect.left + 16;
const y = rect.top + (buttonRef.value.offsetHeight / 2); const y = rect.top + (buttonEl.value.offsetHeight / 2);
os.popup(MkPlusOneEffect, { reaction: props.reaction, x, y }, {}, 'end'); os.popup(MkPlusOneEffect, { reaction: props.reaction, x, y }, {}, 'end');
}; };
@ -72,7 +72,7 @@ onMounted(() => {
if (!props.isInitial) anime(); if (!props.isInitial) anime();
}); });
useTooltip(buttonRef, async (showing) => { useTooltip(buttonEl, async (showing) => {
const reactions = await os.apiGet('notes/reactions', { const reactions = await os.apiGet('notes/reactions', {
noteId: props.note.id, noteId: props.note.id,
type: props.reaction, type: props.reaction,
@ -87,7 +87,7 @@ useTooltip(buttonRef, async (showing) => {
reaction: props.reaction, reaction: props.reaction,
users, users,
count: props.count, count: props.count,
targetElement: buttonRef.value, targetElement: buttonEl.value,
}, {}, 'closed'); }, {}, 'closed');
}, 100); }, 100);
</script> </script>