From f73bb1e8c179b3d64fc7dab3cac0305eb18a28b4 Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Fri, 2 Sep 2022 18:27:25 +0200
Subject: [PATCH] [mirotalksfu] - add clean/paste Chat input txt

---
 public/css/Room.css     | 33 +++++++++++++++++++++++++++++----
 public/js/Room.js       | 10 ++++++++++
 public/js/RoomClient.js | 16 ++++++++++++++++
 public/views/Room.html  |  8 ++++++++
 4 files changed, 63 insertions(+), 4 deletions(-)

diff --git a/public/css/Room.css b/public/css/Room.css
index a2d92b6e..01db21ae 100644
--- a/public/css/Room.css
+++ b/public/css/Room.css
@@ -471,7 +471,6 @@ body {
 .chat-msger-inputarea {
     display: flex;
     padding: 10px;
-    background: #1f1e1e;
 }
 
 .chat-msger-input {
@@ -479,15 +478,41 @@ body {
     padding: 10px;
     border: none;
     border-top-left-radius: 10px;
-    background: rgb(0, 0, 0);
+    background: rgb(7 7 7);
     color: #fff;
     resize: none;
 }
 
-.chat-msger-inputarea button {
+.chat-msger-input::-webkit-scrollbar {
+    width: 5px;
+}
+
+.chat-msger-input::-webkit-scrollbar-track {
+    background: transparent;
+}
+
+.chat-msger-input::-webkit-scrollbar-thumb {
+    background: #404040;
+}
+
+/*--------------------------------------------------------------
+# Chat room buttons area
+--------------------------------------------------------------*/
+
+.chat-msger-buttons {
+    display: flex;
+    padding: 10px;
+}
+
+.chat-msger-buttons button {
     width: 32px;
 }
 
+#chatSendButton {
+    position: absolute;
+    right: 5px;
+}
+
 /*--------------------------------------------------------------
 # Chat room emoji picker
 --------------------------------------------------------------*/
@@ -495,7 +520,7 @@ body {
 emoji-picker {
     z-index: 0;
     position: absolute;
-    bottom: 70px;
+    bottom: 100px;
     width: 100%;
     height: 50%;
     --background: #16171b;
diff --git a/public/js/Room.js b/public/js/Room.js
index 422e31ef..0510cb13 100644
--- a/public/js/Room.js
+++ b/public/js/Room.js
@@ -146,6 +146,8 @@ function initClient() {
         setTippy('whiteboardEraserBtn', 'Eraser', 'top');
         setTippy('whiteboardCleanBtn', 'Clean', 'top');
         setTippy('chatMessage', 'Press enter to send', 'top-start');
+        setTippy('chatCleanTextButton', 'Clean', 'top');
+        setTippy('chatPasteButton', 'Paste', 'top');
         setTippy('chatSendButton', 'Send', 'top');
         setTippy('chatSpeechStartButton', 'Start speech recognition', 'top');
         setTippy('chatSpeechStopButton', 'Stop speech recognition', 'top');
@@ -629,6 +631,8 @@ function roomIsReady() {
     BUTTONS.main.shareButton && show(shareButton);
     show(startRecButton);
     BUTTONS.main.chatButton && show(chatButton);
+    show(chatCleanTextButton);
+    show(chatPasteButton);
     show(chatSendButton);
     show(chatEmojiButton);
     show(chatMarkdownButton);
@@ -802,6 +806,12 @@ function handleButtons() {
     chatCloseButton.onclick = () => {
         rc.toggleChat();
     };
+    chatCleanTextButton.onclick = () => {
+        rc.cleanMessage();
+    };
+    chatPasteButton.onclick = () => {
+        rc.pasteMessage();
+    };
     chatSendButton.onclick = () => {
         rc.sendMessage();
     };
diff --git a/public/js/RoomClient.js b/public/js/RoomClient.js
index 58a60fbd..7a8079b7 100644
--- a/public/js/RoomClient.js
+++ b/public/js/RoomClient.js
@@ -2029,6 +2029,22 @@ class RoomClient {
         this.getId('chatEmojiButton').style.color = this.isChatEmojiOpen ? '#FFFF00' : '#FFFFFF';
     }
 
+    cleanMessage() {
+        chatMessage.value = '';
+    }
+
+    pasteMessage() {
+        navigator.clipboard
+            .readText()
+            .then((text) => {
+                chatMessage.value = text;
+                isChatPasteTxt = true;
+            })
+            .catch((err) => {
+                console.error('Failed to read clipboard contents: ', err);
+            });
+    }
+
     sendMessage() {
         if (!this.thereIsParticipants()) {
             chatMessage.value = '';
diff --git a/public/views/Room.html b/public/views/Room.html
index 47616c2b..224f7111 100644
--- a/public/views/Room.html
+++ b/public/views/Room.html
@@ -367,6 +367,8 @@
                         class="chat-msger-input"
                         placeholder="💬 Enter your message..."
                     ></textarea>
+                </div>
+                <div class="chat-msger-buttons">
                     <button id="chatEmojiButton" class="hidden">
                         <i class="fas fa-smile"></i>
                     </button>
@@ -382,6 +384,12 @@
                     <button id="chatSpeechStopButton" class="hidden">
                         <i class="fas fa-microphone"></i>
                     </button>
+                    <button id="chatCleanTextButton" class="hidden">
+                        <i class="fas fa-trash"></i>
+                    </button>
+                    <button id="chatPasteButton" class="hidden">
+                        <i class="fas fa-paste"></i>
+                    </button>
                     <button id="chatSendButton" class="hidden">
                         <i class="fas fa-paper-plane"></i>
                     </button>