Il manquait la moitié des components :d

frontend/src/app/change-password/change-password.component.html

@@ -0,0 +1 @@
+<p>change-password works!</p>

frontend/src/app/change-password/change-password.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ChangePasswordComponent } from './change-password.component';
+
+describe('ChangePasswordComponent', () => {
+  let component: ChangePasswordComponent;
+  let fixture: ComponentFixture<ChangePasswordComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ChangePasswordComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ChangePasswordComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

frontend/src/app/change-password/change-password.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-change-password',
+  templateUrl: './change-password.component.html',
+  styleUrls: ['./change-password.component.scss']
+})
+export class ChangePasswordComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

frontend/src/app/chat/chat.component.html

@@ -0,0 +1,2 @@
+<app-private></app-private>
+

frontend/src/app/chat/chat.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ChatComponent } from './chat.component';
+
+describe('ChatComponent', () => {
+  let component: ChatComponent;
+  let fixture: ComponentFixture<ChatComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ChatComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ChatComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

frontend/src/app/chat/chat.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-chat',
+  templateUrl: './chat.component.html',
+  styleUrls: ['./chat.component.scss']
+})
+export class ChatComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

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

@@ -0,0 +1,22 @@
+<div class="chat-container">
+    <div class="chat-header">
+      <p class="username" *ngIf="room !== 'general'">{{room}}</p>
+      <p class="username" *ngIf="room === 'general'">General</p>
+    </div>
+    <div #scrollContainer class="chat-body" >
+      <ul #ulMessages id="messages">
+      </ul>
+    </div>
+    <div class="chat-footer">
+      <div class="row">
+        <div class="col-md-10">
+          <div class="form-group mb-0">
+            <input type="text" placeholder="Entrez votre message" (keydown.enter)="sendButtonClick()" class="form-control" [(ngModel)]="msg"/>
+          </div>
+        </div>
+        <div class="col-md-2 text-center align-self-center">
+          <button class="btn btn-primary btn-bm px-3" (click)="sendButtonClick()" id="button-send">Envoyer</button>
+        </div>
+      </div>
+    </div>
+</div>

frontend/src/app/message/message.component.scss

