aboutsummaryrefslogtreecommitdiff
path: root/src/components/timeline/timeline.js
blob: 6070e4423c0d3a4d27b943d497fb1d5db658dbee (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
import Status from '../status/status.vue'
import timelineFetcher from '../../services/timeline_fetcher/timeline_fetcher.service.js'
import StatusOrConversation from '../status_or_conversation/status_or_conversation.vue'

const Timeline = {
  props: [
    'timeline',
    'timelineName',
    'title'
  ],
  computed: {
    timelineError () { return this.$store.state.statuses.error }
  },
  components: {
    Status,
    StatusOrConversation
  },
  created () {
    const store = this.$store
    const credentials = store.state.users.currentUser.credentials
    const showImmediately = this.timeline.visibleStatuses.length === 0

    window.onscroll = this.scrollLoad

    timelineFetcher.fetchAndUpdate({
      store,
      credentials,
      timeline: this.timelineName,
      showImmediately
    })
  },
  methods: {
    showNewStatuses () {
      this.$store.commit('showNewStatuses', { timeline: this.timelineName })
    },
    fetchOlderStatuses () {
      const store = this.$store
      const credentials = store.state.users.currentUser.credentials
      store.commit('setLoading', { timeline: this.timelineName, value: true })
      timelineFetcher.fetchAndUpdate({
        store,
        credentials,
        timeline: this.timelineName,
        older: true,
        showImmediately: true
      }).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()
      }
    }
  }
}

export default Timeline