This commit is contained in:
syuilo 2018-04-26 14:38:37 +09:00
parent 6ab0c386cb
commit 03d09e9d24
13 changed files with 233 additions and 47 deletions

View file

@ -1,8 +1,8 @@
<template>
<div class="mk-mentions">
<header>
<span :data-is-active="mode == 'all'" @click="mode = 'all'">すべて</span>
<span :data-is-active="mode == 'following'" @click="mode = 'following'">フォロー中</span>
<span :data-active="mode == 'all'" @click="mode = 'all'">すべて</span>
<span :data-active="mode == 'following'" @click="mode = 'following'">フォロー中</span>
</header>
<div class="fetching" v-if="fetching">
<mk-ellipsis-icon/>
@ -98,7 +98,7 @@ export default Vue.extend({
font-size 18px
color #555
&:not([data-is-active])
&:not([data-active])
color $theme-color
cursor pointer

View file

@ -31,6 +31,7 @@
<script lang="ts">
import Vue from 'vue';
import { url } from '../../../config';
import getNoteSummary from '../../../../../renderers/get-note-summary';
import XNote from './notes.note.vue';
@ -53,6 +54,7 @@ export default Vue.extend({
requestInitPromise: null as () => Promise<any[]>,
notes: [],
queue: [],
unreadCount: 0,
fetching: true,
moreFetching: false
};
@ -71,10 +73,12 @@ export default Vue.extend({
},
mounted() {
document.addEventListener('visibilitychange', this.onVisibilitychange, false);
window.addEventListener('scroll', this.onScroll);
},
beforeDestroy() {
document.removeEventListener('visibilitychange', this.onVisibilitychange);
window.removeEventListener('scroll', this.onScroll);
},
@ -130,6 +134,12 @@ export default Vue.extend({
}
//#endregion
// 稿
if ((document.hidden || !this.isScrollTop()) && note.userId !== (this as any).os.i.id) {
this.unreadCount++;
document.title = `(${this.unreadCount}) ${getNoteSummary(note)}`;
}
if (this.isScrollTop()) {
// Prepend the note
this.notes.unshift(note);
@ -172,9 +182,21 @@ export default Vue.extend({
this.moreFetching = false;
},
clearNotification() {
this.unreadCount = 0;
document.title = 'Misskey';
},
onVisibilitychange() {
if (!document.hidden) {
this.clearNotification();
}
},
onScroll() {
if (this.isScrollTop()) {
this.releaseQueue();
this.clearNotification();
}
if ((this as any).os.i.clientSettings.fetchOnScroll !== false) {

View file

@ -1,10 +1,10 @@
<template>
<div class="mk-timeline">
<header>
<span :data-is-active="src == 'home'" @click="src = 'home'">%fa:home% ホーム</span>
<span :data-is-active="src == 'local'" @click="src = 'local'">%fa:R comments% ローカル</span>
<span :data-is-active="src == 'global'" @click="src = 'global'">%fa:globe% グローバル</span>
<span :data-is-active="src == 'list'" @click="src = 'list'" v-if="list">%fa:list% {{ list.title }}</span>
<span :data-active="src == 'home'" @click="src = 'home'">%fa:home% ホーム</span>
<span :data-active="src == 'local'" @click="src = 'local'">%fa:R comments% ローカル</span>
<span :data-active="src == 'global'" @click="src = 'global'">%fa:globe% グローバル</span>
<span :data-active="src == 'list'" @click="src = 'list'" v-if="list">%fa:list% {{ list.title }}</span>
<button @click="chooseList" title="リスト">%fa:list%</button>
</header>
<x-core v-if="src == 'home'" ref="tl" key="home" src="home"/>
@ -93,7 +93,7 @@ root(isDark)
font-size 12px
user-select none
&[data-is-active]
&[data-active]
color $theme-color
cursor default
font-weight bold
@ -108,7 +108,7 @@ root(isDark)
height 2px
background $theme-color
&:not([data-is-active])
&:not([data-active])
color isDark ? #9aa2a7 : #6f7477
cursor pointer

View file

@ -87,7 +87,7 @@ export default Vue.extend({
},
onUserRemoved() {
this.fetch();
},
}
}
});
</script>

View file

@ -2,8 +2,8 @@
<div class="mk-users-list">
<nav>
<div>
<span :data-is-active="mode == 'all'" @click="mode = 'all'">すべて<span>{{ count }}</span></span>
<span v-if="os.isSignedIn && youKnowCount" :data-is-active="mode == 'iknow'" @click="mode = 'iknow'">知り合い<span>{{ youKnowCount }}</span></span>
<span :data-active="mode == 'all'" @click="mode = 'all'">すべて<span>{{ count }}</span></span>
<span v-if="os.isSignedIn && youKnowCount" :data-active="mode == 'iknow'" @click="mode = 'iknow'">知り合い<span>{{ youKnowCount }}</span></span>
</div>
</nav>
<div class="users" v-if="!fetching && users.length != 0">
@ -98,7 +98,7 @@ export default Vue.extend({
*
pointer-events none
&[data-is-active]
&[data-active]
font-weight bold
color $theme-color
border-color $theme-color

View file

@ -1,9 +1,9 @@
<template>
<div class="timeline">
<header>
<span :data-is-active="mode == 'default'" @click="mode = 'default'">投稿</span>
<span :data-is-active="mode == 'with-replies'" @click="mode = 'with-replies'">投稿と返信</span>
<span :data-is-active="mode == 'with-media'" @click="mode = 'with-media'">メディア</span>
<span :data-active="mode == 'default'" @click="mode = 'default'">投稿</span>
<span :data-active="mode == 'with-replies'" @click="mode = 'with-replies'">投稿と返信</span>
<span :data-active="mode == 'with-media'" @click="mode = 'with-media'">メディア</span>
</header>
<div class="loading" v-if="fetching">
<mk-ellipsis-icon/>
@ -114,7 +114,7 @@ export default Vue.extend({
font-size 18px
color #555
&:not([data-is-active])
&:not([data-active])
color $theme-color
cursor pointer