Continue working on options

This commit is contained in:
Calvin Montgomery 2013-06-15 17:45:07 -04:00
parent 565759decf
commit 9dcaeb88c1
5 changed files with 123 additions and 34 deletions

View File

@ -24,10 +24,6 @@ html, body {
background-color: #ffffff;
}
#librarytoggle, #userpltoggle, #playlisttoggle {
background-color: #ffffff;
}
#librarywrap, #userplaylistwrap, #playlist_controls {
display: none;
}

View File

@ -1,17 +1,13 @@
(function() {
$("#channelsettingswrap div").each(function() {
$("#channelsettingswrap div.span12").each(function() {
$(this).hide();
});
function clickHandler(selector, div) {
$(selector).click(function() {
$("#channelsettings_nav li").each(function() {
$(this).removeClass("active");
});
$(selector).parent().addClass("active");
$("#channelsettingswrap div").each(function() {
$("#csdropdown_title").text($(selector).text());
$("#channelsettingswrap div.span12").each(function() {
$(this).hide();
});
$(div).show();
@ -21,4 +17,7 @@
clickHandler("#show_optedit", "#optedit");
clickHandler("#show_permedit", "#permedit");
clickHandler("#show_motdedit", "#motdedit");
clickHandler("#show_filteredit", "#filteredit");
clickHandler("#show_cssedit", "#cssedit");
clickHandler("#show_jsedit", "#jsedit");
})();

View File

@ -4,14 +4,14 @@ function generateToggle(chevron, div) {
if($(div).css("display") == "none") {
$(chevron).html($(chevron).html().replace(/Show/, "Hide"));
$(div).show();
$(chevron+" i").removeClass("icon-chevron-down")
.addClass("icon-chevron-up");
$(chevron+" i").removeClass("icon-plus")
.addClass("icon-minus");
}
else {
$(chevron).html($(chevron).html().replace(/Hide/, "Show"));
$(div).hide();
$(chevron+" i").removeClass("icon-chevron-up")
.addClass("icon-chevron-down");
$(chevron+" i").removeClass("icon-minus")
.addClass("icon-plus");
}
});
}

View File

@ -89,14 +89,17 @@
<!-- left pane - Library + user playlists -->
<div class="span5" id="leftpane-outer">
<div class="row-fluid" id="leftpane-inner">
<button class="btn btn-primary btn-small" id="newpollbtn">New Poll</button>
<!-- new poll controls -->
<div class="span12" id="pollbtnwrap">
<button class="btn btn-primary btn-small" id="newpollbtn">New Poll</button>
</div>
<!-- poll container -->
<div class="span12" id="pollwrap">
<!-- new poll controls -->
</div>
<!-- library search -->
<div class="well well-small span12 row-fluid">
<div class="span12 pointer" id="librarytoggle">
<i class="icon-chevron-down pull-left"></i>
<i class="icon-plus pull-left"></i>
<p>Show Library</p>
</div>
<div id="librarywrap">
@ -110,9 +113,11 @@
<ul class="span12 videolist" id="library">
</ul>
</div>
</div>
<!-- user playlists -->
<div class="well well-small span12 row-fluid">
<div class="span12 pointer" id="userpltoggle">
<i class="icon-chevron-down pull-left"></i>
<i class="icon-plus pull-left"></i>
<p>Show Playlist Manager</p>
</div>
<div id="userplaylistwrap">
@ -125,6 +130,7 @@
<ul class="span12" id="userpl_list">
</ul>
</div>
</div>
</div>
</div>
<!-- right pane - channel playlist -->
@ -135,8 +141,9 @@
<!-- electric boogaloo -->
<div class="span12" id="queue_align2"></div>
<!-- playlist controls -->
<div class="well well-small span12 row-fluid">
<div class="span12 pointer" id="playlisttoggle">
<i class="icon-chevron-down pull-left"></i>
<i class="icon-plus pull-left"></i>
<p>Show Playlist Controls</p>
</div>
<div id="playlist_controls">
@ -154,6 +161,7 @@
<button class="btn btn-block" id="shuffleplaylist">Shuffle Playlist</button>
</div>
</div>
</div>
<!-- video queue -->
<ul class="span12 videolist" id="queue">
</ul>
@ -164,7 +172,12 @@
</div>
</div>
<!-- moderator controls -->
<div class="span12 row-fluid" id="channelsettingswrap">
<!-- there has got to be a better way to nest this -->
<div class="span12" id="channelsettingswrap3">
<div class="well" id="channelsettingswrap2">
<div class="row-fluid" id="channelsettingswrap">
</div>
</div>
</div>
</div>
</div>

View File

@ -1,21 +1,102 @@
<script src="/assets/js/channelsettings.js"></script>
<ul class="nav nav-pills" id="channelsettings_nav">
<li id="optedit_tab"><a href="javascript:void(0);" id="show_optedit">Channel Options</a></li>
<li id="permedit_tab"><a href="javascript:void(0);" id="show_permedit">Permissions</a></li>
<li id="motdedit_tab"><a href="javascript:void(0);" id="show_motdedit">MOTD Editor</a></li>
<li id="filteredit_tab"><a href="javascript:void(0);" id="show_filteredit">Chat Filters</a></li>
<li id="cssedit_tab"><a href="javascript:void(0);" id="show_cssedit">CSS Editor</a></li>
<li id="jsedit_tab"><a href="javascript:void(0);" id="show_jsedit">JS Editor</a></li>
<li id="banlist_tab"><a href="javascript:void(0);" id="show_banlist">Ban List</a></li>
<li id="recentconn_tab"><a href="javascript:void(0);" id="show_recentconn">Recent Connections</a></li>
</ul>
<div class="btn-group">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="javascript:void(0)">
<span id="csdropdown_title">Moderation Menu</span>
<span class="caret"></span>
</a>
<ul class="dropdown-menu" id="channelsettings_nav">
<li id="optedit_tab"><a href="javascript:void(0);" id="show_optedit">Channel Options</a></li>
<li id="permedit_tab"><a href="javascript:void(0);" id="show_permedit">Permissions</a></li>
<li id="motdedit_tab"><a href="javascript:void(0);" id="show_motdedit">MOTD Editor</a></li>
<li id="filteredit_tab"><a href="javascript:void(0);" id="show_filteredit">Chat Filters</a></li>
<li id="cssedit_tab"><a href="javascript:void(0);" id="show_cssedit">CSS Editor</a></li>
<li id="jsedit_tab"><a href="javascript:void(0);" id="show_jsedit">JS Editor</a></li>
<li id="banlist_tab"><a href="javascript:void(0);" id="show_banlist">Ban List</a></li>
<li id="recentconn_tab"><a href="javascript:void(0);" id="show_recentconn">Recent Connections</a></li>
</ul>
</div>
<hr>
<div id="optedit" class="span12">
Wut
<form class="form-horizontal" action="javascript:void(0)">
<!-- prevent chat flood -->
<div class="control-group">
<label class="control-label" for="opt_chat_antiflood">Prevent Chat Flood</label>
<div class="controls">
<input type="checkbox" id="opt_chat_antiflood">
</div>
</div>
<!-- convert URLs to links -->
<div class="control-group">
<label class="control-label" for="opt_enable_link_regex">Convert URLs in chat to links</label>
<div class="controls">
<input type="checkbox" id="opt_enable_link_regex">
</div>
</div>
<!-- voteskip toggle -->
<div class="control-group">
<label class="control-label" for="opt_allow_voteskip">Allow Voteskip</label>
<div class="controls">
<input type="checkbox" id="opt_allow_voteskip">
</div>
</div>
<!-- voteskip ratio -->
<div class="control-group">
<label class="control-label" for="opt_voteskip_ratio">Voteskip Ratio</label>
<div class="controls">
<input type="text" id="opt_voteskip_ratio" placeholder="0.5">
</div>
</div>
<hr>
<strong>Admin-Only Controls</strong>
<!-- page title -->
<div class="control-group">
<label class="control-label" for="opt_pagetitle">Page Title</label>
<div class="controls">
<input type="text" id="opt_pagetitle" placeholder="CyTube">
</div>
</div>
<!-- external CSS -->
<div class="control-group">
<label class="control-label" for="opt_externalcss">External CSS</label>
<div class="controls">
<input type="text" id="opt_externalcss" placeholder="Stylesheet URL">
</div>
</div>
<!-- external JS -->
<div class="control-group">
<label class="control-label" for="opt_externaljs">External Javascript</label>
<div class="controls">
<input type="text" id="opt_externaljs" placeholder="Script URL">
</div>
</div>
<!-- show publicly -->
<div class="control-group">
<label class="control-label" for="opt_show_public">List Channel Publicly</label>
<div class="controls">
<input type="checkbox" id="opt_show_public">
</div>
</div>
</div>
<br>
</div>
<div id="permedit" class="span12">
Permissions shit
Permissions Here
</div>
<div id="motdedit" class="span12">
MOTD shit
<textarea rows="10" id="motdtext"></textarea>
<button class="btn btn-primary" id="save_motd">Save</button>
</div>
<div id="filteredit" class="span12">
Filters Here
</div>
<div id="cssedit" class="span12">
<p>Max 20KB. If you need more space, host the file externally and use the External CSS option</p>
<textarea rows="10" id="csstext"></textarea>
<button class="btn btn-primary" id="save_css">Save</button>
</div>
<div id="jsedit" class="span12">
<p>Max 20KB. If you need more space, host the file externally and use the External JS option</p>
<textarea rows="10" id="jstext"></textarea>
<button class="btn btn-primary" id="save_js">Save</button>
</div>