mirror/hotomoe
1
0
Fork 0
mirror of https://github.com/hotomoe/hotomoe synced 2024-12-01 16:28:12 +09:00
Code

🎨

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