102 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			102 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
<template>
 | 
						|
<x-notes ref="timeline" :more="existMore ? more : null"/>
 | 
						|
</template>
 | 
						|
 | 
						|
<script lang="ts">
 | 
						|
import Vue from 'vue';
 | 
						|
import XNotes from './deck.notes.vue';
 | 
						|
 | 
						|
const fetchLimit = 10;
 | 
						|
 | 
						|
export default Vue.extend({
 | 
						|
	components: {
 | 
						|
		XNotes
 | 
						|
	},
 | 
						|
 | 
						|
	props: {
 | 
						|
	},
 | 
						|
 | 
						|
	data() {
 | 
						|
		return {
 | 
						|
			fetching: true,
 | 
						|
			moreFetching: false,
 | 
						|
			existMore: false,
 | 
						|
			connection: null
 | 
						|
		};
 | 
						|
	},
 | 
						|
 | 
						|
	mounted() {
 | 
						|
		this.connection = this.$root.stream.useSharedConnection('main');
 | 
						|
		this.connection.on('mention', this.onNote);
 | 
						|
 | 
						|
		this.fetch();
 | 
						|
	},
 | 
						|
 | 
						|
	beforeDestroy() {
 | 
						|
		this.connection.dispose();
 | 
						|
	},
 | 
						|
 | 
						|
	methods: {
 | 
						|
		fetch() {
 | 
						|
			this.fetching = true;
 | 
						|
 | 
						|
			(this.$refs.timeline as any).init(() => new Promise((res, rej) => {
 | 
						|
				this.$root.api('notes/mentions', {
 | 
						|
					limit: fetchLimit + 1,
 | 
						|
					includeMyRenotes: this.$store.state.settings.showMyRenotes,
 | 
						|
					includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
 | 
						|
					includeLocalRenotes: this.$store.state.settings.showLocalRenotes,
 | 
						|
					visibility: 'specified'
 | 
						|
				}).then(notes => {
 | 
						|
					if (notes.length == fetchLimit + 1) {
 | 
						|
						notes.pop();
 | 
						|
						this.existMore = true;
 | 
						|
					}
 | 
						|
					res(notes);
 | 
						|
					this.fetching = false;
 | 
						|
					this.$emit('loaded');
 | 
						|
				}, rej);
 | 
						|
			}));
 | 
						|
		},
 | 
						|
 | 
						|
		more() {
 | 
						|
			this.moreFetching = true;
 | 
						|
 | 
						|
			const promise = this.$root.api('notes/mentions', {
 | 
						|
				limit: fetchLimit + 1,
 | 
						|
				untilId: (this.$refs.timeline as any).tail().id,
 | 
						|
				includeMyRenotes: this.$store.state.settings.showMyRenotes,
 | 
						|
				includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
 | 
						|
				includeLocalRenotes: this.$store.state.settings.showLocalRenotes,
 | 
						|
				visibility: 'specified'
 | 
						|
			});
 | 
						|
 | 
						|
			promise.then(notes => {
 | 
						|
				if (notes.length == fetchLimit + 1) {
 | 
						|
					notes.pop();
 | 
						|
				} else {
 | 
						|
					this.existMore = false;
 | 
						|
				}
 | 
						|
				for (const n of notes) {
 | 
						|
					(this.$refs.timeline as any).append(n);
 | 
						|
				}
 | 
						|
				this.moreFetching = false;
 | 
						|
			});
 | 
						|
 | 
						|
			return promise;
 | 
						|
		},
 | 
						|
 | 
						|
		onNote(note) {
 | 
						|
			// Prepend a note
 | 
						|
			if (note.visibility == 'specified') {
 | 
						|
				(this.$refs.timeline as any).prepend(note);
 | 
						|
			}
 | 
						|
		},
 | 
						|
 | 
						|
		focus() {
 | 
						|
			this.$refs.timeline.focus();
 | 
						|
		}
 | 
						|
	}
 | 
						|
});
 | 
						|
</script>
 |