From 6fa293aba45ac1b0aa0a1934e17ef2e51f0e098f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kasper=20Rynning-T=C3=B8nnesen?= <kasper@kasperrt.no>
Date: Thu, 28 Jun 2018 16:51:31 +0200
Subject: [PATCH] Fixed scaling issues with chat and soundcloud players on
 resizing

---
 server/public/assets/css/style.css   | 4 ++--
 server/public/assets/js/functions.js | 9 ++++++++-
 server/public/assets/js/listeners.js | 6 +++++-
 server/public/assets/js/player.js    | 7 +++++++
 4 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/server/public/assets/css/style.css b/server/public/assets/css/style.css
index ff4a3956..aa81a9b7 100755
--- a/server/public/assets/css/style.css
+++ b/server/public/assets/css/style.css
@@ -249,7 +249,7 @@ margin: auto;
 }
 
 #chat-container, #suggestions{
-    height:calc(100vh - 48px - 64px) !important;
+    height:calc(100vh - 48px - 64px);
 }
 
 .channel-info-all-chat {
@@ -2914,7 +2914,7 @@ nav ul li:hover, nav ul li.active {
 
 
     #chat-container {
-        height: calc(100vh - 48px - 64px - 120px) !important;
+        height: calc(100vh - 48px - 64px - 120px);
         margin-bottom: 18px;
     }
 
diff --git a/server/public/assets/js/functions.js b/server/public/assets/js/functions.js
index efb091c4..fa763511 100644
--- a/server/public/assets/js/functions.js
+++ b/server/public/assets/js/functions.js
@@ -784,10 +784,17 @@ function resizePlaylistPlaying(playing) {
     if(window.innerWidth < 601) {
         var subtract = 0;
         if(playing) {
-            Helper.css("#chat-bar", "height", window.innerHeight - 246 - subtract + "px");
+            var height = window.innerHeight - 246 - 170 - subtract;
+            Helper.css("#chat-bar", "height", height + "px");
+            Helper.css("#channelchat", "height", height - 130 + "px");
+            Helper.css("#all_chat", "height", height - 130 + "px");
+            Helper.css("#chat-container", "height", height + "px");
             subtract = 200;
         } else {
             document.querySelector("#chat-bar").style.height = "";
+            document.querySelector("#channelchat").style.height = "";
+            document.querySelector("#all_chat").style.height = "";
+            document.querySelector("#chat-container").style.height = "";
         }
         Helper.css("#wrapper", "height", window.innerHeight - 246 - subtract + "px");
         var temp_fit = Math.round(Helper.computedStyle("#wrapper", "height") / 71)+1;
diff --git a/server/public/assets/js/listeners.js b/server/public/assets/js/listeners.js
index 43e54fe9..5acf35da 100755
--- a/server/public/assets/js/listeners.js
+++ b/server/public/assets/js/listeners.js
@@ -1280,8 +1280,12 @@ window.addEventListener("resize", function(){
     if(chan && !Helper.mobilecheck()){
         if(window.innerWidth > 600 && document.querySelector("#wrapper").style.height != "") {
             document.querySelector("#wrapper").style.height = "";
+           document.querySelector("#chat-bar").style.height = "";
+           document.querySelector("#channelchat").style.height = "";
+           document.querySelector("#all_chat").style.height = "";
+           document.querySelector("#chat-container").style.height = "";
         } else if(window.innerWidth < 601) {
-            resizePlaylistPlaying(Player.player.getPlayerState() == YT.PlayerState.PLAYING);
+            resizePlaylistPlaying(Player.player.getPlayerState() == YT.PlayerState.PLAYING || Player.soundcloud_player.isPlaying());
             return;
         }
         var temp_fit = Math.round(Helper.computedStyle("#wrapper", "height") / 71)+1;
diff --git a/server/public/assets/js/player.js b/server/public/assets/js/player.js
index aa14da43..5913aa5e 100755
--- a/server/public/assets/js/player.js
+++ b/server/public/assets/js/player.js
@@ -626,6 +626,9 @@ var Player = {
             end_programmatically = false;
         } else {
             was_stopped = true;
+            if(!embed && !client && window.location.pathname != "/") {
+                resizePlaylistPlaying(false);
+            }
             if(!chromecastAvailable){
                 if(Helper.mobilecheck()) {
                     Helper.css("#playpause", "visibility", "visible");
@@ -665,6 +668,10 @@ var Player = {
 
             //}
         }
+        if(!embed && !client && window.location.pathname != "/") {
+            resizePlaylistPlaying(true);
+        }
+
         Helper.css("#playpause", "visibility", "visible");
         Helper.css("#playpause", "pointer-events", "all");
         playing = true;