2016-10-28 06:19:42 -07:00
|
|
|
import Status from '../status/status.vue'
|
2016-11-06 08:44:05 -08:00
|
|
|
import timelineFetcher from '../../services/timeline_fetcher/timeline_fetcher.service.js'
|
2017-02-04 04:53:16 -08:00
|
|
|
import StatusOrConversation from '../status_or_conversation/status_or_conversation.vue'
|
2017-08-21 10:25:01 -07:00
|
|
|
import UserCard from '../user_card/user_card.vue'
|
2016-10-28 06:19:42 -07:00
|
|
|
|
2016-10-26 10:03:55 -07:00
|
|
|
const Timeline = {
|
|
|
|
props: [
|
2016-10-28 06:40:13 -07:00
|
|
|
'timeline',
|
2017-03-01 11:36:37 -08:00
|
|
|
'timelineName',
|
2017-06-12 07:34:41 -07:00
|
|
|
'title',
|
|
|
|
'userId'
|
2016-10-28 06:19:42 -07:00
|
|
|
],
|
2017-03-09 04:38:32 -08:00
|
|
|
computed: {
|
2017-08-21 10:25:01 -07:00
|
|
|
timelineError () { return this.$store.state.statuses.error },
|
|
|
|
followers () {
|
|
|
|
return this.timeline.followers
|
|
|
|
},
|
|
|
|
friends () {
|
|
|
|
return this.timeline.friends
|
|
|
|
},
|
|
|
|
viewing () {
|
|
|
|
return this.timeline.viewing
|
|
|
|
}
|
2017-03-09 04:38:32 -08:00
|
|
|
},
|
2016-10-28 06:19:42 -07:00
|
|
|
components: {
|
2017-02-04 04:53:16 -08:00
|
|
|
Status,
|
2017-08-21 10:25:01 -07:00
|
|
|
StatusOrConversation,
|
|
|
|
UserCard
|
2016-10-28 06:40:13 -07:00
|
|
|
},
|
2016-11-06 11:11:00 -08:00
|
|
|
created () {
|
|
|
|
const store = this.$store
|
|
|
|
const credentials = store.state.users.currentUser.credentials
|
2016-11-24 09:31:18 -08:00
|
|
|
const showImmediately = this.timeline.visibleStatuses.length === 0
|
2016-11-06 11:11:00 -08:00
|
|
|
|
2017-06-03 08:51:55 -07:00
|
|
|
window.onscroll = this.scrollLoad
|
|
|
|
|
2016-11-06 11:11:00 -08:00
|
|
|
timelineFetcher.fetchAndUpdate({
|
|
|
|
store,
|
|
|
|
credentials,
|
|
|
|
timeline: this.timelineName,
|
2017-06-12 07:34:41 -07:00
|
|
|
showImmediately,
|
|
|
|
userId: this.userId
|
2016-11-06 11:11:00 -08:00
|
|
|
})
|
2017-08-21 10:25:01 -07:00
|
|
|
|
|
|
|
// don't fetch followers for public, friend, twkn
|
|
|
|
if (this.timelineName === 'user') {
|
|
|
|
this.fetchFriends()
|
|
|
|
this.fetchFollowers()
|
|
|
|
}
|
2016-11-06 11:11:00 -08:00
|
|
|
},
|
2016-10-28 06:40:13 -07:00
|
|
|
methods: {
|
|
|
|
showNewStatuses () {
|
|
|
|
this.$store.commit('showNewStatuses', { timeline: this.timelineName })
|
2016-11-06 08:44:05 -08:00
|
|
|
},
|
|
|
|
fetchOlderStatuses () {
|
|
|
|
const store = this.$store
|
|
|
|
const credentials = store.state.users.currentUser.credentials
|
2016-11-07 06:04:27 -08:00
|
|
|
store.commit('setLoading', { timeline: this.timelineName, value: true })
|
2016-11-06 08:44:05 -08:00
|
|
|
timelineFetcher.fetchAndUpdate({
|
|
|
|
store,
|
|
|
|
credentials,
|
|
|
|
timeline: this.timelineName,
|
|
|
|
older: true,
|
2017-06-12 07:34:41 -07:00
|
|
|
showImmediately: true,
|
|
|
|
userId: this.userId
|
2016-11-06 08:44:05 -08:00
|
|
|
}).then(() => store.commit('setLoading', { timeline: this.timelineName, value: false }))
|
2017-06-03 08:51:55 -07:00
|
|
|
},
|
2017-08-23 09:21:15 -07:00
|
|
|
fetchFollowers () {
|
2017-08-21 10:25:01 -07:00
|
|
|
const id = this.userId
|
|
|
|
this.$store.state.api.backendInteractor.fetchFollowers({ id })
|
|
|
|
.then((followers) => this.$store.dispatch('addFollowers', { followers }))
|
|
|
|
},
|
2017-08-23 09:21:15 -07:00
|
|
|
fetchFriends () {
|
2017-08-21 10:25:01 -07:00
|
|
|
const id = this.userId
|
|
|
|
this.$store.state.api.backendInteractor.fetchFriends({ id })
|
|
|
|
.then((friends) => this.$store.dispatch('addFriends', { friends }))
|
|
|
|
},
|
2017-06-03 08:51:55 -07:00
|
|
|
scrollLoad (e) {
|
2017-06-03 09:53:23 -07:00
|
|
|
let height = Math.max(document.body.offsetHeight, document.body.scrollHeight)
|
|
|
|
if (this.timeline.loading === false && this.$store.state.config.autoLoad && (window.innerHeight + window.pageYOffset) >= (height - 750)) {
|
2017-06-03 08:51:55 -07:00
|
|
|
this.fetchOlderStatuses()
|
|
|
|
}
|
2016-10-28 06:40:13 -07:00
|
|
|
}
|
2016-10-28 06:19:42 -07:00
|
|
|
}
|
2016-10-26 10:03:55 -07:00
|
|
|
}
|
|
|
|
|
2016-10-28 06:19:42 -07:00
|
|
|
export default Timeline
|