From 2db08f913d7123a4918cb5099dcec6e9af22101c Mon Sep 17 00:00:00 2001
From: ian ramzy <ianramzy@gmail.com>
Date: Sun, 29 Mar 2020 22:41:15 -0400
Subject: [PATCH] chat icon/text is now dynamic

---
 public/chat.html  |  6 +++---
 public/js/chat.js | 25 ++++++++++++++++++++++---
 2 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/public/chat.html b/public/chat.html
index 128e24e..2417b1f 100644
--- a/public/chat.html
+++ b/public/chat.html
@@ -107,10 +107,10 @@
         <div class="HoverState" id="caption-text">Start Live Caption</div>
     </div>
     <div class="buttonContainer">
-        <button class="hoverButton" onclick="{$('#entire-chat').fadeToggle();}">
-            <i class="fas fa-comment-alt fa-xs"></i>
+        <button class="hoverButton" onclick="{toggleChat()}">
+            <i id="chat-icon" class="fas fa-comment fa-xs"></i>
         </button>
-        <div class="HoverState">Open Chat</div>
+        <div class="HoverState" id="chat-text">Show Chat</div>
     </div>
     <div class="buttonContainer">
         <button class="hoverButton" id="pip-button" onclick="{togglePictureInPicture()}">
diff --git a/public/js/chat.js b/public/js/chat.js
index 9811670..13cd97f 100644
--- a/public/js/chat.js
+++ b/public/js/chat.js
@@ -355,7 +355,6 @@ function muteMicrophone() {
 
 function pauseVideo() {
     var paused = VideoChat.localStream.getVideoTracks()[0].enabled;
-    alert(paused);
     VideoChat.localStream.getVideoTracks()[0].enabled = !paused;
     const micIcon = document.getElementById("video-icon");
     const micText = document.getElementById("video-text");
@@ -585,8 +584,28 @@ input.addEventListener('keypress', function (event) {
 socket.on('chat message', function (msg) {
     $('.chat-messages').append('<div class="message-item moderator"><div class="message-bloc"><div class="message">' + msg + '</div></div></div>');
     $('#chat-zone').scrollTop($('#chat-zone')[0].scrollHeight);
-    $('#entire-chat').fadeIn();
+    if ($('#entire-chat').is(":hidden")){
+        toggleChat()
+    }
 });
+
+
+function toggleChat() {
+    var entireChat =  $('#entire-chat');
+    var chatIcon =  document.getElementById("chat-icon");
+    var chatText = $('#chat-text');
+    if (entireChat.is(":visible")){
+        entireChat.fadeOut();
+        chatText.text("Show Chat");
+        chatIcon.classList.remove("fa-comment-slash");
+        chatIcon.classList.add("fa-comment");
+    } else {
+        entireChat.fadeIn();
+        chatText.text("Hide Chat");
+        chatIcon.classList.remove("fa-comment");
+        chatIcon.classList.add("fa-comment-slash");
+    }
+}
 // Chat
 
 
@@ -599,7 +618,7 @@ function togglePictureInPicture() {
                 .catch(error => {
                     logIt("Error exiting pip.");
                     logIt(error);
-                })
+                });
         } else {
             pipVideo.requestPictureInPicture()
                 .catch(error => {