diff --git a/src/renderer/components/TimelineSpace/Favourites.vue b/src/renderer/components/TimelineSpace/Favourites.vue index 03ca7e6c..8e49d689 100644 --- a/src/renderer/components/TimelineSpace/Favourites.vue +++ b/src/renderer/components/TimelineSpace/Favourites.vue @@ -3,6 +3,8 @@
+
+
@@ -16,7 +18,8 @@ export default { computed: { ...mapState({ account: state => state.TimelineSpace.account, - favourites: state => state.TimelineSpace.Favourites.favourites + favourites: state => state.TimelineSpace.Favourites.favourites, + lazyLoading: state => state.TimelineSpace.Favourites.lazyLoading }) }, created () { @@ -38,10 +41,32 @@ export default { }) }) }, + mounted () { + window.addEventListener('scroll', this.onScroll) + }, + destroyed () { + window.removeEventListener('scroll', this.onScroll) + }, methods: { updateToot (message) { this.$store.commit('TimelineSpace/Favourites/updateToot', message) + }, + onScroll (event) { + if (((document.documentElement.clientHeight + event.target.defaultView.scrollY) >= document.getElementById('favourites').clientHeight - 10) && !this.lazyloading) { + this.$store.dispatch('TimelineSpace/Favourites/lazyFetchFavourites', this.favourites[this.favourites.length - 1]) + } } } } + + diff --git a/src/renderer/store/TimelineSpace/Favourites.js b/src/renderer/store/TimelineSpace/Favourites.js index efce75da..c107ba70 100644 --- a/src/renderer/store/TimelineSpace/Favourites.js +++ b/src/renderer/store/TimelineSpace/Favourites.js @@ -3,12 +3,16 @@ import Mastodon from 'mastodon-api' const Favourites = { namespaced: true, state: { - favourites: [] + favourites: [], + lazyLoading: false }, mutations: { updateFavourites (state, favourites) { state.favourites = favourites }, + insertFavourites (state, favourites) { + state.favourites = state.favourites.concat(favourites) + }, updateToot (state, message) { state.favourites = state.favourites.map((toot) => { if (toot.id === message.id) { @@ -24,6 +28,9 @@ const Favourites = { return toot } }) + }, + changeLazyLoading (state, value) { + state.lazyLoading = value } }, actions: { @@ -41,6 +48,28 @@ const Favourites = { resolve(res) }) }) + }, + lazyFetchFavourites ({ state, commit, rootState }, last) { + return new Promise((resolve, reject) => { + if (state.lazyLoading) { + return resolve() + } + commit('changeLazyLoading', true) + const client = new Mastodon( + { + access_token: rootState.TimelineSpace.account.accessToken, + api_url: rootState.TimelineSpace.account.baseURL + '/api/v1' + }) + console.log(last.id) + // Note: Now this API's explanation and implementation are reversed. + // So if the bug has resolved, please use max_id instead of since_id. + // https://github.com/tootsuite/documentation/blob/master/Using-the-API/API.md#favourites + client.get('/favourites', { since_id: last.id, limit: 40 }, (err, data, res) => { + if (err) return reject(err) + commit('insertFavourites', data) + commit('changeLazyLoading', false) + }) + }) } } }