Merge pull request #1479 from tamaina/master

タイムラインで古い投稿から順に画面から消していく

src/client/app/desktop/views/components/timeline.vue

@@ -5,11 +5,11 @@
 		<mk-ellipsis-icon/>
 	</div>
 	<p class="empty" v-if="notes.length == 0 && !fetching">
-		%fa:R comments%自分の投稿や、自分がフォローしているユーザーの投稿が表示されます。
+		%fa:R comments%%i18n:@empty%
 	</p>
 	<mk-notes :notes="notes" ref="timeline">
 		<button slot="footer" @click="more" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
-			<template v-if="!moreFetching">もっと見る</template>
+			<template v-if="!moreFetching">%i18n:@load-more%</template>
 			<template v-if="moreFetching">%fa:spinner .pulse .fw%</template>
 		</button>
 	</mk-notes>
@@ -29,7 +29,8 @@ export default Vue.extend({
 			notes: [],
 			connection: null,
 			connectionId: null,
-			date: null
+			date: null,
+			isTop: true
 		};
 	},
 	computed: {
@@ -101,6 +102,7 @@ export default Vue.extend({
 				sound.play();
 			}
 
+			if (this.isTop) this.notes.pop();
 			this.notes.unshift(note);
 		},
 		onChangeFollowing() {
@@ -111,6 +113,7 @@ export default Vue.extend({
 				const current = window.scrollY + window.innerHeight;
 				if (current > document.body.offsetHeight - 8) this.more();
 			}
+			this.isTop = window.scrollY < 100;
 		},
 		onKeydown(e) {
 			if (e.target.tagName != 'INPUT' && e.target.tagName != 'TEXTAREA') {

src/client/app/mobile/views/components/timeline.vue

@@ -37,7 +37,8 @@ export default Vue.extend({
 			notes: [],
 			existMore: false,
 			connection: null,
-			connectionId: null
+			connectionId: null,
+			isTop: true
 		};
 	},
 	computed: {
@@ -53,13 +54,18 @@ export default Vue.extend({
 		this.connection.on('follow', this.onChangeFollowing);
 		this.connection.on('unfollow', this.onChangeFollowing);
 
+		window.addEventListener('scroll', this.onScroll);
+
 		this.fetch();
 	},
 	beforeDestroy() {
 		this.connection.off('note', this.onNote);
 		this.connection.off('follow', this.onChangeFollowing);
 		this.connection.off('unfollow', this.onChangeFollowing);
+		this.connection.off('unfollow', this.onChangeFollowing);
 		(this as any).os.stream.dispose(this.connectionId);
+
+		window.removeEventListener('scroll', this.onScroll);
 	},
 	methods: {
 		fetch(cb?) {
@@ -95,10 +101,18 @@ export default Vue.extend({
 			});
 		},
 		onNote(note) {
-			this.notes.unshift(note);
+			this.isTop = window.scrollY < 100;
 		},
 		onChangeFollowing() {
 			this.fetch();
+		},
+		onScroll() {
+			if ((this as any).os.i.clientSettings.fetchOnScroll !== false) {
+				const current = window.scrollY + window.innerHeight;
+				if (current > document.body.offsetHeight - 8) this.more();
+			}
+			if (window.scrollY > 100) this.isTop = false;
+			else this.isTop = true;
 		}
 	}
 });