KevinMidboe/zoff
1
0
Fork 0
mirror of https://github.com/KevinMidboe/zoff.git synced 2025-12-08 20:48:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Better admin settings

Browse Source
This commit is contained in:
Nicolas A. Tonne
2014-10-24 15:00:56 +02:00
parent a2fa3022cc
commit 35e8263bc6
3 changed files with 95 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
js/admin.js
View File

@@ -4,7 +4,10 @@ var pass_corr = "";
function admin() function admin()
{ {
adminTogg = !adminTogg; adminTogg = !adminTogg;
if(!adminTogg) $("#playlist").height($("#playlist").height()+$("#adminPanel").outerHeight(true)); if(!adminTogg){
$("#playlist").height($("#playlist").height()+$("#adminPanel").outerHeight(true));
$("#passbox").focus();
}
$("#adminPanel").toggleClass("hiddenAdmin"); $("#adminPanel").toggleClass("hiddenAdmin");
if(adminTogg) $("#playlist").height($("#playlist").height()-$("#adminPanel").outerHeight(true)); if(adminTogg) $("#playlist").height($("#playlist").height()-$("#adminPanel").outerHeight(true));
} }
@@ -32,6 +35,15 @@ function submitAdmin(form)
}).responseText; }).responseText;
pass_corr = confRes; pass_corr = confRes;
if(pass_corr=="correct"){
$("#adminPanel").addClass("success");
}else{ $("#adminPanel").addClass("fadeerror"); alert("Wrong password :(")}
console.log(pass_corr); console.log(pass_corr);
updateList(); updateList();
setTimeout(function(){
$("#adminPanel").removeClass("success");
$("#adminPanel").removeClass("fadeerror");
},1500);
} }

50
php/panel.php
View File

@@ -1,14 +1,46 @@
<b>Admin Panel</b> <b>Admin Panel</b>
<br>
<form id="adminForm" onsubmit="return false" name="ufo" action="" class="daform nomargin" id="base"> <form id="adminForm" onsubmit="return false" name="ufo" action="" class="daform nomargin" id="base">
<label>Only admin can vote <input type="checkbox" name="vote" value="1"></label> <div class="toggler">
<label>Only admin can add songs <input type="checkbox" name="addSongs" value="1"></label> <label><input type="radio" class="radio"name="frontPage" value="1"><span>Display</span></label> /
<label>Allow long songs <input type="checkbox" name="longSongs" value="1"></label> <label><input type="radio" class="radio"name="frontPage" value="0"><span>Hide</span></label>
<label>Show playlist on frontpage <input type="checkbox" name="frontPage" value="1"></label> </div>
<label>All Videos <input type="checkbox" name="allvideos" value="1"></label>
<label>Remove song after playing <input type="checkbox" name="removePlay" value="1"></label>
<label>Admin Password <input type="password" name="pass"></label>
<input type="button" class="button" value="Save Settings" onclick="submitAdmin(this.form);"> <div class="toggler">
<label><input type="radio" class="radio"name="vote" value="1"><span>Admin</span></label> /
<label><input type="radio" class="radio"name="vote" value="0"><span>Anyone</span></label>
</div>
<div class="toggler">
<label><input type="radio" class="radio"name="addSongs" value="1"><span>Admin</span></label> /
<label><input type="radio" class="radio"name="addSongs" value="0"><span>Anyone</span></label>
</div>
<div class="toggler">
<label><input type="radio" class="radio"name="longSongs" value="1"><span>Allow</span></label> /
<label><input type="radio" class="radio"name="longSongs" value="0"><span>Block</span></label>
</div>
<div class="toggler">
<label><input type="radio" class="radio"name="allvideos" value="1"><span>All</span></label> /
<label><input type="radio" class="radio"name="allvideos" value="0"><span>Song</span></label>
</div>
<div class="toggler">
<label><input type="radio" class="radio"name="removePlay" value="1"><span>Remove</span></label> /
<label><input type="radio" class="radio"name="removePlay" value="0"><span>Keep</span></label>
</div>
<div>
playlist on frontpage
can vote
can add songs
long songs
categories allowed
song after player
</div>
<input type="password" name="pass" id="passbox" class="passbox" placeholder="Channel password">
<input type="submit" class="button" value="Store" onclick="submitAdmin(this.form);">
</form> </form>

