Finish refactoring options menu

This commit is contained in:
calzoneman 2013-08-31 12:37:37 -05:00
parent 7ae76bbe31
commit 3b5f6c64ef

View file

@ -497,7 +497,9 @@ function rebuildPlaylist() {
}
/* menus */
function showOpts() {
/* user settings menu */
function showOptionsMenu() {
hidePlayer();
var modal = $("<div/>").addClass("modal hide fade")
.appendTo($("body"));
@ -676,209 +678,39 @@ function showOpts() {
$("#uopt-btn-general").click();
$("#uopt-btn-save").click(function () {
});
});
modal.on("hidden", function () {
unhidePlayer();
modal.remove();
});
modal.modal();
}
function showOptionsMenu() {
hidePlayer();
var modal = $("<div/>").addClass("modal hide fade")
.appendTo($("body"));
var head = $("<div/>").addClass("modal-header")
.appendTo(modal);
$("<button/>").addClass("close")
.attr("data-dismiss", "modal")
.attr("aria-hidden", "true")
.appendTo(head)[0].innerHTML = "&times;";
$("<h3/>").text("User Options").appendTo(head);
var body = $("<div/>").addClass("modal-body").appendTo(modal);
var form = $("<form/>").addClass("form-horizontal")
.appendTo(body);
function addOption(lbl, thing) {
var g = $("<div/>").addClass("control-group").appendTo(form);
$("<label/>").addClass("control-label").text(lbl).appendTo(g);
var c = $("<div/>").addClass("controls").appendTo(g);
thing.appendTo(c);
}
var themeselect = $("<select/>");
$("<option/>").attr("value", "default").text("Default").appendTo(themeselect);
$("<option/>").attr("value", "assets/css/darkstrap.css").text("Dark").appendTo(themeselect);
$("<option/>").attr("value", "assets/css/semidark.css").text("Semidark").appendTo(themeselect);
themeselect.val(USEROPTS.theme);
addOption("Theme", themeselect);
var usercss = $("<input/>").attr("type", "text")
.attr("placeholder", "Stylesheet URL");
usercss.val(USEROPTS.css);
addOption("User CSS", usercss);
var layoutselect = $("<select/>");
$("<option/>").attr("value", "default").text("Compact")
.appendTo(layoutselect);
$("<option/>").attr("value", "synchtube").text("Synchtube")
.appendTo(layoutselect);
$("<option/>").attr("value", "fluid").text("Fluid")
.appendTo(layoutselect);
layoutselect.val(USEROPTS.layout);
addOption("Layout", layoutselect);
var warn = $("<p/>").addClass("text-error")
.text("Changing layouts may require a refresh")
addOption("", warn);
$("<hr>").appendTo(form);
var nocsscontainer = $("<label/>").addClass("checkbox")
.text("Ignore channel CSS");
var nocss = $("<input/>").attr("type", "checkbox").appendTo(nocsscontainer);
nocss.prop("checked", USEROPTS.ignore_channelcss);
addOption("Channel CSS", nocsscontainer);
var nojscontainer = $("<label/>").addClass("checkbox")
.text("Ignore channel JS");
var nojs = $("<input/>").attr("type", "checkbox").appendTo(nojscontainer);
nojs.prop("checked", USEROPTS.ignore_channeljs);
addOption("Channel JS", nojscontainer);
$("<hr>").appendTo(form);
var hqbtncontainer = $("<label/>").addClass("checkbox")
.text("Hide playlist buttons by default");
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");
var synch = $("<input/>").attr("type", "checkbox").appendTo(synchcontainer);
synch.prop("checked", USEROPTS.synch);
addOption("Synch", synchcontainer);
var syncacc = $("<input/>").attr("type", "text")
.attr("placeholder", "Seconds");
syncacc.val(USEROPTS.sync_accuracy);
addOption("Synch Accuracy", syncacc);
var wmcontainer = $("<label/>").addClass("checkbox")
.text("Allow transparency over video");
var wmodetrans = $("<input/>").attr("type", "checkbox")
.appendTo(wmcontainer);
wmodetrans.prop("checked", USEROPTS.wmode_transparent);
addOption("Transparent wmode", wmcontainer);
var vidcontainer = $("<label/>").addClass("checkbox")
.text("Hide Video");
var hidevid = $("<input/>").attr("type", "checkbox").appendTo(vidcontainer);
hidevid.prop("checked", USEROPTS.hidevid);
addOption("Hide Video", vidcontainer);
$("<hr>").appendTo(form);
var tscontainer = $("<label/>").addClass("checkbox")
.text("Show timestamps in chat");
var showts = $("<input/>").attr("type", "checkbox").appendTo(tscontainer);
showts.prop("checked", USEROPTS.show_timestamps);
addOption("Show timestamps", tscontainer);
var srcontainer = $("<label/>").addClass("checkbox")
.text("Sort userlist by rank");
var sr = $("<input/>").attr("type", "checkbox").appendTo(srcontainer);
sr.prop("checked", USEROPTS.sort_rank);
addOption("Userlist sort", srcontainer);
var sacontainer = $("<label/>").addClass("checkbox")
.text("AFKers at bottom of userlist");
var sa = $("<input/>").attr("type", "checkbox").appendTo(sacontainer);
sa.prop("checked", USEROPTS.sort_afk);
addOption("Userlist sort", sacontainer);
var blinkcontainer = $("<label/>").addClass("checkbox")
.text("Flash title on every incoming message");
var blink = $("<input/>").attr("type", "checkbox").appendTo(blinkcontainer);
blink.prop("checked", USEROPTS.blink_title);
addOption("Chat Notice", blinkcontainer);
var boopcontainer = $("<label/>").addClass("checkbox")
.text("Play a sound in addition to flashing the title");
var boop = $("<input/>").attr("type", "checkbox").appendTo(boopcontainer);
boop.prop("checked", USEROPTS.boop);
addOption("Chat Sound", boopcontainer);
var sendbtncontainer = $("<label/>").addClass("checkbox")
.text("Add a send button to the chatbox");
var sendbtn = $("<input/>").attr("type", "checkbox").appendTo(sendbtncontainer);
sendbtn.prop("checked", USEROPTS.chatbtn);
addOption("Send Button", sendbtncontainer);
var altsocketcontainer = $("<label/>").addClass("checkbox")
.text("Use alternative socket connection (requires refresh)");
var altsocket = $("<input/>").attr("type", "checkbox")
.appendTo(altsocketcontainer);
altsocket.prop("checked", USEROPTS.altsocket);
addOption("Alternate Socket", altsocketcontainer);
if(CLIENT.rank >= Rank.Moderator) {
$("<hr>").appendTo(form);
var modhatcontainer = $("<label/>").addClass("checkbox")
.text("Show name color");
var modhat = $("<input/>").attr("type", "checkbox").appendTo(modhatcontainer);
modhat.prop("checked", USEROPTS.modhat);
addOption("Modflair", modhatcontainer);
var joincontainer = $("<label/>").addClass("checkbox")
.text("Show join messages");
var join = $("<input/>").attr("type", "checkbox").appendTo(joincontainer);
join.prop("checked", USEROPTS.joinmessage);
addOption("Join Messages", joincontainer);
}
var footer = $("<div/>").addClass("modal-footer").appendTo(modal);
var submit = $("<button/>").addClass("btn btn-primary pull-right")
.text("Save")
.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.wmode_transparent = wmodetrans.prop("checked");
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");
USEROPTS.ignore_channelcss = nocss.prop("checked");
USEROPTS.ignore_channeljs = nojs.prop("checked");
USEROPTS.sort_rank = sr.prop("checked");
USEROPTS.sort_afk = sa.prop("checked");
USEROPTS.boop = boop.prop("checked");
sortUserlist();
if(CLIENT.rank >= Rank.Moderator) {
USEROPTS.modhat = modhat.prop("checked");
USEROPTS.joinmessage = join.prop("checked");
USEROPTS.theme = gen_theme.val();
USEROPTS.layout = gen_layout.val();
USEROPTS.css = gen_css.val();
USEROPTS.ignore_channelcss = gen_nocss.prop("checked");
USEROPTS.ignore_channeljs = gen_nojs.prop("checked");
USEROPTS.altsocket = gen_altsocket.prop("checked");
USEROPTS.synch = pl_synch.prop("checked");
USEROPTS.sync_accuracy = parseFloat(pl_synchacc.val())||2;
USEROPTS.wmode_transparent = pl_wmode.prop("checked");
USEROPTS.hidevid = pl_hide.prop("checked");
USEROPTS.qbtn_hide = pl_hidebtn.prop("checked");
USEROPTS.qbtn_idontlikechange = pl_oldbtn.prop("checked");
USEROPTS.show_timestamps = chat_time.prop("checked");
USEROPTS.sort_rank = chat_sort_rank.prop("checked");
USEROPTS.sort_afk = chat_sort_afk.prop("checked");
USEROPTS.blink_title = chat_all.prop("checked");
USEROPTS.boop = chat_boop.prop("checked");
USEROPTS.chatbtn = chat_sendbtn.prop("checked");
if (CLIENT.rank >= 2) {
USEROPTS.modhat = mod_flair.prop("checked");
USEROPTS.joinmessage = mod_joinmsg.prop("checked");
}
saveOpts();
modal.modal("hide");
});
});
modal.on("hidden", function () {
unhidePlayer();
applyOpts();
modal.remove();
});
modal.modal();
}