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

Completely removed jQuery

Browse Source 
- Missing results/search not working properly
This commit is contained in:
Kasper Rynning-Tønnesen
2018-04-25 16:59:40 +02:00
parent f540f10cca
commit e01bef2ace
22 changed files with 1112 additions and 993 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
gulpfile.js
View File

@@ -52,7 +52,7 @@ gulp.task('build', function() {
})
gulp.task('remotecontroller', function () {
gulp.src(['server/VERSION.js', 'server/config/api_key.js', 'server/public/assets/js/remotecontroller.js'])
gulp.src(['server/VERSION.js', 'server/config/api_key.js', 'server/public/assets/js/remotecontroller.js', 'server/public/assets/js/helpers.js'])
.pipe(uglify({
mangle: true,
compress: true,

1
server/public/assets/css/style.css
View File

@@ -2308,6 +2308,7 @@ nav ul li:hover, nav ul li.active {
#controls
{
overflow: hidden;
z-index: 99999999999;
opacity:0;
height:32px;

8
server/public/assets/js/admin.js
View File

@@ -32,7 +32,7 @@ var Admin = {
//Crypt.set_pass(chan.toLowerCase(), Crypt.tmp_pass);
for (var i = 0; i < names.length; i++) {
document.getElementsByName(names[i])[0].setAttribute("disabled", false);
document.getElementsByName(names[i])[0].removeAttribute("disabled");
}
Helper.removeClass(".card-action", "hide");
@@ -162,7 +162,11 @@ var Admin = {
for (var i = 0; i < names.length; i++) {
document.getElementsByName(names[i])[0].checked = (conf_array[names[i]] === true);
document.getElementsByName(names[i])[0].setAttribute("disabled", show_disabled);
if(show_disabled) {
document.getElementsByName(names[i])[0].setAttribute("disabled", show_disabled);
} else {
document.getElementsByName(names[i])[0].removeAttribute("disabled");
}
}
if((hasadmin) && !Admin.logged_in) {
if(Helper.html("#admin-lock") != "lock") Admin.display_logged_out();

7
server/public/assets/js/channel.js
View File

@@ -246,7 +246,7 @@ var Channel = {
html: "Cast Zoff to TV"
});
$("#color_embed").spectrum({
/*$("#color_embed").spectrum({
color: "#808080",
change: function(c) {
color = c.toHexString().substring(1); // #ff0000
@@ -256,12 +256,13 @@ var Channel = {
containerClassName: 'polyfill-color z-depth-4',
show: function(color) {
},
});
});*/
Helper.addClass(".sp-choose", "hide");
/*Helper.addClass(".sp-choose", "hide");
Helper.addClass(".sp-cancel", "btn-flat waves-effect waves-red");
Helper.removeClass(".sp-cancel", "sp-cancel");
document.getElementsByClassName("sp-button-container")[0].insertAdjacentHTML("beforeend", "<a href='#' class='btn-flat waves-effect waves-green sp-choose-link'>CHOOSE</a>");
*/
}
addListener("click", ".sp-choose-link", function(e) {

51
server/public/assets/js/chat.js
View File

@@ -42,9 +42,9 @@ var Chat = {
if(data.value.startsWith("/name ")){
Chat.namechange(data.value.substring(6), false);
} else if(data.value.startsWith("/help")) {
if($(".chat-tab-li a.active").attr("href") == "#all_chat"){
if($("#chatall").children().length > 100) {
$("#chatall").children()[0].remove()
if(document.querySelector(".chat-tab-li a.active").getAttribute("href") == "#all_chat"){
if(document.querySelector("#chatall").children.length > 100) {
document.querySelector("#chatall").children[0].remove()
}
for(var x = 0; x < Chat.chat_help.length; x++) {
var color = Helper.intToARGB(Helper.hashCode("System"));
@@ -55,14 +55,14 @@ var Chat = {
}
color = Helper.hexToRgb(color.substring(0,6));
var color_temp = Helper.rgbToHsl([color.r, color.g, color.b], false);
$("#chatall").append("<li title='Zoff''><span style='color:"+color_temp+";'>System</span>: </li>");
document.querySelector("#chatall").insertAdjacentHTML("beforeend", "<li title='Zoff''><span style='color:"+color_temp+";'>System</span>: </li>");
var in_text = document.createTextNode(Chat.chat_help[x]);
$("#chatall li:last")[0].appendChild(in_text);
document.querySelector("#chatall").children[document.querySelector("#chatall").children.length - 1].appendChild(in_text);
document.getElementById("chatall").scrollTop = document.getElementById("chatall").scrollHeight;
}
} else {
if($("#chatchannel").children().length > 100) {
$("#chatchannel").children()[0].remove()
if(document.querySelector("#chatchannel").children.length > 100) {
document.querySelector("#chatchannel").children[0].remove()
}
for(var x = 0; x < Chat.chat_help.length; x++) {
@@ -74,15 +74,14 @@ var Chat = {
}
color = Helper.hexToRgb(color.substring(0,6));
var color_temp = Helper.rgbToHsl([color.r, color.g, color.b], false);
$("#chatchannel").append("<li><span style='color:"+color_temp+";'>System</span>: </li>");
document.querySelector("#chatchannel").insertAdjacentHTML("beforeend", "<li><span style='color:"+color_temp+";'>System</span>: </li>");
var in_text = document.createTextNode(Chat.chat_help[x]);
$("#chatchannel li:last")[0].appendChild(in_text);
document.getElementById("chatchannel").scrollTop = document.getElementById("chatchannel").scrollHeight;
}
}
} else if(data.value.startsWith("/removename")) {
Chat.removename();
} else if($(".chat-tab-li a.active").attr("href") == "#all_chat") {
} else if(document.querySelector(".chat-tab-li a.active").getAttribute("href") == "#all_chat") {
socket.emit("all,chat", {channel: chan.toLowerCase(), data: data.value});
} else {
socket.emit("chat", {channel: chan.toLowerCase(), data: data.value});
@@ -94,20 +93,20 @@ var Chat = {
allchat: function(inp, time_sent, disable_blink) {
if(inp.msg.substring(0,1) == ":" && !chat_active && !disable_blink) {
Chat.all_received += 1;
$("#favicon").attr("href", "/assets/images/highlogo.png");
document.querySelector("#favicon").getAttribute("href", "/assets/images/highlogo.png");
unseen = true;
chat_unseen = true;
Helper.removeClass(".chat-link span badge new white", "hide");
Helper.removeClass(document.querySelector(".chat-link span.badge.new.white"), "hide");
var to_display = Chat.channel_received + Chat.all_received > 9 ? "9+" : Chat.channel_received + Chat.all_received;
Helper.setHtml(".chat-link span badge new white", to_display);
Helper.setHtml(document.querySelector(".chat-link span.badge.new.white"), to_display);
}
if(document.hidden) {
document.getElementById("favicon").setAttribute("href", "/assets/images/highlogo.png");
}
if($("#chatall").children().length > 100) {
$("#chatall").children()[0].remove()
if(document.querySelector("#chatall").children.length > 100) {
document.querySelector("#chatall").children[0].remove()
}
var color = Helper.intToARGB(Helper.hashCode(inp.from));
if(color.length < 6) {
@@ -127,9 +126,9 @@ var Chat = {
_time = new Date(time_sent);
}
var time = Helper.pad(_time.getHours()) + ":" + Helper.pad(_time.getMinutes());
$("#chatall").append("<li title='"+inp.channel+"'><span class='time_color'>" + time + "</span> " + icon_add + "<span style='color:"+color_temp+";'>"+inp.from+"</span><span class='channel-info-all-chat'> " + inp.channel + " </span></li>");
document.querySelector("#chatall").insertAdjacentHTML("beforeend", "<li title='"+inp.channel+"'><span class='time_color'>" + time + "</span> " + icon_add + "<span style='color:"+color_temp+";'>"+inp.from+"</span><span class='channel-info-all-chat'> " + inp.channel + " </span></li>");
var in_text = document.createTextNode(inp.msg);
$("#chatall li:last")[0].appendChild(in_text);
document.querySelector("#chatall").children[document.querySelector("#chatall").children.length - 1].appendChild(in_text);
if(!userscroll) {
programscroll = true;
document.getElementById("chatall").scrollTop = document.getElementById("chatall").scrollHeight;
@@ -139,18 +138,18 @@ var Chat = {
channelchat: function(data, time_sent, disable_blink) {
if(data.msg.substring(0,1) == ":" && !chat_active && !disable_blink) {
$("#favicon").attr("href", "/assets/images/highlogo.png");
document.querySelector("#favicon").setAttribute("href", "/assets/images/highlogo.png");
unseen = true;
chat_unseen = true;
Chat.channel_received += 1;
//blink_interval = setTimeout(Chat.chat_blink, 1000);
Helper.removeClass(".chat-link span badge new white", "hide");
Helper.removeClass(document.querySelector(".chat-link span.badge.new.white"), "hide");
var to_display = Chat.channel_received + Chat.all_received > 9 ? "9+" : Chat.channel_received + Chat.all_received;
Helper.setHtml(".chat-link span badge new white", to_display);
Helper.setHtml(document.querySelector(".chat-link span.badge.new.white"), to_display);
}
if($("#chatchannel").children().length > 100) {
$("#chatchannel").children()[0].remove()
if(document.querySelector("#chatchannel").children.length > 100) {
document.querySelector("#chatchannel").children[0].remove()
}
var icon_add = "";
@@ -171,9 +170,9 @@ var Chat = {
_time = new Date(time_sent);
}
var time = Helper.pad(_time.getHours()) + ":" + Helper.pad(_time.getMinutes());
$("#chatchannel").append("<li><span class='time_color'>" + time + "</span> " + icon_add + "<span style='color:"+color_temp+";'>"+data.from+"</span></li>");
document.querySelector("#chatchannel").insertAdjacentHTML("beforeend", "<li><span class='time_color'>" + time + "</span> " + icon_add + "<span style='color:"+color_temp+";'>"+data.from+"</span> </li>");
var in_text = document.createTextNode(data.msg);
$("#chatchannel li:last")[0].appendChild(in_text);
document.querySelector("#chatchannel").children[document.querySelector("#chatchannel").children.length - 1].appendChild(in_text);
if(!userscroll) {
programscroll = true;
document.getElementById("chatchannel").scrollTop = document.getElementById("chatchannel").scrollHeight;
@@ -183,9 +182,9 @@ var Chat = {
chat_blink: function() {
blinking = true;
$(".chat-link").attr("style", "color: grey !important;");
document.querySelector(".chat-link").setAttribute("style", "color: grey !important;");
setTimeout(function () {
$(".chat-link").attr("style", "color: white !important;");
document.querySelector(".chat-link").setAttribute("style", "color: white !important;");
setTimeout(function() {
if(blinking) Chat.chat_blink();
}, 1000);

55
server/public/assets/js/embed.js
View File

@@ -6,8 +6,9 @@ var paused = false;
var client = false;
var startTime = 0;
var socket_connected = false;
var dynamicListeners = {};
var player_ready = false;
var list_html = $("#list-song-html").html();
var list_html = document.getElementById("list-song-html").innerHTML;
var w_p = true;
var lazy_load = false;
var end_programmatically = false;
@@ -66,11 +67,11 @@ function receiveMessage(event) {
window.addEventListener("message", receiveMessage, false);
$(document).ready(function() {
window.addEventListener("load", function() {
if(hash.length >= 3 && hash[2] == "autoplay"){
autoplay = true;
$("#player").css("visibility", "hidden");
Helper.css("#player", "visibility", "hidden");
} else {
paused = true;
}
@@ -120,8 +121,8 @@ $(document).ready(function() {
Playercontrols.initSlider();
window.setVolume = setVolume;
$("#controls").css("background-color", color);
$("#playlist").css("background-color", color);
Helper.css("#controls", "background-color", color);
Helper.css("#playlist", "background-color", color);
if(hash.indexOf("controll") > -1) {
Hostcontroller.change_enabled(true);
} else {
@@ -285,8 +286,8 @@ function toast(msg) {
tried_again = false;
adminpass = Crypt.get_pass(chan.toLowerCase()) == undefined ? Crypt.tmp_pass : Crypt.get_pass(chan.toLowerCase());
msg="Correct password. You now have access to the sacred realm of The Admin.";
$("#thumbnail_form").css("display", "inline-block");
$("#description_form").css("display", "inline-block");
Helper.css("#thumbnail_form", "display", "inline-block");
Helper.css("#description_form", "display", "inline-block");
if(!Helper.mobilecheck()) {
Helper.tooltip('#chan_thumbnail', {
delay: 5,
@@ -326,6 +327,28 @@ function emit() {
}
}
function handleEvent(e, target, tried, type) {
if(dynamicListeners[type] && dynamicListeners[type]["#" + target.id]) {
dynamicListeners[type]["#" + target.id].call(target);
return;
} else {
for(var i = 0; i < target.classList.length; i++) {
if(dynamicListeners[type] && dynamicListeners[type]["." + target.classList[i]]) {
dynamicListeners[type]["." + target.classList[i]].call(target);
return;
}
}
}
if(!tried) {
handleEvent(e, e.target.parentElement, true, type);
}
}
function addListener(type, element, callback) {
if(dynamicListeners[type] == undefined) dynamicListeners[type] = {};
dynamicListeners[type][element] = callback;
}
function before_toast(){
/*if($('.toast').length > 0) {
var toastElement = $('.toast').first()[0];
@@ -336,32 +359,36 @@ function before_toast(){
//Materialize.Toast.removeAll();
}
$(document).on( "click", "#zoffbutton", function(e) {
document.addEventListener("click", function(e) {
handleEvent(e, e.target, false, "click");
}, false);
addListener("click", "#zoffbutton", function(e) {
Player.pauseVideo();
window.open("https://zoff.me/" + chan.toLowerCase() + "/", '_blank');
});
$(document).on( "click", ".vote-container", function(e) {
var id = $(this).attr("data-video-id");
addListener("click", ".vote-container", function(e) {
var id = this.getAttribute("data-video-id");
List.vote(id, "pos");
});
$(document).on("click", ".prev_page", function(e) {
addListener("click", ".prev_page", function(e) {
e.preventDefault();
List.dynamicContentPage(-1);
});
$(document).on("click", ".next_page", function(e) {
addListener("click", ".next_page", function(e) {
e.preventDefault();
List.dynamicContentPage(1);
});
$(document).on("click", ".last_page", function(e){
addListener("click", ".last_page", function(e){
e.preventDefault();
List.dynamicContentPage(10);
});
$(document).on("click", ".first_page", function(e){
addListener("click", ".first_page", function(e){
e.preventDefault();
List.dynamicContentPage(-10);
});

40
server/public/assets/js/frontpage.js
View File

@@ -148,8 +148,9 @@ var Frontpage = {
});
document.getElementById("preloader").style.display = "none";
document.getElementById("channels").style.display = "block";
//Materialize.fadeInImage('#channels');
$("#channels").fadeIn(800);
//$("#channels").fadeIn(800);
document.getElementById("autocomplete-input").focus();
num = 0;
},
@@ -201,11 +202,11 @@ var Frontpage = {
//$(".room-namer").css("opacity", 0);
setTimeout(function(){
if(frontpage){
$("#mega-background").css("background", "url(data:image/png;base64,"+Frontpage.blob_list[i]+")");
$("#mega-background").css("background-size" , "cover");
$("#mega-background").css("background-repeat" , "no-repeat");
$("#mega-background").css("opacity", 1);
$(".autocomplete").attr("placeholder", list[i]._id);
Helper.css("#mega-background","background", "url(data:image/png;base64,"+Frontpage.blob_list[i]+")");
Helper.css("#mega-background","background-size" , "cover");
Helper.css("#mega-background","background-repeat" , "no-repeat");
Helper.css("#mega-background","opacity", 1);
document.querySelector(".autocomplete").setAttribute("placeholder", list[i]._id);
//$(".room-namer").css("opacity", 1);
}
},500);
@@ -222,26 +223,27 @@ var Frontpage = {
type: "POST",
data: {id:id},
url: add + "/api/imageblob",
headers: {"Content-Type": "application/json;charset=UTF-8"},
success: function(data){
setTimeout(function(){
$("#mega-background").css("background", "url(/assets/images/thumbnails/"+data+")");
$("#mega-background").css("background-size" , "cover");
$("#mega-background").css("background-repeat" , "no-repeat");
$("#mega-background").css("opacity", 1);
$(".autocomplete").attr("placeholder", list[i]._id);
Helper.css("#mega-background", "background", "url(/assets/images/thumbnails/"+data+")");
Helper.css("#mega-background", "background-size" , "cover");
Helper.css("#mega-background", "background-repeat" , "no-repeat");
Helper.css("#mega-background", "opacity", 1);
document.querySelector(".autocomplete").setAttribute("placeholder", list[i]._id);
},500);
},
error: function() {
$(".autocomplete").attr("placeholder", list[i]._id);
document.querySelector(".autocomplete").setAttribute("placeholder", list[i]._id);
}
});
};
img.onload = function(){ // Loaded successfully
$("#mega-background").css("background", "url("+img.src+")");
$("#mega-background").css("background-size" , "cover");
$("#mega-background").css("background-repeat" , "no-repeat");
$("#mega-background").css("opacity", 1);
$(".autocomplete").attr("placeholder", list[i]._id);
Helper.css("#mega-background", "background", "url("+img.src+")");
Helper.css("#mega-background", "background-size" , "cover");
Helper.css("#mega-background", "background-repeat" , "no-repeat");
Helper.css("#mega-background", "opacity", 1);
document.querySelector(".autocomplete").setAttribute("placeholder", list[i]._id);
};
}
@@ -306,7 +308,7 @@ var Frontpage = {
},
set_viewers: function(viewers) {
$("#frontpage-viewer-counter").html("<i class='material-icons frontpage-viewers'>visibility</i>" + viewers);
document.querySelector("#frontpage-viewer-counter").innerHTML = "<i class='material-icons frontpage-viewers'>visibility</i>" + viewers;
},
to_channel: function(new_channel, popstate) {
@@ -439,7 +441,7 @@ var Frontpage = {
window.location.reload(true);
});
}
if($("#alreadyfp").length === 0 || Helper.mobilecheck() || !socket._callbacks.$playlists || user_auth_avoid){
if(document.querySelectorAll("#alreadyfp").length === 0 || Helper.mobilecheck() || !socket._callbacks.$playlists || user_auth_avoid){
setup_playlist_listener();
}

222
server/public/assets/js/functions.js
View File

@@ -23,12 +23,12 @@ function removeAllListeners() {
function getColor(id) {
Helper.ajax({
type: "POST",
method: "POST",
url: "/api/color",
async: true,
data: {
headers: {"Content-Type": "application/json;charset=UTF-8"},
data: JSON.stringify({
id: id
},
}),
success: function(c) {
c = JSON.parse(c);
if(typeof(c) == "object") {
@@ -40,9 +40,7 @@ function getColor(id) {
function hide_native(way) {
if(way == 1){
if(!$('.castButton').hasClass('castButton-white-active')) {
$('.castButton').addClass('castButton-white-active');
}
Helper.addClass('.castButton', 'castButton-white-active');
if(!Helper.mobilecheck()) {
if(M.Tooltip.getInstance(document.getElementsByClassName("castButton")[0])) {
Helper.tooltip('.castButton', 'destroy');
@@ -53,19 +51,19 @@ function hide_native(way) {
html: "Stop casting"
});
}
$("#duration").toggleClass("hide");
$("#fullscreen").toggleClass("hide");
Helper.toggleClass("#duration", "hide");
Helper.toggleClass("#fullscreen", "hide");
try{
Player.player.stopVideo();
} catch(e){}
Player.stopInterval = true;
if(Helper.mobilecheck()){
if($("#pause").hasClass("hide")){
$("#play").toggleClass("hide");
$("#pause").toggleClass("hide");
} else if($("#play").hasClass("hide")){
$("#play").toggleClass("hide");
$("#pause").toggleClass("hide");
if(document.querySelector("#pause").classList.contains("hide")){
Helper.toggleClass("#play", "hide");
Helper.toggleClass("#pause", "hide");
} else if(document.querySelector("#play").classList.contains("hide")){
Helper.toggleClass("#play", "hide");
Helper.toggleClass("#pause", "hide");
}
} else {
Playercontrols.visualVolume(100);
@@ -87,7 +85,7 @@ function hide_native(way) {
}
Player.player.setVolume(100);
$("#player_overlay_text").toggleClass("hide");
Helper.toggleClass("#player_overlay_text", "hide");
} else if(way == 0){
if(!Helper.mobilecheck()) {
if(M.Tooltip.getInstance(document.getElementsByClassName("castButton")[0])) {
@@ -101,8 +99,8 @@ function hide_native(way) {
}
Helper.removeClass('.castButton', 'castButton-white-active');
$("#duration").toggleClass("hide");
$("#fullscreen").toggleClass("hide");
Helper.toggleClass("#duration", "hide");
Helper.toggleClass("#fullscreen", "hide");
Player.player.playVideo();
Player.stopInterval = false;
duration = Player.player.getDuration();
@@ -112,7 +110,7 @@ function hide_native(way) {
Playercontrols.visualVolume(Crypt.get_volume());
}
Helper.addClass("#player_overlay", "hide");
$("#player_overlay_text").toggleClass("hide");
Helper.toggleClass("#player_overlay_text", "hide");
Helper.setHtml("#chromecast_text", "");
Helper.css("#playing_on", "display", "none");
if(!offline){
@@ -157,7 +155,7 @@ function start_auth() {
Helper.removeClass("#player_overlay", "hide");
Helper.css("#player_overlay", "display", "block");
M.Modal.getInstance(document.getElementById("user_password")).open();
$("#user-pass-input").focus();
document.querySelector("#user-pass-input").focus();
//Crypt.remove_userpass(chan.toLowerCase());
before_toast();
M.toast({html: "That is not the correct password, try again..", displayLength: 4000});
@@ -186,6 +184,7 @@ function get_list_ajax() {
userpass: "",
token: zoff_api_token,
},
headers: {"Content-Type": "application/json;charset=UTF-8"},
url: "/api/list/" + chan.toLowerCase(),
success: function(response) {
response = JSON.parse(response);
@@ -217,24 +216,26 @@ function get_list_ajax() {
}
function contextListener(that, e) {
var parent = $(that).parent();
console.log("here");
var parent = that.parentElement;
var suggested = false;
if(parent.attr("id").indexOf("suggested-") > -1) suggested = true;
if(parent.id.indexOf("suggested-") > -1) suggested = true;
document.getElementsByClassName("context-menu-root")[0].setAttribute("data-suggested", suggested);
document.getElementsByClassName("context-menu-root")[0].setAttribute("data-id", parent.attr("id").replace("suggested-", ""));
document.getElementsByClassName("context-menu-root")[0].setAttribute("data-id", parent.getAttribute("id").replace("suggested-", ""));
Helper.removeClass("#context-menu-overlay", "hide");
var left = e.pageX - $(".context-menu-root").width() / 2;
var top = e.pageY;
if(left + 200 > $(window).width()) {
left = $(window).width() - 200 - 15;
var left = event.pageX - document.querySelector(".context-menu-root").offsetWidth / 2;
var top = event.pageY;
if(left + 200 > window.innerWidth) {
left = window.innerWidth - 200 - 15;
} else if (left < 0) {
left = 11;
}
if(top + 96 > $(window).height()) {
top = $(window).height() - 96 - 15;
if(top + 96 > window.innerHeight) {
top = window.innerHeight - 96 - 15;
} else if(top < 0) {
top = 15;
}
console.log(event.pageX);
Helper.css(".context-menu-root", "left", left + "px");
Helper.css(".context-menu-root", "top", top + "px");
Helper.removeClass(".context-menu-root","hide");
@@ -244,15 +245,18 @@ function contextListener(that, e) {
}
function mouseContext(left, top) {
$(document).off("mousemove");
$(document).mousemove(function( event ) {
if(event.pageX < left - 60 || event.pageX > left + $(".context-menu-root").width() + 60 ||
event.pageY < top - 60 || event.pageY > top + $(".context-menu-root").height() + 60) {
var moveFunction = function( event ) {
if(event.pageX < left - 60 || event.pageX > left + document.querySelector(".context-menu-root").offsetWidth + 60 ||
event.pageY < top - 60 || event.pageY > top + document.querySelector(".context-menu-root").offsetHeight + 60) {
Helper.addClass(".context-menu-root", "hide");
Helper.addClass("#context-menu-overlay", "hide");
$(document).off("mousemove");
document.removeEventListener("mousemove", moveFunction);
}
});
};
try {
document.removeEventListener("mousemove", moveFunction);
} catch(e) {}
document.addEventListener("mousemove", moveFunction, false);
}
function get_np_ajax() {
@@ -265,6 +269,7 @@ function get_np_ajax() {
fetch_song: true,
token: zoff_api_token
},
headers: {"Content-Type": "application/json;charset=UTF-8"},
url: "/api/list/" + chan.toLowerCase() + "/__np__",
success: function(response) {
response = JSON.parse(response);
@@ -295,6 +300,7 @@ function del_ajax(id) {
userpass: "",
token: zoff_api_token
},
headers: {"Content-Type": "application/json;charset=UTF-8"},
url: "/api/list/" + chan.toLowerCase() + "/" + id,
success: function(response) {
toast("deletesong");
@@ -329,6 +335,7 @@ function add_ajax(id, title, duration, playlist, num, full_num, start, end) {
start_time: start,
token: zoff_api_token
},
headers: {"Content-Type": "application/json;charset=UTF-8"},
url: "/api/list/" + chan.toLowerCase() + "/" + id,
success: function(response) {
toast("addedsong");
@@ -361,6 +368,7 @@ function vote_ajax(id) {
userpass: "",
token: zoff_api_token
},
headers: {"Content-Type": "application/json;charset=UTF-8"},
url: "/api/list/" + chan.toLowerCase() + "/" + id,
success: function(response) {
toast("voted");
@@ -446,7 +454,7 @@ function setup_viewers_listener(){
viewers = view;
var outPutWord = "<i class='material-icons'>visibility</i>"//v > 1 ? "viewers" : "viewer";
$("#viewers").html(outPutWord + " " + view);
Helper.setHtml("#viewers", outPutWord + " " + view);
if(song_title !== undefined)
Player.getTitle(song_title, viewers);
@@ -528,19 +536,42 @@ function change_offline(enabled, already_offline){
Helper.tooltip("#offline-mode", 'destroy');
}
}
if(enabled){
if(list_html){
list_html = $("<div>" + list_html + "</div>");
//list_html.find(".list-remove").removeClass("hide");
list_html = list_html.html();
var mouseEnter = function(e){
Helper.removeClass("#seekToDuration", "hide");
};
var mouseLeave = function(e){
dragging = false;
Helper.addClass("#seekToDuration", "hide");
};
var mouseDown = function(e) {
var acceptable = ["bar", "controls", "duration"];
if(acceptable.indexOf(e.target.id) >= 0) {
dragging = true;
}
};
var mouseUp = function(e) {
dragging = false;
};
if(enabled){
/*if(list_html == undefined){
var tempOuter = document.createElement("div");
list_html.innerHTML = list_html;
//list_html.find(".list-remove").removeClass("hide");
list_html = list_html.innerHTML;
}*/
//$(".list-remove").removeClass("hide");
Helper.addClass("#viewers", "hide");
Helper.removeClass(".margin-playbar", "margin-playbar");
Helper.addClass(".prev.playbar", "margin-playbar");
Helper.removeClass(".prev.playbar", "hide");
Helper.addClass(".prev playbar", "margin-playbar");
Helper.removeClass(".prev playbar", "hide");
Helper.removeClass("#offline-mode", "waves-cyan");
Helper.addClass("#offline-mode", "cyan");
Helper.removeClass(".delete-context-menu", "context-menu-disabled");
if(!Helper.mobilecheck()) {
Helper.tooltip("#offline-mode", {
delay: 5,
@@ -551,35 +582,18 @@ function change_offline(enabled, already_offline){
if(window.location.pathname != "/"){
socket.removeEventListener("color");
$("#controls").on("mouseenter", function(e){
Helper.removeClass("#seekToDuration", "hide");
});
document.getElementById("controls").addEventListener("mouseenter", mouseEnter, false);
document.getElementById("controls").addEventListener("mouseleave", mouseLeave, false);
document.getElementById("controls").addEventListener("mousedown", mouseDown, false);
document.getElementById("controls").addEventListener("mouseup", mouseUp, false);
document.getElementById("controls").addEventListener("mousemove", Channel.seekToMove);
document.getElementById("controls").addEventListener("click", Channel.seekToClick);
$("#controls").on("mouseleave", function(e){
dragging = false;
Helper.addClass("#seekToDuration", "hide");
});
$("#controls").on("mousedown", function(e) {
var acceptable = ["bar", "controls", "duration"];
if(acceptable.indexOf($(e.target).attr("id")) >= 0) {
dragging = true;
}
});
$("#controls").on("mouseup", function(e) {
dragging = false;
});
$("#controls").on("mousemove", Channel.seekToMove);
$("#controls").on("click", Channel.seekToClick);
$("#main_components").append("<div id='seekToDuration' class='hide'>00:00/01:00</div>");
if(!Helper.mobilecheck()) $("#seekToDuration").css("top", $("#controls").position().top - 55);
else if(Helper.mobilecheck()) $("#seekToDuration").css("top", $("#controls").position().top - 20);
document.querySelector("#main_components").insertAdjacentHTML("beforeend", "<div id='seekToDuration' class='hide'>00:00/01:00</div>");
var controlElement = document.querySelector("#controls");
if(!Helper.mobilecheck()) Helper.css("#seekToDuration", "top", controlElement.offsetHeight - parseInt(controlElement.style.height) - 55);
else if(Helper.mobilecheck()) Helper.css("#seekToDuration", "top", controlElement.offsetHeight - parseInt(controlElement.style.height) - 20);
Helper.addClass("#controls", "ewresize");
} else {
$("#controls").off("mouseenter");
$("#controls").off("mouseleave");
$("#controls").off("mousemove");
$("#controls").off("click");
}
if(full_playlist != undefined && !already_offline){
for(var x = 0; x < full_playlist.length; x++){
@@ -589,14 +603,17 @@ function change_offline(enabled, already_offline){
List.populate_list(full_playlist);
}
} else {
if(list_html){
list_html = $("<div>" + list_html + "</div>");
list_html = list_html.html();
}
/*if(list_html == undefined){
var tempOuter = document.createElement("div");
list_html.innerHTML = list_html;
//list_html.find(".list-remove").removeClass("hide");
list_html = list_html.innerHTML;
}*/
if(!Admin.logged_in) Helper.addClass(".delete-context-menu", "context-menu-disabled");
Helper.removeClass(".margin-playbar", "margin-playbar");
Helper.addClass("#playpause", "margin-playbar");
Helper.removeClass("#viewers", "hide");
Helper.addClass(".prev.playbar", "hide");
Helper.addClass(".prev playbar", "hide");
Helper.addClass("#offline-mode", "waves-cyan");
Helper.removeClass("#offline-mode", "cyan");
if(!Helper.mobilecheck()) {
@@ -607,14 +624,14 @@ function change_offline(enabled, already_offline){
});
}
$("#controls").off("mouseleave");
$("#controls").off("mouseenter");
$("#controls").off("mousedown");
$("#controls").off("mouseup");
$("#controls").off("mousemove", Channel.seekToMove);
$("#controls").off("click", Channel.seekToClick);
Helper.removeElement("#seekToDuration");
if(window.location.pathname != "/"){
document.getElementById("controls").removeEventListener("mouseenter", mouseEnter, false);
document.getElementById("controls").removeEventListener("mouseleave", mouseLeave, false);
document.getElementById("controls").removeEventListener("mousedown", mouseDown, false);
document.getElementById("controls").removeEventListener("mouseup", mouseUp, false);
document.getElementById("controls").removeEventListener("mousemove", Channel.seekToMove);
document.getElementById("controls").removeEventListener("click", Channel.seekToClick);
Helper.removeElement("#seekToDuration");
socket.on("color", Player.setBGimage);
socket.emit("pos", {channel: chan.toLowerCase()});
var add = "";
@@ -626,20 +643,27 @@ function change_offline(enabled, already_offline){
}
function handleEvent(e, target, tried, type) {
if(dynamicListeners[type] && dynamicListeners[type]["#" + target.id]) {
dynamicListeners[type]["#" + target.id].call(target);
return;
} else {
for(var i = 0; i < target.classList.length; i++) {
if(dynamicListeners[type] && dynamicListeners[type]["." + target.classList[i]]) {
dynamicListeners[type]["." + target.classList[i]].call(target);
return;
//console.log(target, dynamicListeners);
//console.log(e.path, target);
console.log(target);
for(var y = 0; y < e.path.length; y++) {
var target = e.path[y];
if(dynamicListeners[type] && dynamicListeners[type]["#" + target.id]) {
//console.log(target.id);
dynamicListeners[type]["#" + target.id].call(target);
return;
} else {
if(target.classList == undefined) return;
for(var i = 0; i < target.classList.length; i++) {
if(dynamicListeners[type] && dynamicListeners[type]["." + target.classList[i]]) {
//console.log(target.id);
dynamicListeners[type]["." + target.classList[i]].call(target);
return;
}
}
}
}
if(!tried) {
handleEvent(e, e.target.parentElement, true, type);
}
}
function addListener(type, element, callback) {
@@ -843,25 +867,25 @@ function before_toast(){
}
function scrollChat() {
var current = $(".chat-tab active").attr("href");
var current = document.querySelector(".chat-tab active").getAttribute("href");
if(current == "#channelchat") {
$('#chatchannel').scrollTop($('#chatchannel')[0].scrollHeight);
document.querySelector('#chatchannel').scrollTop(document.querySelector('#chatchannel').scrollHeight);
} else if(current == "#all_chat") {
$('#chatall').scrollTop($('#chatall')[0].scrollHeight);
document.querySelector('#chatall').scrollTop(document.querySelector('#chatall').scrollHeight);
}
}
function searchTimeout(event) {
search_input = $(".search_input").val();
search_input = document.getElementsByClassName("search_input")[0].value;
code = event.keyCode || event.which;
if (code != 40 && code != 38 && code != 13 && code != 39 && code != 37 && code != 17 && code != 16 && code != 225 && code != 18 && code != 27) {
clearTimeout(timeout_search);
if(search_input.length < 3){
$("#results").html("");
document.querySelector("#results").innerHTML = "";
if(search_input.length == 0) {
$("body").attr("style", "overflow-y: auto");
document.querySelector("body").setAttribute("style", "overflow-y: auto");
}
}
if(code == 13){

98
server/public/assets/js/helpers.js
View File

@@ -63,6 +63,19 @@ var Helper = {
css: function(element, attribute, value) {
try {
if(typeof(element) == "object") {
try {
if(element.length > 0) {
for(var i = 0; i < element.length; i++) {
element[i].style[attribute] = value;
}
} else {
element.style[attribute] = value;
}
} catch(e) {
element.style[attribute] = value;
}
}
if(typeof(element) == "object") {
element.style[attribute] = value;
} else if(element.substring(0,1) == "#") {
@@ -232,66 +245,79 @@ var Helper = {
},
addClass: function(element, className) {
if(typeof(element) == "object") {
if(element.className.indexOf(className) == -1) {
element.className += " " + className;
}
} else if(element.substring(0,1) == "#") {
var elem = document.getElementById(element.substring(1));
if(elem.className.indexOf(className) == -1) {
elem.className += " " + className;
}
} else {
var elements;
if(element.substring(0,1) == ".") {
var testSplit = element.substring(1).split(" ");
if(testSplit.length > 1) {
var insideElement = document.getElementsByClassName(testSplit[0]);
elements = [];
for(var i = 0; i < insideElement.length; i++) {
var innards = insideElement[i].querySelectorAll(testSplit[1]);
for(var y = 0; y < innards.length; y++) {
elements.push(innards[y]);
try {
if(typeof(element) == "object") {
try {
if(element.length > 0) {
for(var i = 0; i < element.length; i++) {
if(element[i].className.indexOf(className) == -1) {
element[i].className += " " + className;
}
}
} else {
if(element.className.indexOf(className) == -1) {
element.className += " " + className;
}
}
} else {
elements = document.getElementsByClassName(element.substring(1));
} catch(e) {
console.log(element);
if(element.className.indexOf(className) == -1) {
element.className += " " + className;
}
}
} else if(element.substring(0,1) == "#") {
var elem = document.getElementById(element.substring(1));
if(elem.className.indexOf(className) == -1) {
elem.className += " " + className;
}
} else {
elements = document.getElementsByTagName(element);
}
for(var i = 0; i < elements.length; i++) {
if(elements[i].className.indexOf(className) == -1) {
elements[i].className += " " + className;
var elements;
if(element.substring(0,1) == ".") {
elements = document.getElementsByClassName(element.substring(1));
} else {
elements = document.getElementsByTagName(element);
}
for(var i = 0; i < elements.length; i++) {
if(elements[i].className.indexOf(className) == -1) {
elements[i].className += " " + className;
}
}
}
}
}catch(e) {}
},
ajax: function(obj) {
var _async = true;
if(obj.async) _async = obj.async;
if(obj.method == undefined && obj.type != undefined) obj.method = obj.type;
if(obj.method == undefined) obj.method = "GET";
var xmlhttp = new XMLHttpRequest();
if(obj.headers) {
for(header in obj.headers) {
xmlhttp.setRequestHeader(header, obj.headers[header]);
}
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == XMLHttpRequest.DONE) { // XMLHttpRequest.DONE == 4
if (xmlhttp.status == 200) {
obj.success(xmlhttp.responseText, xmlhttp);
}
else {
else if(obj.hasOwnProperty("error")){
obj.error(xmlhttp);
}
}
};
xmlhttp.open(obj.method, obj.url, _async);
if(obj.headers) {
for(header in obj.headers) {
xmlhttp.setRequestHeader(header, obj.headers[header]);
}
}
if(obj.data) {
var sendRequest = "";
if(typeof(obj.data) == "string") JSON.parse(obj.data);
for(key in obj.data) {
sendRequest += key + "=" + obj.data[key] + "&";
}
sendRequest = sendRequest.substring(0, sendRequest.length - 1);
if(typeof(obj.data) == "object") obj.data = JSON.stringify(obj.data);
//xmlhttp.send(sendRequest);
xmlhttp.send(obj.data);
}
else xmlhttp.send();
@@ -559,10 +585,10 @@ var Helper = {
url: "/api/mail",
success: function(data){
if(data == "success"){
$("#contact-container").empty();
Helper.setHtml("#contact-container", "");
Helper.setHtml("#contact-container", "Mail has been sent, we'll be back with you shortly.")
}else{
$("#contact-container").empty();
Helper.setHtml("#contact-container", "");
Helper.setHtml("#contact-container", "Something went wrong, sorry about that. You could instead try with your own mail-client: <a title='Open in client' href='mailto:contact@zoff.me?Subject=Contact%20Zoff'>contact@zoff.me</a>")
}
}

10
server/public/assets/js/hostcontroller.js
View File

@@ -21,9 +21,9 @@ var Hostcontroller = {
}
}
var codeURL = window.location.protocol + "//remote."+window.location.hostname+"/"+id;
$("#code-text").text(id);
$("#code-qr").attr("src", "https://chart.googleapis.com/chart?chs=221x221&cht=qr&choe=UTF-8&chld=L|1&chl="+codeURL);
$("#code-link").attr("href", codeURL);
document.querySelector("#code-text").innerText = id;
document.querySelector("#code-qr").setAttribute("src", "https://chart.googleapis.com/chart?chs=221x221&cht=qr&choe=UTF-8&chld=L|1&chl="+codeURL);
document.querySelector("#code-link").setAttribute("href", codeURL);
if(!began) {
began = true;
setup_host_listener(id);
@@ -42,7 +42,7 @@ var Hostcontroller = {
Admin.beginning = true;
chan = arr.value.toLowerCase();
$("#chan").html(Helper.upperFirst(chan));
Helper.setHtml("#chan", Helper.upperFirst(chan));
w_p = true;
var add = "";
@@ -62,6 +62,6 @@ var Hostcontroller = {
change_enabled:function(val){
enabled = val;
$(".remote_switch_class").prop("checked", enabled);
document.querySelector(".remote_switch_class").checked = enabled;
}
};

385
server/public/assets/js/list.js
View File

@@ -2,8 +2,8 @@ var List = {
empty: false,
page: 0,
can_fit: Math.round(($("#wrapper").height()) / 71),
element_height: (($("#wrapper").height()) / Math.round(($("#wrapper").height()) / 71)) - 25,
can_fit: document.querySelectorAll("#wrapper").length > 0 ? Math.round((window.getComputedStyle(document.querySelector("#wrapper"), null).getPropertyValue("height")) / 71) : 0,
element_height: document.querySelectorAll("#wrapper").length > 0 ? ((window.getComputedStyle(document.querySelector("#wrapper"), null).getPropertyValue("height")) / Math.round((window.getComputedStyle(document.querySelector("#wrapper"), null).getPropertyValue("height")) / 71)) - 25 : 0,
uris: [],
not_found: [],
num_songs: 0,
@@ -83,13 +83,13 @@ var List = {
changedValues: function(song) {
if(song.type == "suggested") {
$("#suggested-" + song.id).find(".vote-container").attr("title", song.title);
$("#suggested-" + song.id).find(".list-title").attr("title", song.title);
$("#suggested-" + song.id).find(".list-title").text(song.title);
document.querySelector("#suggested-" + song.id).querySelector(".vote-container").setAttribute("title", song.title);
document.querySelector("#suggested-" + song.id).querySelector(".list-title").setAttribute("title", song.title);
document.querySelector("#suggested-" + song.id).querySelector(".list-title").innerText = song.title;
var _temp_duration = Helper.secondsToOther(song.duration);
$("#suggested-" + song.id).find(".card-duration").text(Helper.pad(_temp_duration[0]) + ":" + Helper.pad(_temp_duration[1]));
$("#suggested-" + song.id).find(".list-image").attr("style", "background-image:url('//img.youtube.com/vi/"+song.new_id+"/mqdefault.jpg');");
$("#suggested-" + song.id).attr("id", song.new_id);
document.querySelector("#suggested-" + song.id).querySelector(".card-duration").innerText = Helper.pad(_temp_duration[0]) + ":" + Helper.pad(_temp_duration[1]);
document.querySelector("#suggested-" + song.id).querySelector(".list-image").setAttribute("style", "background-image:url('//img.youtube.com/vi/"+song.new_id+"/mqdefault.jpg');");
document.querySelector("#suggested-" + song.id).setAttribute("id", song.new_id);
return;
}
var i = List.getIndexOfSong(song.id);
@@ -100,20 +100,20 @@ var List = {
full_playlist[i].end = song.end;
full_playlist[i].id = song.new_id;
$("#" + song.id).find(".vote-container").attr("title", song.title);
$("#" + song.id).find(".list-title").attr("title", song.title);
$("#" + song.id).find(".list-title").text(song.title);
document.querySelector("#" + song.id).querySelector(".vote-container").setAttribute("title", song.title);
document.querySelector("#" + song.id).querySelector(".list-title").setAttribute("title", song.title);
document.querySelector("#" + song.id).querySelector(".list-title").innerText = song.title;
var _temp_duration = Helper.secondsToOther(song.duration);
$("#" + song.id).find(".card-duration").text(Helper.pad(_temp_duration[0]) + ":" + Helper.pad(_temp_duration[1]));
$("#" + song.id).find(".list-image").attr("style", "background-image:url('//img.youtube.com/vi/"+song.new_id+"/mqdefault.jpg');");
$("#" + song.id).attr("id", song.new_id);
document.querySelector("#" + song.id).querySelector(".card-duration").innerText = Helper.pad(_temp_duration[0]) + ":" + Helper.pad(_temp_duration[1]);
document.querySelector("#" + song.id).querySelector(".list-image").setAttribute("style", "background-image:url('//img.youtube.com/vi/"+song.new_id+"/mqdefault.jpg');");
document.querySelector("#" + song.id).setAttribute("id", song.new_id);
}
},
insertAtBeginning: function(song_info, transition) {
var display = List.page == 0 ? "" : "none";
var add = List.generateSong(song_info, transition, false, true, false, display, false);
$("#wrapper").append(add);
document.querySelector("#wrapper").insertAdjacentHTML("beforeend", add);
},
insertAtIndex: function(song_info, transition, change) {
@@ -123,21 +123,21 @@ var List = {
if(i >= List.page && i < List.page + (List.can_fit)) display = "inline-flex"
var add = List.generateSong(song_info, transition, false, true, false, display, false);
if(i === 0) {
$("#wrapper").prepend(add);
document.querySelector("#wrapper").insertAdjacentHTML("afterbegin", add);
} else {
$("#wrapper > div:nth-child(" + (i) + ")").after(add);
document.querySelector("#wrapper > div:nth-child(" + (i) + ")").insertAdjacentHTML("afterend", add);
}
var added = $("#wrapper").children()[i];
var added = document.querySelector("#wrapper").children[i];
Helper.css(added, "display", display);
if(display == "inline-flex" && $("#wrapper").children().length >= List.page + List.can_fit + 1){
$($("#wrapper").children()[List.page + List.can_fit]).css("display", "none");
} else if(i < List.page && $("#wrapper").children().length - (List.page + 1) >= 0){
$($("#wrapper").children()[List.page]).css("display", "inline-flex");
} else if($("#wrapper").children().length > List.page + List.can_fit){
$($("#wrapper").children()[List.page + List.can_fit - 1]).css("display", "inline-flex");
if(display == "inline-flex" && document.querySelector("#wrapper").children.length >= List.page + List.can_fit + 1){
Helper.css(document.querySelector("#wrapper").children[List.page + List.can_fit], "display", "none");
} else if(i < List.page && document.querySelector("#wrapper").children.length - (List.page + 1) >= 0){
Helper.css(document.querySelector("#wrapper").children[List.page], "display", "inline-flex");
} else if(document.querySelector("#wrapper").children.length > List.page + List.can_fit){
Helper.css(document.querySelector("#wrapper").children[List.page + List.can_fit - 1], "display", "inline-flex");
}
if(change && List.page > 0){
$($("#wrapper").children()[List.page - 1]).css("display", "none");
Helper.css(document.querySelector("#wrapper").children[List.page - 1], "display", "none");
}
if(transition){
setTimeout(function(){
@@ -153,23 +153,23 @@ var List = {
populate_list: function(msg, no_reset) {
// This math is fucked and I don't know how it works. Should be fixed sometime
if(!Helper.mobilecheck() && !embed && !client){
List.can_fit = Math.round(($("#wrapper").height()) / 71)+1;
List.element_height = (($("#wrapper").height()) / List.can_fit)-5.3;
List.can_fit = Math.round((document.querySelector("#wrapper").offsetHeight) / 71);
List.element_height = ((document.querySelector("#wrapper").offsetHeight) / List.can_fit)-5.3;
} else if(embed) {
List.can_fit = Math.round(($("#wrapper").height()) / 91) + 1;
List.element_height = (($("#wrapper").height()) / List.can_fit)-4;
List.can_fit = Math.round((document.querySelector("#wrapper").offsetHeight) / 91) + 1;
List.element_height = ((document.querySelector("#wrapper").offsetHeight) / List.can_fit)-4;
} else if(!client){
List.can_fit = Math.round(($(window).height() - $(".tabs").height() - $("header").height() - 64 - 40) / 71)+1;
List.element_height = (($(window).height() - $(".tabs").height() - $("header").height() - 64 - 40) / List.can_fit)-5;
List.can_fit = Math.round((window.innerHeight - window.getComputedStyle(document.querySelector(".tabs"), null).getPropertyValue("height") - window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height") - 64 - 40) / 71)+1;
List.element_height = ((window.innerHeight - window.getComputedStyle(document.querySelector(".tabs"), null).getPropertyValue("height") - window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height") - 64 - 40) / List.can_fit)-5;
} else {
List.can_fit = Math.round(($(window).height() - $("header").height() - $("#pageButtons").height()) / 80)+1;
List.element_height = (($(window).height() - $("header").height() - $("#pageButtons").height()) / List.can_fit) - 8;
List.can_fit = Math.round((window.innerHeight - window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height") - window.getComputedStyle(document.querySelector(".pageButtons"), null).getPropertyValue("height")) / 80)+1;
List.element_height = ((window.innerHeight - window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height") - window.getComputedStyle(document.querySelector(".pageButtons"), null).getPropertyValue("height")) / List.can_fit) - 8;
}
if(List.element_height < 55.2 && !client){
List.can_fit = List.can_fit - 1;
List.element_height = 55.2;
List.can_fit = Math.round(($(window).height() - $(".tabs").height() - $("header").height() - 64 - 40) / 71);
List.element_height = (($(window).height() - $(".tabs").height() - $("header").height() - 64 - 40) / List.can_fit)-5;
List.can_fit = Math.round((window.innerHeight - window.getComputedStyle(document.querySelector(".tabs"), null).getPropertyValue("height") - window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height") - 64 - 40) / 71);
List.element_height = ((window.innerHeight - window.getComputedStyle(document.querySelector(".tabs"), null).getPropertyValue("height") - window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height") - 64 - 40) / List.can_fit)-5;
}
if(list_html === undefined) list_html = Helper.html("#list-song-html");
full_playlist = msg;
@@ -180,7 +180,7 @@ var List = {
}
List.sortList();
$("#wrapper").empty();
Helper.setHtml("#wrapper", "");
Helper.log([
"FULL PLAYLIST",
@@ -192,16 +192,16 @@ var List = {
if(!_current_song.hasOwnProperty("start")) full_playlist[j].start = 0;
if(!_current_song.hasOwnProperty("end")) full_playlist[j].end = full_playlist[j].duration;
if(!_current_song.now_playing && _current_song.type != "suggested"){ //check that the song isnt playing
var generated = List.generateSong(_current_song, false, lazy_load, true, false, "", true)
$("#wrapper").append(generated);
var generated = List.generateSong(_current_song, false, lazy_load, true, false, "inline-flex", true)
document.querySelector("#wrapper").insertAdjacentHTML("beforeend", generated);
}
}
if($("#wrapper").children().length > List.can_fit && !$("#pageButtons").length){
if(document.querySelector("#wrapper").children.length > List.can_fit && !document.querySelectorAll("#pageButtons").length){
Helper.css(".prev_page", "display", "none");
Helper.css(".first_page", "display", "none");
Helper.css(".next_page_hide", "display","none");
Helper.css(".last_page_hide", "display","none");
} else if(!$("#pageButtons").length){
} else if(!document.querySelectorAll("#pageButtons").length){
Helper.css(".prev_page", "display", "none");
Helper.css(".next_page", "display", "none");
Helper.css(".last_page", "display", "none");
@@ -267,17 +267,17 @@ var List = {
dynamicContentPageJumpTo: function(page) {
page = page * List.can_fit;
if(page > List.page || page < List.page){
$("#wrapper").children().slice(List.page, List.page + List.can_fit).hide();
Helper.css(document.querySelector("#wrapper").children.slice(List.page, List.page + List.can_fit), "display", "none");
List.page = page;
$("#wrapper").children().slice(List.page, List.page + List.can_fit).css("display", "inline-flex");
if(List.page > 0 && $(".prev_page").css("display") == "none"){
Helper.css(document.querySelector("#wrapper").children.slice(List.page, List.page + List.can_fit), "display", "inline-flex");
if(List.page > 0 && document.querySelector(".prev_page").style.display == "none"){
Helper.css(".prev_page", "display", "inline-flex");
Helper.css(".prev_page_hide", "display", "none");
Helper.css(".first_page", "display", "inline-flex");
Helper.css(".first_page_hide", "display", "none");
}
if(List.page + List.can_fit >= $("#wrapper").children().length){
if(List.page + List.can_fit >= document.querySelector("#wrapper").children.length){
Helper.css(".next_page_hide", "display", "inline-flex");
Helper.css(".next_page", "display", "none");
Helper.css(".last_page_hide", "display", "inline-flex");
@@ -289,89 +289,60 @@ var List = {
},
dynamicContentPage: function(way) {
if(way == 1){
$("#wrapper").children().slice(List.page, List.page + List.can_fit).hide();
List.page = List.page + List.can_fit;
$("#wrapper").children().slice(List.page, List.page + List.can_fit).css("display", "inline-flex");
if(List.page > 0 && $(".prev_page").css("display") == "none"){
var wrapperChildren = [].slice.call(document.querySelector("#wrapper").children);
if(way == 1 || way == 10) {
Helper.css(wrapperChildren.slice(List.page, List.page + List.can_fit), "display", "none");
if(way == 1){
List.page = List.page + List.can_fit;
} else if(way == 10) {
List.page = (Math.floor((document.querySelector("#wrapper").children.length - 1)/ List.can_fit) * List.can_fit);
}
Helper.css(wrapperChildren.slice(List.page, List.page + List.can_fit), "display", "inline-flex");
if(List.page > 0 && document.querySelector(".prev_page").style.display == "none"){
Helper.css(".prev_page", "display", "inline-flex");
Helper.css(".prev_page_hide", "display", "none");
Helper.css(".first_page", "display", "inline-flex");
Helper.css(".first_page_hide", "display", "none");
}
if(List.page + List.can_fit >= $("#wrapper").children().length){
if(List.page + List.can_fit >= document.querySelector("#wrapper").children.length){
Helper.css(".next_page_hide", "display", "inline-flex");
Helper.css(".next_page", "display", "none");
Helper.css(".last_page_hide", "display", "inline-flex");
Helper.css(".last_page", "display", "none");
}
//$("#wrapper").scrollTop(0);
} else if(way == 10) {
$("#wrapper").children().slice(List.page, List.page + List.can_fit).hide();
List.page = (Math.floor(($("#wrapper").children().length - 1)/ List.can_fit) * List.can_fit);
$("#wrapper").children().slice(List.page, List.page + List.can_fit).css("display", "inline-flex");
if(List.page > 0 && $(".prev_page").css("display") == "none"){
Helper.css(".prev_page", "display", "inline-flex");
Helper.css(".prev_page_hide", "display", "none");
Helper.css(".first_page", "display", "inline-flex");
Helper.css(".first_page_hide", "display", "none");
}
if(List.page + List.can_fit >= $("#wrapper").children().length){
Helper.css(".next_page_hide", "display", "inline-flex");
Helper.css(".next_page", "display", "none");
Helper.css(".last_page_hide", "display", "inline-flex");
Helper.css(".last_page", "display", "none");
}
} else if(way==-10) {
$("#wrapper").children().slice(List.page, List.page + List.can_fit).hide();
List.page = 0;
$("#wrapper").children().slice(List.page, List.page + List.can_fit).css("display", "inline-flex");
if(List.page == 0 && $(".prev_page").css("display") != "none"){
Helper.css(".prev_page", "display", "none");
Helper.css(".prev_page_hide", "display", "inline-flex");
Helper.css(".first_page", "display", "none");
Helper.css(".first_page_hide", "display", "inline-flex");
} else if($(".prev_page").css("display") == "none"){
Helper.css(".prev_page_hide", "display", "inline-flex");
Helper.css(".first_page_hide", "display", "inline-flex");
} else {
Helper.css(".prev_page_hide", "display", "none");
Helper.css(".first_page_hide", "display", "none");
}
if(List.page + List.can_fit < $("#wrapper").children().length){
Helper.css(".next_page_hide", "display", "none");
Helper.css(".next_page", "display", "inline-flex");
Helper.css(".last_page_hide", "display", "none");
Helper.css(".last_page", "display", "inline-flex");
}
} else {
$("#wrapper").children().slice(List.page - List.can_fit, List.page).css("display", "inline-flex");
$("#wrapper").children().slice(List.page, List.page + List.can_fit).hide();
List.page = List.page - List.can_fit < 0 ? 0 : List.page - List.can_fit;
if(List.page == 0 && $(".prev_page").css("display") != "none"){
if(way==-10) {
Helper.css(wrapperChildren.slice(List.page, List.page + List.can_fit), "display", "none");
List.page = 0;
//console.log(List.page, List.can_fit, wrapperChildren.slice(List.page, List.page + List.can_fit));
Helper.css(wrapperChildren.slice(List.page, List.page + List.can_fit), "display", "inline-flex");
} else {
Helper.css(wrapperChildren.slice(List.page - List.can_fit, List.page), "display", "inline-flex");
Helper.addClass(wrapperChildren.slice(List.page, List.page + List.can_fit), "hide");
List.page = List.page - List.can_fit < 0 ? 0 : List.page - List.can_fit;
}
if(List.page == 0 && document.querySelector(".prev_page").style.display != "none"){
Helper.css(".prev_page", "display", "none");
Helper.css(".prev_page_hide", "display", "inline-flex");
Helper.css(".first_page", "display", "none");
Helper.css(".first_page_hide", "display", "inline-flex");
} else if($(".prev_page").css("display") == "none"){
} else if(document.querySelector(".prev_page").style.display == "none"){
Helper.css(".prev_page_hide", "display", "inline-flex");
Helper.css(".first_page_hide", "display", "inline-flex");
} else {
Helper.css(".prev_page_hide", "display", "none");
Helper.css(".first_page_hide", "display", "none");
}
if(List.page + List.can_fit < $("#wrapper").children().length){
if(List.page + List.can_fit < document.querySelector("#wrapper").children.length){
Helper.css(".next_page_hide", "display", "none");
Helper.css(".next_page", "display", "inline-flex");
Helper.css(".last_page_hide", "display", "none");
Helper.css(".last_page", "display", "inline-flex");
}
}
$("#pageNumber").html((List.page / List.can_fit) + 1);
document.querySelector("#pageNumber").innerText = (List.page / List.can_fit) + 1;
},
added_song: function(added) {
@@ -386,26 +357,28 @@ var List = {
full_playlist.push(now_playing);
}
if($("#suggested-"+added.id).length > 0) {
if(document.querySelectorAll("#suggested-"+added.id).length > 0) {
number_suggested = number_suggested - 1;
if(number_suggested < 0) number_suggested = 0;
var to_display = number_suggested > 9 ? "9+" : number_suggested;
if(to_display == 0){
Helper.addClass(".suggested-link span badge new white", "hide");
Helper.addClass(document.querySelector(".suggested-link span.badge.new.white"), "hide");
}
$(".suggested-link span.badge.new.white").text(to_display);
document.querySelector(".suggested-link span.badge.new.white").innerText = to_display;
}
Helper.removeElement("#suggested-"+added.id);
if(List.empty){
List.empty = false;
}
$("#empty-channel-message").remove();
if(document.querySelectorAll("#empty-channel-message").length > 0) {
document.querySelector("#empty-channel-message").remove();
}
List.insertAtIndex(added, true);
$($("#wrapper").children()[List.page + List.can_fit]).css("display", "none");
if($("#wrapper").children().length > List.page + List.can_fit){
Helper.css(document.querySelector("#wrapper").children[List.page + List.can_fit], "display", "none");
if(document.querySelector("#wrapper").children.length > List.page + List.can_fit){
Helper.css(".next_page_hide", "display", "none");
Helper.removeClass(".next_page", "hide");
Helper.css(".last_page_hide", "display", "none");
@@ -421,26 +394,27 @@ var List = {
deleted_song: function(deleted, removed) {
try{
var index = List.getIndexOfSong(deleted);
//var to_delete = $("#wrapper").children()[index];
//if(!removed) to_delete.style.height = 0;
if(index < List.page && $("#wrapper").children().length - (List.page + 2) >= 0){
$($("#wrapper").children()[List.page]).css("height", 0);
$($("#wrapper").children()[List.page]).css("display", "inline-flex");
$($("#wrapper").children()[List.page]).css("height", List.element_height);
} else if($("#wrapper").children().length > List.page + (List.can_fit)){
$($("#wrapper").children()[List.page + (List.can_fit)]).css("height", 0);
$($("#wrapper").children()[List.page + (List.can_fit)]).css("display", "inline-flex");
$($("#wrapper").children()[List.page + (List.can_fit)]).css("height", List.element_height);
var nextToChange;
if(index < List.page && document.querySelector("#wrapper").children.length - (List.page + 2) >= 0){
//Helper.css(document.querySelector("#wrapper").children[List.page], "height", 0 + "px");
nextToChange = document.querySelector("#wrapper").children[List.page];
//Helper.css(document.querySelector("#wrapper").children[List.page], "display", "inline-flex");
//Helper.css(document.querySelector("#wrapper").children[List.page], "height", List.element_height + "px");
} else if(document.querySelector("#wrapper").children.length > List.page + (List.can_fit)){
//Helper.css(document.querySelector("#wrapper").children[List.page + (List.can_fit)], "height", 0 + "px");
nextToChange = document.querySelector("#wrapper").children[List.page + (List.can_fit)];
//Helper.css(document.querySelector("#wrapper").children[List.page + (List.can_fit)], "display", "inline-flex");
//Helper.css(document.querySelector("#wrapper").children[List.page + (List.can_fit)], "height", List.element_height + "px");
}
if(List.page >= $("#wrapper").children().length - 1){
console.log(List.element_height);
if(List.page >= document.querySelector("#wrapper").children.length - 1){
List.dynamicContentPage(-1);
Helper.css(".next_page_hide", "display", "inline-flex");
Helper.css(".next_page", "display", "none");
Helper.css(".last_page_hide", "display", "inline-flex");
Helper.css(".last_page", "display", "none");
} else if(List.page + List.can_fit + 1 >= $("#wrapper").children().length - 1){
} else if(List.page + List.can_fit + 1 >= document.querySelector("#wrapper").children.length - 1){
Helper.css(".next_page_hide", "display", "inline-flex");
Helper.css(".next_page", "display", "none");
Helper.css(".last_page_hide", "display", "inline-flex");
@@ -449,16 +423,27 @@ var List = {
if(List.page <= index && List.page - List.can_fit <= index) {
Helper.addClass("#" + deleted, "side_away");
$("#" + deleted).find(".mobile-delete").remove();
//document.getElementById(deleted).querySelector(".mobile-delete").remove();
Helper.css("#" + deleted, "transform", "translateX(-100%)");
setTimeout(function() {
Helper.removeElement("#" + deleted);
/*var wrapperChildren = [].slice.call(document.querySelector("#wrapper").children);
if(wrapperChildren.length > List.can_fit) {
Helper.css(wrapperChildren[List.can_fit], "display", "inline-flex");
}*/
if(nextToChange != undefined) {
Helper.css(nextToChange, "display", "inline-flex");
Helper.css(nextToChange, "height", List.element_height + "px");
}
}, 300);
} else {
Helper.removeElement("#"+deleted);
if(nextToChange != undefined) {
Helper.css(nextToChange, "display", "inline-flex");
Helper.css(nextToChange, "height", List.element_height + "px");
}
}
//$("#"+deleted).remove();
full_playlist.splice(List.getIndexOfSong(deleted), 1);
Player.sendNext({title: full_playlist[0].title, videoId: full_playlist[0].id});
//}
@@ -466,11 +451,17 @@ var List = {
} catch(err) {
full_playlist.splice(List.getIndexOfSong(deleted), 1);
if(!List.empty){
$("#"+deleted).remove();
if(index < List.page && $("#wrapper").children().length - (List.page + 1) >= 0){
$($("#wrapper").children()[List.page - 1]).css("display", "inline-flex");
} else if($("#wrapper").children().length > List.page + List.can_fit){
$($("#wrapper").children()[List.page + (List.can_fit - 1)]).css("display", "inline-flex");
try {
document.getElementById(deleted).remove();
}catch(e){}
if(index < List.page && document.querySelector("#wrapper").children.length - (List.page + 1) >= 0){
//Helper.css(document.querySelector("#wrapper").children[List.page - 1], "display", "inline-flex");
} else if(document.querySelector("#wrapper").children.length > List.page + List.can_fit){
//Helper.css(document.querySelector("#wrapper").children[List.page + (List.can_fit - 1)], "display", "inline-flex");
}
if(nextToChange != undefined) {
Helper.css(nextToChange, "display", "inline-flex");
Helper.css(nextToChange, "height", List.element_height + "px");
}
Player.sendNext({title: full_playlist[0].title, videoId: full_playlist[0].id});
}
@@ -480,11 +471,11 @@ var List = {
Helper.setHtml("#wrapper", "<span id='empty-channel-message'>The playlist is empty.</span>");
}
Helper.removeElement("#suggested-"+deleted);
if(List.page + List.can_fit < $("#wrapper").children().length + 1){
if(List.page + List.can_fit < document.querySelector("#wrapper").children.length + 1){
//$(".next_page_hide").css("display", "none");
//$(".next_page").css("display", "flex");
}
if(List.page >= $("#wrapper").children().length){
if(List.page >= document.querySelector("#wrapper").children.length){
List.dynamicContentPage(-1);
}
Suggestions.checkUserEmpty();
@@ -511,7 +502,7 @@ var List = {
full_playlist.unshift(full_playlist.pop());
full_playlist[full_playlist.length - 1].now_playing = true;
$("#wrapper").children()[$("#wrapper").children().length - 1].remove();
document.querySelector("#wrapper").children[document.querySelector("#wrapper").children.length - 1].remove();
var length = full_playlist.length - 2;
if(length < 0) {
@@ -524,7 +515,7 @@ var List = {
song_change: function(time, remove) {
try{
var length = full_playlist.length - 1;
$("#wrapper").children()[0].remove();
document.querySelector("#wrapper").children[0].remove();
if(full_playlist.length <= 1) {
List.empty = true;
Helper.setHtml("#wrapper", "<span id='empty-channel-message'>The playlist is empty.</span>");
@@ -543,11 +534,15 @@ var List = {
"SONG ON FIRST INDEX",
full_playlist[0]
]);
full_playlist.push(full_playlist.shift());
if(!remove){
List.insertAtIndex(full_playlist[$("#wrapper").children().length], false, true);
List.insertAtIndex(full_playlist[document.querySelector("#wrapper").children.length], false, true);
}
/*var wrapperChildren = [].slice.call(document.querySelector("#wrapper").children);
if(wrapperChildren.length > List.can_fit) {
//Helper.css(wrapperChildren[List.can_fit], "display", "inline-flex");
}*/
} catch(e) {}
},
@@ -661,7 +656,7 @@ var List = {
track = encodeURIComponent(track);
Helper.removeClass(".current_number", "hide");
$(".current_number").text((current_element + 1) + " of " + (full_playlist.length));
document.querySelector(".current_number").innerText = (current_element + 1) + " of " + (full_playlist.length);
Helper.ajax({
type: "GET",
url: "https://api.spotify.com/v1/search?q=" + track + "&type=track",
@@ -753,16 +748,16 @@ var List = {
List.addToSpotifyPlaylist(List.uris, playlist_id, user_id);
Helper.addClass("#playlist_loader_export", "hide");
}
if($(".exported-spotify-list").length == 0) {
$(".exported-list").append("<a target='_blank' class='btn light exported-playlist exported-spotify-list' href='https://open.spotify.com/user/" + user_id + "/playlist/"+ playlist_id + "'>" + chan + "</a>");
if(document.querySelector(".exported-spotify-list").length == 0) {
document.querySelector(".exported-list").insertAdjacentHTML("beforeend", "<a target='_blank' class='btn light exported-playlist exported-spotify-list' href='https://open.spotify.com/user/" + user_id + "/playlist/"+ playlist_id + "'>" + chan + "</a>");
}
for(var i = 0; i < List.not_found.length; i++) {
var data = List.not_found[i];
var not_added_song = $("<div>" + not_export_html + "</div>");
not_added_song.find(".extra-add-text").attr("value", data);
not_added_song.find(".extra-add-text").attr("title", data);
$(".not-exported-container").append(not_added_song.html());
var not_added_song = document.createElement("div");
not_added_song.innerHTML = not_export_html;
not_added_song.querySelector(".extra-add-text").setAttribute("value", data);
not_added_song.querySelector(".extra-add-text").setAttribute("title", data);
document.querySelector(".not-exported-container").insertAdjacentHTML("beforeend", not_added_song.innerHTML);
}
Helper.addClass(".current_number", "hide");
Helper.removeClass(".not-exported", "hide");
@@ -859,14 +854,14 @@ var List = {
if(num == full_playlist.length - 1){
Helper.log(["All videoes added!"]);
Helper.log(["url: https://www.youtube.com/playlist?list=" + playlist_id]);
$(".exported-list").append("<a target='_blank' class='btn light exported-playlist' href='https://www.youtube.com/playlist?list=" + playlist_id + "'>" + chan + "</a>");
document.querySelector(".exported-list").insertAtBeginning("beforeend", "<a target='_blank' class='btn light exported-playlist' href='https://www.youtube.com/playlist?list=" + playlist_id + "'>" + chan + "</a>");
Helper.addClass("#playlist_loader_export", "hide");
Helper.addClass(".current_number", "hide");
//$(".youtube_export_button").removeClass("hide");
} else {
//setTimeout(function(){
Helper.removeClass(".current_number", "hide");
$(".current_number").text((num + 1) + " of " + (full_playlist.length));
document.querySelector(".current_number").innerText = (num + 1) + " of " + (full_playlist.length);
List.addToYoutubePlaylist(playlist_id, full_playlist, num + 1, request_url)
//}, 50);
}
@@ -904,7 +899,9 @@ var List = {
var video_votes = _song_info.votes;
var video_thumb_url = "//img.youtube.com/vi/"+video_id+"/mqdefault.jpg";
var video_thumb = "background-image:url('" + video_thumb_url + "');";
var song = $("<div>"+list_html+"</div>");
var song = document.createElement("div");
song.innerHTML = list_html;
song = song.cloneNode(true);
var image_attr = "style";
if(_song_info.hasOwnProperty("start") && _song_info.hasOwnProperty("end")) {
_song_info.duration = _song_info.end - _song_info.start;
@@ -913,37 +910,40 @@ var List = {
var del_attr;
//song.find(".list-song");
if(transition) {
song.find(".list-song").css("transform", "translateX(100%)");
song.find(".list-song").addClass("side_away");
Helper.css(song.querySelector(".list-song"), "transform", "translateX(100%)");
Helper.addClass(song.querySelector(".list-song"), "side_away");
}
song.find(".list-song").css("height", List.element_height);
if(!w_p) song.find(".card-action").removeClass("hide");
if(video_votes == 1)song.find(".vote-text").text("vote");
Helper.css(song.querySelector(".list-song"), "height", List.element_height + "px");
if(!w_p) Helper.removeClass(song.querySelector(".card-action"), "hide");
if(video_votes == 1)song.querySelector(".vote-text").innerText = "vote";
if(lazy){
video_thumb = "//img.youtube.com/vi/"+video_id+"/mqdefault.jpg";
image_attr = "data-original";
}
song.querySelector(".list-image").setAttribute(image_attr,video_thumb);
if(list){
song.find(".list-votes").text(video_votes);
song.find("#list-song").attr("data-video-id", video_id);
song.find("#list-song").attr("data-video-type", "song");
song.find("#list-song").attr("id", video_id);
song.find(".vote-container").attr("title", video_title);
if((($("#wrapper").children().length >= List.can_fit) && initial) || display == "none"){
song.find(".card").css("display", "none");
song.querySelector(".list-votes").innerText = video_votes;
song.querySelector("#list-song").setAttribute("data-video-id", video_id);
song.querySelector("#list-song").setAttribute("data-video-type", "song");
song.querySelector("#list-song").setAttribute("id", video_id);
song.classList.remove("hide");
song.querySelector(".vote-container").setAttribute("title", video_title);
if(((document.querySelector("#wrapper").children.length >= List.can_fit) && initial) || display == "none"){
Helper.css(song.querySelector(".card"), "display", "none");
}
attr = ".vote-container";
del_attr = "delete_button";
var _temp_duration = Helper.secondsToOther(_song_info.duration);
song.find(".card-duration").text(Helper.pad(_temp_duration[0]) + ":" + Helper.pad(_temp_duration[1]));
song.querySelector(".card-duration").innerText = Helper.pad(_temp_duration[0]) + ":" + Helper.pad(_temp_duration[1]);
}else if(!list){
//song.find(".card-duration").remove();
//song.find(".list-song").removeClass("playlist-element");
//song.find(".more_button").addClass("hide");
song.find(".suggested_remove").removeClass("hide");
song.find(".vote-text").text("");
song.find(".card-duration").text(Helper.pad(_song_info.duration[0]) + ":" + Helper.pad(_song_info.duration[1]));
//song.querySelector(".card-duration").remove();
//song.querySelector(".list-song").removeClass("playlist-element");
//song.querySelector(".more_button").addClass("hide");
Helper.removeClass(song.querySelector(".suggested_remove"), "hide");
song.querySelector(".vote-text").innerText = "";
song.querySelector(".card-duration").innerText = Helper.pad(_song_info.duration[0]) + ":" + Helper.pad(_song_info.duration[1]);
var added_by = "user";
attr = ".add-suggested";
if(user){
@@ -952,48 +952,49 @@ var List = {
del_attr = "del_suggested";
added_by = "system";
}
song.find(".vote-container").attr("class", "clickable add-suggested");
song.find(".add-suggested").attr("title", video_title);
song.find(".delete_button").addClass(del_attr);
song.find(attr).attr("data-video-title", video_title);
song.find(attr).attr("data-video-length", _song_info.length);
song.find(attr).attr("data-added-by", added_by);
song.find("#list-song").attr("data-video-type", "suggested");
song.find("#list-song").attr("data-video-id", video_id);
song.find("#list-song").css("display", "inline-flex");
song.find("#list-song").attr("id", "suggested-" + video_id);
song.find(".list-image").attr("class", song.find(".list-image").attr("class").replace("list-image", "list-suggested-image"));
song.querySelector(".vote-container").setAttribute("class", "clickable add-suggested");
song.querySelector(".add-suggested").setAttribute("title", video_title);
//Helper.addClass(song.querySelector(".delete_button"), del_attr);
song.querySelector(attr).setAttribute("data-video-title", video_title);
song.querySelector(attr).setAttribute("data-video-length", _song_info.length);
song.querySelector(attr).setAttribute("data-added-by", added_by);
song.querySelector("#list-song").setAttribute("data-video-type", "suggested");
song.querySelector("#list-song").setAttribute("data-video-id", video_id);
Helper.css(song.querySelector("#list-song"), "display", "inline-flex");
song.querySelector("#list-song").setAttribute("id", "suggested-" + video_id);
var list_image = song.querySelector(".list-image");
list_image.classList.remove("list-image");
list_image.className += " list-suggested-image";
//song.querySelector(".list-image").setAttribute("class", song.querySelector(".list-image").getAttribute("class").replace("list-image", "list-suggested-image"));
}
song.find(".mobile-delete").remove();
song.find(".list-title").text(video_title);
song.find(".list-title").attr("title", video_title);
song.find(attr).attr("data-video-id", video_id);
song.find(".list-image").attr(image_attr,video_thumb);
song.find(".list-image-placeholder").attr("src", video_thumb_url);
song.find(".list-suggested-image").attr(image_attr,video_thumb);
song.find("."+del_attr).attr("data-video-id", video_id);
return song.html();
song.querySelector(".mobile-delete").remove();
song.querySelector(".list-title").innerText = video_title;
song.querySelector(".list-title").setAttribute("title", video_title);
song.querySelector(attr).setAttribute("data-video-id", video_id);
//song.querySelector(".list-image-placeholder").setAttribute("src", video_thumb_url);
if(song.querySelectorAll(".list-suggested-image").length > 0) {
song.querySelector(".list-suggested-image").setAttribute(image_attr,video_thumb);
}
//console.log(del_attr, song.querySelector("."+del_attr));
//song.querySelector("."+del_attr).setAttribute("data-video-id", video_id);
return song.innerHTML;
},
getIndexOfSong: function(id) {
try {
indexes = $.map(full_playlist, function(obj, index) {
if(obj.id == id) {
return index;
}
});
for(var i = 0; i < full_playlist.length; i++) {
if(full_playlist[i].id == id) return i;
}
return indexes[0];
} catch(e) {}
},
scrollTop: function() {
$("#wrapper").scrollTop(0);
document.querySelector("#wrapper").scrollTop(0);
},
scrollBottom: function(){
$("#wrapper").scrollTop($("#wrapper")[0].scrollHeight);
document.querySelector("#wrapper").scrollTop(document.querySelector("#wrapper").scrollHeight);
}
};

714
server/public/assets/js/listeners.js
View File

File diff suppressed because it is too large Load Diff

26
server/public/assets/js/mobileremote.js
View File

@@ -11,15 +11,15 @@ var Mobile_remote = {
set_id: function(id) {
Mobile_remote.id = id;
$("#pausebutton_remote").attr("disabled", false);
$("#skipbutton_remote").attr("disabled", false);
$("#playbutton_remote").attr("disabled", false);
$("#skipbutton_remote").attr("disabled", false);
$("#remote_channel").val("");
$("#remote_channel").attr("placeholder", "Change channel");
$("#remote_header").html("Controlling " + id);
$("#volume-control-remote").css("display", "inline-block");
$(".slider-vol-mobile").attr("style", "display: inline-block !important");
document.getElementById("#pausebutton_remote").removeAttribute("disabled");
document.getElementById("#skipbutton_remote").removeAttribute("disabled", false);
document.getElementById("#playbutton_remote").removeAttribute("disabled", false);
document.getElementById("#skipbutton_remote").removeAttribute("disabled", false);
document.getElementById("#remote_channel").value = "";
document.getElementById("#remote_channel").setAttribute("placeholder", "Change channel");
document.getElementById("#remote_header").innerText = "Controlling " + id;
Helper.css("#volume-control-remote", "display", "inline-block");
document.querySelector(".slider-vol-mobile").setAttribute("style", "display: inline-block !important");
},
set_channel: function(channel_name) {
@@ -40,10 +40,10 @@ var Mobile_remote = {
initiate_volume: function() {
var vol = 100;
$("#volume-control-remote").append("<div class='volume-slid-remote'></div>");
$("#volume-control-remote").append("<div class='volume-handle-remote'></div>");
$(".volume-slid-remote").css("width", vol + "%");
$(".volume-handle-remote").css("left", "calc(" + vol + "% - 1px)");
document.getElementById("#volume-control-remote").insertAdjacentHTML("beforeend", "<div class='volume-slid-remote'></div>");
document.getElementById("#volume-control-remote").insertAdjacentHTML("beforeend", "<div class='volume-handle-remote'></div>");
Helper.css(".volume-slid-remote", "width", vol + "%");
Helper.css(".volume-handle-remote", "left", "calc(" + vol + "% - 1px)");
document.getElementById("volume-control-remote").addEventListener("touchstart", function(e) {
e.preventDefault();
Playercontrols.dragMouseDown(e);

74
server/public/assets/js/player.js
View File

@@ -81,10 +81,9 @@ var Player = {
} catch(e){}
Helper.log(["video_id variable: " + video_id]);
if(!obj.np){
$('#song-title').html("Empty channel. Add some songs!");
document.getElementById('song-title').innerText = "Empty channel. Add some songs!";
document.title = "Zoff - the shared YouTube based radio";
$("#channel-load").css("display", "none");
//$("#player_overlay").height($("#player").height());
Helper.css("#channel-load", "display", "none");
if(!window.MSStream && !chromecastAvailable) {
Helper.removeClass("#player_overlay", "hide");
@@ -281,20 +280,18 @@ var Player = {
break;
case YT.PlayerState.PLAYING:
if(embed) {
$("#player").css("visibility", "visible");
Helper.css("#player", "visibility", "visible");
}
if(embed && !autoplay) autoplay = true;
if(!window.MSStream) {
$("#player").css("opacity", "1");
Helper.css("#player", "opacity", "1");
//if(!Helper.mobilecheck()) {
$("#channel-load").css("display", "none");
/*if(Frontpage.winter && $("#snow").length == 0) {
$("#video-container").prepend('<div id="snow" class="snow-channel"></div>');
}*/
Helper.css("#channel-load", "display", "none");
//}
}
$("#playpause").css("visibility", "visible");
$("#playpause").css("pointer-events", "all");
Helper.css("#playpause", "visibility", "visible");
Helper.css("#playpause", "pointer-events", "all");
playing = true;
if(beginning && Helper.mobilecheck() && !chromecastAvailable){
//Player.pauseVideo();
@@ -305,9 +302,9 @@ var Player = {
if(!embed && window.location.pathname != "/" && !chromecastAvailable) Helper.addClass("#player_overlay", "hide");
if(window.location.pathname != "/"){
if(document.getElementById("play").className.split(" ").length == 1)
$("#play").toggleClass("hide");
Helper.toggleClass("#play", "hide");
if(document.getElementById("pause").className.split(" ").length == 2)
$("#pause").toggleClass("hide");
Helper.toggleClass("#pause", "hide");
}
if((paused || was_stopped) && !offline) {
/*var u = Crypt.crypt_pass(Crypt.get_userpass(chan.toLowerCase()), true);
@@ -325,9 +322,9 @@ var Player = {
} else {
if(!chromecastAvailable){
if(beginning && mobile_beginning) {
$("#playpause").css("visibility", "visible");
$("#playpause").css("pointer-events", "all");
$("#channel-load").css("display", "none");
Helper.css("#playpause", "visibility", "visible");
Helper.css("#playpause", "pointer-events", "all");
Helper.css("#channel-load", "display", "none");
}
if(!empty_clear && !gotten_np) {
paused = true;
@@ -355,9 +352,9 @@ var Player = {
//socket.emit('pos', {channel: chan.toLowerCase()});
chrome.cast.media.GenericMediaMetadata({metadataType: 0, title:song_title, image: 'https://img.youtube.com/vi/'+video_id+'/mqdefault.jpg', images: ['https://img.youtube.com/vi/'+video_id+'/mqdefault.jpg']});
//chrome.cast.Image('https://img.youtube.com/vi/'+video_id+'/mqdefault.jpg');
if($("#pause").hasClass("hide")){
$("#play").toggleClass("hide");
$("#pause").toggleClass("hide");
if(document.getElementById("pause").classList.contains("hide")){
Helper.toggleClass("#play", "hide");
Helper.toggleClass("#pause", "hide");
}
//Playercontrols.play_pause();
} else {
@@ -368,9 +365,9 @@ var Player = {
pauseVideo: function(){
if(chromecastAvailable){
castSession.sendMessage("urn:x-cast:zoff.me", {type: "pauseVideo"});
if($("#play").hasClass("hide")){
$("#play").toggleClass("hide");
$("#pause").toggleClass("hide");
if(document.getElementById("play").classList.contains("hide")){
Helper.toggleClass("#play", "hide");
Helper.toggleClass("#pause", "hide");
}
//Playercontrols.play_pause();
} else {
@@ -535,16 +532,16 @@ var Player = {
//var elem = document.getElementById('song-title');
//var getTitleViews = document.getElementById('viewers');
$("#song-title").text(title);
$("#viewers").html(outPutWord + " " + v);
$("#song-title").attr("title", title);
document.getElementById("song-title").innerText = title;
document.getElementById("viewers").innerHtml = outPutWord + " " + v;
document.getElementById("song-title").setAttribute("title", title);
//elem.title = title;
if(chromecastAvailable){
$("#player_overlay").css("background", "url(https://img.youtube.com/vi/" + video_id + "/hqdefault.jpg)");
$("#player_overlay").css("background-position", "center");
$("#player_overlay").css("background-size", "100%");
$("#player_overlay").css("background-color", "black");
$("#player_overlay").css("background-repeat", "no-repeat");
Helper.css("#player_overlay", "background", "url(https://img.youtube.com/vi/" + video_id + "/hqdefault.jpg)");
Helper.css("#player_overlay", "background-position", "center");
Helper.css("#player_overlay", "background-size", "100%");
Helper.css("#player_overlay", "background-color", "black");
Helper.css("#player_overlay", "background-repeat", "no-repeat");
//$("#player_overlay").css("height", "calc(100% - 32px)");
}
}
@@ -627,6 +624,7 @@ var Player = {
},
setBGimage: function(c){
console.log(c);
var color = c.color;
if(window.location.pathname != "/" && ((offline && c.only) || (!offline && !c.only) || (!offline && c.only))) {
document.getElementById("main-container").style.backgroundColor = Helper.rgbToHsl(color,true);
@@ -637,7 +635,7 @@ var Player = {
var hsl = Helper.rgbToHsl(color, true).replace("hsl(", "").replace(")", "").replace("%", "").replace(/ /g,'').replace("%", "").split(",");
hexHsl = Helper.hslToHex(parseInt(hsl[0]), parseInt(hsl[1]), parseInt(hsl[2]));
} catch(e) {}
$("meta[name=theme-color]").attr("content", hexHsl);
document.querySelector("meta[name=theme-color]").setAttribute("content", hexHsl);
if(!client) {
var new_color = Helper.rgbToHex(color[0], color[1], color[2]);
new_color = Helper.hexToComplimentary(new_color);
@@ -649,14 +647,14 @@ var Player = {
},
set_width: function(val){
$(".video-container").width(val);
document.getElementsByClassName("video-container")[0].style.width = val + "px";
if(!Helper.mobilecheck()) {
if($(window).width() > 769) {
var test_against_width = $(window).width() - $(".control-list").width() - $(".zbrand").outerWidth() - $(".brand-logo-navigate").outerWidth() - 66;
if(window.innerWidth > 769) {
var test_against_width = window.innerWidth - window.getComputedStyle(document.querySelector(".control-list"), null).getPropertyValue("width") - document.querySelector(".zbrand").offsetWidth - document.querySelector(".brand-logo-navigate").offsetWidth - 66;
title_width = test_against_width;
$(".title-container").width(title_width);
document.querySelector(".title-container").style.width = title_width + "px";
} else {
$(".title-container").width("100%");
document.querySelector(".title-container").style.width = "100%";
}
}
@@ -739,7 +737,7 @@ var Player = {
minutes = Math.floor(currDurr / 60);
seconds = currDurr - (minutes * 60);
if(!isNaN(minutes) && !isNaN(seconds) && !isNaN(dMinutes) && !isNaN(dSeconds)) {
$("#duration").html(Helper.pad(minutes)+":"+Helper.pad(seconds)+" <span id='dash'>/</span> "+Helper.pad(dMinutes)+":"+Helper.pad(dSeconds));
Helper.setHtml("#duration", Helper.pad(minutes)+":"+Helper.pad(seconds)+" <span id='dash'>/</span> "+Helper.pad(dMinutes)+":"+Helper.pad(dSeconds));
}
per = (100 / duration) * currDurr;
if(per >= 100) {
@@ -778,7 +776,7 @@ var Player = {
},
loadPlayer: function() {
if($("script[src='https://www.youtube.com/iframe_api']").length == 1){
if(document.querySelectorAll("script[src='https://www.youtube.com/iframe_api']").length == 1){
try{
Player.onYouTubeIframeAPIReady();
} catch(error){

152
server/public/assets/js/playercontrols.js
View File

@@ -8,18 +8,18 @@ var Playercontrols = {
},
initControls: function() {
$("#volume-button").on("click", Playercontrols.mute_video);
$("#playpause").on("click", Playercontrols.play_pause);
$("#volume-button-overlay").on("click", Playercontrols.mute_video);
$("#playpause-overlay").on("click", Playercontrols.play_pause);
$("#fullscreen").on("click", Playercontrols.fullscreen);
document.getElementById("volume-button").addEventListener("click", Playercontrols.mute_video);
document.getElementById("playpause").addEventListener("click", Playercontrols.play_pause);
document.getElementById("volume-button-overlay").addEventListener("click", Playercontrols.mute_video);
document.getElementById("playpause-overlay").addEventListener("click", Playercontrols.play_pause);
document.getElementById("fullscreen").addEventListener("click", Playercontrols.fullscreen);
},
initSlider: function() {
try {
vol = (Crypt.get_volume());
//$("#volume").slider("destroy");
} catch(e){
vol = 100;
}
@@ -30,12 +30,12 @@ var Playercontrols = {
}catch(e){}
if(Helper.mobilecheck() || slider_type == "vertical") {
//slider_values.orientation = "vertical";
if(!$(".volume-container").hasClass("hide")) {
$(".volume-container").toggleClass("hide");
if(!document.querySelector(".volume-container").classList.contains("hide")) {
Helper.toggleClass(".volume-container", "hide");
}
}
$("#volume").append("<div class='volume-slid " + slider_type + "'></div>");
$("#volume").append("<div class='volume-handle " + slider_type + "'></div>");
document.getElementById("volume").insertAdjacentHTML("beforeend", "<div class='volume-slid " + slider_type + "'></div>");
document.getElementById("volume").insertAdjacentHTML("beforeend", "<div class='volume-handle " + slider_type + "'></div>");
if(slider_type != "vertical") {
Helper.removeClass("#volume", "vertical");
Helper.css(".volume-slid", "width", vol + "%");
@@ -181,7 +181,7 @@ var Playercontrols = {
},
fullscreen: function() {
var playerElement = $("#player").get(0);
var playerElement = document.getElementById("player");
var requestFullScreen = playerElement.requestFullScreen || playerElement.mozRequestFullScreen || playerElement.webkitRequestFullScreen;
if (requestFullScreen) {
requestFullScreen.bind(playerElement)();
@@ -196,18 +196,18 @@ var Playercontrols = {
if(Helper.mobilecheck() && !window.MSStream){
//if(Helper.mobilecheck() && !/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream){
//document.getElementById("player").style.display = "none";
$("#player").css("display", "none");
$(".video-container").toggleClass("click-through");
$(".page-footer").toggleClass("padding-bottom-extra");
Helper.css("#player", "display", "none");
Helper.toggleClass(".video-container", "click-through");
Helper.toggleClass(".page-footer", "padding-bottom-extra");
}
} else if(Player.player.getPlayerState() == YT.PlayerState.PAUSED || Player.player.getPlayerState() === YT.PlayerState.ENDED || (Player.player.getPlayerState() === YT.PlayerState.CUED)){
Player.playVideo();
//if(Helper.mobilecheck() && !/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream){
if(Helper.mobilecheck() && !window.MSStream){
//document.getElementById("player").style.display = "block";
$("#player").css("display", "block");
$(".video-container").toggleClass("click-through");
$(".page-footer").toggleClass("padding-bottom-extra");
Helper.css("#player", "display", "block");
Helper.toggleClass(".video-container", "click-through");
Helper.toggleClass(".page-footer", "padding-bottom-extra");
}
}
} else {
@@ -217,26 +217,26 @@ var Playercontrols = {
play_pause_show: function() {
if(chromecastAvailable){
if($("#play").hasClass("hide")){
if(document.getElementById("play").classList.contains("hide")){
Player.pauseVideo();
} else if($("#pause").hasClass("hide")){
} else if(document.getElementById("pause").classList.contains("hide")){
Player.playVideo();
}
} else {
if(!$("#pause").hasClass("hide")) {
$("#pause").toggleClass("hide");
$("#pause-overlay").toggleClass("hide");
if(!document.getElementById("pause").classList.contains("hide")) {
Helper.toggleClass("#pause", "hide");
Helper.toggleClass("#pause-overlay", "hide");
}
if($("#play").hasClass("hide")) {
$("#play").toggleClass("hide");
$("#play-overlay").toggleClass("hide");
if(document.getElementById("play").classList.contains("hide")) {
Helper.toggleClass("#play", "hide");
Helper.toggleClass("#play-overlay", "hide");
}
}
},
settings: function() {
$("#qS").toggleClass("hide");
Helper.toggleClass("#qS", "hide");
},
changeQuality: function(wantedQ) {
@@ -244,12 +244,12 @@ var Playercontrols = {
Player.player.setPlaybackQuality(wantedQ);
Player.player.getPlaybackQuality();
}
$("#qS").toggleClass("hide");
Helper.toggleClass("#qS", "hide");
},
mute_video: function() {
if(Helper.mobilecheck() || slider_type == "vertical") {
$(".volume-container").toggleClass("hide");
Helper.toggleClass(".volume-container", "hide");
} else {
if(!Player.player.isMuted()) {
if(chromecastAvailable) castSession.sendMessage("urn:x-cast:zoff.me", {type: "mute"});
@@ -273,73 +273,73 @@ var Playercontrols = {
choose_button: function(vol, mute) {
if(!mute){
if(vol >= 0 && vol <= 33) {
if(!$("#v-full").hasClass("hide")) {
$("#v-full").toggleClass("hide");
$("#v-full-overlay").toggleClass("hide");
if(!document.getElementById("v-full").classList.contains("hide")) {
Helper.toggleClass("#v-full", "hide");
Helper.toggleClass("#v-full-overlay", "hide");
}
if(!$("#v-medium").hasClass("hide")) {
$("#v-medium").toggleClass("hide");
$("#v-medium-overlay").toggleClass("hide");
if(!document.getElementById("v-medium").classList.contains("hide")) {
Helper.toggleClass("#v-medium", "hide");
Helper.toggleClass("#v-medium-overlay", "hide");
}
if($("#v-low").hasClass("hide")) {
$("#v-low").toggleClass("hide");
$("#v-low-overlay").toggleClass("hide");
if(document.getElementById("v-low").classList.contains("hide")) {
Helper.toggleClass("#v-low", "hide");
Helper.toggleClass("#v-low-overlay", "hide");
}
if(!$("#v-mute").hasClass("hide")) {
$("#v-mute").toggleClass("hide");
$("#v-mute-overlay").toggleClass("hide");
if(!document.getElementById("v-mute").classList.contains("hide")) {
Helper.toggleClass("#v-mute", "hide");
Helper.toggleClass("#v-mute-overlay", "hide");
}
} else if(vol >= 34 && vol <= 66) {
if(!$("#v-full").hasClass("hide")) {
$("#v-full").toggleClass("hide");
$("#v-full-overlay").toggleClass("hide");
if(!document.getElementById("v-full").classList.contains("hide")) {
Helper.toggleClass("#v-full", "hide");
Helper.toggleClass("#v-full-overlay", "hide");
}
if($("#v-medium").hasClass("hide")) {
$("#v-medium").toggleClass("hide");
$("#v-medium-overlay").toggleClass("hide");
if(document.getElementById("v-medium").classList.contains("hide")) {
Helper.toggleClass("#v-medium", "hide");
Helper.toggleClass("#v-medium-overlay", "hide");
}
if(!$("#v-low").hasClass("hide")) {
$("#v-low").toggleClass("hide");
$("#v-low-overlay").toggleClass("hide");
if(!document.getElementById("v-low").classList.contains("hide")) {
Helper.toggleClass("#v-low", "hide");
Helper.toggleClass("#v-low-overlay", "hide");
}
if(!$("#v-mute").hasClass("hide")) {
$("#v-mute").toggleClass("hide");
$("#v-mute-overlay").toggleClass("hide");
if(!document.getElementById("v-mute").classList.contains("hide")) {
Helper.toggleClass("#v-mute", "hide");
Helper.toggleClass("#v-mute-overlay", "hide");
}
} else if(vol >= 67 && vol <= 100) {
if($("#v-full").hasClass("hide")) {
$("#v-full").toggleClass("hide");
$("#v-full-overlay").toggleClass("hide");
if(document.getElementById("v-full").classList.contains("hide")) {
Helper.toggleClass("#v-full", "hide");
Helper.toggleClass("#v-full-overlay", "hide");
}
if(!$("#v-medium").hasClass("hide")) {
$("#v-medium").toggleClass("hide");
$("#v-medium-overlay").toggleClass("hide");
if(!document.getElementById("v-medium").classList.contains("hide")) {
Helper.toggleClass("#v-medium", "hide");
Helper.toggleClass("#v-medium-overlay", "hide");
}
if(!$("#v-low").hasClass("hide")) {
$("#v-low").toggleClass("hide");
$("#v-low-overlay").toggleClass("hide");
if(!document.getElementById("v-low").classList.contains("hide")) {
Helper.toggleClass("#v-low", "hide");
Helper.toggleClass("#v-low-overlay", "hide");
}
if(!$("#v-mute").hasClass("hide")) {
$("#v-mute").toggleClass("hide");
$("#v-mute-overlay").toggleClass("hide");
if(!document.getElementById("v-mute").classList.contains("hide")) {
Helper.toggleClass("#v-mute", "hide");
Helper.toggleClass("#v-mute-overlay", "hide");
}
}
} else {
if(!$("#v-full").hasClass("hide")) {
$("#v-full").toggleClass("hide");
$("#v-full-overlay").toggleClass("hide");
if(!document.getElementById("v-full").classList.contains("hide")) {
Helper.toggleClass("#v-full", "hide");
Helper.toggleClass("#v-full-overlay", "hide");
}
if(!$("#v-medium").hasClass("hide")) {
$("#v-medium").toggleClass("hide");
$("#v-medium-overlay").toggleClass("hide");
if(!document.getElementById("v-medium").classList.contains("hide")) {
Helper.toggleClass("#v-medium", "hide");
Helper.toggleClass("#v-medium-overlay", "hide");
}
if(!$("#v-low").hasClass("hide")) {
$("#v-low").toggleClass("hide");
$("#v-low-overlay").toggleClass("hide");
if(!document.getElementById("v-low").classList.contains("hide")) {
Helper.toggleClass("#v-low", "hide");
Helper.toggleClass("#v-low-overlay", "hide");
}
if($("#v-mute").hasClass("hide")) {
$("#v-mute").toggleClass("hide");
$("#v-mute-overlay").toggleClass("hide");
if(document.getElementById("v-mute").classList.contains("hide")) {
Helper.toggleClass("#v-mute", "hide");
Helper.toggleClass("#v-mute-overlay", "hide");
}
}
},

71
server/public/assets/js/remotecontroller.js
View File

@@ -6,9 +6,9 @@ mobilecheck = function() {
return check;
};
$(document).ready(function (){
window.addEventListener("DOMContentLoaded", function (){
document.title = "Zoff Remote";
setTimeout(function(){$("#search").focus();},500);
setTimeout(function(){document.getElementById("search").focus();},500);
var connection_options = {
'sync disconnect on unload':true,
'secure': true
@@ -30,22 +30,57 @@ $(document).ready(function (){
id = id.toLowerCase();
Remotecontroller.control();
}
});
}, false);
$(document).on("click", "#playbutton", function() {
function handleEvent(e, target, tried, type) {
//console.log(target, dynamicListeners);
//console.log(e.path, target);
for(var y = 0; y < e.path.length; y++) {
var target = e.path[y];
if(dynamicListeners[type] && dynamicListeners[type]["#" + target.id]) {
//console.log(target.id);
dynamicListeners[type]["#" + target.id].call(target);
return;
} else {
if(target.classList == undefined) return;
for(var i = 0; i < target.classList.length; i++) {
if(dynamicListeners[type] && dynamicListeners[type]["." + target.classList[i]]) {
//console.log(target.id);
dynamicListeners[type]["." + target.classList[i]].call(target);
return;
}
}
}
}
}
function addListener(type, element, callback) {
if(dynamicListeners[type] == undefined) dynamicListeners[type] = {};
dynamicListeners[type][element] = callback;
}
document.addEventListener("click", function(e) {
handleEvent(e, e.target, false, "click");
}, true);
document.addEventListener("submit", function(e) {
handleEvent(e, e.target, false, "submit");
}, true);
addListener("click", "#playbutton", function() {
socket.emit("id", {id: id, type: "play", value: "mock"});
});
$(document).on("click", "#pausebutton", function() {
addListener("click", "#pausebutton", function() {
socket.emit("id", {id: id, type: "pause", value: "mock"});
});
$(document).on("click", "#skipbutton", function() {
addListener("click", "#skipbutton", function() {
socket.emit("id", {id: id, type: "skip", value: "mock"});
});
$(document).on("submit", "#remoteform", function(e) {
e.preventDefault();
addListener("submit", "#remoteform", function(e) {
event.preventDefault();
Remotecontroller.control();
});
@@ -60,14 +95,14 @@ var Remotecontroller = {
document.getElementById("remoteform").chan.value = "";
start = false;
$(".volume-elements").css("display", "flex");
$(".rc").css("display", "block");
Helper.css(".volume-elements", "display", "flex");
Helper.css(".rc", "display", "block");
//document.getElementById("base").setAttribute("onsubmit", "control(); return false;");
$("#remote-text").text("Controlling "+ id.toUpperCase());
document.getElementById("remote-text").innerText = "Controlling "+ id.toUpperCase();
document.getElementById("search").setAttribute("length", "18");
document.getElementById("search").setAttribute("maxlength", "18");
$("#forsearch").html("Type new channel name to change to");
document.getElementById("forsearch").innerText = "Type new channel name to change to";
//
/*$("#volume-control").slider({
@@ -81,11 +116,11 @@ var Remotecontroller = {
}
//});*/
$("#volume").append("<div class='volume-slid'></div>");
$("#volume").append("<div class='volume-handle'></div>");
document.getElementById("volume").insertAdjacentHTML("beforeend", "<div class='volume-slid'></div>");
document.getElementById("volume").insertAdjacentHTML("beforeend", "<div class='volume-handle'></div>");
$(".volume-slid").css("width", "100%");
$(".volume-handle").css("left", "calc(100% - 1px)");
Helper.css(".volume-slid", "width", "100%");
Helper.css(".volume-handle", "left", "calc(100% - 1px)");
//document.getElementsByClassName("volume-handle")[0].onmousedown = Remotecontroller.dragMouseDown;
//$("#volume").slider(slider_values);
//document.getElementsByClassName("volume-slid")[0].onmousedown = Remotecontroller.dragMouseDown;
@@ -99,8 +134,8 @@ var Remotecontroller = {
Remotecontroller.closeDragElement();
}
} else {
socket.emit("id", {id: id, type: "channel", value: $("#search").val().toLowerCase()});
$("#search").val("");
socket.emit("id", {id: id, type: "channel", value: document.getElementById("search").value.toLowerCase()});
document.getElementById("search").value = "";
}
},

132
server/public/assets/js/search.js
View File

@@ -8,35 +8,36 @@ var Search = {
submitYouTubeError: false,
showSearch: function(){
$("#search-wrapper").toggleClass("hide");
Helper.toggleClass("#search-wrapper", "hide");
if(Helper.mobilecheck())
{
$(".search_input").focus();
document.querySelector(".search_input").focus();
}
$("#song-title").toggleClass("hide");
Helper.toggleClass("#song-title", "hide");
//$("#results").empty();
if($("#search-btn i").html() == "close") {
$("body").attr("style", "overflow-y:auto")
$("#results").slideUp({
if(document.querySelector("#search-btn i").innerText == "close") {
document.querySelector("body").setAttribute("style", "overflow-y:auto")
/*$("#results").slideUp({
complete: function() {
$("#results").empty();
}
});
$(".search_input").val("");
$("#search-btn i").html("search");
});*/
document.getElementById("results").innerHTML = "";
document.querySelector(".search_input").value = "";
document.querySelector("#search-btn i").innerText = "search";
} else {
$("#search-btn i").html("close");
document.querySelector("#search-btn i").innerText = "close";
}
$("#search").focus();
document.querySelector("#search").focus();
},
search: function(search_input, retried, related, pagination){
if(result_html === undefined || empty_results_html === undefined) {
result_html = $("#temp-results-container");
result_html = document.getElementById("#temp-results-container");
empty_results_html = Helper.html("#empty-results-container");
}
if(!pagination && $("#inner-results").length == 0) {
if(!pagination && document.querySelectorAll("#inner-results").length == 0) {
Helper.setHtml(".search_results", '');
}
if(search_input !== ""){
@@ -65,10 +66,10 @@ var Search = {
var nextPageToken = response.nextPageToken;
var prevPageToken = response.prevPageToken;
if(response.items.length === 0) {
$("#results").empty();
document.getElementById("results").innerHTML = "";
Helper.css("#results", "display", "block");
$("<div style='display:none;' id='inner-results' class='empty-inner-results'>"+empty_results_html+"</div>").appendTo($("#results")).show("blind", 83.33);
if(Helper.contains($(".search_loader_spinner").attr("class").split(" "), "active"))
//$("<div style='display:none;' id='inner-results' class='empty-inner-results'>"+empty_results_html+"</div>").appendTo($("#results")).show("blind", 83.33);
document.getElementById("results").insertAdjacentHTML("beforeend", "<div style='display:none;' id='inner-results' class='empty-inner-results'>"+empty_results_html+"</div>");
Helper.removeClass(".search_loader_spinner", "active");
} else if(response.items){
@@ -83,7 +84,9 @@ var Search = {
success: function(response){
response = JSON.parse(response);
var output = "";
var pre_result = $(result_html);
var pre_result = document.createElement("div");
pre_result.innerHTML = result_html;
//$("#results").append(result_html);
@@ -100,51 +103,52 @@ var Search = {
thumb=song.snippet.thumbnails.medium.url;
//$("#results").append(result_html);
var songs = pre_result;
songs.find(".search-title").text(title);
songs.find(".result_info").text(Helper.pad(_temp_duration[0]) + ":" + Helper.pad(_temp_duration[1]));
songs.find(".thumb").attr("src", thumb);
//songs.find(".add-many").attr("onclick", "submit('"+id+"','"+enc_title+"',"+secs+");");
songs.find("#add-many").attr("data-video-id", id);
songs.find("#add-many").attr("data-video-title", enc_title);
songs.find("#add-many").attr("data-video-length", secs);
//$($(songs).find("div")[0]).attr("onclick", "submitAndClose('"+id+"','"+enc_title+"',"+secs+");");
songs.find("#temp-results").attr("data-video-id", id);
songs.find("#temp-results").attr("data-video-title", enc_title);
songs.find("#temp-results").attr("data-video-length", secs);
songs.find(".open-externally").attr("href", "https://www.youtube.com/watch?v=" + id);
$(songs.find(".result-end")).attr("value", secs);
//$($(songs).find("div")[0]).attr("id", id)
var songs = pre_result.cloneNode(true);
songs.querySelector(".search-title").innerText = title;
songs.querySelector(".result_info").innerText = Helper.pad(_temp_duration[0]) + ":" + Helper.pad(_temp_duration[1]);
songs.querySelector(".thumb").setAttribute("src", thumb);
//songs.querySelector(".add-many").attr("onclick", "submit('"+id+"','"+enc_title+"',"+secs+");");
songs.querySelector("#add-many").setAttribute("data-video-id", id);
songs.querySelector("#add-many").setAttribute("data-video-title", enc_title);
songs.querySelector("#add-many").setAttribute("data-video-length", secs);
//$($(songs).querySelector("div")[0]).setAttribute("onclick", "submitAndClose('"+id+"','"+enc_title+"',"+secs+");");
songs.querySelector("#temp-results").setAttribute("data-video-id", id);
songs.querySelector("#temp-results").setAttribute("data-video-title", enc_title);
songs.querySelector("#temp-results").setAttribute("data-video-length", secs);
songs.querySelector(".open-externally").setAttribute("href", "https://www.youtube.com/watch?v=" + id);
songs.querySelector(".result-end").setAttribute("value", secs);
//$($(songs).querySelector("div")[0]).setAttribute("id", id)
//output += undefined;
if(songs.html() != undefined) {
output += songs.html();
if(songs.innerHTML != undefined && songs.innerHTML != "") {
output += songs.innerHTML;
}
}
}
var fresh = false;
if($("#inner-results").length == 0) {
if(document.querySelectorAll("#inner-results").length == 0) {
fresh = true;
}
$(".search_results").empty();
document.getElementsByClassName("search_results")[0].innerHTML = "";
if(output.length > 0) {
//$(window).scrollTop(0);
if(!pagination && fresh) {
$(".search_results").css("display", "none");
Helper.css(".search_results", "display", "none");
}
$("#results").append(pagination_buttons_html);
$("<div id='inner-results'>"+output+"</div>").prependTo($("#results"));
document.getElementById("results").insertAdjacentHTML("beforeend", pagination_buttons_html);
//$("<div id='inner-results'>"+output+"</div>").prependTo($("#results"));
document.getElementById("results").insertAdjacentHTML("afterbegin", "<div id='inner-results'>"+output+"</div>");
if(!pagination && fresh) {
$(".search_results").slideDown();
//$(".search_results").slideDown();
}
$("body").attr("style", "overflow-y:hidden !important")
document.getElementsByTagName("body")[0].setAttribute("style", "overflow-y:hidden !important")
if(nextPageToken) {
$(".next-results-button").attr("data-pagination", nextPageToken);
document.querySelector(".next-results-button").setAttribute("data-pagination", nextPageToken);
} else {
Helper.addClass(".next-results-button", "disabled");
}
if(prevPageToken) {
$(".prev-results-button").attr("data-pagination", prevPageToken);
document.querySelector(".prev-results-button").setAttribute("data-pagination", prevPageToken);
} else {
Helper.addClass(".prev-results-button", "disabled");
}
@@ -153,19 +157,14 @@ var Search = {
//setTimeout(function(){$(".thumb").lazyload({container: $("#results")});}, 250);
if(Helper.contains($(".search_loader_spinner").attr("class").split(" "), "active"))
Helper.removeClass(".search_loader_spinner", "active");
$(".add-many").click(function(e) {
e.preventDefault();
e.stopPropagation();
return false;
});
} else if(!retried){
Search.search(search_input, true);
} else {
$("<div style='display:none;' id='inner-results'>"+empty_results_html+"</div>").appendTo($("#results")).show("blind", 83.33);
if(Helper.contains($(".search_loader_spinner").attr("class").split(" "), "active"))
//$("<div style='display:none;' id='inner-results'>"+empty_results_html+"</div>").appendTo($("#results")).show("blind", 83.33);
document.getElementById("results").insertAdjacentHTML("beforeend", "<div style='display:none;' id='inner-results'>"+empty_results_html+"</div>");
Helper.removeClass(".search_loader_spinner", "active");
}
}
@@ -202,11 +201,13 @@ var Search = {
"Spotify title: " + title + " " + artist.join(" "),
"Spotify length: " + length
]);
var not_added_song = $("<div>" + not_import_html + "</div>");
not_added_song.find(".extra-add-text").text(title + " - " + artist.join(" "));
not_added_song.find(".extra-add-text").attr("title", title + " - " + artist.join(" "));
not_added_song.find(".extra-button-search").attr("data-text", title + " - " + artist.join(" "));
$(".not-imported-container").append(not_added_song.html());
var not_added_song = document.createElement("div");
not_added_song.innerHTML = not_import_html;
not_added_song.querySelector(".extra-add-text").innerText = title + " - " + artist.join(" ");
not_added_song.querySelector(".extra-add-text").setAttribute("title", title + " - " + artist.join(" "));
not_added_song.querySelector(".extra-button-search").setAttribute("data-text", title + " - " + artist.join(" "));
document.querySelector(".not-imported-container").insertAdjacentHTML("beforeend", not_added_song.innerHTML);
Helper.removeClass(".not-imported", "hide");
} else if(response.items.length > 0) {
for(var i = 0; i < response.items; i++) {
@@ -264,11 +265,12 @@ var Search = {
"Spotify title: " + title + " " + artist.join(" "),
"Spotify length: " + length
]);
var not_added_song = $("<div>" + not_import_html + "</div>");
not_added_song.find(".extra-add-text").text(title + " - " + artist.join(" "));
not_added_song.find(".extra-add-text").attr("title", title + " - " + artist.join(" "));
not_added_song.find(".extra-button-search").attr("data-text", title + " - " + artist.join(" "));
$(".not-imported-container").append(not_added_song.html());
var not_added_song = document.createElement("div");
not_added_song.innerHTML = not_import_html;
not_added_song.querySelector(".extra-add-text").innerText = title + " - " + artist.join(" ");
not_added_song.querySelector(".extra-add-text").setAttribute("title", title + " - " + artist.join(" "));
not_added_song.querySelector(".extra-button-search").setAttribute("data-text", title + " - " + artist.join(" "));
document.querySelector(".not-imported-container").insertAdjacentHTML("beforeend", not_added_song.innerHTML);
Helper.removeClass(".not-imported", "hide");
}
}
@@ -477,11 +479,9 @@ var Search = {
}
if(offline && document.getElementsByName("addsongs")[0].checked && document.getElementsByName("addsongs")[0].disabled){
var found_array = [];
found_array = $.map(full_playlist, function(obj, index) {
if(obj.id == id) {
return index;
}
});
for(var i = 0; i < full_playlist.length; i++) {
if(full_playlist[i].id == id) found_array.push(i);
}
if(found_array.length == 0){
List.channel_function({type: "added", start: start, end: end, value: {added: (new Date).getTime()/1000, guids: [1], id: id, title: title, duration: duration, now_playing: false, votes: 1}});
} else {

17
server/public/assets/js/suggestions.js
View File

@@ -7,15 +7,15 @@ var Suggestions = {
number_suggested = number_suggested + params.length;
}
for(var i = 0; i < params.length; i++) {
if($("#suggested-" + params[i].id).length > 0) {
if(document.querySelectorAll("#suggested-" + params[i].id).length > 0) {
number_suggested -= 1;
}
}
var to_display = number_suggested > 9 ? "9+" : number_suggested;
if(number_suggested > 0 && Admin.logged_in){
Helper.removeClass(".suggested-link span badge new white", "hide");
Helper.removeClass(document.querySelector(".chat-link span.badge.new.white"), "hide");
}
$(".suggested-link span.badge.new.white").text(to_display);
document.querySelector(".suggested-link span.badge.new.white").innerText = to_display;
if(single){
Suggestions.createSuggested(params);
}else{
@@ -31,8 +31,8 @@ var Suggestions = {
var video_id = params.id;
var video_title = params.title;
var song = List.generateSong({id: video_id, title: video_title, length: params.duration, duration: duration}, false, false, false, true);
if($("#" + $(song).attr("id")).length == 0) {
$("#user-suggest-html").append(song);
if(document.querySelectorAll("#" + song.getAttribute("id")).length == 0) {
document.getElementById("user-suggest-html").insertAdjacentHTML("beforeend", song);
}
},
@@ -60,7 +60,7 @@ var Suggestions = {
success: function(response)
{
response = JSON.parse(response);
$("#suggest-song-html").empty();
Helper.setHtml("#suggest-song-html", "");
for(var i = 0; i < response.items.length; i++) {
var song = response.items[i];
var duration = song.contentDetails.duration;
@@ -69,7 +69,7 @@ var Suggestions = {
var video_id = song.id;
var video_title = song.snippet.title;
$("#suggest-song-html").append(List.generateSong({id: video_id, title: video_title, length: length, duration: duration}, false, false, false));
document.getElementById("suggest-song-html").insertAdjacentHTML("beforeend", List.generateSong({id: video_id, title: video_title, length: length, duration: duration}, false, false, false));
}
}
});
@@ -78,9 +78,8 @@ var Suggestions = {
},
checkUserEmpty: function(){
var length = $("#user-suggest-html").children().length;
var length = document.getElementById("user-suggest-html").children.length;
if(length === 0){
if(!Helper.contains($("#user_suggests").attr("class").split(" "), "hide"))
Helper.addClass("#user_suggests", "hide");
} else if(Admin.logged_in){
Helper.removeClass("#user_suggests", "hide");

32
server/public/assets/js/token_apply.js
View File

@@ -1,25 +1,25 @@
$(document).ready(function() {
window.addEventListener("DOMContentLoaded", function(e) {
M.Modal.init(document.getElementById("about"));
M.Modal.init(document.getElementById("contact"));
Helper.addClass(".help-button-footer", "hide");
Helper.setHtml("#contact-container", "");
Helper.setHtml("#contact-container", "Send a mail to us: <a title='Open in client' href='mailto:contact@zoff.me?Subject=Contact%20Zoff'>contact@zoff.me</a>");
$("#submit-contact-form").hide();
Helper.css("#submit-contact-form", "display", "none");
ga('send', 'pageview');
if(!Helper.mobilecheck()) {
$("#iframe-container").append('<iframe id="iframe" src="https://zoff.me/_embed#celebrate&808080" width="600px" height="300px"></iframe>');
document.getElementById("iframe-container").insertAdjacentHTML("beforeend", '<iframe id="iframe" src="https://zoff.me/_embed#celebrate&808080" width="600px" height="300px"></iframe>');
}
$(".token-form").on("submit", function(e) {
document.getElementsByClassName("token-form")[0].addEventListener("submit", function(e) {
e.preventDefault();
var email = $("#email_address").val();
var origin = $("#origin").val();
$("#origin").attr("readonly", true);
$("#email_address").attr("readonly", true);
$(".submit").toggleClass("disabled");
var email = document.getElementById("email_address").value;
var origin = document.getElementById("origin").value;
document.getElementById("origin").setAttribute("readonly", true);
document.getElementById("email_address").setAttribute("readonly", true);
Helper.toggleClass(".submit", "disabled");
Helper.removeClass(".full-form-token", "hide");
var captcha_response = grecaptcha.getResponse();
Helper.ajax({
@@ -35,23 +35,23 @@ $(document).ready(function() {
if(response == "success") {
M.toast({html: "Email sent!", displayLength: 3000, classes: "green lighten"});
} else {
$("#email_address").attr("readonly", false);
$(".submit").toggleClass("disabled");
$("#origin").attr("readonly", false);
document.getElementById("email_address").setAttribute("readonly", false);
Helper.toggleClass(".submit", "disabled");
document.getElementById("origin").setAttribute("readonly", false);
grecaptcha.reset();
M.toast({html: "Something went wrong. Sure that email hasn't been used for another token?",displayLength: 3000, classes: "red lighten"});
}
},
error: function(response) {
Helper.addClass(".full-form-token", "hide");
$("#email_address").attr("readonly", false);
$(".submit").toggleClass("disabled");
document.getElementById("email_address").setAttribute("readonly", false);
Helper.toggleClass(".submit", "disabled");
}
});
});
$('#submit-contact-form').on('click', function(e) {
document.getElementById('submit-contact-form').addEventListener('click', function(e) {
e.preventDefault();
$("#contact-form").submit();
document.getElementById("contact-form").submit();
});
});

4
server/public/layouts/client/main.handlebars
View File

@@ -84,10 +84,10 @@
</ul>
<div id="context-menu-overlay" class="hide"></div>
{{/unless}}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.1.0/socket.io.slim.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.0/spectrum.min.js"></script>
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.0/spectrum.min.js"></script>-->
<script type="text/javascript" src="/assets/dist/{{javascript_file}}"></script>
{{#unless embed}}
<script type="text/javascript" src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"></script>

2
server/public/partials/channel/modal.handlebars
View File

@@ -13,7 +13,7 @@
<label for="height_embed" class="padding_left_6 embed-label">Height</label>
<input type="number" value="300" id="height_embed" class="settings_embed" min="1" />
<label for="color_embed" class="padding_left_6 embed-label">Color</label>
<input type="text" id="color_embed" class="settings_embed" value="#808080" />
<input type="color" id="color_embed" class="settings_embed" value="#808080" />
<label>
<input type="checkbox" id="videoonly" class="checkbox" />
<span for="videoonly" class="padding_right_26">Video-only</span>

2
server/routing/client/api.js
View File

@@ -1095,6 +1095,7 @@ function incrementToken(token) {
router.route('/api/color').post(function(req, res) {
var origin = req.get("origin").replace("https://", "").replace("http://", "");
var allowed = ["client.localhost", "localhost", "zoff.me", "client.zoff.me", "zoff.no", "client.zoff.no"];
console.log(req.body);
if(allowed.indexOf(origin) < 0) {
res.sendStatus(403);
return;
@@ -1114,6 +1115,7 @@ router.route('/api/imageblob').post(function(req, res) {
res.sendStatus(403);
return;
}
Jimp.read('https://img.youtube.com/vi/' + req.body.id + '/mqdefault.jpg', function (err, image) {
if (err) {
console.log(err);