Fixed group prefix/suffix display

shared/css/ts/client.scss

@@ -53,11 +53,21 @@
 .channelTree div * {vertical-align: middle;display:inline-block;height: 16px;padding: 0px;}
 .channelTree div img  {border: 0;}
 .channelTree div > span {position: absolute; right: 0;}
-.channelTree .name {
+.channelTree {
-    vertical-align: middle;
+    .name, .group_prefix, .group_suffix, .away {
-    margin-top: 1px;
+        vertical-align: middle;
-    height: 14px;
+        margin-top: 1px;
-    display: inline;
+        height: 14px;
+        display: inline;
+    }
+
+    .group_prefix {
+        margin-right: 3px;
+    }
+
+    .group_suffix {
+        margin-left: 3px;
+    }
 }
 .channelTree .own_name {
     font-weight: bold;

shared/js/permission/GroupManager.ts

@@ -143,9 +143,9 @@ class GroupManager {
                 group.updateProperty(key, groupData[key]);
             }
 
-            group.requiredMemberRemovePower = groupData["n_member_removep"];
+            group.requiredMemberRemovePower = parseInt(groupData["n_member_removep"]);
-            group.requiredMemberAddPower = groupData["n_member_addp"];
+            group.requiredMemberAddPower = parseInt(groupData["n_member_addp"]);
-            group.requiredModifyPower = groupData["n_modifyp"];
+            group.requiredModifyPower = parseInt(groupData["n_modifyp"]);
 
             if(target == GroupTarget.SERVER)
                 this.serverGroups.push(group);
@@ -154,6 +154,8 @@ class GroupManager {
         }
 
         console.log("Got " + json.length + " new " + target + " groups:");
+        for(const client of this.handle.channelTree.clients)
+            client.update_displayed_client_groups();
     }
 
     request_permissions(group: Group) : Promise<PermissionValue[]> { //database_empty_result

shared/js/ui/client.ts

@@ -408,7 +408,9 @@ class ClientEntry {
 
         tag.append($.spawn("div").addClass("icon_client_state").attr("title", "Client state"));
 
+        tag.append($.spawn("div").addClass("group_prefix").attr("title", "Server groups prefixes").hide());
         tag.append($.spawn("div").addClass("name").text(this.clientNickName()));
+        tag.append($.spawn("div").addClass("group_suffix").attr("title", "Server groups suffix").hide());
         tag.append($.spawn("div").addClass("away").text(this.clientNickName()));
 
         let clientIcons = $.spawn("span");
@@ -561,7 +563,7 @@ class ClientEntry {
             if(variable.key == "client_icon_id")
                 this.updateClientIcon();
             if(variable.key =="client_channel_group_id" || variable.key == "client_servergroups")
-                this.updateGroupIcons();
+                this.update_displayed_client_groups();
         }
 
         /* process updates after variables have been set */
@@ -577,11 +579,39 @@ class ClientEntry {
         group.end();
     }
 
-    updateGroupIcons() {
+    update_displayed_client_groups() {
         this.tag.find("span .group_icons").children().detach();
+
         for(let id of this.assignedServerGroupIds())
             this.updateGroupIcon(this.channelTree.client.groups.serverGroup(id));
+
         this.updateGroupIcon(this.channelTree.client.groups.channelGroup(this.properties.client_channel_group_id));
+
+        let prefix_groups: string[] = [];
+        let suffix_groups: string[] = [];
+        for(const group_id of this.assignedServerGroupIds()) {
+            const group = this.channelTree.client.groups.serverGroup(group_id);
+            if(!group) continue;
+
+            if(group.properties.namemode == 1)
+                prefix_groups.push(group.name);
+            else if(group.properties.namemode == 2)
+                suffix_groups.push(group.name);
+        }
+
+        const tag_group_prefix = this.tag.find(".group_prefix");
+        const tag_group_suffix = this.tag.find(".group_suffix");
+        if(prefix_groups.length > 0) {
+            tag_group_prefix.text("[" + prefix_groups.join("][") + "]").show();
+        } else {
+            tag_group_prefix.hide()
+        }
+
+        if(suffix_groups.length > 0) {
+            tag_group_suffix.text("[" + suffix_groups.join("][") + "]").show();
+        } else {
+            tag_group_suffix.hide()
+        }
     }
 
     updateClientVariables(){