upd: add like button to normal note component
This commit is contained in:
parent
ae3d77ad46
commit
f82f2cc3e1
1 changed files with 20 additions and 0 deletions
|
@ -108,6 +108,9 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<button v-else :class="$style.footerButton" class="_button" disabled>
|
<button v-else :class="$style.footerButton" class="_button" disabled>
|
||||||
<i class="ph-prohibit ph-bold ph-lg"></i>
|
<i class="ph-prohibit ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
|
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
||||||
|
<i class="ph-heart ph-bold ph-lg"></i>
|
||||||
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.footerButton" class="_button" @mousedown="react()">
|
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.footerButton" class="_button" @mousedown="react()">
|
||||||
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-heart ph-bold ph-lg"></i>
|
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-heart ph-bold ph-lg"></i>
|
||||||
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
||||||
|
@ -212,6 +215,7 @@ const renoteButton = shallowRef<HTMLElement>();
|
||||||
const renoteTime = shallowRef<HTMLElement>();
|
const renoteTime = shallowRef<HTMLElement>();
|
||||||
const reactButton = shallowRef<HTMLElement>();
|
const reactButton = shallowRef<HTMLElement>();
|
||||||
const clipButton = shallowRef<HTMLElement>();
|
const clipButton = shallowRef<HTMLElement>();
|
||||||
|
const likeButton = shallowRef<HTMLElement>();
|
||||||
let appearNote = $computed(() => isRenote ? note.renote as Misskey.entities.Note : note);
|
let appearNote = $computed(() => isRenote ? note.renote as Misskey.entities.Note : note);
|
||||||
const isMyRenote = $i && ($i.id === note.userId);
|
const isMyRenote = $i && ($i.id === note.userId);
|
||||||
const showContent = ref(false);
|
const showContent = ref(false);
|
||||||
|
@ -365,6 +369,22 @@ function reply(viaKeyboard = false): void {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function like(): void {
|
||||||
|
pleaseLogin();
|
||||||
|
showMovedDialog();
|
||||||
|
os.api('notes/reactions/create', {
|
||||||
|
noteId: props.note.id,
|
||||||
|
reaction: '❤️',
|
||||||
|
});
|
||||||
|
const el = likeButton.value as HTMLElement | null | undefined;
|
||||||
|
if (el) {
|
||||||
|
const rect = el.getBoundingClientRect();
|
||||||
|
const x = rect.left + (el.offsetWidth / 2);
|
||||||
|
const y = rect.top + (el.offsetHeight / 2);
|
||||||
|
os.popup(MkRippleEffect, { x, y }, {}, 'end');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function react(viaKeyboard = false): void {
|
function react(viaKeyboard = false): void {
|
||||||
pleaseLogin();
|
pleaseLogin();
|
||||||
showMovedDialog();
|
showMovedDialog();
|
||||||
|
|
Loading…
Reference in a new issue