Implement layout reversal as per #336

- compactLayout() now reverses the changes made by fluidLayout, synchtubeLayout, hdLayout
This commit is contained in:
calzoneman 2014-03-29 16:57:53 -05:00
parent 43be6402a0
commit a484b6c6a1
1 changed files with 50 additions and 0 deletions

View File

@ -688,6 +688,7 @@ function applyOpts() {
hdLayout(); hdLayout();
break; break;
default: default:
compactLayout();
break; break;
} }
@ -1414,6 +1415,55 @@ function addChatMessage(data) {
/* layouts */ /* layouts */
function compactLayout() {
/* Undo synchtube layout */
if ($("body").hasClass("synchtube")) {
$("#chatwrap").detach().insertBefore($("#videowrap"));
$("#leftcontrols").detach().insertBefore($("#rightcontrols"));
$("#leftpane").detach().insertBefore($("#rightpane"));
$("#userlist").css("float", "left");
}
/* Undo fluid layout */
$(".container-fluid").removeClass("container-fluid").addClass("container");
/* Undo HD layout */
if ($("body").hasClass("hd")) {
$("#drinkbar").detach().removeClass().addClass("col-lg-12 col-md-12")
.appendTo("#drinkbarwrap");
$("#chatwrap").detach().removeClass().addClass("col-lg-5 col-md-5")
.appendTo("#main");
$("#videowrap").detach().removeClass().addClass("col-lg-7 col-md-7")
.appendTo("#main");
$("#leftcontrols").detach().removeClass().addClass("col-lg-5 col-md-5")
.prependTo("#controlsrow");
$("#plcontrol").detach().appendTo("#rightcontrols");
$("#videocontrols").detach().appendTo("#rightcontrols");
$("#playlistrow").prepend('<div id="leftpane" class="col-lg-5 col-md-5" />');
$("#leftpane").append('<div id="leftpane-inner" class="row" />');
$("#pollwrap").detach().removeClass().addClass("col-lg-12 col-md-12")
.appendTo("#leftpane-inner");
$("#playlistmanagerwrap").detach().removeClass().addClass("col-lg-12 col-md-12")
.css("margin-top", "10px")
.appendTo("#leftpane-inner");
$("#rightpane").detach().removeClass().addClass("col-lg-7 col-md-7")
.appendTo("#playlistrow");
$("nav").addClass("navbar-fixed-top");
$("#mainpage").css("padding-top", "60px");
$("#queue").css("max-height", "500px");
$("#messagebuffer, #userlist").css("max-height", "");
$("body").removeClass("hd");
}
setTimeout(resizeStuff, 500);
}
function fluidLayout() { function fluidLayout() {
$(".container").removeClass("container").addClass("container-fluid"); $(".container").removeClass("container").addClass("container-fluid");
$("footer .container-fluid").removeClass("container-fluid").addClass("container"); $("footer .container-fluid").removeClass("container-fluid").addClass("container");