From d69caaec82a3075c9238d3781224fe6952cecffb Mon Sep 17 00:00:00 2001 From: wilfried Date: Fri, 28 May 2021 09:37:02 +0200 Subject: [PATCH] second commit --- frontend/angular.json | 2 +- frontend/package-lock.json | 25 ++++ frontend/package.json | 2 + .../src/app/general/general.component.html | 55 ++++++- frontend/src/app/general/general.component.ts | 135 +++++++++++++++++- frontend/src/app/login/login.component.html | 17 ++- frontend/src/app/login/login.component.ts | 27 ++-- .../src/app/private/private.component.html | 12 +- frontend/src/app/private/private.component.ts | 26 ++-- .../src/app/services/auth/auth.service.ts | 40 +++--- .../src/app/services/chat/chat.service.ts | 28 ++++ frontend/src/assets/image/fond.png | Bin 0 -> 11632 bytes frontend/src/assets/image/user.png | Bin 11632 -> 52987 bytes 13 files changed, 314 insertions(+), 55 deletions(-) create mode 100644 frontend/src/assets/image/fond.png diff --git a/frontend/angular.json b/frontend/angular.json index b4dfcfc..4a9d47d 100644 --- a/frontend/angular.json +++ b/frontend/angular.json @@ -34,7 +34,7 @@ "src/assets" ], "styles": [ - "./node_modules/bootstrap/scss/bootstrap.scss", + "node_modules/bootstrap/scss/bootstrap.scss", "src/styles.scss" ], "scripts": [] diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 953646a..f44d99e 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -143,6 +143,23 @@ "tslib": "^2.1.0" } }, + "@angular/cdk": { + "version": "12.0.2", + "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-12.0.2.tgz", + "integrity": "sha512-1JGayyUJmwaul5YSEgb780aWxk+MLVG5FakVaxz5NtbPZx19ZyOuZqytCh5js11LsBDipF5/kirYhJPBFlMbWQ==", + "requires": { + "parse5": "^5.0.0", + "tslib": "^2.1.0" + }, + "dependencies": { + "parse5": { + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.1.tgz", + "integrity": "sha512-ugq4DFI0Ptb+WWjAdOK16+u/nHfiIrcE+sh8kZMaM0WllQKLI9rOUq6c2b7cwPkXdzfQESqvoqK6ug7U/Yyzug==", + "optional": true + } + } + }, "@angular/cli": { "version": "12.0.1", "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-12.0.1.tgz", @@ -423,6 +440,14 @@ } } }, + "@angular/material": { + "version": "12.0.2", + "resolved": "https://registry.npmjs.org/@angular/material/-/material-12.0.2.tgz", + "integrity": "sha512-jTH53w4iVNk+3K5ciFyHeRhNNtV6TzeuNTSELeme4l3t5FP3VqFTdE56Q55MrV2RMIzDKLYEpiqSiQf+8ZuGSA==", + "requires": { + "tslib": "^2.1.0" + } + }, "@angular/platform-browser": { "version": "12.0.2", "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-12.0.2.tgz", diff --git a/frontend/package.json b/frontend/package.json index 57c8deb..3d9e707 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -11,11 +11,13 @@ "private": true, "dependencies": { "@angular/animations": "~12.0.1", + "@angular/cdk": "^12.0.2", "@angular/common": "~12.0.1", "@angular/compiler": "~12.0.1", "@angular/core": "~12.0.1", "@angular/forms": "~12.0.1", "@angular/localize": "^12.0.2", + "@angular/material": "^12.0.2", "@angular/platform-browser": "~12.0.1", "@angular/platform-browser-dynamic": "~12.0.1", "@angular/router": "~12.0.1", diff --git a/frontend/src/app/general/general.component.html b/frontend/src/app/general/general.component.html index 237133c..b469ee8 100644 --- a/frontend/src/app/general/general.component.html +++ b/frontend/src/app/general/general.component.html @@ -1 +1,54 @@ -

general works!

+
+
+ +
+ +
+
+ + + +

{{user?.name}}

+ +
+
+ +
+
+ +
+ +
+

{{selectedUser?.name}}

+
+ +
+
+ {{item.user}} : {{item.message}} +
+ +
+ + +
+
+
+
+
diff --git a/frontend/src/app/general/general.component.ts b/frontend/src/app/general/general.component.ts index 299af91..282037c 100644 --- a/frontend/src/app/general/general.component.ts +++ b/frontend/src/app/general/general.component.ts @@ -1,4 +1,6 @@ import { Component, OnInit } from '@angular/core'; +import {ChatService} from "../services/chat/chat.service"; +import {AuthService} from "../services/auth/auth.service"; @Component({ selector: 'app-general', @@ -6,10 +8,141 @@ import { Component, OnInit } from '@angular/core'; styleUrls: ['./general.component.scss'] }) export class GeneralComponent implements OnInit { + public currentUser; - constructor() { } + // @ts-ignore + public user:String; + // @ts-ignore + public room:String; + // @ts-ignore + public messageText: string; + messageArray:Array<{user:String,message:String}> = []; + private storageArray = []; + // @ts-ignore + public showScreen: boolean; + + // @ts-ignore + public password: string; + // @ts-ignore + public currentUser; + // @ts-ignore + public selectedUser; + + public userList = [ + { + id: 1, + name: 'Yuki Vachot', + login: 'yuki', + password: 'vachot1', + room: 'general' + }, + { + id: 2, + name: 'Wilfried Vallee', + login: 'wilfried', + password: 'vallee2', + room: 'general' + }, + { + id: 3, + name: 'Khai Phan', + login: 'khai', + password: 'phan3', + room: 'general' + } + ]; + + + constructor(private chatService:ChatService, + private Auth: AuthService + ) { + this.currentUser = this.Auth.sendAuth(this.currentUser); + this.userList = this.userList.filter((user) => user.password !== this.currentUser.password.toString()); + console.log(this.userList); + + this.chatService.newUserJoined() + .subscribe(data=> this.messageArray.push(data)); + + + this.chatService.userLeftRoom() + .subscribe(data=>this.messageArray.push(data)); + + this.chatService.getMessage() + .subscribe(data=>this.messageArray.push(data)); + } ngOnInit(): void { + this.chatService.getMessage() + .subscribe((data: {user: string, message: string}) => { + this.messageArray.push(data); + if (this.room) { + setTimeout( () => { + this.storageArray = this.chatService.getStorage(); + //@ts-ignore + const storeIndex = this.storageArray.findIndex((storage) => storage.room === this.room); + //@ts-ignore + this.messageArray = this.storageArray[storeIndex].chats; + }, 500); + } + }); + } + selectUserHandler(password: string): void { + this.selectedUser = this.userList.find(user => user.password === password); + this.room = this.selectedUser.room[this.currentUser.id]; + this.messageArray = []; + + this.storageArray = this.chatService.getStorage(); + // @ts-ignore + const storeIndex = this.storageArray.findIndex((storage) => storage.room === this.room); + + if (storeIndex > -1) { + // @ts-ignore + this.messageArray = this.storageArray[storeIndex].chats; + } + + // @ts-ignore + this.join(this.currentUser.name, this.room); + } + + join(username: string, room: string): void { + this.chatService.joinRoom({user: username, room: room}); + } + + sendMessage() + { + this.chatService.sendMessage({user:this.user, room:this.room, message:this.messageText}); + + this.storageArray = this.chatService.getStorage(); + // @ts-ignore + const storeIndex = this.storageArray.findIndex((storage) => storage.room === this.room); + + if (storeIndex > -1) { + // @ts-ignore + this.storageArray[storeIndex].chats.push({ + user: this.currentUser.name, + message: this.messageText + }) + } else { + const updateStorage = { + room: this.room, + chats: [{ + user: this.currentUser.name, + message: this.messageText + }] + }; + // @ts-ignore + this.storageArray.push(updateStorage); + } + this.chatService.setStorage(this.storageArray); + this.messageText = ''; + } + + + leave(){ + this.chatService.leaveRoom({user:this.user, room:this.room}); + } + + } diff --git a/frontend/src/app/login/login.component.html b/frontend/src/app/login/login.component.html index c5ab6b9..403c3a5 100644 --- a/frontend/src/app/login/login.component.html +++ b/frontend/src/app/login/login.component.html @@ -1,23 +1,28 @@