This commit is contained in:
syuilo 2020-03-20 22:37:44 +09:00
parent 3d40b7e822
commit 500518348b
8 changed files with 13 additions and 84 deletions

View File

@ -439,7 +439,6 @@ serverLogs: "サーバーログ"
deleteAll: "全て削除"
showFixedPostForm: "タイムライン上部に投稿フォームを表示する"
newNoteRecived: "新しいノートがあります"
useNotificationsPopup: "通知一覧をポップアップで表示"
sounds: "サウンド"
listen: "聴く"
none: "なし"

View File

@ -51,11 +51,7 @@
<fa :icon="faHome" fixed-width/><span class="text">{{ $store.getters.isSignedIn ? $t('timeline') : $t('home') }}</span>
</router-link>
<template v-if="$store.getters.isSignedIn">
<button class="item _button notifications" @click="notificationsOpen = !notificationsOpen" ref="notificationButton" v-if="$store.state.device.useNotificationsPopup">
<fa :icon="faBell" fixed-width/><span class="text">{{ $t('notifications') }}</span>
<i v-if="$store.state.i.hasUnreadNotification"><fa :icon="faCircle"/></i>
</button>
<router-link class="item notifications" active-class="active" to="/my/notifications" ref="notificationButton" v-else>
<router-link class="item notifications" active-class="active" to="/my/notifications" ref="notificationButton">
<fa :icon="faBell" fixed-width/><span class="text">{{ $t('notifications') }}</span>
<i v-if="$store.state.i.hasUnreadNotification"><fa :icon="faCircle"/></i>
</router-link>
@ -149,17 +145,12 @@
<button class="button nav _button" @click="showNav = true" ref="navButton"><fa :icon="faBars"/><i v-if="$store.getters.isSignedIn && ($store.state.i.hasUnreadSpecifiedNotes || $store.state.i.hasPendingReceivedFollowRequest || $store.state.i.hasUnreadMessagingMessage || $store.state.i.hasUnreadAnnouncement)"><fa :icon="faCircle"/></i></button>
<button v-if="$route.name === 'index'" class="button home _button" @click="top()"><fa :icon="faHome"/></button>
<button v-else class="button home _button" @click="$router.push('/')"><fa :icon="faHome"/></button>
<button v-if="$store.getters.isSignedIn && $store.state.device.useNotificationsPopup" class="button notifications _button" @click="notificationsOpen = !notificationsOpen" ref="notificationButton2"><fa :icon="notificationsOpen ? faTimes : faBell"/><i v-if="$store.state.i.hasUnreadNotification"><fa :icon="faCircle"/></i></button>
<button v-if="$store.getters.isSignedIn && !$store.state.device.useNotificationsPopup" class="button notifications _button" @click="$router.push('/my/notifications')" ref="notificationButton2"><fa :icon="faBell"/><i v-if="$store.state.i.hasUnreadNotification"><fa :icon="faCircle"/></i></button>
<button v-if="$store.getters.isSignedIn" class="button notifications _button" @click="$router.push('/my/notifications')" ref="notificationButton2"><fa :icon="faBell"/><i v-if="$store.state.i.hasUnreadNotification"><fa :icon="faCircle"/></i></button>
<button v-if="$store.getters.isSignedIn" class="button post _buttonPrimary" @click="post()"><fa :icon="faPencilAlt"/></button>
</div>
<button v-if="$store.getters.isSignedIn" class="post _buttonPrimary" @click="post()"><fa :icon="faPencilAlt"/></button>
<transition name="zoom-in-top">
<x-notifications v-if="notificationsOpen" class="notifications" ref="notifications"/>
</transition>
<stream-indicator v-if="$store.getters.isSignedIn"/>
</div>
</template>
@ -173,7 +164,6 @@ import { v4 as uuid } from 'uuid';
import i18n from './i18n';
import { host, instanceName } from './config';
import { search } from './scripts/search';
import contains from './scripts/contains';
import MkToast from './components/toast.vue';
const DESKTOP_THRESHOLD = 1100;
@ -183,7 +173,6 @@ export default Vue.extend({
components: {
XClock: () => import('./components/header-clock.vue').then(m => m.default),
XNotifications: () => import('./components/notifications.vue').then(m => m.default),
MkButton: () => import('./components/ui/button.vue').then(m => m.default),
XDraggable: () => import('vuedraggable'),
},
@ -194,7 +183,6 @@ export default Vue.extend({
pageKey: 0,
showNav: false,
searching: false,
notificationsOpen: false,
accounts: [],
lists: [],
connection: null,
@ -226,23 +214,10 @@ export default Vue.extend({
watch:{
$route(to, from) {
this.pageKey++;
this.notificationsOpen = false;
this.showNav = false;
this.canBack = (window.history.length > 0 && !['index'].includes(to.name));
},
notificationsOpen(open) {
if (open) {
for (const el of Array.from(document.querySelectorAll('*'))) {
el.addEventListener('mousedown', this.onMousedown);
}
} else {
for (const el of Array.from(document.querySelectorAll('*'))) {
el.removeEventListener('mousedown', this.onMousedown);
}
}
},
isDesktop() {
if (this.isDesktop) this.adjustWidgetsWidth();
}
@ -568,15 +543,6 @@ export default Vue.extend({
this.$root.sound('notification');
},
onMousedown(e) {
e.preventDefault();
if (!contains(this.$refs.notifications.$el, e.target) &&
!contains(this.$refs.notificationButton, e.target) &&
!contains(this.$refs.notificationButton2, e.target)
) this.notificationsOpen = false;
return false;
},
widgetFunc(id) {
const w = this.$refs[id][0];
if (w.func) w.func();
@ -976,18 +942,20 @@ export default Vue.extend({
width: $main-width;
min-width: $main-width;
box-shadow: 1px 0 0 0 var(--divider), -1px 0 0 0 var(--divider);
background: var(--mainBg);
@media (max-width: $side-hide-threshold) {
min-width: 0;
}
> .content {
padding: 16px 0;
box-sizing: border-box;
> * {
&:not(.full) {
padding: var(--margin) 0;
}
@media (max-width: 500px) {
padding: 8px 0;
&:not(.naked) {
background: var(--pageBg);
}
}
}
@ -1178,34 +1146,5 @@ export default Vue.extend({
}
}
}
> .notifications {
position: fixed;
top: 32px;
left: 0;
right: 0;
margin: 0 auto;
padding: 8px 8px 0 8px;
z-index: 10001;
width: 350px;
height: 400px;
box-sizing: border-box;
background: var(--vocsgcxy);
-webkit-backdrop-filter: blur(12px);
backdrop-filter: blur(12px);
border-radius: 6px;
box-shadow: 0 3px 12px rgba(27, 31, 35, 0.15);
overflow: auto;
@media (max-width: 800px) {
width: 320px;
height: 350px;
}
@media (max-width: 500px) {
width: 290px;
height: 310px;
}
}
}
</style>

View File

@ -1,5 +1,5 @@
<template>
<div>
<div class="naked full">
<portal to="header">
<button @click="menu" class="_button _jmoebdiw_">
<fa :icon="faCloud" style="margin-right: 8px;"/>

View File

@ -1,5 +1,5 @@
<template>
<div class="mk-messaging-room"
<div class="mk-messaging-room naked"
@dragover.prevent.stop="onDragover"
@drop.prevent.stop="onDrop"
>

View File

@ -63,7 +63,6 @@
<template #desc><mfm text="🍮🍦🍭🍩🍰🍫🍬🥞🍪"/></template>
</mk-switch>
<mk-switch v-model="showFixedPostForm">{{ $t('showFixedPostForm') }}</mk-switch>
<mk-switch v-model="useNotificationsPopup">{{ $t('useNotificationsPopup') }}</mk-switch>
</div>
<div class="_content">
<mk-select v-model="lang">
@ -175,11 +174,6 @@ export default Vue.extend({
set(value) { this.$store.commit('device/set', { key: 'showFixedPostForm', value }); }
},
useNotificationsPopup: {
get() { return this.$store.state.device.useNotificationsPopup; },
set(value) { this.$store.commit('device/set', { key: 'useNotificationsPopup', value }); }
},
sfxVolume: {
get() { return this.$store.state.device.sfxVolume; },
set(value) { this.$store.commit('device/set', { key: 'sfxVolume', value: parseFloat(value, 10) }); }

View File

@ -40,7 +40,6 @@ const defaultDeviceSettings = {
animatedMfm: true,
imageNewTab: false,
showFixedPostForm: false,
useNotificationsPopup: true,
sfxVolume: 0.3,
sfxNote: 'syuilo/down',
sfxNoteMy: 'syuilo/up',

View File

@ -20,7 +20,7 @@
panel: '#000',
shadow: 'rgba(0, 0, 0, 0.1)',
header: 'rgba(20, 20, 20, 0.75)',
mainBg: ':lighten<3<@bg',
pageBg: ':lighten<5<@bg',
navBg: '@panel',
navFg: '@fg',
navHoverFg: ':lighten<17<@fg',
@ -53,7 +53,6 @@
badge: '#31b1ce',
bonzsgfz: ':alpha<0<@bg',
pcncwizz: ':darken<2<@panel',
vocsgcxy: 'rgba(0, 0, 0, 0.5)',
yrnqrguo: 'rgba(255, 255, 255, 0.05)',
nwjktjjq: 'rgba(255, 255, 255, 0.1)',
geavgsxy: 'rgba(255, 255, 255, 0.05)',

View File

@ -20,7 +20,7 @@
panel: '#fff',
shadow: 'rgba(0, 0, 0, 0.1)',
header: 'rgba(255, 255, 255, 0.75)',
mainBg: '@bg',
pageBg: '@bg',
navBg: '@panel',
navFg: '@fg',
navHoverFg: ':darken<17<@fg',
@ -53,7 +53,6 @@
badge: '#31b1ce',
bonzsgfz: ':alpha<0<@bg',
pcncwizz: ':darken<2<@panel',
vocsgcxy: 'rgba(255, 255, 255, 0.5)',
yrnqrguo: 'rgba(0, 0, 0, 0.05)',
nwjktjjq: 'rgba(0, 0, 0, 0.1)',
geavgsxy: 'rgba(0, 0, 0, 0.05)',