Add tag timeline view.

This commit is contained in:
eal 2017-09-17 14:26:35 +03:00
parent 3eaaa4c16d
commit 9abfcb34ef
9 changed files with 82 additions and 10 deletions

View file

@ -0,0 +1,26 @@
import Timeline from '../timeline/timeline.vue'
const TagTimeline = {
created () {
this.$store.commit('clearTimeline', { timeline: 'tag' })
this.$store.dispatch('startFetching', { 'tag': this.tag })
},
components: {
Timeline
},
computed: {
tag () { return this.$route.params.tag },
timeline () { return this.$store.state.statuses.timelines.tag }
},
watch: {
tag () {
this.$store.commit('clearTimeline', { timeline: 'tag' })
this.$store.dispatch('startFetching', { 'tag': this.tag })
}
},
destroyed () {
this.$store.dispatch('stopFetching', 'tag')
}
}
export default TagTimeline

View file

@ -0,0 +1,12 @@
import Timeline from '../timeline/timeline.vue'
const TagTimeline = {
components: {
Timeline
},
computed: {
timeline () { return this.$store.state.statuses.timelines.tag }
}
};
export default TagTimeline

View file

@ -0,0 +1,5 @@
<template>
<Timeline :title="tag" :timeline="timeline" :timeline-name="'tag'" :tag="tag" />
</template>
<script src='./tag_timeline.js'></script>

View file

@ -0,0 +1,5 @@
<template>
<div> timleinei </div>
</template>
<script src='./tag_timeline.js'></script>

View file

@ -8,7 +8,8 @@ const Timeline = {
'timeline', 'timeline',
'timelineName', 'timelineName',
'title', 'title',
'userId' 'userId',
'tag'
], ],
computed: { computed: {
timelineError () { return this.$store.state.statuses.error }, timelineError () { return this.$store.state.statuses.error },
@ -39,7 +40,8 @@ const Timeline = {
credentials, credentials,
timeline: this.timelineName, timeline: this.timelineName,
showImmediately, showImmediately,
userId: this.userId userId: this.userId,
tag: this.tag
}) })
// don't fetch followers for public, friend, twkn // don't fetch followers for public, friend, twkn
@ -62,7 +64,8 @@ const Timeline = {
timeline: this.timelineName, timeline: this.timelineName,
older: true, older: true,
showImmediately: true, showImmediately: true,
userId: this.userId userId: this.userId,
tag: this.tag
}).then(() => store.commit('setLoading', { timeline: this.timelineName, value: false })) }).then(() => store.commit('setLoading', { timeline: this.timelineName, value: false }))
}, },
fetchFollowers () { fetchFollowers () {

View file

@ -5,6 +5,7 @@ import App from './App.vue'
import PublicTimeline from './components/public_timeline/public_timeline.vue' import PublicTimeline from './components/public_timeline/public_timeline.vue'
import PublicAndExternalTimeline from './components/public_and_external_timeline/public_and_external_timeline.vue' import PublicAndExternalTimeline from './components/public_and_external_timeline/public_and_external_timeline.vue'
import FriendsTimeline from './components/friends_timeline/friends_timeline.vue' import FriendsTimeline from './components/friends_timeline/friends_timeline.vue'
import TagTimeline from './components/tag_timeline/tag_timeline.vue'
import ConversationPage from './components/conversation-page/conversation-page.vue' import ConversationPage from './components/conversation-page/conversation-page.vue'
import Mentions from './components/mentions/mentions.vue' import Mentions from './components/mentions/mentions.vue'
import UserProfile from './components/user_profile/user_profile.vue' import UserProfile from './components/user_profile/user_profile.vue'
@ -58,6 +59,7 @@ const routes = [
{ path: '/main/all', component: PublicAndExternalTimeline }, { path: '/main/all', component: PublicAndExternalTimeline },
{ path: '/main/public', component: PublicTimeline }, { path: '/main/public', component: PublicTimeline },
{ path: '/main/friends', component: FriendsTimeline }, { path: '/main/friends', component: FriendsTimeline },
{ path: '/tag/:tag', component: TagTimeline },
{ name: 'conversation', path: '/notice/:id', component: ConversationPage, meta: { dontScroll: true } }, { name: 'conversation', path: '/notice/:id', component: ConversationPage, meta: { dontScroll: true } },
{ name: 'user-profile', path: '/users/:id', component: UserProfile }, { name: 'user-profile', path: '/users/:id', component: UserProfile },
{ name: 'mentions', path: '/:username/mentions', component: Mentions }, { name: 'mentions', path: '/:username/mentions', component: Mentions },

View file

@ -79,6 +79,20 @@ export const defaultState = {
followers: [], followers: [],
friends: [], friends: [],
viewing: 'statuses' viewing: 'statuses'
},
tag: {
statuses: [],
statusesObject: {},
faves: [],
visibleStatuses: [],
visibleStatusesObject: {},
newStatusCount: 0,
maxId: 0,
minVisibleId: 0,
loading: false,
followers: [],
friends: [],
viewing: 'statuses'
} }
} }
} }

