Add an option to initiate fetching older statuses automatically when scrolled 750 pixels or less from the bottom.

This commit is contained in:
Shpuld Shpuldson 2017-06-03 18:51:55 +03:00
parent e901e064de
commit 65646c5a12
5 changed files with 17 additions and 0 deletions

View file

@ -7,6 +7,7 @@ const settings = {
hideAttachmentsLocal: this.$store.state.config.hideAttachments, hideAttachmentsLocal: this.$store.state.config.hideAttachments,
hideAttachmentsInConvLocal: this.$store.state.config.hideAttachmentsInConv, hideAttachmentsInConvLocal: this.$store.state.config.hideAttachmentsInConv,
hideNsfwLocal: this.$store.state.config.hideNsfw, hideNsfwLocal: this.$store.state.config.hideNsfw,
autoLoadLocal: this.$store.state.config.autoLoad,
muteWordsString: this.$store.state.config.muteWords.join('\n') muteWordsString: this.$store.state.config.muteWords.join('\n')
} }
}, },
@ -23,6 +24,9 @@ const settings = {
hideNsfwLocal (value) { hideNsfwLocal (value) {
this.$store.dispatch('setOption', { name: 'hideNsfw', value }) this.$store.dispatch('setOption', { name: 'hideNsfw', value })
}, },
autoLoadLocal (value) {
this.$store.dispatch('setOption', { name: 'autoLoad', value })
},
muteWordsString (value) { muteWordsString (value) {
value = filter(value.split('\n'), (word) => trim(word).length > 0) value = filter(value.split('\n'), (word) => trim(word).length > 0)
this.$store.dispatch('setOption', { name: 'muteWords', value }) this.$store.dispatch('setOption', { name: 'muteWords', value })

View file

@ -28,6 +28,10 @@
<input type="checkbox" id="hideNsfw" v-model="hideNsfwLocal"> <input type="checkbox" id="hideNsfw" v-model="hideNsfwLocal">
<label for="hideNsfw">Enable clickthrough NSFW attachment hiding</label> <label for="hideNsfw">Enable clickthrough NSFW attachment hiding</label>
</li> </li>
<li>
<input type="checkbox" id="autoLoad" v-model="autoLoadLocal">
<label for="autoLoad">Enable automatic loading when scrolled to the bottom</label>
</li>
</ul> </ul>
</div> </div>
</div> </div>

View file

@ -20,6 +20,8 @@ const Timeline = {
const credentials = store.state.users.currentUser.credentials const credentials = store.state.users.currentUser.credentials
const showImmediately = this.timeline.visibleStatuses.length === 0 const showImmediately = this.timeline.visibleStatuses.length === 0
window.onscroll = this.scrollLoad
timelineFetcher.fetchAndUpdate({ timelineFetcher.fetchAndUpdate({
store, store,
credentials, credentials,
@ -42,6 +44,11 @@ const Timeline = {
older: true, older: true,
showImmediately: true showImmediately: true
}).then(() => store.commit('setLoading', { timeline: this.timelineName, value: false })) }).then(() => store.commit('setLoading', { timeline: this.timelineName, value: false }))
},
scrollLoad (e) {
if (this.timeline.loading === false && this.$store.state.config.autoLoad && (window.innerHeight + window.pageYOffset) >= (document.body.scrollHeight - 750)) {
this.fetchOlderStatuses()
}
} }
} }
} }

View file

@ -33,6 +33,7 @@ const persistedStateOptions = {
'config.hideAttachments', 'config.hideAttachments',
'config.hideAttachmentsInConv', 'config.hideAttachmentsInConv',
'config.hideNsfw', 'config.hideNsfw',
'config.autoLoad',
'config.muteWords', 'config.muteWords',
'statuses.notifications', 'statuses.notifications',
'users.users' 'users.users'

View file

@ -7,6 +7,7 @@ const defaultState = {
hideAttachments: false, hideAttachments: false,
hideAttachmentsInConv: false, hideAttachmentsInConv: false,
hideNsfw: true, hideNsfw: true,
autoLoad: true,
muteWords: [] muteWords: []
} }