@@ -0,0 +1,3 @@
+#messages { list-style-type: none; margin: 0; padding: 0; }
+#messages > li { padding: 0.5rem 1rem; }
+#messages > li:nth-child(odd) { background: #efefef; }

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

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MessageComponent } from './message.component';
+
+describe('MessageComponent', () => {
+  let component: MessageComponent;
+  let fixture: ComponentFixture<MessageComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MessageComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MessageComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

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

@@ -0,0 +1,113 @@
+import {Component, ElementRef, Input, OnChanges, OnInit, SimpleChanges, ViewChild} from '@angular/core';
+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";
+
+@Component({
+  selector: 'app-message',
+  templateUrl: './message.component.html',
+  styleUrls: ['./message.component.scss']
+})
+export class MessageComponent implements OnInit, OnChanges {
+
+  public username = sessionStorage.getItem('login');
+  public msg = '';
+  public roomId = '';
+
+  // @ts-ignore
+  @Input() room: string;
+
+  // @ts-ignore
+  @ViewChild('ulMessages') ulMsg: ElementRef;
+
+  // @ts-ignore
+  @ViewChild('scrollContainer') scrollContainer: ElementRef;
+
+  constructor(private chatservice: ChatService, private pipe: DatePipe, private messageservice: MessageService) {
+  }
+
+  ngOnInit() {
+  }
+
+  ngOnChanges(changes: SimpleChanges){
+    //console.log('ngOnChange :'+this.room);
+    this.chatservice.leaveRoom();
+    // @ts-ignore
+    document.getElementById('messages').innerHTML = '';
+    if(this.room === 'General' || this.room === 'general'){
+      this.room = 'general';
+      this.chatservice.setUrl(environment.urlCG);
+      this.chatservice.setRoom(this.room);
+      this.chatServiceOnNewMessage(this.room);
+    }
+    else{
+      this.chatservice.setUrl(environment.urlCPR);
+      this.messageservice.sendMessage(environment.urlCPR,"conversations/getConv",{
+        sender: this.username,
+        receiver: this.room,
+      }).subscribe(data => {
+        if (data.status !== 'ok') {
+          console.log(data.data.reason);
+        } else {
+          if(data.data === null){
+            this.messageservice.sendMessage(environment.urlCPR, "conversations/newConv", {
+              sender: this.username,
+              receiver: this.room,
+            }).subscribe(data2 => {
+              if (data2.status !== 'ok') {
+                console.log(data2.data.reason);
+              } else {
+                //console.log(data.data);
+                this.roomId = data2.data._id;
+                this.chatservice.setRoom(this.roomId)
+                this.chatServiceOnNewMessage(this.roomId);
+              }
+            });
+          }
+          else{
+            if(typeof data.data !== 'undefined' && typeof data.data._id !== 'undefined'){
+              //console.log(data.data);
+              this.roomId = data.data._id;
+              this.chatservice.setRoom(this.roomId);
+              this.chatServiceOnNewMessage(this.roomId);
+            }
+          }
+        }
+      });
+    }
+  }
+
+  chatServiceOnNewMessage(room: string){
+    this.chatservice.onNewMessage(room).subscribe((infos: ChatInfo[]) => {
+      for(let data of infos){
+        if(data !== undefined && data.date !== undefined){
+          if(data.username === 'Server'){
+            this.ulMsg.nativeElement.insertAdjacentHTML('beforeend', '<li><span class="text-danger">'+data.message+'</span></li>');
+          }
+          else{
+            this.ulMsg.nativeElement.insertAdjacentHTML('beforeend','<li><span class="text-primary">['+this.pipe.transform(data.date, 'dd/MM/yyyy HH:MM:ss')+'] </span><span class="text-success">'+data.username+' </span>:<span class="text-secondary"> '+data.message+'</span></li>');
+          }
+        }
+      }
+      this.scrollContainer.nativeElement.scrollTop = this.scrollContainer.nativeElement.scrollHeight;
+    });
+  }
+
+  sendButtonClick(){
+    //console.log('Button working');
+    if(this.msg && this.username && this.room){
+      if(this.room === 'general'){
+        //console.log("sendButton general");
+        this.chatservice.sendMessage(this.username, this.room,  this.msg);
+        //console.log(this.username, this.room, this.msg);
+      }
+      else{
+        //console.log("sendButton private");
+        this.chatservice.sendMessage(this.username, this.roomId,  this.msg);
+        //console.log(this.username, this.roomId, this.msg);
+      }
+      this.msg = '';
+    }
+  }
+}

frontend/src/app/navbar/navbar.component.html

@@ -0,0 +1 @@
+<p>navbar works!</p>

frontend/src/app/navbar/navbar.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NavbarComponent } from './navbar.component';
+
+describe('NavbarComponent', () => {
+  let component: NavbarComponent;
+  let fixture: ComponentFixture<NavbarComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ NavbarComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(NavbarComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

frontend/src/app/navbar/navbar.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-navbar',
+  templateUrl: './navbar.component.html',
+  styleUrls: ['./navbar.component.scss']
+})
+export class NavbarComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

frontend/src/app/private/private.component.html

@@ -0,0 +1,12 @@
+<div class="container-fluid">
+  <div class="row">
+    <div class="col-md-4">
+      <div #userList class="user-list-card"  (click)="selectRoom($event)">
+        <div class="user-card"><p class="username">General</p></div>
+      </div>
+    </div>
+    <div class="col-md-8">
+      <app-message [room]="roomSelected"></app-message>
+    </div>
+  </div>
+</div>

frontend/src/app/private/private.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PrivateComponent } from './private.component';
+
+describe('PrivateComponent', () => {
+  let component: PrivateComponent;
+  let fixture: ComponentFixture<PrivateComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ PrivateComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PrivateComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

frontend/src/app/private/private.component.ts

@@ -0,0 +1,50 @@
+import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';
+import {environment} from "../../environments/environment";
+import {ChatService} from "../services/chat/chat.service";
+import {MessageService} from "../services/message/message.service";
+
+@Component({
+  selector: 'app-private',
+  templateUrl: './private.component.html',
+  styleUrls: ['./private.component.scss']
+})
+export class PrivateComponent implements OnInit {
+
+  public username = sessionStorage.getItem('login');
+  public roomSelected = 'general';
+
+  // @ts-ignore
+  @ViewChild('userList') userList: ElementRef;
+
+  constructor(private chatservice: ChatService, private messageservice: MessageService) {}
+
+  ngOnInit(): void {
+    this.messageservice.sendMessage(environment.urlCL,'getUsers', {username: this.username}).subscribe(
+      data => {
+        if (data.status !== 'ok'){
+          console.log(data.data.reason);
+        }
+        else{
+          //console.log(data.data);
+          //data.data = data.data.concat(data.data).concat(data.data).concat(data.data).concat(data.data).concat(data.data).concat(data.data).concat(data.data).concat(data.data);
+          for(let user of data.data){
+            if(user !== undefined && user.login !== undefined){
+                this.userList.nativeElement.insertAdjacentHTML('beforeend', '<div class="user-card" [id]="'+user.login+'"><img src="../../assets/image/user.png" height="25" width="25"/><p class="username">'+user.login+'</p></div>');
+            }
+          }
+        }
+      }
+    );
+  }
+
+  selectRoom(event: Event): void {
+    if((event.target as Element).className !== 'user-list-card'){
+      const room = (event.target as Element).textContent;
+      //console.log(room);
+      if(room !== '' && room !== null) {
+        this.roomSelected = room;
+      }
+    }
+  }
+
+}

frontend/src/app/register/register.component.html

@@ -0,0 +1,24 @@
+<div class="container">
+  <div class="modal-header">
+    <h4 class="modal-title">Vous pouvez aussi vous enregistrer ici</h4>
+  </div>
+  <form>
+    <div class="modal-body">
+      <div class="row">
+        <div class="col-md-10">
+          <div class="form-group mb-0">
+            <input class="form-control" type="text" required="" [(ngModel)]="login2" autocomplete="login-register" id="login-register" name="login-name-register" placeholder="login">
+            <input class="form-control" type="password" required="" [(ngModel)]="password2" autocomplete="password-register" id="password-register" name="password-name-register" placeholder="password">
+            <input class="form-control" type="password" required="" [(ngModel)]="password4" autocomplete="password2-register" id="password2-register" name="password2-name-register" placeholder="confirmation password">
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="modal-footer">
+      <input class="btn btn-sm btn-primary" name="button-register" (click)="register()" type="submit" value="S'enregistrer">
+    </div>
+  </form>
+  <br>
+  <div class="alert alert-danger" *ngIf="errorMessage!==''">{{errorMessage}}</div>
+  <div class="alert-success" *ngIf="succesMessage!==''">{{succesMessage}}</div>
+</div>

frontend/src/app/register/register.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { RegisterComponent } from './register.component';
+
+describe('RegisterComponent', () => {
+  let component: RegisterComponent;
+  let fixture: ComponentFixture<RegisterComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ RegisterComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(RegisterComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

frontend/src/app/register/register.component.ts

@@ -0,0 +1,41 @@
+import { Component, OnInit } from '@angular/core';
+import {MessageService} from "../services/message/message.service";
+import {environment} from "../../environments/environment";
+
+@Component({
+  selector: 'app-register',
+  templateUrl: './register.component.html',
+  styleUrls: ['./register.component.scss']
+})
+export class RegisterComponent implements OnInit {
+
+  login2 = '';
+  password2 = '';
+  password4 = '';
+  errorMessage = '';
+  succesMessage = '';
+
+  constructor(private messageService: MessageService) { }
+
+  ngOnInit(): void {
+
+  }
+
+  register(): void {
+    if(this.password4 !== this.password2){
+      console.log("error");
+      this.errorMessage = 'Les mots de passe ne sont pas identiques.';
+    }
+    else {
+      this.messageService.sendMessage(environment.urlCL,"register",{username: this.login2, password: this.password2}).subscribe(data => {
+        if (data.status !== 'ok') {
+          console.log(data.data.reason);
+          this.errorMessage = data.data.reason;
+        } else {
+          //console.log(data.data);
+          this.succesMessage = data.data;
+        }
+      });
+    }
+  }
+}