View file

@ -4,6 +4,7 @@ const FRIENDS_TIMELINE_URL = '/api/statuses/friends_timeline.json'
const ALL_FOLLOWING_URL = '/api/qvitter/allfollowing' const ALL_FOLLOWING_URL = '/api/qvitter/allfollowing'
const PUBLIC_TIMELINE_URL = '/api/statuses/public_timeline.json' const PUBLIC_TIMELINE_URL = '/api/statuses/public_timeline.json'
const PUBLIC_AND_EXTERNAL_TIMELINE_URL = '/api/statuses/public_and_external_timeline.json' const PUBLIC_AND_EXTERNAL_TIMELINE_URL = '/api/statuses/public_and_external_timeline.json'
const TAG_TIMELINE_URL = '/api/statusnet/tags/timeline'
const FAVORITE_URL = '/api/favorites/create' const FAVORITE_URL = '/api/favorites/create'
const UNFAVORITE_URL = '/api/favorites/destroy' const UNFAVORITE_URL = '/api/favorites/destroy'
const RETWEET_URL = '/api/statuses/retweet' const RETWEET_URL = '/api/statuses/retweet'
@ -228,13 +229,14 @@ const setUserMute = ({id, credentials, muted = true}) => {
}) })
} }
const fetchTimeline = ({timeline, credentials, since = false, until = false, userId = false}) => { const fetchTimeline = ({timeline, credentials, since = false, until = false, userId = false, tag = false}) => {
const timelineUrls = { const timelineUrls = {
public: PUBLIC_TIMELINE_URL, public: PUBLIC_TIMELINE_URL,
friends: FRIENDS_TIMELINE_URL, friends: FRIENDS_TIMELINE_URL,
mentions: MENTIONS_URL, mentions: MENTIONS_URL,
'publicAndExternal': PUBLIC_AND_EXTERNAL_TIMELINE_URL, 'publicAndExternal': PUBLIC_AND_EXTERNAL_TIMELINE_URL,
user: QVITTER_USER_TIMELINE_URL user: QVITTER_USER_TIMELINE_URL,
tag: TAG_TIMELINE_URL
} }
let url = timelineUrls[timeline] let url = timelineUrls[timeline]
@ -247,10 +249,12 @@ const fetchTimeline = ({timeline, credentials, since = false, until = false, use
if (until) { if (until) {
params.push(['max_id', until]) params.push(['max_id', until])
} }
if (userId) { if (userId) {
params.push(['user_id', userId]) params.push(['user_id', userId])
} }
if (tag) {
url += `/${tag}.json`
}
const queryString = map(params, (param) => `${param[0]}=${param[1]}`).join('&') const queryString = map(params, (param) => `${param[0]}=${param[1]}`).join('&')
url += `?${queryString}` url += `?${queryString}`

View file

@ -14,7 +14,7 @@ const update = ({store, statuses, timeline, showImmediately}) => {
}) })
} }
const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false, showImmediately = false, userId = false}) => { const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false, showImmediately = false, userId = false, tag = false}) => {
const args = { timeline, credentials } const args = { timeline, credentials }
const rootState = store.rootState || store.state const rootState = store.rootState || store.state
const timelineData = rootState.statuses.timelines[camelCase(timeline)] const timelineData = rootState.statuses.timelines[camelCase(timeline)]
@ -26,15 +26,16 @@ const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false
} }
args['userId'] = userId args['userId'] = userId
args['tag'] = tag
return apiService.fetchTimeline(args) return apiService.fetchTimeline(args)
.then((statuses) => update({store, statuses, timeline, showImmediately}), .then((statuses) => update({store, statuses, timeline, showImmediately}),
() => store.dispatch('setError', { value: true })) () => store.dispatch('setError', { value: true }))
} }
const startFetching = ({timeline = 'friends', credentials, store, userId = false}) => { const startFetching = ({timeline = 'friends', credentials, store, userId = false, tag = false}) => {
fetchAndUpdate({timeline, credentials, store, showImmediately: true, userId}) fetchAndUpdate({timeline, credentials, store, showImmediately: true, userId, tag})
const boundFetchAndUpdate = () => fetchAndUpdate({ timeline, credentials, store, userId }) const boundFetchAndUpdate = () => fetchAndUpdate({ timeline, credentials, store, userId, tag })
return setInterval(boundFetchAndUpdate, 10000) return setInterval(boundFetchAndUpdate, 10000)
} }
const timelineFetcher = { const timelineFetcher = {