feat: require double click for sensitive images

This commit is contained in:
무라쿠모 2024-07-20 22:21:57 +09:00
parent 8bd86ce456
commit 7d4383c449
No known key found for this signature in database
GPG key ID: 139D6573F92DA9F7
6 changed files with 83 additions and 10 deletions

View file

@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<div :class="$style.root">
<MkMediaAudio v-if="media.type.startsWith('audio') && media.type !== 'audio/midi'" :audio="media"/>
<div v-else-if="media.isSensitive && hide" :class="$style.sensitive" @click="showHiddenContent">
<div v-else-if="media.isSensitive && hide" :class="$style.sensitive" @click="showHiddenContent" @dblclick="showHiddenContentDouble">
<span style="font-size: 1.6em;"><i class="ti ti-alert-triangle"></i></span>
<b>{{ i18n.ts.sensitive }}</b>
<span>{{ i18n.ts.clickToShow }}</span>
@ -30,6 +30,7 @@ import { i18n } from '@/i18n.js';
import MkMediaAudio from '@/components/MkMediaAudio.vue';
import { pleaseLogin } from '@/scripts/please-login.js';
import { $i } from '@/account.js';
import { defaultStore } from '@/store.js';
const props = withDefaults(defineProps<{
media: Misskey.entities.DriveFile;
@ -40,6 +41,25 @@ const audioEl = shallowRef<HTMLAudioElement>();
const hide = ref(true);
function showHiddenContent(ev: MouseEvent) {
if (defaultStore.state.sensitiveDoubleClickRequired) {
return;
}
if (props.media.isSensitive && !$i) {
ev.preventDefault();
ev.stopPropagation();
pleaseLogin();
return;
}
if (hide.value) {
ev.preventDefault();
ev.stopPropagation();
hide.value = false;
}
}
function showHiddenContentDouble(ev: MouseEvent) {
if (props.media.isSensitive && !$i) {
ev.preventDefault();
ev.stopPropagation();