Dialog of Add, Remove + Member list in chat

frontend/src/app/message/message.component.html

@@ -2,6 +2,11 @@
     <div class="chat-header">
       <p class="username" *ngIf="room !== 'general'">{{room}}</p>
       <p class="username" *ngIf="room === 'general'">General</p>
+      <div class="pull-right">
+        <input *ngIf="room !== 'general' && typeRoom === true" class="btn btn-sm btn-primary" name="button-change-private" (click)="addMember()"  type="submit" value="+">
+        <input *ngIf="room !== 'general' && typeRoom === true" class="btn btn-sm btn-primary" name="button-change-private" (click)="removeMember()"  type="submit" value="-">
+        <input *ngIf="room !== 'general' && typeRoom === true" class="btn btn-sm btn-primary" name="button-change-private" (click)="listMembers()"  type="submit" value="Members">
+      </div>
     </div>
     <div #scrollContainer class="chat-body" >
       <ul #ulMessages id="messages">

frontend/src/app/message/message.component.ts

@@ -3,6 +3,9 @@ import {ChatInfo, ChatService} from "../services/chat/chat.service";
 import {DatePipe} from "@angular/common";
 import {environment} from "../../environments/environment";
 import {MessageService} from "../services/message/message.service";
+import {MatDialog} from "@angular/material/dialog";
+import {AddMemberDialogComponent} from "../add-member-dialog/add-member-dialog.component";
+import {RemoveMemberDialogComponent} from "../remove-member-dialog/remove-member-dialog.component";
 
 @Component({
   selector: 'app-message',
@@ -18,13 +21,16 @@ export class MessageComponent implements OnInit, OnChanges {
   // @ts-ignore
   @Input() room: string;
 
+  // @ts-ignore
+  @Input() typeRoom: boolean;
+
   // @ts-ignore
   @ViewChild('ulMessages') ulMsg: ElementRef;
 
   // @ts-ignore
   @ViewChild('scrollContainer') scrollContainer: ElementRef;
 
-  constructor(private chatservice: ChatService, private pipe: DatePipe, private messageservice: MessageService) {
+  constructor(private chatservice: ChatService, private pipe: DatePipe, private messageservice: MessageService, public dialog: MatDialog) {
   }
 
   ngOnInit() {
@@ -42,11 +48,21 @@ export class MessageComponent implements OnInit, OnChanges {
       this.chatServiceOnNewMessage(this.room);
     }
     else{
-      this.chatservice.setUrl(environment.urlCPR);
+      let dataMessage;
-      this.messageservice.sendMessage(environment.urlCPR,"conversations/getConv",{
+      if(this.typeRoom === true){
+        dataMessage = {
+          member: this.username,
+          roomName: this.room,
+        }
+      }
+      else{
+        dataMessage = {
           sender: this.username,
           receiver: this.room,
-      }).subscribe(data => {
+        }
+      }
+      this.chatservice.setUrl(environment.urlCPR);
+      this.messageservice.sendMessage(environment.urlCPR,"conversations/getConv",dataMessage).subscribe(data => {
         if (data.status !== 'ok') {
           console.log(data.data.reason);
         } else {
@@ -110,4 +126,99 @@ export class MessageComponent implements OnInit, OnChanges {
       this.msg = '';
     }
   }
+
+  addMember(){
+    let dataMessage;
+    if(this.typeRoom === true){
+      dataMessage = {
+        member: this.username,
+        roomName: this.room,
+      }
+    }
+    else{
+      dataMessage = {
+        sender: this.username,
+        receiver: this.room,
+      }
+    }
+    this.messageservice.sendMessage(environment.urlCPR, "conversations/getConv", dataMessage).subscribe(data => {
+      if (data.status !== 'ok') {
+        console.log(data.data.reason);
+      } else {
+        this.roomId = data.data._id;
+        const dialogRef = this.dialog.open(AddMemberDialogComponent, {
+          width: '50%',
+          data: {owner: this.username, conversationid: this.roomId}
+        });
+        dialogRef.afterClosed().subscribe(data2 => {
+          console.log(data2);
+          this.listMembers();
+        });
+      }
+    });
+  }
+
+  removeMember(){
+    let dataMessage;
+    if(this.typeRoom === true){
+      dataMessage = {
+        member: this.username,
+        roomName: this.room,
+      }
+    }
+    else{
+      dataMessage = {
+        sender: this.username,
+        receiver: this.room,
+      }
+    }
+    this.messageservice.sendMessage(environment.urlCPR, "conversations/getConv", dataMessage).subscribe(data => {
+      if (data.status !== 'ok') {
+        console.log(data.data.reason);
+      } else {
+        this.roomId = data.data._id;
+        const dialogRef = this.dialog.open(RemoveMemberDialogComponent, {
+          width: '50%',
+          data: {owner: this.username, conversationid: this.roomId}
+        });
+        dialogRef.afterClosed().subscribe(data2 => {
+          console.log(data2);
+          this.listMembers();
+        });
+      }
+    });
+  }
+
+  listMembers(){
+    let dataMessage;
+    if(this.typeRoom === true){
+      dataMessage = {
+        member: this.username,
+        roomName: this.room,
+      }
+    }
+    else{
+      dataMessage = {
+        sender: this.username,
+        receiver: this.room,
+      }
+    }
+    this.messageservice.sendMessage(environment.urlCPR, "conversations/getConv", dataMessage).subscribe(data => {
+      if (data.status !== 'ok') {
+        console.log(data.data.reason);
+      } else {
+        this.roomId = data.data._id;
+        this.messageservice.sendMessage(environment.urlCPR, "conversations/getMembers", {conversationid: this.roomId}).subscribe(data2 => {
+          if (data2.status !== 'ok') {
+            console.log(data2.data.reason);
+          } else {
+            if(typeof data2.data[0] !== 'undefined'){
+              this.ulMsg.nativeElement.insertAdjacentHTML('beforeend', '<li><span class="text-danger">Membres: '+data2.data[0].members+'</span></li>');
+            }
+          }
+        });
+      }
+    });
+
+  }
 }