ap note preview

This commit is contained in:
fly_mc 2024-10-08 13:31:43 +08:00
parent 8a78ef4861
commit 4186cfc5cb
2 changed files with 45 additions and 1 deletions

View file

@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkNoteHeader :class="$style.header" :note="note" :mini="true"/>
<div>
<p v-if="note.cw != null" :class="$style.cw">
<Mfm v-if="note.cw != ''" style="margin-right: 8px;" :text="note.cw" :author="note.user" :nyaize="'respect'" :emojiUrls="note.emojis"/>
<Mfm v-if="note.cw != ''" style="margin-right: 8px;" :text="note.cw" :isBlock="true" :author="note.user" :nyaize="'respect'" :emojiUrls="note.emojis" @click.stop="defaultStore.state.clickToOpen ? noteclick(note.id) : undefined"/>
<MkCwButton v-model="showContent" :text="note.text" :files="note.files" :poll="note.poll"/>
</p>
<div v-show="note.cw == null || showContent">
@ -27,12 +27,20 @@ import * as Misskey from 'misskey-js';
import MkNoteHeader from '@/components/MkNoteHeader.vue';
import MkSubNoteContent from '@/components/MkSubNoteContent.vue';
import MkCwButton from '@/components/MkCwButton.vue';
import { useRouter } from '@/router/supplier.js';
const props = defineProps<{
note: Misskey.entities.Note;
}>();
const showContent = ref(false);
function noteclick(id: string) {
const selection = document.getSelection();
if (selection?.toString().length === 0) {
useRouter().push(`/notes/${id}`);
}
}
</script>
<style lang="scss" module>

View file

@ -43,6 +43,14 @@ SPDX-License-Identifier: AGPL-3.0-only
</MkButton>
</div>
</template>
<template v-else-if="apNote && apExpanded">
<MkNoteSimple :note="apNote" :class="$style.linkNote"/>
<div :class="$style.action">
<MkButton :small="true" inline @click="apExpanded = false">
<i class="ti ti-x"></i> {{ i18n.ts.close }}
</MkButton>
</div>
</template>
<div v-else>
<component :is="self ? 'MkA' : 'a'" :class="[$style.link, { [$style.compact]: compact }]" :[attr]="self ? url.substring(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
<div v-if="thumbnail && !sensitive" :class="$style.thumbnail" :style="defaultStore.state.dataSaver.urlPreview ? '' : `background-image: url('${thumbnail}')`">
@ -78,12 +86,20 @@ SPDX-License-Identifier: AGPL-3.0-only
<i class="ti ti-picture-in-picture"></i> {{ i18n.ts.openInWindow }}
</MkButton>
</div>
<div v-else-if="!apExpanded && apNote" :class="$style.action">
<MkButton :small="true" inline @click="apExpanded = true">
<i class="ti ti-world-x"></i> {{ i18n.ts.expandTweet }}
</MkButton>
</div>
</template>
</div>
</template>
<script lang="ts" setup>
import { defineAsyncComponent, onDeactivated, onUnmounted, ref } from 'vue';
import * as Misskey from 'misskey-js';
import MkNoteSimple from './MkNoteSimple.vue';
import { misskeyApi } from '@/scripts/misskey-api.js';
import type { summaly } from '@misskey-dev/summaly';
import { url as local } from '@@/js/config.js';
import { i18n } from '@/i18n.js';
@ -131,6 +147,8 @@ const tweetExpanded = ref(props.detail);
const embedId = `embed${Math.random().toString().replace(/\D/, '')}`;
const tweetHeight = ref(150);
const unknownUrl = ref(false);
const apExpanded = ref(false);
const apNote = ref<Misskey.entities.Note | null>(null);
onDeactivated(() => {
playerEnabled.value = false;
@ -178,6 +196,16 @@ window.fetch(`/url?url=${encodeURIComponent(requestUrl.href)}&lang=${versatileLa
sitename.value = info.sitename;
player.value = info.player;
sensitive.value = info.sensitive ?? false;
if (info.activityPub) {
misskeyApi('ap/show', {
uri: info.activityPub,
}).then(res => {
if (res.type === 'Note') {
apNote.value = res.object;
}
});
}
});
function adjustTweetHeight(message: any) {
@ -236,6 +264,14 @@ onUnmounted(() => {
width: 100%;
}
.linkNote {
margin-top: 5px;
padding: 16px;
border: solid 1px var(--renote);
border-radius: var(--radius-sm);
overflow: clip;
}
.link {
position: relative;
display: block;