diff --git a/src/components/app/MembersList.vue b/src/components/app/MembersList.vue index 3ac6130..acccbe5 100644 --- a/src/components/app/MembersList.vue +++ b/src/components/app/MembersList.vue @@ -16,10 +16,17 @@ export default { components: { MemberTemplate }, computed: { members() { + const members = this.$store.getters['members/members']; const serverMembers = this.$store.getters['servers/serverMembers'] const selectedServerID = this.$store.getters['servers/selectedServerID']; - return serverMembers.filter(sm => sm.server_id === selectedServerID).sort((a, b) => { + let filteredSM = serverMembers.filter(sm => sm.server_id === selectedServerID); + + let getMember = filteredSM.map(sm => { + sm.member = members[sm.uniqueID]; + return sm; + }) + const sort = getMember.sort((a, b) => { var nameA = a.member.username.toUpperCase(); var nameB = b.member.username.toUpperCase(); if (nameA < nameB) { @@ -30,6 +37,7 @@ export default { } return 0; }) + return sort; } } diff --git a/src/components/app/MessageTemplate.vue b/src/components/app/MessageTemplate.vue index ff69e3f..4f6bffb 100644 --- a/src/components/app/MessageTemplate.vue +++ b/src/components/app/MessageTemplate.vue @@ -350,6 +350,5 @@ img.emoji { height: 1.7em; width: auto; margin: 0 0.05em 0 0.1em; - vertical-align: -0.1em; } diff --git a/src/components/app/relationships/FriendsTemplate.vue b/src/components/app/relationships/FriendsTemplate.vue index 7073e0e..8f42a2f 100644 --- a/src/components/app/relationships/FriendsTemplate.vue +++ b/src/components/app/relationships/FriendsTemplate.vue @@ -59,9 +59,10 @@ export default { return config.domain + "/avatars/" + this.recipient.avatar }, status() { + const presences = this.$store.getters['members/presences']; let status = 0; - if (this.$store.getters.user.friends[this.recipient.uniqueID]) { - status = this.$store.getters.user.friends[this.recipient.uniqueID].recipient.status || 0 + if (presences[this.recipient.uniqueID]) { + status = presences[this.recipient.uniqueID] || 0 } return { diff --git a/src/components/app/relationships/OfflineFriends.vue b/src/components/app/relationships/OfflineFriends.vue index 0214874..1b2867e 100644 --- a/src/components/app/relationships/OfflineFriends.vue +++ b/src/components/app/relationships/OfflineFriends.vue @@ -27,10 +27,13 @@ export default { computed: { friends() { const allFriend = this.$store.getters.user.friends; + const members = this.$store.getters['members/members']; + const presences = this.$store.getters['members/presences']; const result = Object.keys(allFriend).map(function(key) { + allFriend[key].recipient = members[allFriend[key].uniqueID]; return allFriend[key]; }); - return result.filter(friend => friend.status == 2 && (friend.recipient.status === undefined || friend.recipient.status == 0 )); + return result.filter(friend => friend.status == 2 && (!presences[friend.uniqueID] || presences[friend.uniqueID] == 0 )); } } } diff --git a/src/components/app/relationships/OnlineFriends.vue b/src/components/app/relationships/OnlineFriends.vue index 59bdbd3..6a330cb 100644 --- a/src/components/app/relationships/OnlineFriends.vue +++ b/src/components/app/relationships/OnlineFriends.vue @@ -30,10 +30,14 @@ export default { computed: { friends() { const allFriend = this.$store.getters.user.friends; + const members = this.$store.getters['members/members']; + const presences = this.$store.getters['members/presences']; const notifications = this.$store.getters.notifications; const channels = this.$store.getters.channels; + const result = Object.keys(allFriend).map(function(key) { - const friend = allFriend[key]; + const friend = allFriend[key]; + friend.recipient = members[friend.uniqueID]; const findNotification = notifications.find( e => { return e.sender.uniqueID === friend.recipient.uniqueID && !channels[e.channelID].server_id @@ -45,7 +49,7 @@ export default { return friend }); - return result.filter(friend => friend.status == 2 && (friend.recipient.status !== undefined && friend.recipient.status > 0 )); + return result.filter(friend => friend.status == 2 && (presences[friend.uniqueID] && presences[friend.uniqueID] > 0 )); } } } diff --git a/src/components/app/relationships/PendingFriends.vue b/src/components/app/relationships/PendingFriends.vue index 47b7ef9..2614fd2 100644 --- a/src/components/app/relationships/PendingFriends.vue +++ b/src/components/app/relationships/PendingFriends.vue @@ -27,7 +27,9 @@ export default { computed: { friends() { const allFriend = this.$store.getters.user.friends; + const members = this.$store.getters['members/members']; const result = Object.keys(allFriend).map(function(key) { + allFriend[key].recipient = members[allFriend[key].uniqueID]; return allFriend[key]; }); return result.filter(friend => friend.status < 2); diff --git a/src/store/index.js b/src/store/index.js index 6987d90..d57c20e 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -10,6 +10,7 @@ import uploadFilesModule from './modules/uploadFilesModule'; import popoutsModule from './modules/popoutsModule/popoutsModule.js'; import emojiSuggestionModule from './modules/emojiSuggestionModule'; import serversModule from './modules/serversModule'; +import membersModule from './modules/membersModule'; import { router } from './../router' @@ -27,7 +28,8 @@ export const store = new Vuex.Store({ uploadFilesModule, popoutsModule, emojiSuggestionModule, - servers: serversModule + servers: serversModule, + members: membersModule }, state: { diff --git a/src/store/modules/membersModule.js b/src/store/modules/membersModule.js new file mode 100644 index 0000000..1aa8dc2 --- /dev/null +++ b/src/store/modules/membersModule.js @@ -0,0 +1,70 @@ +import { bus } from "../../main"; +import { router } from "./../../router"; +import Vue from "vue"; + +const state = { + members: {}, + presences: {} +}; + +const getters = { + members(state) { + return state.members; + }, + presences(state) { + return state.presences; + } + +}; + +const actions = { + + addPresences(context, presences) { + context.commit('ADD_PRESENCES', presences); + }, + updatePresence(context, {uniqueID, status}) { + context.commit('UPDATE_PRESENCE', {uniqueID, status}); + }, + addMembers(context, membersOBJ) { + context.commit('ADD_MEMBERS', membersOBJ); + }, + addMember(context, member) { + context.commit('ADD_MEMBER', member); + }, + removeMember(context, uniqueID) { + context.commit('REMOVE_MEMBER', uniqueID); + }, + updateAvatar(context, {uniqueID, avatarID}) { + context.commit('UPDATE_AVATAR', {uniqueID, avatarID}); + }, +}; + +const mutations = { + ADD_PRESENCES(state, presences){ + state.presences = {...state.presences, ...presences} + }, + UPDATE_PRESENCE(state, {uniqueID, status}) { + Vue.set(state.presences, uniqueID, status); + }, + ADD_MEMBERS(state, membersOBJ){ + state.members = Object.assign(state.members, membersOBJ); + }, + ADD_MEMBER(state, member) { + state.members[member.uniqueID] = member; + }, + REMOVE_MEMBER(state, uniqueID) { + delete state.members[uniqueID]; + }, + UPDATE_AVATAR(state, {uniqueID, avatarID}) { + state.members[uniqueID].avatar = avatarID; + }, + +}; + +export default { + namespaced: true, + state, + actions, + mutations, + getters +}; diff --git a/src/store/modules/serversModule.js b/src/store/modules/serversModule.js index 55b200c..d9e0a39 100644 --- a/src/store/modules/serversModule.js +++ b/src/store/modules/serversModule.js @@ -68,18 +68,18 @@ const mutations = { ADD_SERVER_MEMBERS(state, serverMembersArr) { for (let members of serverMembersArr) { - if (!state.serverMembers.find(sm => sm.member.uniqueID === members.member.uniqueID && sm.server_id === members.server_id)){ + if (!state.serverMembers.find(sm => sm.uniqueID === members.uniqueID && sm.server_id === members.server_id)){ state.serverMembers.push(members) } } }, ADD_SERVER_MEMBER(state, serverMember) { - const exists = state.serverMembers.find(sm => sm.member.uniqueID === serverMember.member.uniqueID && sm.server_id === serverMember.server_id) + const exists = state.serverMembers.find(sm => sm.uniqueID === serverMember.uniqueID && sm.server_id === serverMember.server_id) if (exists) return; state.serverMembers.push(serverMember); }, REMOVE_SERVER_MEMBER(state, {uniqueID, server_id}) { - state.serverMembers = state.serverMembers.filter(m => m.member.uniqueID !== uniqueID && m.server_id === server_id); + state.serverMembers = state.serverMembers.filter(m => m.uniqueID !== uniqueID && m.server_id === server_id); }, SET_SELECTED_SERVER_ID(state, serverID){ state.selectedServerID = serverID; diff --git a/src/store/modules/socketIOModule.js b/src/store/modules/socketIOModule.js index 31eecfb..d918d60 100644 --- a/src/store/modules/socketIOModule.js +++ b/src/store/modules/socketIOModule.js @@ -18,23 +18,53 @@ const actions = { socket_success(context, data) { const {message, user, serverMembers, dms, notifications, currentFriendStatus, settings} = data; - const friendsArray = user.friends; - const friendObject = {}; - // convert array into object and add online status. - if(friendsArray !== undefined && friendsArray.length >=1) { - for (let index = 0; index < friendsArray.length; index++) { - const element = friendsArray[index]; - if (element.recipient) { - friendObject[element.recipient.uniqueID] = element; - for (let currentFriendStatus of currentFriendStatus){ - if(currentFriendStatus[0] == element.recipient.uniqueID){ - friendObject[element.recipient.uniqueID].recipient.status = currentFriendStatus[1] - } - } - } + + const friendsArr = user.friends; + + const presence = {}; + const friendObj = {}; + const memberObj = {}; + if (friendsArr) { + for ( let friend of friendsArr ){ + const member = friend.recipient; + delete friend.recipient; + friend.uniqueID = member.uniqueID; + friendObj[member.uniqueID] = friend; + memberObj[member.uniqueID] = member; } } + if (currentFriendStatus) { + for (const _presence of currentFriendStatus) { + presence[_presence[0]] = _presence[1]; + } + } + + context.dispatch('members/addPresences', presence); + + context.dispatch('members/addMembers', memberObj); + + + + + // const friendsArray = user.friends; + // const friendObject = {}; + + // // convert array into object and add online status. + // if(friendsArray !== undefined && friendsArray.length >=1) { + // for (let index = 0; index < friendsArray.length; index++) { + // const element = friendsArray[index]; + // if (element.recipient) { + // friendObject[element.recipient.uniqueID] = element; + // for (let currentFriendStatus of currentFriendStatus){ + // console.log(currentFriendStatus[0], currentFriendStatus[1]) + // if(currentFriendStatus[0] == element.recipient.uniqueID){ + // friendObject[element.recipient.uniqueID].recipient.status = currentFriendStatus[1] + // } + // } + // } + // } + // } let servers = user.servers || []; //convert array to object for servers @@ -60,14 +90,24 @@ const actions = { context.dispatch('servers/setServers', servers) data.user.servers = undefined; - data.user.friends = friendObject; + data.user.friends = friendObj; context.commit('user', data.user) //server members - context.dispatch( 'servers/addServerMembers', serverMembers ) + let serverMembersArr = []; + let membersObj = {}; + for (let serverMember of serverMembers) { + const member = serverMember.member; + delete serverMember.member; + serverMember.uniqueID = member.uniqueID; + serverMembersArr.push(serverMember); + membersObj[member.uniqueID] = member; + } + context.dispatch('members/addMembers', membersObj); + context.dispatch( 'servers/addServerMembers', serverMembersArr ) // convert dms array to object @@ -84,6 +124,12 @@ const actions = { }, socket_relationshipAdd(context, friend) { + const member = friend.recipient; + delete friend.recipient; + friend.uniqueID = member.uniqueID; + context.dispatch('members/updatePresence', {uniqueID: member.uniqueID, status: member.status}) + delete member.status; + context.dispatch('members/addMember', member) context.commit('addFriend', friend) }, socket_relationshipAccept(context, uniqueID) { @@ -116,7 +162,8 @@ const actions = { context.dispatch('messageCreatedNotification', notification); }, socket_userStatusChange(context, data) { - context.commit('userStatusChange', data) + if (context.rootState.user.user.uniqueID === data.uniqueID) return; + context.dispatch('members/updatePresence', {uniqueID: data.uniqueID, status: data.status}) }, socket_multiDeviceStatus(context, data) { context.commit('changeStatus', data.status) @@ -128,7 +175,7 @@ const actions = { context.commit('changeAvatar', data.avatarID); }, socket_userAvatarChange(context, data) { - context.commit('userAvatarChange', data) + context.commit('members/updateAvatar', data) }, ['socket_channel:created'](context, data){ const {channel} = data; @@ -176,7 +223,14 @@ const actions = { context.dispatch('servers/removeServer', server_id) }, ['socket_server:memberAdd'](context, {serverMember}) { // member_add - context.dispatch('servers/addServerMember', serverMember) + let sm = Object.assign({}, serverMember); + const member = sm.member; + delete sm.member; + sm.uniqueID = member.uniqueID; + + context.dispatch('members/addMember', member) + context.dispatch('servers/addServerMember', sm) + console.log("someone joined") }, ['socket_server:memberRemove'](context, {uniqueID, server_id}) { // member_remove @@ -184,6 +238,16 @@ const actions = { console.log("Someone left") }, ['socket_server:members'](context, {serverMembers}) { // members + let serverMembersArr = []; + let members = {}; + for (let serverMember of serverMembers) { + const member = serverMember.member; + delete serverMember.member; + serverMember.uniqueID = member.uniqueID; + serverMembersArr.push(serverMember); + members[member.uniqueID] = member; + } + context.dispatch('members/addMembers', members); context.dispatch('servers/addServerMembers', serverMembers) console.log("server members ") }, diff --git a/src/store/modules/userModule.js b/src/store/modules/userModule.js index 77a8ea1..ca78273 100644 --- a/src/store/modules/userModule.js +++ b/src/store/modules/userModule.js @@ -52,18 +52,6 @@ const mutations = { //changes my status Vue.set(state.user, "status", status) }, - userStatusChange(state, data) { - // changes friends status - const friends = state.user.friends; - friends[data.uniqueID].recipient.status = data.status; - state.user.friends = Object.assign({}, friends) - }, - userAvatarChange(state, data) { - // changes friends status - const friends = state.user.friends; - friends[data.uniqueID].recipient.avatar = data.avatarID; - state.user.friends = Object.assign({}, friends) - }, token(state, token) { axios.defaults.headers.common['authorization'] = token; localStorage.setItem('hauthid', token); @@ -81,7 +69,7 @@ const mutations = { addFriend(state, friend) { const friends = state.user.friends; - friends[friend.recipient.uniqueID] = friend; + friends[friend.uniqueID] = friend; state.user.friends = Object.assign({}, friends)