refs #197 Move store state to each pages

This commit is contained in:
AkiraFukushima 2018-04-21 00:06:29 +09:00
parent 2befbbaf71
commit a9c16f32f2
6 changed files with 129 additions and 136 deletions

View File

@ -43,8 +43,8 @@ export default {
methods: {
async clear () {
await this.$store.dispatch('TimelineSpace/clearAccount')
await this.$store.dispatch('TimelineSpace/clearTimeline')
await this.$store.dispatch('TimelineSpace/clearNotifications')
await this.$store.commit('TimelineSpace/Contents/Home/clearTimeline')
await this.$store.commit('TimelineSpace/Contents/Notifications/clearNotifications')
await this.$store.dispatch('TimelineSpace/removeShortcutEvents')
return 'clear'
},
@ -59,7 +59,7 @@ export default {
})
})
try {
await this.$store.dispatch('TimelineSpace/fetchHomeTimeline', account)
await this.$store.dispatch('TimelineSpace/Contents/Home/fetchTimeline', account)
} catch (err) {
this.$message({
message: 'Could not fetch timeline',
@ -67,7 +67,7 @@ export default {
})
}
try {
await this.$store.dispatch('TimelineSpace/fetchNotifications', account)
await this.$store.dispatch('TimelineSpace/Contents/Notifications/fetchNotifications', account)
} catch (err) {
this.$message({
message: 'Could not fetch notification',

View File

@ -18,11 +18,11 @@ export default {
components: { Toot },
computed: {
...mapState({
timeline: state => state.TimelineSpace.homeTimeline,
timeline: state => state.TimelineSpace.Contents.Home.timeline,
lazyLoading: state => state.TimelineSpace.Contents.Home.lazyLoading,
backgroundColor: state => state.App.theme.background_color,
heading: state => state.TimelineSpace.heading,
unread: state => state.TimelineSpace.unreadHomeTimeline
heading: state => state.TimelineSpace.Contents.Home.heading,
unread: state => state.TimelineSpace.Contents.Home.unreadTimeline
})
},
mounted () {
@ -35,9 +35,9 @@ export default {
}
},
destroyed () {
this.$store.commit('TimelineSpace/changeHeading', true)
this.$store.commit('TimelineSpace/mergeHomeTimeline')
this.$store.commit('TimelineSpace/archiveHomeTimeline')
this.$store.commit('TimelineSpace/Contents/Home/changeHeading', true)
this.$store.commit('TimelineSpace/Contents/Home/mergeTimeline')
this.$store.commit('TimelineSpace/Contents/Home/archiveTimeline')
if (document.getElementById('scrollable') !== undefined && document.getElementById('scrollable') !== null) {
document.getElementById('scrollable').removeEventListener('scroll', this.onScroll)
document.getElementById('scrollable').scrollTop = 0
@ -57,10 +57,10 @@ export default {
}
// for unread control
if ((event.target.scrollTop > 10) && this.heading) {
this.$store.commit('TimelineSpace/changeHeading', false)
this.$store.commit('TimelineSpace/Contents/Home/changeHeading', false)
} else if ((event.target.scrollTop <= 10) && !this.heading) {
this.$store.commit('TimelineSpace/changeHeading', true)
this.$store.commit('TimelineSpace/mergeHomeTimeline')
this.$store.commit('TimelineSpace/Contents/Home/changeHeading', true)
this.$store.commit('TimelineSpace/Contents/Home/mergeTimeline')
}
}
}

View File

@ -17,7 +17,7 @@ export default {
components: { Notification },
computed: {
...mapState({
notifications: state => state.TimelineSpace.notifications,
notifications: state => state.TimelineSpace.Contents.Notifications.notifications,
lazyLoading: state => state.TimelineSpace.Contents.Notifications.lazyLoading,
backgroundColor: state => state.App.theme.background_color
})
@ -32,7 +32,7 @@ export default {
}
},
destroyed () {
this.$store.commit('TimelineSpace/archiveNotifications')
this.$store.commit('TimelineSpace/Contents/Notifications/archiveNotifications')
if (document.getElementById('scrollable') !== undefined && document.getElementById('scrollable') !== null) {
document.getElementById('scrollable').removeEventListener('scroll', this.onScroll)
}

View File

@ -19,87 +19,11 @@ const TimelineSpace = {
domain: '',
_id: '',
username: ''
},
heading: true,
homeTimeline: [],
unreadHomeTimeline: [],
notifications: []
}
},
mutations: {
updateAccount (state, account) {
state.account = account
},
changeHeading (state, value) {
state.heading = value
},
appendHomeTimeline (state, update) {
if (state.heading) {
state.homeTimeline = [update].concat(state.homeTimeline)
} else {
state.unreadHomeTimeline = [update].concat(state.unreadHomeTimeline)
}
},
mergeHomeTimeline (state) {
state.homeTimeline = state.unreadHomeTimeline.concat(state.homeTimeline)
state.unreadHomeTimeline = []
},
appendNotifications (state, notification) {
state.notifications = [notification].concat(state.notifications)
},
updateHomeTimeline (state, messages) {
state.homeTimeline = messages
},
updateNotifications (state, notifications) {
state.notifications = notifications
},
insertHomeTimeline (state, messages) {
state.homeTimeline = state.homeTimeline.concat(messages)
},
insertNotifications (state, notifications) {
state.notifications = state.notifications.concat(notifications)
},
updateToot (state, message) {
// Replace target message in homeTimeline and notifications
state.homeTimeline = state.homeTimeline.map((toot) => {
if (toot.id === message.id) {
return message
} else if (toot.reblog !== null && toot.reblog.id === message.id) {
// When user reblog/favourite a reblogged toot, target message is a original toot.
// So, a message which is received now is original toot.
const reblog = {
reblog: message
}
return Object.assign(toot, reblog)
} else {
return toot
}
})
state.notifications = state.notifications.map((notification) => {
// I want to update toot only mention.
// Because Toot component don't use status information when other patterns.
if (notification.type === 'mention' && notification.status.id === message.id) {
const status = {
status: message
}
return Object.assign(notification, status)
} else {
return notification
}
})
},
clearTimeline (state) {
state.homeTimeline = []
state.unreadHomeTimeline = []
},
clearNotifications (state) {
state.notifications = []
},
archiveHomeTimeline (state) {
state.homeTimeline = state.homeTimeline.slice(0, 40)
},
archiveNotifications (state) {
state.notifications = state.notifications.slice(0, 40)
}
},
actions: {
@ -155,10 +79,10 @@ const TimelineSpace = {
},
startUserStreaming ({ state, commit }, account) {
ipcRenderer.on('update-start-user-streaming', (event, update) => {
commit('appendHomeTimeline', update)
commit('TimelineSpace/Contents/Home/appendTimeline', update, { root: true })
// Sometimes archive old statuses
if (state.heading) {
commit('archiveHomeTimeline')
commit('TimelineSpace/Contents/Home/archiveTimeline', null, { root: true })
}
commit('TimelineSpace/SideMenu/changeUnreadHomeTimeline', true, { root: true })
})
@ -167,7 +91,7 @@ const TimelineSpace = {
notify.onclick = () => {
router.push(`/${account._id}/notifications`)
}
commit('appendNotifications', notification)
commit('TimelineSpace/Contents/Notifications/appendNotifications', notification, { root: true })
commit('TimelineSpace/SideMenu/changeUnreadNotifications', true, { root: true })
})
@ -198,44 +122,6 @@ const TimelineSpace = {
ipcRenderer.removeAllListeners('CmdOrCtrl+K')
return 'removeShortcutEvents'
},
fetchHomeTimeline ({ commit }, account) {
return new Promise((resolve, reject) => {
const client = new Mastodon(
{
access_token: account.accessToken,
api_url: account.baseURL + '/api/v1'
}
)
client.get('/timelines/home', { limit: 40 }, (err, data, res) => {
if (err) return reject(err)
commit('updateHomeTimeline', data)
resolve(res)
})
})
},
fetchNotifications ({ commit }, account) {
return new Promise((resolve, reject) => {
const client = new Mastodon(
{
access_token: account.accessToken,
api_url: account.baseURL + '/api/v1'
}
)
client.get('/notifications', { limit: 30 }, (err, data, res) => {
if (err) return reject(err)
commit('updateNotifications', data)
resolve(res)
})
})
},
async clearTimeline ({ commit }) {
commit('clearTimeline')
return 'clearTimeline'
},
async clearNotifications ({ commit }) {
commit('clearNotifications')
return 'clearNotifications'
},
async clearAccount ({ commit }) {
commit(
'updateAccount',

View File

@ -3,14 +3,76 @@ import Mastodon from 'mastodon-api'
const Home = {
namespaced: true,
state: {
lazyLoading: false
lazyLoading: false,
heading: true,
timeline: [],
unreadTimeline: []
},
mutations: {
changeLazyLoading (state, value) {
state.lazyLoading = value
},
changeHeading (state, value) {
state.heading = value
},
appendTimeline (state, update) {
if (state.heading) {
state.timeline = [update].concat(state.timeline)
} else {
state.unreadTimeline = [update].concat(state.unreadTimeline)
}
},
updateTimeline (state, messages) {
state.timeline = messages
},
mergeTimeline (state) {
state.timeline = state.unreadTimeline.concat(state.timeline)
state.unreadTimeline = []
},
insertTimeline (state, messages) {
state.timeline = state.timeline.concat(messages)
},
archiveTimeline (state) {
state.timeline = state.timeline.slice(0, 40)
},
clearTimeline (state) {
state.timeline = []
state.unreadTimeline = []
},
updateToot (state, message) {
// Replace target message in homeTimeline and notifications
state.timeline = state.timeline.map((toot) => {
if (toot.id === message.id) {
return message
} else if (toot.reblog !== null && toot.reblog.id === message.id) {
// When user reblog/favourite a reblogged toot, target message is a original toot.
// So, a message which is received now is original toot.
const reblog = {
reblog: message
}
return Object.assign(toot, reblog)
} else {
return toot
}
})
}
},
actions: {
fetchTimeline ({ state, commit, rootState }, account) {
return new Promise((resolve, reject) => {
const client = new Mastodon(
{
access_token: rootState.TimelineSpace.account.accessToken,
api_url: rootState.TimelineSpace.account.baseURL + '/api/v1'
}
)
client.get('/timelines/home', { limit: 40 }, (err, data, res) => {
if (err) return reject(err)
commit('updateTimeline', data)
resolve(res)
})
})
},
lazyFetchTimeline ({ state, commit, rootState }, last) {
if (last === undefined || last === null) {
return null
@ -27,7 +89,7 @@ const Home = {
})
client.get('/timelines/home', { max_id: last.id, limit: 40 }, (err, data, res) => {
if (err) return reject(err)
commit('TimelineSpace/insertHomeTimeline', data, { root: true })
commit('insertTimeline')
commit('changeLazyLoading', false)
})
})

View File

@ -3,14 +3,59 @@ import Mastodon from 'mastodon-api'
const Notifications = {
namespaced: true,
state: {
lazyLoading: false
lazyLoading: false,
notifications: []
},
mutations: {
changeLazyLoading (state, value) {
state.lazyLoading = value
},
appendNotifications (state, notification) {
state.notifications = [notification].concat(state.notifications)
},
updateNotifications (state, notifications) {
state.notifications = notifications
},
insertNotifications (state, notifications) {
state.notifications = state.notifications.concat(notifications)
},
updateToot (state, message) {
state.notifications = state.notifications.map((notification) => {
// I want to update toot only mention.
// Because Toot component don't use status information when other patterns.
if (notification.type === 'mention' && notification.status.id === message.id) {
const status = {
status: message
}
return Object.assign(notification, status)
} else {
return notification
}
})
},
clearNotifications (state) {
state.notifications = []
},
archiveNotifications (state) {
state.notifications = state.notifications.slice(0, 40)
}
},
actions: {
fetchNotifications ({ commit }, account) {
return new Promise((resolve, reject) => {
const client = new Mastodon(
{
access_token: account.accessToken,
api_url: account.baseURL + '/api/v1'
}
)
client.get('/notifications', { limit: 30 }, (err, data, res) => {
if (err) return reject(err)
commit('updateNotifications', data)
resolve(res)
})
})
},
lazyFetchNotifications ({ state, commit, rootState }, last) {
if (last === undefined || last === null) {
return null