Fixed some form placements in the HTML, placing of X button, removed doublesubmitting of switches and added disabled handling for togglebuttons

This commit is contained in:
Kasper Rynning-Tønnesen
2015-04-15 18:13:31 +02:00
parent e0b0b01f5a
commit a9d99e208a
5 changed files with 83 additions and 53 deletions

View File

@@ -1,84 +1,84 @@
<li class="no-padding"> <li class="no-padding">
<ul class="collapsible collapsible-accordion"> <ul class="collapsible collapsible-accordion">
<li> <li><a class="nav-btn close-settings" title="Close" href="#" onclick="hide_settings()" style="float:right;">
<a class="nav-btn close-settings" title="Close" href="#" onclick="hide_settings()"> <i class="mdi-navigation-close right-align"></i>
<i class="mdi-navigation-close right-align"></i> </a>
</a> <a class="col s9 collapsible-header bold waves-effect active">
<a class="col s9 collapsible-header bold waves-effect active">Channel Settings Channel Settings
<i class="mdi-image-tune"></i> <i class="mdi-image-tune"></i>
</a> </a>
<div class="collapsible-body"> <div class="collapsible-body">
<ul> <ul>
<li class="white-bg"> <form id="adminForm" onsubmit="pass_save();return false;">
<a class="white-bg"> <li class="white-bg">
<div class="input-field"> <a class="white-bg">
<input placeholder="Enter channel password" id="password" type="password" class="validate"> <div class="input-field">
</div> <input placeholder="Enter channel password" id="password" type="password" class="validate">
</a> </div>
</li> </a>
<form id="adminForm"> </li>
<li><a class="setting-text"> <li><a class="setting-text">
Add songs Add songs
<div class="switch"><label onclick="save()"> <div class="switch"><label>
Anyone Anyone
<input name="addsongs" type="checkbox"><span class="lever"></span> <input name="addsongs" type="checkbox" class="conf"><span class="lever"></span>
Admin Admin
</label></div></a></li> </label></div></a></li>
<li><a class="setting-text"> <li><a class="setting-text">
Vote Vote
<div class="switch"><label onclick="save()"> <div class="switch"><label>
Anyone Anyone
<input name="vote" type="checkbox"><span class="lever"></span> <input name="vote" type="checkbox" class="conf"><span class="lever"></span>
Admin Admin
</label></div></a></li> </label></div></a></li>
<li><a class="setting-text"> <li><a class="setting-text">
Shuffle Shuffle
<div class="switch"><label onclick="save()"> <div class="switch"><label>
Anyone Anyone
<input name="shuffle" type="checkbox"><span class="lever"></span> <input name="shuffle" type="checkbox" class="conf"><span class="lever"></span>
Admin Admin
</label></div></a></li> </label></div></a></li>
<li><a class="setting-text"> <li><a class="setting-text">
Skip Skip
<div class="switch"><label onclick="save()"> <div class="switch"><label>
Anyone Anyone
<input name="addsongs" type="checkbox"><span class="lever"></span> <input name="skip" type="checkbox" class="conf"><span class="lever"></span>
Admin Admin
</label></div></a></li> </label></div></a></li>
<li><a class="setting-text"> <li><a class="setting-text">
Song length Song length
<div class="switch"><label onclick="save()"> <div class="switch"><label>
Any Any
<input name="longsongs" type="checkbox"><span class="lever"></span> <input name="longsongs" type="checkbox" class="conf"><span class="lever"></span>
Short Short
</label></div></a></li> </label></div></a></li>
<li><a class="setting-text"> <li><a class="setting-text">
Type Type
<div class="switch"><label onclick="save()"> <div class="switch"><label>
Any Any
<input name="allvideos" type="checkbox"><span class="lever"></span> <input name="allvideos" type="checkbox" class="conf"><span class="lever"></span>
Song Song
</label></div></a></li> </label></div></a></li>
<li><a class="setting-text"> <li><a class="setting-text">
Frontpage Frontpage
<div class="switch"><label onclick="save()"> <div class="switch"><label>
Display Display
<input name="frontpage" type="checkbox"><span class="lever"></span> <input name="frontpage" type="checkbox" class="conf"><span class="lever"></span>
Hide Hide
</label></div></a></li> </label></div></a></li>
<li><a class="setting-text"> <li><a class="setting-text">
After play After play
<div class="switch"><label onclick="save()"> <div class="switch"><label>
Keep Keep
<input name="removeplay" type="checkbox"><span class="lever"></span> <input name="removeplay" type="checkbox" class="conf"><span class="lever"></span>
Remove Remove
</label></div></a></li> </label></div></a></li>

