-
+
@@ -50,6 +53,10 @@ export default {
async leaveServer() {
this.closeMenu();
await ServerService.leaveServer(this.contextDetails.serverID);
+ },
+ copyServerID() {
+ this.closeMenu();
+ this.$clipboard(this.contextDetails.serverID);
}
},
mounted() {
diff --git a/src/components/app/Popouts/Popouts/ServerMemberContext.vue b/src/components/app/Popouts/Popouts/ServerMemberContext.vue
index 684dcd1..4b329aa 100644
--- a/src/components/app/Popouts/Popouts/ServerMemberContext.vue
+++ b/src/components/app/Popouts/Popouts/ServerMemberContext.vue
@@ -1,12 +1,36 @@
-
{{ this.$props.username }}
{{ getDate }}
@@ -152,7 +156,8 @@ export default {
"messageID",
"channelID",
"timeEdited",
- "color"
+ "color",
+ "isServer"
],
components: {
ProfilePicture,
@@ -306,6 +311,28 @@ export default {
width: windowProperties.resizeWidth,
height: windowProperties.resizeHeight
};
+ },
+ roles() {
+ return this.$store.getters["servers/roles"][
+ this.$store.getters["servers/selectedServerID"]
+ ];
+ },
+ serverMember() {
+ const serverMembers = this.$store.getters["servers/serverMembers"];
+ return serverMembers.find(
+ m =>
+ m.uniqueID === this.uniqueID &&
+ m.server_id === this.$store.getters["servers/selectedServerID"]
+ );
+ },
+ roleColor() {
+ if (!this.isServer) return undefined;
+ if (!this.serverMember || !this.serverMember.roles) return undefined;
+ const filtered = this.roles.filter(r =>
+ this.serverMember.roles.includes(r.id)
+ );
+ if (!filtered.length) return undefined;
+ return filtered[0].color;
}
}
};
diff --git a/src/components/app/Popouts/Popouts/ServerContextMenu.vue b/src/components/app/Popouts/Popouts/ServerContextMenu.vue
index c04a481..9d5f861 100644
--- a/src/components/app/Popouts/Popouts/ServerContextMenu.vue
+++ b/src/components/app/Popouts/Popouts/ServerContextMenu.vue
@@ -7,6 +7,9 @@
Leave Server
+
+ Copy Server ID
+
-
-
-
-
+
+
+
+
View Profile
- Copy User@Tag
- Copy ID
-
- Kick
+
+
@@ -14,7 +38,9 @@
import ServerService from "../../../../services/ServerService";
export default {
data() {
- return {};
+ return {
+ editRoleHovered: false
+ };
},
methods: {
closeMenu() {
@@ -58,12 +84,70 @@ export default {
this.closeMenu();
await ServerService.banMember(serverID, uniqueID);
},
+ editRoleHoverEvent() {
+ this.editRoleHovered = true;
+ const mainMenu = this.$refs["main-menu"];
+ this.$nextTick(() => {
+ const rolesMenu = this.$refs["roles-menu"];
+
+ const mainMenuY = parseInt(mainMenu.style.top, 10);
+ const mainMenuX = parseInt(mainMenu.style.left, 10);
+
+ rolesMenu.style.top =
+ mainMenuY + mainMenu.clientHeight - rolesMenu.clientHeight + "px";
+ rolesMenu.style.left = mainMenuX - mainMenu.clientWidth - 38 + "px";
+ });
+ },
setPosition() {
const y = this.contextDetails.y;
- const x = this.contextDetails.x;
+ let x = this.contextDetails.x;
+ const mainMenu = this.$refs["main-menu"];
- this.$el.style.top = y + "px";
- this.$el.style.left = x + "px";
+ // if context is out of screen
+ if (x + mainMenu.clientWidth > window.innerWidth) {
+ x = window.innerWidth - mainMenu.clientWidth;
+ }
+
+ mainMenu.style.top = y + "px";
+ mainMenu.style.left = x + "px";
+ },
+ async addRole(roleID) {
+ this.$store.dispatch("servers/addMemberRole", {
+ role_id: roleID,
+ uniqueID: this.contextDetails.uniqueID,
+ server_id: this.contextDetails.serverID
+ });
+ await ServerService.applyRoleToMember(
+ this.contextDetails.serverID,
+ roleID,
+ this.contextDetails.uniqueID
+ );
+ },
+ async removeRole(roleID) {
+ this.$store.dispatch("servers/removeMemberRole", {
+ role_id: roleID,
+ uniqueID: this.contextDetails.uniqueID,
+ server_id: this.contextDetails.serverID
+ });
+ await ServerService.removeRoleFromMember(
+ this.contextDetails.serverID,
+ roleID,
+ this.contextDetails.uniqueID
+ );
+ },
+ serverRoles() {
+ const roles = this.$store.getters["servers/roles"][
+ this.contextDetails.serverID
+ ];
+
+ const map = roles.map(r => {
+ if (this.serverMember.roles && this.serverMember.roles.includes(r.id)) {
+ return Object.assign({}, r, { hasRole: true });
+ }
+ return r;
+ });
+
+ return map;
}
},
mounted() {
@@ -89,7 +173,8 @@ export default {
uniqueID
};
},
- serverMember() {
+ // check if i am the server Owner.
+ isServerMember() {
const serverMembers = this.$store.getters["servers/serverMembers"];
return serverMembers.find(
m =>
@@ -98,6 +183,14 @@ export default {
m.type === "OWNER"
);
},
+ serverMember() {
+ const serverMembers = this.$store.getters["servers/serverMembers"];
+ return serverMembers.find(
+ m =>
+ m.uniqueID === this.contextDetails.uniqueID &&
+ m.server_id === this.contextDetails.serverID
+ );
+ },
user() {
return this.$store.getters.user;
},
@@ -110,7 +203,7 @@ export default {
return;
// Only show kick and ban option if the user is server owner and not us
if (this.user.uniqueID === this.contextDetails.uniqueID) return false;
- return !!this.serverMember;
+ return !!this.isServerMember;
}
}
};
@@ -118,24 +211,54 @@ export default {
diff --git a/src/components/app/Popouts/Popouts/ServerSettingsPanels/ServerSettings.vue b/src/components/app/Popouts/Popouts/ServerSettingsPanels/ServerSettings.vue
index 735aa27..cca374a 100644
--- a/src/components/app/Popouts/Popouts/ServerSettingsPanels/ServerSettings.vue
+++ b/src/components/app/Popouts/Popouts/ServerSettingsPanels/ServerSettings.vue
@@ -23,9 +23,10 @@
+
+
+
+ check
+ {{ role.name }}
+
+
- View Profile
+ Copy User@Tag
+ Copy ID
+
+
+ keyboard_arrow_left
+ Edit Roles
+
+ Kick
+
+
+ Ban
+
Ban