Fix feedback moufmouf

front/dist/resources/style/style.css

@@ -840,7 +840,7 @@ div.modal-report-user{
     position: absolute;
     height: calc(100% - 360px);
     overflow-x: hidden;
-    overflow-y: scroll;
+    overflow-y: auto;
     max-width: calc(100% - 40px);
     width: calc(100% - 40px);
 }
@@ -887,6 +887,7 @@ div.modal-report-user{
     color: white;
     border-radius: 15px;
     border: none;
+    padding: 6px;
 }
 
 .discussion .send-message img{

front/src/Phaser/Game/GameScene.ts

@@ -387,6 +387,7 @@ export class GameScene extends ResizableScene implements CenterListener {
 
         //create input to move
         this.userInputManager = new UserInputManager(this);
+        mediaManager.setUserInputManager(this.userInputManager);
 
         //notify game manager can to create currentUser in map
         this.createCurrentPlayer();

front/src/WebRtc/DiscussionManager.ts

@@ -1,5 +1,6 @@
 import {HtmlUtils} from "./HtmlUtils";
 import {MediaManager, ReportCallback, UpdatedLocalStreamCallback} from "./MediaManager";
+import {UserInputManager} from "../Phaser/UserInput/UserInputManager";
 export type SendMessageCallback = (message:string) => void;
 
 export class DiscussionManager {
@@ -17,6 +18,8 @@ export class DiscussionManager {
 
     private sendMessageCallBack : Map<number|string, SendMessageCallback> = new Map<number|string, SendMessageCallback>();
 
+    private userInputManager?: UserInputManager;
+
     constructor(private mediaManager: MediaManager, name: string) {
         this.mainContainer = HtmlUtils.getElementByIdOrFail<HTMLDivElement>('main-container');
         this.createDiscussPart(name);
@@ -31,15 +34,13 @@ export class DiscussionManager {
         buttonCloseDiscussion.classList.add('close-btn');
         buttonCloseDiscussion.innerHTML = `<img src="resources/logos/close.svg"/>`;
         buttonCloseDiscussion.addEventListener('click', () => {
-            this.activeDiscussion = false;
+            this.hideDiscussion();
-            this.divDiscuss?.classList.remove('active');
             this.showButtonDiscussionBtn();
         });
         this.buttonActiveDiscussion.classList.add('active-btn');
         this.buttonActiveDiscussion.innerHTML = `<img src="resources/logos/discussion.svg"/>`;
         this.buttonActiveDiscussion.addEventListener('click', () => {
-            this.activeDiscussion = true;
+            this.showDiscussion();
-            this.divDiscuss?.classList.add('active');
             this.hideButtonDiscussionBtn();
         });
         this.divDiscuss.appendChild(buttonCloseDiscussion);
@@ -69,6 +70,11 @@ export class DiscussionManager {
         inputMessage.addEventListener('keyup', (event: KeyboardEvent) => {
             if (event.key === 'Enter') {
                 event.preventDefault();
+                if(inputMessage.value === null
+                    || inputMessage.value === ''
+                    || inputMessage.value === undefined) {
+                    return;
+                }
                 this.addMessage(name, inputMessage.value, true);
                 for(const callback of this.sendMessageCallBack.values()) {
                     callback(inputMessage.value);
@@ -117,6 +123,8 @@ export class DiscussionManager {
             reportBanUserAction.addEventListener('click', () => {
                 if(reportCallback) {
                     this.mediaManager.showReportModal(`${userId}`, name ?? '', reportCallback);
+                }else{
+                    console.info('report feature is not activated!');
                 }
             });
             divParticipant.appendChild(reportBanUserAction);
@@ -193,7 +201,27 @@ export class DiscussionManager {
         this.buttonActiveDiscussion?.classList.add('active');
     }
 
+    private showDiscussion(){
+        this.activeDiscussion = true;
+        if(this.userInputManager) {
+            this.userInputManager.clearAllInputKeyboard();
+        }
+        this.divDiscuss?.classList.add('active');
+    }
+
+    private hideDiscussion(){
+        this.activeDiscussion = false;
+        if(this.userInputManager) {
+            this.userInputManager.initKeyBoardEvent();
+        }
+        this.divDiscuss?.classList.remove('active');
+    }
+
     private hideButtonDiscussionBtn(){
         this.buttonActiveDiscussion?.classList.remove('active');
     }
+
+    public setUserInputManager(userInputManager : UserInputManager){
+        this.userInputManager = userInputManager;
+    }
 }

front/src/WebRtc/MediaManager.ts

@@ -1,6 +1,7 @@
 import {DivImportance, layoutManager} from "./LayoutManager";
 import {HtmlUtils} from "./HtmlUtils";
 import {DiscussionManager, SendMessageCallback} from "./DiscussionManager";
+import {UserInputManager} from "../Phaser/UserInput/UserInputManager";
 declare const navigator:any; // eslint-disable-line @typescript-eslint/no-explicit-any
 
 const videoConstraint: boolean|MediaTrackConstraints = {
@@ -41,6 +42,8 @@ export class MediaManager {
 
     private discussionManager: DiscussionManager;
 
+    private userInputManager?: UserInputManager;
+
     constructor() {
 
         this.myCamVideo = HtmlUtils.getElementByIdOrFail<HTMLVideoElement>('myCamVideo');
@@ -93,7 +96,7 @@ export class MediaManager {
             //update tracking
         });
 
-        this.discussionManager = new DiscussionManager(this,'test');
+        this.discussionManager = new DiscussionManager(this,'');
     }
 
     public onUpdateLocalStream(callback: UpdatedLocalStreamCallback): void {
@@ -572,20 +575,24 @@ export class MediaManager {
     }
 
     public removeParticipant(userId: number|string){
-        this.discussionManager.removeParticipant(userId)
+        this.discussionManager.removeParticipant(userId);
     }
 
     public addNewMessage(name: string, message: string, isMe: boolean = false){
-        this.discussionManager.addMessage(name, message, isMe)
+        this.discussionManager.addMessage(name, message, isMe);
     }
 
     public addSendMessageCallback(userId: string|number, callback: SendMessageCallback){
-        this.discussionManager.onSendMessageCallback(userId, callback)
+        this.discussionManager.onSendMessageCallback(userId, callback);
     }
 
     get activatedDiscussion(){
         return this.discussionManager.activatedDiscussion;
     }
+
+    public setUserInputManager(userInputManager : UserInputManager){
+        this.discussionManager.setUserInputManager(userInputManager);
+    }
 }
 
 export const mediaManager = new MediaManager();