From 247862355cafa15ae64ae99f281e23d419853484 Mon Sep 17 00:00:00 2001
From: calzoneman <calzoneman@gmail.com>
Date: Thu, 20 Jun 2013 16:50:12 -0400
Subject: [PATCH] Add option for old-style playlist buttons (#174)

---
 www/assets/js/data.js | 33 ++++++++++----------
 www/assets/js/util.js | 70 ++++++++++++++++++++++++++++---------------
 2 files changed, 64 insertions(+), 39 deletions(-)

diff --git a/www/assets/js/data.js b/www/assets/js/data.js
index bee7080f..9a6b1c68 100644
--- a/www/assets/js/data.js
+++ b/www/assets/js/data.js
@@ -34,8 +34,10 @@ var CHANNEL = {
 
 var PLAYER = false;
 var FLUIDLAYOUT = false;
-var VWIDTH = $("#ytapiplayer").parent().css("width").replace("px", "");
-var VHEIGHT = ""+parseInt(parseInt(VWIDTH) * 9 / 16);
+if($("ytapiplayer").length > 0) {
+    var VWIDTH = $("#ytapiplayer").parent().css("width").replace("px", "");
+    var VHEIGHT = ""+parseInt(parseInt(VWIDTH) * 9 / 16);
+}
 var POSITION = -1;
 var socket = {
     emit: function() {
@@ -77,19 +79,20 @@ function getOrDefault(k, def) {
 }
 
 var USEROPTS = {
-    theme           : getOrDefault("theme", "default"),
-    css             : getOrDefault("css", ""),
-    layout          : getOrDefault("layout", "default"),
-    synch           : getOrDefault("synch", true),
-    hidevid         : getOrDefault("hidevid", false),
-    show_timestamps : getOrDefault("show_timestamps", true),
-    modhat          : getOrDefault("modhat", false),
-    blink_title     : getOrDefault("blink_title", false),
-    sync_accuracy   : getOrDefault("sync_accuracy", 2),
-    chatbtn         : getOrDefault("chatbtn", false),
-    altsocket       : getOrDefault("altsocket", false),
-    joinmessage     : getOrDefault("joinmessage", true),
-    qbtn_hide       : getOrDefault("qbtn_hide", false)
+    theme                : getOrDefault("theme", "default"),
+    css                  : getOrDefault("css", ""),
+    layout               : getOrDefault("layout", "default"),
+    synch                : getOrDefault("synch", true),
+    hidevid              : getOrDefault("hidevid", false),
+    show_timestamps      : getOrDefault("show_timestamps", true),
+    modhat               : getOrDefault("modhat", false),
+    blink_title          : getOrDefault("blink_title", false),
+    sync_accuracy        : getOrDefault("sync_accuracy", 2),
+    chatbtn              : getOrDefault("chatbtn", false),
+    altsocket            : getOrDefault("altsocket", false),
+    joinmessage          : getOrDefault("joinmessage", true),
+    qbtn_hide            : getOrDefault("qbtn_hide", false),
+    qbtn_idontlikechange : getOrDefault("qbtn_idontlikechange", false)
 };
 
 var Rank = {
diff --git a/www/assets/js/util.js b/www/assets/js/util.js
index dcb3fee8..9f7f0d62 100644
--- a/www/assets/js/util.js
+++ b/www/assets/js/util.js
@@ -261,17 +261,32 @@ function addQueueButtons(li) {
             .appendTo(menu);
     }
 
-    if(USEROPTS.qbtn_hide)
+    if(USEROPTS.qbtn_hide && !USEROPTS.qbtn_idontlikechange)
         menu.hide();
 
-    li.contextmenu(function(ev) {
-        ev.preventDefault();
-        if(menu.css("display") == "none")
-            menu.show("blind");
-        else
-            menu.hide("blind");
-        return false;
-    });
+    // I DON'T LIKE CHANGE
+    if(USEROPTS.qbtn_idontlikechange) {
+        menu.addClass("pull-left");
+        menu.detach().prependTo(li);
+        menu.find(".btn").each(function() {
+            // Clear icon
+            var icon = $(this).find("i");
+            $(this).html("");
+            icon.appendTo(this);
+        });
+        menu.find(".qbtn-play").addClass("btn-success");
+        menu.find(".qbtn-delete").addClass("btn-danger");
+    }
+    else {
+        li.contextmenu(function(ev) {
+            ev.preventDefault();
+            if(menu.css("display") == "none")
+                menu.show("blind");
+            else
+                menu.hide("blind");
+            return false;
+        });
+    }
 }
 
 function rebuildPlaylist() {
@@ -331,11 +346,17 @@ function showOptionsMenu() {
     addOption("", warn);
     $("<hr>").appendTo(form);
 
-    var qbtncontainer = $("<label/>").addClass("checkbox")
+    var hqbtncontainer = $("<label/>").addClass("checkbox")
         .text("Hide playlist buttons by default");
-    var qbtn = $("<input/>").attr("type", "checkbox").appendTo(qbtncontainer);
-    qbtn.prop("checked", USEROPTS.qbtn_hide);
-    addOption("Playlist Buttons", qbtncontainer);
+    var hqbtn = $("<input/>").attr("type", "checkbox").appendTo(hqbtncontainer);
+    hqbtn.prop("checked", USEROPTS.qbtn_hide);
+    addOption("Playlist Buttons", hqbtncontainer);
+
+    var oqbtncontainer = $("<label/>").addClass("checkbox")
+        .text("Old style playlist buttons");
+    var oqbtn = $("<input/>").attr("type", "checkbox").appendTo(oqbtncontainer);
+    oqbtn.prop("checked", USEROPTS.qbtn_idontlikechange);
+    addOption("Playlist Buttons (Old)", oqbtncontainer);
 
     var synchcontainer = $("<label/>").addClass("checkbox")
         .text("Synchronize Media");
@@ -407,17 +428,18 @@ function showOptionsMenu() {
         .appendTo(footer);
 
     submit.click(function() {
-        USEROPTS.theme           = themeselect.val();
-        USEROPTS.css             = usercss.val();
-        USEROPTS.layout          = layoutselect.val();
-        USEROPTS.synch           = synch.prop("checked");
-        USEROPTS.sync_accuracy   = parseFloat(syncacc.val()) || 2;
-        USEROPTS.hidevid         = hidevid.prop("checked");
-        USEROPTS.show_timestamps = showts.prop("checked");
-        USEROPTS.blink_title     = blink.prop("checked");
-        USEROPTS.chatbtn         = sendbtn.prop("checked");
-        USEROPTS.altsocket       = altsocket.prop("checked");
-        USEROPTS.qbtn_hide     = qbtn.prop("checked");
+        USEROPTS.theme                = themeselect.val();
+        USEROPTS.css                  = usercss.val();
+        USEROPTS.layout               = layoutselect.val();
+        USEROPTS.synch                = synch.prop("checked");
+        USEROPTS.sync_accuracy        = parseFloat(syncacc.val()) || 2;
+        USEROPTS.hidevid              = hidevid.prop("checked");
+        USEROPTS.show_timestamps      = showts.prop("checked");
+        USEROPTS.blink_title          = blink.prop("checked");
+        USEROPTS.chatbtn              = sendbtn.prop("checked");
+        USEROPTS.altsocket            = altsocket.prop("checked");
+        USEROPTS.qbtn_hide            = hqbtn.prop("checked");
+        USEROPTS.qbtn_idontlikechange = oqbtn.prop("checked");
         if(CLIENT.rank >= Rank.Moderator) {
             USEROPTS.modhat = modhat.prop("checked");
             USEROPTS.joinmessage = join.prop("checked");