usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

wip

This commit is contained in:
syuilo 2020-03-20 22:37:44 +09:00
parent def5ea7978
commit c88e737a84
8 changed files with 13 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
locales/ja-JP.yml
View File

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

79
src/client/app.vue
View File

@ -51,11 +51,7 @@
<fa :icon="faHome" fixed-width/><span class="text">{{ $store.getters.isSignedIn ? $t('timeline') : $t('home') }}</span> <fa :icon="faHome" fixed-width/><span class="text">{{ $store.getters.isSignedIn ? $t('timeline') : $t('home') }}</span>
</router-link> </router-link>
<template v-if="$store.getters.isSignedIn"> <template v-if="$store.getters.isSignedIn">
<button class="item _button notifications" @click="notificationsOpen = !notificationsOpen" ref="notificationButton" v-if="$store.state.device.useNotificationsPopup"> <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>
</button>
<router-link class="item notifications" active-class="active" to="/my/notifications" ref="notificationButton" v-else>
<fa :icon="faBell" fixed-width/><span class="text">{{ $t('notifications') }}</span> <fa :icon="faBell" fixed-width/><span class="text">{{ $t('notifications') }}</span>
<i v-if="$store.state.i.hasUnreadNotification"><fa :icon="faCircle"/></i> <i v-if="$store.state.i.hasUnreadNotification"><fa :icon="faCircle"/></i>
</router-link> </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 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-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-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" 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 && !$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 post _buttonPrimary" @click="post()"><fa :icon="faPencilAlt"/></button> <button v-if="$store.getters.isSignedIn" class="button post _buttonPrimary" @click="post()"><fa :icon="faPencilAlt"/></button>
</div> </div>
<button v-if="$store.getters.isSignedIn" class="post _buttonPrimary" @click="post()"><fa :icon="faPencilAlt"/></button> <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"/> <stream-indicator v-if="$store.getters.isSignedIn"/>
</div> </div>
</template> </template>
@ -173,7 +164,6 @@ import { v4 as uuid } from 'uuid';
import i18n from './i18n'; import i18n from './i18n';
import { host, instanceName } from './config'; import { host, instanceName } from './config';
import { search } from './scripts/search'; import { search } from './scripts/search';
import contains from './scripts/contains';
import MkToast from './components/toast.vue'; import MkToast from './components/toast.vue';
const DESKTOP_THRESHOLD = 1100; const DESKTOP_THRESHOLD = 1100;
@ -183,7 +173,6 @@ export default Vue.extend({
components: { components: {
XClock: () => import('./components/header-clock.vue').then(m => m.default), 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), MkButton: () => import('./components/ui/button.vue').then(m => m.default),
XDraggable: () => import('vuedraggable'), XDraggable: () => import('vuedraggable'),
}, },
@ -194,7 +183,6 @@ export default Vue.extend({
pageKey: 0, pageKey: 0,
showNav: false, showNav: false,
searching: false, searching: false,
notificationsOpen: false,
accounts: [], accounts: [],
lists: [], lists: [],
connection: null, connection: null,
@ -226,23 +214,10 @@ export default Vue.extend({
watch:{ watch:{
$route(to, from) { $route(to, from) {
this.pageKey++; this.pageKey++;
this.notificationsOpen = false;
this.showNav = false; this.showNav = false;
this.canBack = (window.history.length > 0 && !['index'].includes(to.name)); 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() { isDesktop() {
if (this.isDesktop) this.adjustWidgetsWidth(); if (this.isDesktop) this.adjustWidgetsWidth();
} }
@ -568,15 +543,6 @@ export default Vue.extend({
this.$root.sound('notification'); 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) { widgetFunc(id) {
const w = this.$refs[id][0]; const w = this.$refs[id][0];
if (w.func) w.func(); if (w.func) w.func();
@ -976,18 +942,20 @@ export default Vue.extend({
width: $main-width; width: $main-width;
min-width: $main-width; min-width: $main-width;
box-shadow: 1px 0 0 0 var(--divider), -1px 0 0 0 var(--divider); box-shadow: 1px 0 0 0 var(--divider), -1px 0 0 0 var(--divider);
background: var(--mainBg);
@media (max-width: $side-hide-threshold) { @media (max-width: $side-hide-threshold) {
min-width: 0; min-width: 0;
} }
> .content { > .content {
padding: 16px 0; > * {
box-sizing: border-box; &:not(.full) {
padding: var(--margin) 0;
}
@media (max-width: 500px) { &:not(.naked) {
padding: 8px 0; 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> </style>

2
src/client/pages/drive.vue
View File

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

2
src/client/pages/messaging-room.vue
View File

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

6
src/client/pages/preferences/index.vue
View File

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

1
src/client/store.ts
View File

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

3
src/client/themes/_dark.json5
View File

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

3
src/client/themes/_light.json5
View File

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