View File

@@ -89,7 +89,7 @@ io.on('connection', function(socket){
}else }else
{ {
db.createCollection(coll, function(err, docs){ db.createCollection(coll, function(err, docs){
db.collection(coll).insert({"addsongs":"false", "adminpass":"", "allvideos":"true", "frontpage":"true", "longsongs":"true", "removeplay": "false", "shuffle": "false", "skip": "true", "skips": [], "startTime":get_time(), "views": [], "vote": "false"}, function(err, docs) db.collection(coll).insert({"addsongs":false, "adminpass":"", "allvideos":true, "frontpage":true, "longsongs":true, "removeplay": false, "shuffle": false, "skip": true, "skips": [], "startTime":get_time(), "views": [], "vote": false}, function(err, docs)
{ {
db.collection(coll).find().sort({votes:-1}, function(err, docs) { db.collection(coll).find().sort({votes:-1}, function(err, docs) {
socket.emit(coll, docs); socket.emit(coll, docs);
@@ -117,7 +117,7 @@ io.on('connection', function(socket){
var hash = hash_pass(arr[2]); var hash = hash_pass(arr[2]);
db.collection(coll).find({views:{$exists:true}}, function(err, docs) db.collection(coll).find({views:{$exists:true}}, function(err, docs)
{ {
if((docs[0]["addsongs"] == "true" && (hash == docs[0]["adminpass"] || docs[0]["adminpass"] == "")) || docs[0]["addsongs"] == "false") if((docs[0]["addsongs"] == true && (hash == docs[0]["adminpass"] || docs[0]["adminpass"] == "")) || docs[0]["addsongs"] == false)
{ {
db.collection(coll).find({id:id}, function(err, docs){ db.collection(coll).find({id:id}, function(err, docs){
if(docs.length == 0) if(docs.length == 0)
@@ -153,7 +153,7 @@ io.on('connection', function(socket){
var hash = hash_pass(msg[4]); var hash = hash_pass(msg[4]);
db.collection(coll).find({views:{$exists:true}}, function(err, docs) db.collection(coll).find({views:{$exists:true}}, function(err, docs)
{ {
if((docs[0]["vote"] == "true" && (hash == docs[0]["adminpass"] || docs[0]["adminpass"] == "")) || docs[0]["vote"] == "false") if((docs[0]["vote"] == true && (hash == docs[0]["adminpass"] || docs[0]["adminpass"] == "")) || docs[0]["vote"] == false)
{ {
vote(coll, id, guid, socket); vote(coll, id, guid, socket);
}else{ }else{
@@ -165,7 +165,7 @@ io.on('connection', function(socket){
socket.on('skip', function(list) socket.on('skip', function(list)
{ {
db.collection(coll).find({skip: "true"}, function(err, docs){ db.collection(coll).find({skip: true}, function(err, docs){
if(docs.length == 1) if(docs.length == 1)
{ {
if(lists[coll].length/2 <= docs[0]["skips"]+1) if(lists[coll].length/2 <= docs[0]["skips"]+1)
@@ -194,7 +194,10 @@ io.on('connection', function(socket){
var skipping = params[7]; var skipping = params[7];
var shuffling = params[8]; var shuffling = params[8];
var hash = hash_pass(adminpass); if(adminpass != "")
var hash = hash_pass(adminpass);
else
var hash = adminpass;
db.collection(coll).find({views:{$exists:true}}, function(err, docs){ db.collection(coll).find({views:{$exists:true}}, function(err, docs){
if(docs[0]["adminpass"] == "" || docs[0]["adminpass"] == hash) if(docs[0]["adminpass"] == "" || docs[0]["adminpass"] == hash)
@@ -209,8 +212,12 @@ io.on('connection', function(socket){
shuffle:shuffling, shuffle:shuffling,
longsongs:longsongs, longsongs:longsongs,
adminpass:hash}}, function(err, docs){ adminpass:hash}}, function(err, docs){
socket.emit("toast", "Successfully applied settings!"); db.collection(coll).find({views:{$exists:true}}, function(err, docs)
sort_list(coll,undefined,false); {
io.sockets.emit(coll+",conf", docs);
socket.emit("toast", "Successfully applied settings!");
});
//sort_list(coll,undefined,false);
}); });
}else }else
@@ -223,7 +230,7 @@ io.on('connection', function(socket){
socket.on('shuffle', function(pass){ socket.on('shuffle', function(pass){
var hash = hash_pass(pass); var hash = hash_pass(pass);
db.collection(coll).find({views:{$exists:true}}, function(err, docs){ db.collection(coll).find({views:{$exists:true}}, function(err, docs){
if((docs[0]["adminpass"] == hash || docs[0]["adminpass"] == "") || docs[0]["shuffle"] == "true") if((docs[0]["adminpass"] == hash || docs[0]["adminpass"] == "") || docs[0]["shuffle"] == true)
{ {
db.collection(coll).find({now_playing:false}).forEach(function(err, docs){ db.collection(coll).find({now_playing:false}).forEach(function(err, docs){
if(!docs){ if(!docs){
@@ -305,7 +312,7 @@ function vote(coll, id, guid, socket)
function change_song(coll) function change_song(coll)
{ {
db.collection(coll).find({views:{$exists:true}}, function(err, docs){ db.collection(coll).find({views:{$exists:true}}, function(err, docs){
if(docs[0]["removeplay"] == "true") if(docs[0]["removeplay"] == true)
{ {
db.collection(coll).remove({now_playing:true}, function(err, docs) db.collection(coll).remove({now_playing:true}, function(err, docs)
{ {

View File

@@ -162,6 +162,7 @@ hide mdi-action-visibility mdi-action-visibility-off
{ {
transition: background-color .2s; transition: background-color .2s;
min-width: 64px; min-width: 64px;
float:right;
} }
.nav-btn:hover{background-color:rgba(0,0,0,0.5);} .nav-btn:hover{background-color:rgba(0,0,0,0.5);}
.hover-text{display:none;} .hover-text{display:none;}
@@ -226,3 +227,7 @@ hide mdi-action-visibility mdi-action-visibility-off
.switch label { .switch label {
color:#848484; color:#848484;
} }
.collapsible-body ul li.white-bg{
background-color:white !important;
}

View File

@@ -11,26 +11,41 @@ socket.on("toast", function(msg)
remove_bar();*/ remove_bar();*/
}); });
socket.on(chan.toLowerCase()+",conf", function(msg)
{
populate_list(msg);
});
$('input[class=conf]').change(function()
{
save();
});
function pass_save()
{
save();
}
//function used in html onlick //function used in html onlick
function save(){ function save(){
submitAdmin($("#adminForm")); submitAdmin(document.getElementById("adminForm").elements);
} }
function submitAdmin(form) function submitAdmin(form)
{ {
voting = form.vote.value; console.log(form);
addsongs = form.addsongs.value; voting = form.vote.checked;
longsongs = form.longsongs.value; addsongs = form.addsongs.checked;
frontpage = form.frontpage.value; longsongs = form.longsongs.checked;
allvideos = form.allvideos.value; frontpage = form.frontpage.checked;
removeplay = form.removeplay.value; allvideos = form.allvideos.checked;
adminpass = form.pass.value; removeplay = form.removeplay.checked;
skipping = form.skip.value; adminpass = document.getElementById("password").value;
shuffling = form.shuffle.value; skipping = form.skip.checked;
shuffling = form.shuffle.checked;
configs = [voting, addsongs, longsongs, frontpage, allvideos, removeplay, adminpass, skipping, shuffling]; configs = [voting, addsongs, longsongs, frontpage, allvideos, removeplay, adminpass, skipping, shuffling];
alert(configs) console.log(configs);
socket.emit("conf", configs); socket.emit("conf", configs);
} }

View File

@@ -39,18 +39,21 @@ function populate_list(msg)
if(listeID.hasOwnProperty('startTime')) //check if its config part of list if(listeID.hasOwnProperty('startTime')) //check if its config part of list
{ {
console.log("startTime"); console.log("startTime");
console.log(listeID.addsongs);
if(!adminTogg) if(!adminTogg)
{ {
if(listeID['adminpass'] == "") hasadmin = false;
else hasadmin = true;
names=["vote","addsongs","longsongs","frontpage", "allvideos", "removeplay", "skip", "shuffle"]; names=["vote","addsongs","longsongs","frontpage", "allvideos", "removeplay", "skip", "shuffle"];
for (var i = 0; i < names.length; i++) { for (var i = 0; i < names.length; i++) {
document.getElementsByName(names[i])[0].checked = (listeID[names[i]] === 'true'); document.getElementsByName(names[i])[0].checked = (listeID[names[i]] === true);
if(hasadmin)
$("input[name="+names[i]+"]").attr("disabled", true);
} }
if(hasadmin) /*if(hasadmin)
$("#setpass").text("Channel has admin"); $("#setpass").text("Channel has admin");
else else
$("#setpass").text("Channel has no admin"); $("#setpass").text("Channel has no admin");*/
} }
}else if(!listeID.now_playing){ //check that the song isnt playing }else if(!listeID.now_playing){ //check that the song isnt playing