KevinMidboe/zoff
1
0
Fork 0
mirror of https://github.com/KevinMidboe/zoff.git synced 2025-10-29 18:00:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Cleaned up a bunch of code, and reimplemented navigating through results with arrowkeys

Browse Source
This commit is contained in:
Kasper Rynning-Tønnesen
2015-07-21 21:39:11 +02:00
parent 6041dd245a
commit 91fb7b2bc3
7 changed files with 285 additions and 302 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
server/server.js
View File

@@ -739,10 +739,11 @@ function contains(a, obj) {
return false;
}
function rndName(seed, endlen) {
function rndName(seed, len) {
var vowels = ['a', 'e', 'i', 'o', 'u'];
consts = ['b', 'c', 'd', 'f', 'g', 'h', 'j', 'k', 'l', 'm', 'n', 'p', 'r', 's', 't', 'v', 'w', 'x', 'y', 'z', 'tt', 'ch', 'sh'];
len = 8;
//len = 8;
len = Math.floor(len);
word = '';
is_vowel = false;
var arr;
@@ -752,7 +753,7 @@ function rndName(seed, endlen) {
is_vowel = !is_vowel;
word += arr[(seed[i%seed.length].charCodeAt()+i) % arr.length-1];
}
return word.substring(0, Math.ceil(endlen))
return word
}
function uniqueID(seed, minlen){

4
static/css/style.css
View File

@@ -12,6 +12,7 @@
#toast-container{
left:2% !important;
pointer-events:none;
}
::-webkit-scrollbar-track
@@ -563,9 +564,10 @@ ul #chat-log{
max-height: 600px;
overflow: overlay;
}
.result:hover {
.result:hover, .hoverResults {
background-color: rgba(0,0,0,0.4);
}
.search-title{
height: 40px;
}

3
static/dist/main.min.js vendored
View File

File diff suppressed because one or more lines are too long

87
static/js/admin.js
View File

@@ -59,22 +59,24 @@ var Admin = {
socket.on("pw", function(msg)
{
console.log("fuck");
w_p = false;
adminpass = msg;
names=["vote","addsongs","longsongs","frontpage", "allvideos", "removeplay", "skip", "shuffle"];
names = ["vote","addsongs","longsongs","frontpage", "allvideos",
"removeplay", "skip", "shuffle"];
localStorage.setItem(chan.toLowerCase(), msg);
for (var i = 0; i < names.length; i++) {
$("input[name="+names[i]+"]").attr("disabled", false);
}
$(".card-action").removeClass("hide");
$(".card-action").removeClass("hide");
$("#admin-lock").removeClass("mdi-action-lock");
if(!Helper.contains($("#admin-lock").attr("class").split(" "), "mdi-action-lock-open"))
$("#admin-lock").addClass("mdi-action-lock-open clickable");
localStorage.setItem(chan.toLowerCase(), msg);
$("#password").val("");
$("#password").attr("placeholder", "Change channel password")
//Materialize.toast("Correct password. You now have access to the sacred realm of The Admin.", 4000);
if(!Helper.contains($("#admin-lock").attr("class").split(" "), "mdi-action-lock-open"))
$("#admin-lock").addClass("mdi-action-lock-open clickable");
});
socket.on("conf", function(msg)
@@ -104,17 +106,26 @@ var Admin = {
display_logged_out: function()
{
w_p = true;
names=["vote","addsongs","longsongs","frontpage", "allvideos", "removeplay", "skip", "shuffle"];
for (var i = 0; i < names.length; i++) {
adminpass = "";
names = ["vote","addsongs","longsongs","frontpage", "allvideos",
"removeplay", "skip", "shuffle"];
document.getElementById("password").value = "";
for (i = 0; i < names.length; i++) {
$("input[name="+names[i]+"]").attr("disabled", true);
}
if(!Helper.contains($("#admin-lock").attr("class").split(" "), "mdi-action-lock"))
if(!Helper.contains($("#admin-lock").attr("class").split(" "), "mdi-action-lock")){
$("#admin-lock").addClass("mdi-action-lock");
$("#admin-lock").removeClass("mdi-action-lock-open clickable");
if($(".card-action").length != 0 && !Helper.contains($(".card-action").attr("class").split(" "), "hide"))
}
if($(".card-action").length != 0 &&
!Helper.contains($(".card-action").attr("class").split(" "), "hide")){
$(".card-action").addClass("hide");
adminpass = "";
document.getElementById("password").value = "";
}
$("#admin-lock").removeClass("mdi-action-lock-open clickable");
$("#password").attr("placeholder", "Enter channel password")
},
@@ -125,29 +136,24 @@ var Admin = {
set_conf: function(conf_array)
{
if(conf_array['adminpass'] == "" || !w_p) hasadmin = false;
else hasadmin = true;
music = conf_array["allvideos"];
longsongs = conf_array["longsongs"];
names=["vote","addsongs","longsongs","frontpage", "allvideos", "removeplay", "skip", "shuffle"];
for (var i = 0; i < names.length; i++) {
names = ["vote","addsongs","longsongs","frontpage", "allvideos",
"removeplay", "skip", "shuffle"];
if(conf_array['adminpass'] == "" || !w_p)
hasadmin = false;
else hasadmin = true;
for (var i = 0; i < names.length; i++)
{
document.getElementsByName(names[i])[0].checked = (conf_array[names[i]] === true);
$("input[name="+names[i]+"]").attr("disabled", hasadmin);
}
if(hasadmin && !localStorage[chan.toLowerCase()])
{
$("#password").attr("placeholder", "Enter channel password");
Admin.display_logged_out();
if(!Helper.contains($("#admin-lock").attr("class").split(" "), "mdi-action-lock"))
$("#admin-lock").addClass("mdi-action-lock");
$("#admin-lock").removeClass("mdi-action-lock-open clickable");
}else if(!hasadmin && !localStorage[chan.toLowerCase()])
{
$("#password").attr("placeholder", "Enter channel password");
if(!Helper.contains($("#admin-lock").attr("class").split(" "), "mdi-action-lock"))
$("#admin-lock").addClass("mdi-action-lock");
$("#admin-lock").removeClass("mdi-action-lock-open clickable");
if((hasadmin && !localStorage[chan.toLowerCase()]) ||
(!hasadmin && !localStorage[chan.toLowerCase()])){
Admin.display_logged_out();
}
/*if(conf_array.desc !== undefined)
@@ -164,11 +170,11 @@ var Admin = {
frontpage = form.frontpage.checked;
allvideos = form.allvideos.checked;
removeplay = form.removeplay.checked;
//adminpass = document.getElementById("password").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];
socket.emit("conf", configs);
},
@@ -176,24 +182,9 @@ var Admin = {
$('#settings').sideNav('hide');
},
remove_bar: function()
{
setTimeout(function(){
$("#adminPanel").removeClass("success");
$("#adminPanel").removeClass("fadeerror");
$("#eBar").removeClass("opacityFull");
$("#sBar").removeClass("opacityFull");
},1500);
},
shuffle: function()
{
socket.emit('shuffle', adminpass !== undefined ? adminpass : "");
},
get_wp: function()
{
return w_p;
}
}

209
static/js/list.js
View File

@@ -9,74 +9,23 @@ var List = {
channel_function: function(msg)
{
if(msg[0] == "list")
switch(msg[0])
{
full_playlist = msg[1];
full_playlist.sort(Helper.predicate({
name: 'votes',
reverse: true
}, 'added'));
List.populate_list(full_playlist);
}else if(msg[0] == "added")
{
full_playlist.push(msg[1]);
full_playlist.sort(Helper.predicate({
name: 'votes',
reverse: true
}, 'added'));
var index = List.getIndexOfSong(msg[1].id);
List.insertAtIndex(index, msg[1], true);
var test = $("#wrapper").children()[index];
setTimeout(function(){
$(test).css("height", 66);
},5);
}else if(msg[0] == "deleted")
{
var to_delete = $("#wrapper").children()[List.getIndexOfSong(msg[1])];
to_delete.style.height = 0;
setTimeout(function()
{
$("#"+msg[1]).remove();
full_playlist.splice(List.getIndexOfSong(msg[1]), 1);
}, 305);
document.getElementById('wrapper').scrollTop += 1;
document.getElementById('wrapper').scrollTop += -1;
}else if(msg[0] == "vote")
{
var index_of_song = List.getIndexOfSong(msg[1]);
var song_voted_on = full_playlist[index_of_song];
full_playlist[index_of_song].votes += 1;
full_playlist[index_of_song].added = msg[2];
full_playlist.sort(Helper.predicate({
name: 'votes',
reverse: true
}, 'added'));
$("#"+msg[1]).remove();
List.insertAtIndex(List.getIndexOfSong(msg[1]), song_voted_on, false);
//List.populate_list(full_playlist, false);
}else if(msg[0] == "song_change")
{
full_playlist[0].now_playing = true;
full_playlist[0].votes = 0;
full_playlist[0].guids = [];
full_playlist[0].added = msg[1];
full_playlist[full_playlist.length-1].now_playing = false;
/*full_playlist.sort(predicate({
name: 'votes',
reverse: true
}, 'added'));
*/
full_playlist.push(full_playlist.shift());
$("#wrapper").children()[0].remove();
List.insertAtIndex($("#wrapper").children().length, full_playlist[full_playlist.length-2], false);
document.getElementById('wrapper').scrollTop += 1;
document.getElementById('wrapper').scrollTop += -1;
//populate_list(full_playlist);
case "list":
List.populate_list(msg[1]);
break;
case "added":
List.added_song(msg[1]);
break;
case "deleted":
List.deleted_song(msg[1]);
break;
case "vote":
List.voted_song(msg[1], msg[2]);
break;
case "song_change":
List.song_change(msg[1]);
break;
}
},
@@ -93,27 +42,14 @@ var List = {
populate_list: function(msg)
{
full_playlist = msg;
List.sortList();
$("#wrapper").empty();
$.each(msg, function(j, listeID){
if(!listeID.now_playing){ //check that the song isnt playing
var video_title=decodeURIComponent(listeID.title);
var video_id = listeID.id;
var video_thumb = "//img.youtube.com/vi/"+video_id+"/mqdefault.jpg";
//var delsong = ""; if(pass_corr=="correct");
var video_votes = listeID.votes;
$("#wrapper").append(list_html);
var song = $("#list-song");
song.find(".list-title").text(video_title);
song.find(".list-title").attr("title", video_title);
song.find(".list-votes").text(video_votes);
song.find(".vote-container").attr("onclick", "vote('"+video_id+"','pos')");
song.find(".list-image").attr("data-original",video_thumb);
song.attr("id",video_id);
song.find("#del").attr("onclick", "vote('"+video_id+"', 'del')");
if(!w_p) $(".card-action").removeClass("hide");
if(video_votes==1)song.find(".vote-text").text("vote");
$.each(full_playlist, function(j, current_song){
if(!current_song.now_playing){ //check that the song isnt playing
$("#wrapper").append(List.generateSong(current_song, false));
}
});
@@ -125,6 +61,56 @@ var List = {
},
added_song: function(added){
full_playlist.push(added);
List.sortList();
List.insertAtIndex(added, true);
},
deleted_song: function(deleted){
var index = List.getIndexOfSong(deleted);
var to_delete = $("#wrapper").children()[index];
to_delete.style.height = 0;
setTimeout(function()
{
$("#"+deleted).remove();
full_playlist.splice(List.getIndexOfSong(deleted), 1);
}, 305);
document.getElementById('wrapper').scrollTop += 1;
document.getElementById('wrapper').scrollTop += -1;
},
voted_song: function(voted, time){
var index_of_song = List.getIndexOfSong(voted);
var song_voted_on = full_playlist[index_of_song];
full_playlist[index_of_song].votes += 1;
full_playlist[index_of_song].added = time;
List.sortList();
$("#"+voted).remove();
List.insertAtIndex(song_voted_on, false);
},
song_change: function(time){
var length = full_playlist.length-1;
full_playlist[0].now_playing = true;
full_playlist[0].votes = 0;
full_playlist[0].guids = [];
full_playlist[0].added = time;
full_playlist[length].now_playing = false;
full_playlist.push(full_playlist.shift());
$("#wrapper").children()[0].remove();
List.insertAtIndex(full_playlist[length-1], false);
document.getElementById('wrapper').scrollTop += 1;
document.getElementById('wrapper').scrollTop += -1;
},
vote: function(id, vote){
socket.emit('vote', [chan, id, vote, adminpass]);
return true;
@@ -136,21 +122,24 @@ var List = {
},
importOldList: function(chan){
var ids="";
var num=0;
playlist_url = "lists/"+chan+".json";
list = $.ajax({
list = $.parseJSON($.ajax({
type: "GET",
url: playlist_url,
async: false
}).responseText;
list = $.parseJSON(list);
var ids="";
var num=0;
}).responseText);
$.each(list.songs, function(i,data)
{
ids+=data.id+",";
if(num>45){
Search.addVideos(ids);
ids = "";
num = 0;
}
@@ -161,6 +150,14 @@ var List = {
document.getElementById("search").value = "";
},
sortList: function()
{
full_playlist.sort(Helper.predicate({
name: 'votes',
reverse: true
}, 'added'));
},
show: function(){
if(!window.mobilecheck())
{
@@ -179,12 +176,21 @@ var List = {
}
},
insertAtIndex: function(i, song_info, transition) {
if(i === 0) {
insertAtIndex: function(song_info, transition) {
i = List.getIndexOfSong(song_info.id);
if(i === 0)
$("#wrapper").prepend(List.generateSong(song_info, transition));
return;
}
else
$("#wrapper > div:nth-child(" + (i) + ")").after(List.generateSong(song_info, transition));
if(transition)
{
setTimeout(function(){
var added = $("#wrapper").children()[i];
$(added).css("height", 66);
},5);
}
},
generateSong: function(song_info, transition)
@@ -193,9 +199,12 @@ var List = {
var video_title = song_info.title;
var video_votes = song_info.votes;
var video_thumb = "background-image:url('//img.youtube.com/vi/"+video_id+"/mqdefault.jpg');";
var song = $("<div>"+list_html+"</div>");
if(transition) song.find("#list-song").css("height", 0);
if(!w_p) song.find(".card-action").removeClass("hide");
if(video_votes == 1)song.find(".vote-text").text("vote");
song.find(".list-title").text(video_title);
song.find(".list-title").attr("title", video_title);
song.find(".list-votes").text(video_votes);
@@ -203,14 +212,6 @@ var List = {
song.find(".list-image").attr("style",video_thumb);
song.find("#list-song").attr("id", video_id);
song.find("#del").attr("onclick", "vote('"+video_id+"', 'del')");
if(!w_p) song.find(".card-action").removeClass("hide");
if(video_votes == 1)song.find(".vote-text").text("vote");
/*
$(".lazy").lazyload({
container: $("#wrapper")
}).removeClass("lazy");
*/
return song.html();
},

84
static/js/listeners.js
View File

@@ -1,12 +1,8 @@
var chan = $("#chan").html();
var w_p = true;
var hasadmin = 0;
var list;
var showToggle = true;
var list_html = $("#list-song-html").html();
var full_playlist;
var conf;
var blink_interval;
var blink_interval_exists = false;
var unseen = false;
var timer = 0;
@@ -15,27 +11,33 @@ var result_html = $("#temp-results-container");
var empty_results_html = $("#empty-results-container").html();
var searching = false
var time_regex = /P((([0-9]*\.?[0-9]*)Y)?(([0-9]*\.?[0-9]*)M)?(([0-9]*\.?[0-9]*)W)?(([0-9]*\.?[0-9]*)D)?)?(T(([0-9]*\.?[0-9]*)H)?(([0-9]*\.?[0-9]*)M)?(([0-9]*\.?[0-9]*)S)?)?/
var tag;
var firstScriptTag;
var ytplayer;
var title;
var viewers;
var video_id;
var conf = [];
var music = 0;
var frontpage = 1;
var adminpass = "";
var filesadded = "";
var player_ready = false;
var seekTo;
var song_title;
var viewers = 1;
var paused = false;
var playing = false;
var SAMPLE_RATE = 6000; // 6 seconds
var lastSample = Date.now();
var began = false;
var i = -1;
var id;
var full_playlist;
var conf;
var blink_interval;
var tag;
var firstScriptTag;
var ytplayer;
var title;
var viewers;
var video_id;
var list;
var seekTo;
var song_title;
var connection_options = {
'sync disconnect on unload':true
@@ -68,32 +70,8 @@ $(document).ready(function()
closeOnClick: false // Closes side-nav on <a> clicks, useful for Angular/Meteor
});
if(!window.mobilecheck())
{
Chat.setup_chat_listener(chan);
Chat.allchat_listener();
Hostcontroller.host_listener();
$("#chat-btn").sideNav({
menuWidth: 272, // Default is 240
edge: 'left', // Choose the horizontal origin
closeOnClick: false // Closes side-nav on <a> clicks, useful for Angular/Meteor
});
$(".drag-target")[1].remove();
}
//Materialize.toast("Passwords have been reset. If anything is not right, please send us a mail @ contact@zoff.no", 10000);
//$('#settings-close').sideNav('hide');
if(!window.mobilecheck() && !Helper.msieversion())
{
Notification.requestPermission();
}
if(localStorage[chan.toLowerCase()])
{
//localStorage.removeItem(chan.toLowerCase());
if(localStorage[chan.toLowerCase()].length != 64)
localStorage.removeItem(chan.toLowerCase());
else
@@ -104,9 +82,22 @@ $(document).ready(function()
document.getElementById("search").blur();
Youtube.readyLooks();
}else{
Chat.setup_chat_listener(chan);
Chat.allchat_listener();
Hostcontroller.host_listener();
Youtube.loadPlayer();
window.onYouTubeIframeAPIReady = Youtube.onYouTubeIframeAPIReady;
$("#chat-btn").sideNav({
menuWidth: 272, // Default is 240
edge: 'left', // Choose the horizontal origin
closeOnClick: false // Closes side-nav on <a> clicks, useful for Angular/Meteor
});
$(".drag-target")[1].remove();
if(!Helper.msieversion()) Notification.requestPermission();
if(navigator.userAgent.toLowerCase().indexOf("firefox") > -1) //quickdickfix for firefoxs weird percent handling
$(".main").height(window.innerHeight-64);
@@ -165,9 +156,6 @@ $(document).ready(function()
$(document).keyup(function(e) {
if(event.keyCode == 27){
$("#results").html("");
$(".main").removeClass("blurT");
$("#controls").removeClass("blurT");
$(".main").removeClass("clickthrough");
if(!Helper.contains($("#search-wrapper").attr("class").split(" "), "hide"))
$("#search-wrapper").toggleClass("hide");
if(Helper.contains($("#song-title").attr("class").split(" "), "hide"))
@@ -179,20 +167,17 @@ $(document).keyup(function(e) {
$("#search-btn i").toggleClass("mdi-action-search");
}
$("#results").toggleClass("hide");
}
else if ($("div.result").length > 2){
}else if ($("div.result").length > 2){
if (e.keyCode == 40) {
if(i < $("div.result").length -2)
$(children[i-1]).removeClass("hoverResults");
$(children[i]).addClass("hoverResults");
if(i < children.length -2)
i++;
$("div.result:nth-child("+(i-1)+")").removeClass("hoverResults");
$("div.result:nth-child("+i+")").addClass("hoverResults");
} else if (e.keyCode == 38) {
$("div.result:nth-child("+i+")").removeClass("hoverResults");
$("div.result:nth-child("+(i-1)+")").addClass("hoverResults");
if(i > 1)
i--;
$(children[i]).removeClass("hoverResults");
$(children[i-1]).addClass("hoverResults");
} else if(e.keyCode == 13) {
i = 0;
var elem = document.getElementsByClassName("hoverResults")[0];
@@ -202,9 +187,6 @@ $(document).keyup(function(e) {
$("div.hoverResults").removeClass("hoverResults");
$("#results").html('');
document.getElementById("search").value = "";
$(".main").removeClass("blurT");
$("#controls").removeClass("blurT");
$(".main").removeClass("clickthrough");
}
}
});

25
static/js/youtube.js
View File

@@ -8,6 +8,7 @@ var Youtube = {
document.getElementById('song-title').innerHTML = "Empty channel. Add some songs!";
$("#player_overlay").height($("#player").height());
if(!window.mobilecheck()) $("#player_overlay").toggleClass("hide");
try{
ytplayer.stopVideo();
@@ -16,13 +17,14 @@ var Youtube = {
}
else{
//console.log("gotten new song");
$("#player_overlay").addClass("hide");
video_id = obj[0][0]["id"];
conf = obj[1][0];
time = obj[2];
seekTo = time - conf["startTime"];
song_title = obj[0][0]["title"];
$("#player_overlay").addClass("hide");
Youtube.getTitle(song_title, viewers);
Youtube.setBGimage(video_id);
if(player_ready && !window.mobilecheck())
@@ -48,6 +50,7 @@ var Youtube = {
socket.on("viewers", function(view)
{
viewers = view;
if(song_title !== undefined)
Youtube.getTitle(song_title, viewers);
});
@@ -59,12 +62,14 @@ var Youtube = {
case -1:
break;
case 0:
socket.emit("end", video_id);
playing = false;
paused = false;
socket.emit("end", video_id);
break;
case 1:
playing = true;
if(document.getElementById("play").className.split(" ").length == 1)
$("#play").toggleClass("hide");
if(document.getElementById("pause").className.split(" ").length == 2)
@@ -77,6 +82,7 @@ var Youtube = {
break;
case 2:
paused = true;
if(document.getElementById("pause").className.split(" ").length == 1)
$("#pause").toggleClass("hide");
if(document.getElementById("play").className.split(" ").length == 2)
@@ -92,17 +98,19 @@ var Youtube = {
var outPutWord = v > 1 ? "viewers" : "viewer";
var title = decodeURIComponent(titt);
var elem = document.getElementById('song-title');
var viewers = document.getElementById('viewers');
document.title = title + " • Zöff / "+chan;
elem.innerHTML = title;
document.getElementById('viewers').innerHTML = v + " " + outPutWord;
viewers.innerHTML = v + " " + outPutWord;
elem.title = title + " • " + v + " " + outPutWord;
},
errorHandler: function(newState)
{
if(newState.data == 5 || newState.data == 100 || newState.data == 101 || newState.data == 150)
if(newState.data == 5 || newState.data == 100
|| newState.data == 101 || newState.data == 150)
socket.emit("skip", newState.data);
else if(video_id !== undefined)
ytplayer.loadVideoById(video_id);
@@ -134,13 +142,12 @@ var Youtube = {
if(id !== undefined)
{
var img = new Image();
img.onload = function () {
img.onload = function ()
{
var colorThief = new ColorThief();
//console.log(rgbToHsl(colorThief.getColor(img)));
document.getElementsByTagName("body")[0].style.backgroundColor = Helper.rgbToHsl(colorThief.getColor(img))
//$("body").css("background-color", rgbToHsl(colorThief.getColor(img)));
//$("body").css("background-color", colorThief.getColor(img));
document.getElementsByTagName("body")[0].style.backgroundColor = Helper.rgbToHsl(colorThief.getColor(img));
};
img.crossOrigin = 'Anonymous';
img.src = '//zoff.no:8080/http://img.youtube.com/vi/'+id+'/mqdefault.jpg';
}