From 4c54c270d2f04fe817e2e8fa953e73bb87b0c2d6 Mon Sep 17 00:00:00 2001
From: rainbow napkin <ourforest@tuta.io>
Date: Wed, 9 Apr 2025 21:09:04 -0400
Subject: [PATCH] Fixed chat width breaking when video hidden.

---
 www/js/channel/chat.js   | 31 ++++++++++++++++++++++++++++++-
 www/js/channel/player.js |  9 +++------
 www/js/utils.js          | 11 ++++++++++-
 3 files changed, 43 insertions(+), 8 deletions(-)

diff --git a/www/js/channel/chat.js b/www/js/channel/chat.js
index 305c88a..3ea0b8e 100644
--- a/www/js/channel/chat.js
+++ b/www/js/channel/chat.js
@@ -295,9 +295,14 @@ class chatBox{
     }
 
     resizeAspect(event){
-        if(this.aspectLock){
+        const playerHidden = this.client.player.playerDiv.style.display == "none";
+
+        //If the aspect is locked and the player is hidden
+        if(this.aspectLock && !playerHidden){
             this.sizeToAspect();
+        //Otherwise
         }else{
+            //Fix the clickDragger on userlist
             this.client.userList.clickDragger.fixCutoff();
         }
     }
@@ -334,4 +339,28 @@ class chatBox{
             this.client.player.hideVideoIcon.style.display = "none";
         }
     }
+
+    handleVideoToggle(show){
+        //If we're enabling the video
+        if(show){
+            //Show hide chat icon
+            this.hideChatIcon.style.display = "flex";
+
+            //Re-enable the click dragger
+            this.clickDragger.enabled = true;
+
+            //Lock the chat to aspect ratio of the video, to make sure the chat width isn't breaking shit
+            this.lockAspect();
+        //If we're disabling the video
+        }else{
+            //Hide hide hide hide hide hide chat icon
+            this.hideChatIcon.style.display = "none";
+
+            //Need to clear the width from the split, or else it doesn't display properly
+            this.chatPanel.style.flexBasis = "100%";
+
+            //Disable the click dragger
+            this.clickDragger.enabled = false;
+        }
+    }
 }
\ No newline at end of file
diff --git a/www/js/channel/player.js b/www/js/channel/player.js
index 36014bc..150bab0 100644
--- a/www/js/channel/player.js
+++ b/www/js/channel/player.js
@@ -224,16 +224,13 @@ class player{
         if(show){
             this.playerDiv.style.display = "flex";
             this.showVideoIcon.style.display = "none";
-            this.client.chatBox.hideChatIcon.style.display = "flex";
-            //Lock the chat to aspect ratio of the video, to make sure the chat width isn't breaking shit
-            this.client.chatBox.lockAspect();
         }else{
             this.playerDiv.style.display = "none";
             this.showVideoIcon.style.display = "flex";
-            this.client.chatBox.hideChatIcon.style.display = "none";
-            //Need to clear the width from the split, or else it doesn't display properly
-            this.client.chatBox.chatPanel.style.flexBasis = "100%";
         }
+
+        //Tell chatbox to handle this shit
+        this.client.chatBox.handleVideoToggle(show);
     }
 
     toggleCinemaMode(cinema = !this.navBar.checkVisibility()){
diff --git a/www/js/utils.js b/www/js/utils.js
index 32ba304..923166d 100644
--- a/www/js/utils.js
+++ b/www/js/utils.js
@@ -483,6 +483,9 @@ class canopyUXUtils{
             //Whether or not click dragger is in a flexbox
             this.flex = flex;
 
+            //Create boolean to allow parent classes to suspend click dragging behavior
+            this.enabled = true;
+
             //Setup our event listeners
             this.setupInput();
         } 
@@ -514,7 +517,7 @@ class canopyUXUtils{
         }
 
         drag(event){
-            if(this.dragLock){
+            if(this.dragLock && this.enabled){
                 if(this.leftHandle){
                     //get difference between mouse and right edge of element
                     var difference = this.element.getBoundingClientRect().right - event.clientX;
@@ -558,6 +561,12 @@ class canopyUXUtils{
 
 
         fixCutoff(standalone = true, pageBreak){
+            //If the click dragger isn't enable
+            if(!this.enabled){
+                //FUCK OFF AND DIE
+                return;
+            }
+
             //If we have no pagebreak
             if(pageBreak == null){
                 //If we have a document body