47
static/style.css
View File

@@ -15,8 +15,9 @@ body{background:#000; margin:0; }
color:#f15; text-align: center;-webkit-transition:background 1s;-moz-transition:background 1s;-o-transition:background 1s; transition:background 1s; color:#f15; text-align: center;-webkit-transition:background 1s;-moz-transition:background 1s;-o-transition:background 1s; transition:background 1s;
background-color: rgba(255, 255, 255, 0.22); background-color: rgba(255, 255, 255, 0.22);
} }
.passbox{height: 24px;font-size: 15px;width: 42%;padding: 4px 0;margin: 5px 0;border-radius: 2px;border: none; text-align: center;}
.success{animation: fadecol 1.5s; -moz-animation: fadecol 1.5s; -webkit-animation: fadecol 1.5s; -o-animation: fadecol 1.5s;} .success{animation: fadecol 1.5s; -moz-animation: fadecol 1.5s; -webkit-animation: fadecol 1.5s; -o-animation: fadecol 1.5s;}
.error{animation: fadewrong 1.5s; -moz-animation: fadewrong 1.5s; -webkit-animation: fadewrong 1.5s; -o-animation: fadewrong 1.5s;} .fadeerror {animation: fadered 1.5s; -moz-animation: fadered 1.5s; -webkit-animation: fadered 1.5s; -o-animation: fadered 1.5s;}
.small{font-size: 5vw; color:#E2E2E2; text-decoration: none; } .small{font-size: 5vw; color:#E2E2E2; text-decoration: none; }
/*.small:hover{color: #CCC;}*/ /*.small:hover{color: #CCC;}*/
.big{font-size:180vh; position:absolute; top:-50%; color:#330A00 !important; z-index:-1; width: 100%; overflow: hidden; display: none;} .big{font-size:180vh; position:absolute; top:-50%; color:#330A00 !important; z-index:-1; width: 100%; overflow: hidden; display: none;}
@@ -65,9 +66,17 @@ body{background:#000; margin:0; }
#playlist{-webkit-transition: opacity 0.5s;transition: opacity 0.5s;} #playlist{-webkit-transition: opacity 0.5s;transition: opacity 0.5s;}
.nomargin{padding: 0;margin:0;} .nomargin{padding: 0;margin:0;}
#adminForm{text-align:left;} #adminForm{text-align:center;}
#adminForm label{display: block; cursor: pointer;} #adminForm label{display: inline; cursor: pointer;}
input[type="radio"]{display: none;}
.toggler{display: inline; float: left;}
.toggler label:hover{border-bottom: solid 1px white;}
.radio:checked + span {
font-weight: bold;
}
.adminBox{float:right;} .adminBox{float:right;}
#adminPanel{color:white; height:200px; padding: 10px; overflow:hidden; background-color: rgba(0,0,0,0.2);} #adminPanel{color:white; height:200px; padding: 10px; overflow:hidden; background-color: rgba(0,0,0,0.2);}
.hiddenAdmin{padding:0 !important; margin:0 !important; height: 0 !important;} .hiddenAdmin{padding:0 !important; margin:0 !important; height: 0 !important;}
.button{background-color: rgba(255,255,255,0.2); border-radius: 4px; border: none;color: white;padding: 5px 15px; margin-top: 15px; transition: all 0.1s ease-in-out;} .button{background-color: rgba(255,255,255,0.2); border-radius: 4px; border: none;color: white;padding: 5px 15px; margin-top: 15px; transition: all 0.1s ease-in-out;}
@@ -77,9 +86,33 @@ body{background:#000; margin:0; }
@-webkit-keyframes fadein{from {opacity:0;}to{opacity:1;}}@keyframes fadein{from{opacity:0;}to{opacity:1;}}@-moz-keyframes fadein{from{opacity:0;}to{opacity:1;}}@-o-keyframes fadein{from{opacity:0;}to{opacity:1;}} @-webkit-keyframes fadein{from {opacity:0;}to{opacity:1;}}@keyframes fadein{from{opacity:0;}to{opacity:1;}}@-moz-keyframes fadein{from{opacity:0;}to{opacity:1;}}@-o-keyframes fadein{from{opacity:0;}to{opacity:1;}}
@-webkit-keyframes fadecol{from {background-color:rgba(0,255,0,0.4);}to{background-color: rgba(255,255,255,0);}}@keyframes fadecol{background-color: rgba(0,255,0,0.4);}to{background-color: rgba(255,255,255,0);}}@-moz-keyframes fadecol{from{background-color: rgba(0,255,0,0.4);}to{background-color: rgba(255,255,255,0);}}@-o-keyframes fadecol{background-color: rgba(0,255,0,0.4);}to{background-color: rgba(255,255,255,0);}} @-webkit-keyframes fadecol{from {background-color:rgba(0,255,0,0.4);}to{background-color: rgba(255,255,255,0);}}@keyframes fadecol{background-color: rgba(0,255,0,0.4);}to{background-color: rgba(255,255,255,0);}}@-moz-keyframes fadecol{from{background-color: rgba(0,255,0,0.4);}to{background-color: rgba(255,255,255,0);}}@-o-keyframes fadecol{background-color: rgba(0,255,0,0.4);}to{background-color: rgba(255,255,255,0);}}
@-webkit-keyframes fadewrong{from {background-color:rgba(255,0,0,0.4);}to{background-color: rgba(255,255,255,0);}}@keyframes fadewrong{background-color: rgba(255,0,0,0.4);}to{background-color: rgba(255,255,255,0);}}@-moz-keyframes fadewrong{from{background-color: rgba(255,0,0,0.4);}to{background-color: rgba(255,255,255,0);}}@-o-keyframes fadewrong{background-color: rgba(255,0,0,0.4);}to{background-color: rgba(255,255,255,0);}} @-webkit-keyframes fadered{from {background-color:rgba(255,0,0,0.4);}to{background-color: rgba(255,255,255,0);}}@keyframes fadered{background-color: rgba(255,0,0,0.4);}to{background-color: rgba(255,255,255,0);}}@-moz-keyframes fadered{from{background-color: rgba(255,0,0,0.4);}to{background-color: rgba(255,255,255,0);}}@-o-keyframes fadered{background-color: rgba(255,0,0,0.4);}to{background-color: rgba(255,255,255,0);}}
/* imports */ @media (max-width: 1000px) {
@import url("mobile.css"); body{background-color: #fff;}
/*@import url("toggler.css");*/ .bgimage{display: none;}
#player{width: 100%; height:45%; margin-bottom: 20px; box-shadow: none;}
.playlist{width: 100%;}
.lresult{font-size: 40px; height: 90px; font-size: 50px;}
.votes{float: right; background-color: rgba(0,0,0,0.9); margin-top: -1.5em;font-size: 42px; padding-right: 8px; height: 89px; line-height: 89px; padding-left: 20px; border-radius: 1px;}
.lthumb{height: 90px; box-shadow: none;}
.ltitle{height: 70px; color: #000;}
#plus,#minus{padding-left: 24px; margin-left: 0; padding-right: 24px;}
#plus{border-right:solid 3px rgb(172, 172, 172);}
#search{text-align: left; height: 100px; font-size: 40px; border: solid 2px #ccc;}
#buttons{text-align: center; height: 80px; margin: 0;}
.skip{height: 50px;}
.vcent{
top: inherit;
-webkit-transform: translateY(0%);
}
#title{
font-size: 30px;
font-weight: bold;
overflow: hidden;
padding-left: 2%;
padding-top: 0;
}
.footer{font-size: 40px; margin-top: 150px;}
}