From 7310dabedfd9b6ba48b2f48e5e5f966fcf2a958c Mon Sep 17 00:00:00 2001
From: calzoneman <calzoneman@gmail.com>
Date: Wed, 12 Nov 2014 19:56:29 -0600
Subject: [PATCH] CSS fixes

---
 templates/channeloptions.jade |  6 ++++--
 templates/useroptions.jade    |  5 +++--
 www/css/cytube.css            |  8 ++++++++
 www/js/ui.js                  | 12 ------------
 www/js/util.js                | 10 ++++++----
 5 files changed, 21 insertions(+), 20 deletions(-)

diff --git a/templates/channeloptions.jade b/templates/channeloptions.jade
index 92a6e95b..9aed37e7 100644
--- a/templates/channeloptions.jade
+++ b/templates/channeloptions.jade
@@ -9,8 +9,9 @@ mixin rcheckbox(id, label)
   .form-group
     .col-sm-8.col-sm-offset-4
       .checkbox
-        label.control-label(for=id)= label
+        label(for=id)
           input(type="checkbox", id=id)
+          = label
 
 mixin textbox(id, label, placeholder)
   .form-group
@@ -32,8 +33,9 @@ mixin rcheckbox-auto(id, label)
   .form-group
     .col-sm-8.col-sm-offset-4
       .checkbox
-        label.control-label(for=id)= label
+        label(for=id)
           input.cs-checkbox(type="checkbox", id=id)
+          = label
 
 mixin textbox-auto(id, label, placeholder)
   .form-group
diff --git a/templates/useroptions.jade b/templates/useroptions.jade
index d33607ef..9726aeef 100644
--- a/templates/useroptions.jade
+++ b/templates/useroptions.jade
@@ -9,8 +9,9 @@ mixin rcheckbox(id, label)
   .form-group
     .col-sm-8.col-sm-offset-4
       .checkbox
-        label.control-label(for=id)= label
+        label(for=id)
           input(type="checkbox", id=id)
+          = label
 
 mixin textbox(id, label, placeholder)
   .form-group
@@ -77,7 +78,7 @@ mixin us-playback
       mixin rcheckbox("us-playlistbuttons", "Hide playlist buttons by default")
       mixin rcheckbox("us-oldbtns", "Old style playlist buttons")
       .form-group
-        label.control-label.col-sm-4(for="#us-default-quality") Default YouTube/Vimeo/Dailymotion quality
+        label.control-label.col-sm-4(for="#us-default-quality") Quality Preference
         .col-sm-8
           select#us-default-quality.form-control
             option(value="auto") Auto
diff --git a/www/css/cytube.css b/www/css/cytube.css
index 61ba204e..89b99cfd 100644
--- a/www/css/cytube.css
+++ b/www/css/cytube.css
@@ -590,3 +590,11 @@ table td {
     max-width: 200px;
     word-wrap: break-word;
 }
+
+#cs-chatfilters table .form-group {
+    max-width: 25%;
+}
+
+#cs-chatfilters table .form-group > input {
+    max-width: 100%;
+}
diff --git a/www/js/ui.js b/www/js/ui.js
index eece1f62..19026ca8 100644
--- a/www/js/ui.js
+++ b/www/js/ui.js
@@ -766,12 +766,6 @@ applyOpts();
         });
 
         mr.observe($("#videowrap").find(".embed-responsive")[0], { childList: true });
-
-        var mr2 = new MutationObserver(function (records) {
-            handleVideoResize();
-        });
-
-        mr2.observe(document.body, { attributes: true, attributeFilter: ["class"] });
     } else {
         /*
          * DOMNodeInserted is deprecated.  This code is here only as a fallback
@@ -780,11 +774,5 @@ applyOpts();
         $("#videowrap").find(".embed-responsive")[0].addEventListener("DOMNodeInserted", function (ev) {
             if (ev.target.id === "ytapiplayer") handleVideoResize();
         });
-
-        document.body.addEventListener("DOMAttrModified", function (ev) {
-            if (ev.target !== document.body || ev.attrName !== "class") return;
-            console.log(ev);
-            handleVideoResize();
-        });
     }
 })();
diff --git a/www/js/util.js b/www/js/util.js
index acbe0e92..f7146e48 100644
--- a/www/js/util.js
+++ b/www/js/util.js
@@ -1532,12 +1532,14 @@ function compactLayout() {
     }
 
     $("body").addClass("compact");
+    handleVideoResize();
 }
 
 function fluidLayout() {
     $(".container").removeClass("container").addClass("container-fluid");
     $("footer .container-fluid").removeClass("container-fluid").addClass("container");
     $("body").addClass("fluid");
+    handleVideoResize();
 }
 
 function synchtubeLayout() {
@@ -1601,6 +1603,7 @@ function hdLayout() {
     $("#mainpage").css("padding-top", "0");
 
     $("body").addClass("hd");
+    handleVideoResize();
 }
 
 function chatOnly() {
@@ -1644,7 +1647,7 @@ function handleWindowResize() {
 }
 
 function handleVideoResize() {
-    console.trace();
+    //console.trace();
     var intv, ticks = 0;
     var resize = function () {
         if (++ticks > 10) clearInterval(intv);
@@ -1652,7 +1655,7 @@ function handleVideoResize() {
         clearInterval(intv);
 
         var height = $("#ytapiplayer").height() - $("#chatline").outerHeight() - 2;
-        //console.log(height);
+        console.log(height);
         $("#messagebuffer").height(height);
         $("#userlist").height(height);
 
@@ -2267,8 +2270,7 @@ function formatCSChatFilterList() {
                 .appendTo(wrap);
             var addTextbox = function (placeholder) {
                 var div = $("<div/>").addClass("form-group").appendTo(form)
-                    .css("margin-right", "10px")
-                    .css("max-width", "25%");
+                    .css("margin-right", "10px");
                 var input = $("<input/>").addClass("form-control")
                     .attr("type", "text")
                     .attr("placeholder", placeholder)