From a5134928b5e491d8c150aa105c9498176e3993ac Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Kasper=20Rynning-T=C3=B8nnesen?= Date: Tue, 24 Apr 2018 14:47:31 +0200 Subject: [PATCH] migrated much of the listeners --- server/public/assets/js/admin.js | 11 +- server/public/assets/js/channel.js | 125 +++---- server/public/assets/js/embed.js | 23 +- server/public/assets/js/frontpage.js | 43 +-- server/public/assets/js/functions.js | 49 ++- server/public/assets/js/helpers.js | 151 ++++++-- server/public/assets/js/list.js | 9 +- server/public/assets/js/listeners.js | 394 +++++++++++--------- server/public/assets/js/player.js | 2 +- server/public/assets/js/remotecontroller.js | 6 +- server/public/assets/js/search.js | 2 +- server/public/assets/js/token_apply.js | 6 +- 12 files changed, 484 insertions(+), 337 deletions(-) diff --git a/server/public/assets/js/admin.js b/server/public/assets/js/admin.js index cc9dc0db..09aa5c38 100755 --- a/server/public/assets/js/admin.js +++ b/server/public/assets/js/admin.js @@ -17,7 +17,7 @@ var Admin = { Helper.removeClass(".suggested-badge", "hide"); } if(!Helper.mobilecheck()) { - $('#chan_thumbnail').tooltip({ + Helper.tooltip('#chan_thumbnail', { delay: 5, position: "left", html: "imgur link" @@ -39,7 +39,7 @@ var Admin = { Helper.addClass("#admin-lock", "clickable"); document.getElementById("admin-lock").innerHTML = "lock_open"; if(!Helper.mobilecheck()){ - $('#admin-lock').tooltip({ + Helper.tooltip('#admin-lock', { delay: 5, position: "left", html: "Logout" @@ -57,7 +57,7 @@ var Admin = { Helper.addClass("#admin-lock", "clickable"); document.getElementById("admin-lock").innerHTML = "lock_open"; if(!Helper.mobilecheck()){ - $('#admin-lock').tooltip({ + Helper.tooltip('#admin-lock', { delay: 5, position: "left", html: "Logout" @@ -121,7 +121,7 @@ var Admin = { if(Helper.html("#admin-lock") != "lock") { if(!Helper.mobilecheck()) { - $('#admin-lock').tooltip("destroy"); + Helper.tooltip('#admin-lock', "destroy"); //$('#admin-lock').tooltip('destroy'); } Helper.removeClass("#admin-lock", "clickable"); @@ -219,7 +219,8 @@ var Admin = { }, hide_settings: function() { - $('.sidenav').sidenav('close'); + var sidenavElem = document.getElementsByClassName("sidenav")[0]; + M.Sidenav.getInstance(sidenavElem).close(); }, shuffle: function() { diff --git a/server/public/assets/js/channel.js b/server/public/assets/js/channel.js index e94659e1..9b1d37f3 100644 --- a/server/public/assets/js/channel.js +++ b/server/public/assets/js/channel.js @@ -7,7 +7,7 @@ var Channel = { //$(".embed-button-footer").addClass("hide"); //$(".skip_next_client").removeClass("hide"); if(!Helper.mobilecheck()) { - $(".skip_next_client").tooltip({ + Helper.tooltip(".skip_next_client", { delay: 5, position: "bottom", html: "Skip" @@ -45,37 +45,29 @@ var Channel = { if(Player !== undefined && !client) Player.stopInterval= false; if(!client) { - //$('ul.playlist-tabs').tabs(); - $('ul.playlist-tabs-loggedIn').tabs(); - $('ul.chatTabs').tabs(); + //Helper.tabs('.playlist-tabs'); + Helper.tabs('.playlist-tabs-loggedIn'); + Helper.tabs('.chatTabs'); } - $(".sidenav").sidenav({ + var sidenavElem = document.getElementsByClassName("sidenav")[0]; + M.Sidenav.init(sidenavElem, { menuWidth: 310, edge: side, closeOnClick: false, draggable: false, onOpenStart: function(el) { Helper.addClass(".hamburger-sidenav", "open"); - $('*[id*=sidenav-overlay]:visible').each(function(i) { - if(i > 0) { - this.remove(); - } - }); }, onCloseStart: function(el) { Helper.removeClass(".hamburger-sidenav", "open"); - $('*[id*=sidenav-overlay]:visible').each(function(i) { - if(i > 0) { - this.remove(); - } - }); }, }); - $('.collapsible').collapsible({ + M.Collapsible.init(document.getElementsByClassName("settings-collapsible")[0], { accordion : true }); + if(!client) { - $("#embed").modal(); + M.Modal.init(document.getElementById("embed")); } else { //$("#help").remove(); Helper.removeElement("#embed"); @@ -83,13 +75,13 @@ var Channel = { Helper.removeElement(".embed-button-footer"); Helper.removeElement(".tabs"); } - $("#help").modal(); - $("#contact").modal(); - $("#channel-share-modal").modal(); - $("#delete_song_alert").modal({ + M.Modal.init(document.getElementById("help")); + M.Modal.init(document.getElementById("contact")); + M.Modal.init(document.getElementById("channel-share-modal")); + M.Modal.init(document.getElementById("delete_song_alert"), { dismissible: false }); - $("#user_password").modal({ + M.Modal.init(document.getElementById("user_password"), { dismissible: false }); @@ -156,12 +148,12 @@ var Channel = { $("#share-join-qr").attr("src", "https://chart.googleapis.com/chart?chs=221x221&cht=qr&choe=UTF-8&chld=L|1&chl="+shareCodeUrl); $("#channel-name-join").text("client." + window.location.hostname + "/" + chan.toLowerCase()); } else { - $(".video-container").remove(); - $(".offline-panel").remove(); - $(".remote-panel").remove(); - $(".mobile-remote-panel").remove(); - $(".import-panel").remove(); - $(".export-panel").remove(); + Helper.removeElement(".video-container"); + Helper.removeElement(".offline-panel"); + Helper.removeElement(".remote-panel"); + Helper.removeElement(".mobile-remote-panel"); + Helper.removeElement(".import-panel"); + Helper.removeElement(".export-panel"); } if(no_socket || Helper.mobilecheck()){ emit_list(); @@ -178,39 +170,39 @@ var Channel = { if(!Helper.mobilecheck()) { if(!client) { - $("#chan").tooltip({ + Helper.tooltip("#chan", { delay: 5, position: "bottom", html: "Show join URL", }); } - $("#viewers").tooltip({ + Helper.tooltip("#viewers", { delay: 5, position: "top", html: "Viewers" }); - $("#fullscreen").tooltip({ + Helper.tooltip("#fullscreen", { delay: 5, position: "top", html: "Fullscreen" }); - $(".search-btn-container").tooltip({ + Helper.tooltip(".search-btn-container", { delay: 5, position: "bottom", html: "Search" }); - $(".shuffle-btn-container").tooltip({ + Helper.tooltip(".shuffle-btn-container", { delay: 5, position: "bottom", html: "Shuffle", }); - $("#settings").tooltip({ + Helper.tooltip("#settings", { delay: 5, position: "bottom", html: "Settings", @@ -227,8 +219,8 @@ var Channel = { if(!client) { Mobile_remote.initiate_volume(); } - $(".close-settings").addClass("hide"); - } else { + Helper.addClass(".close-settings", "hide"); + } else { $('input#chan_description').characterCounter(); if(!client) { Channel.window_width_volume_slider(); @@ -253,7 +245,7 @@ var Channel = { Helper.sample(); if(!Helper.mobilecheck() && !client) { - $('.castButton').tooltip({ + Helper.tooltip('.castButton', { delay: 5, position: "top", html: "Cast Zoff to TV" @@ -271,8 +263,8 @@ var Channel = { }, }); - $(".sp-choose").addClass("hide"); - $(".sp-cancel").addClass("btn-flat waves-effect waves-red"); + Helper.addClass(".sp-choose", "hide"); + Helper.addClass(".sp-cancel", "btn-flat waves-effect waves-red"); Helper.removeClass(".sp-cancel", "sp-cancel"); $(".sp-button-container").append("CHOOSE"); } @@ -288,12 +280,12 @@ var Channel = { $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color)); $("#search").attr("placeholder", "Find song on YouTube..."); - if(!$("footer").hasClass("padding-bottom-novideo") && !client) { - $("footer").addClass("padding-bottom-novideo"); + if(!client) { + Helper.addClass("footer", "padding-bottom-novideo"); } if(!/chrom(e|ium)/.test(navigator.userAgent.toLowerCase()) && !Helper.mobilecheck() && !client){ - $(".castButton").css("display", "none"); + Helper.css(".castButton", "display", "none"); } Helper.log(["chromecastAvailable " + chromecastAvailable, "chromecastReady " + chromecastReady]); @@ -512,26 +504,27 @@ var Channel = { $("#embed-button").css("display", "none"); if(!Helper.mobilecheck()) { - $('.castButton').tooltip("destroy"); - $("#viewers").tooltip("destroy"); + Helper.tooltip('.castButton', "destroy"); + Helper.tooltip("#viewers", "destroy"); //$('.castButton-unactive').tooltip("destroy"); - $("#offline-mode").tooltip("destroy"); + Helper.tooltip("#offline-mode", "destroy"); if(M.Tooltip.getInstance($("#chan_thumbnail")) != undefined) { - $('#chan_thumbnail').tooltip("destroy"); + Helper.tooltip('#chan_thumbnail', "destroy"); } - $('#fullscreen').tooltip("destroy"); + Helper.tooltip('#fullscreen', "destroy"); if(M.Tooltip.getInstance($("#admin-lock")) != undefined) { - $('#admin-lock').tooltip("destroy"); + Helper.tooltip('#admin-lock', "destroy"); } - $(".search-btn-container").tooltip("destroy"); - $(".shuffle-btn-container").tooltip("destroy"); - $("#settings").tooltip("destroy"); + Helper.tooltip(".search-btn-container", "destroy"); + Helper.tooltip(".shuffle-btn-container", "destroy"); + Helper.tooltip("#settings", "destroy"); } - $("#seekToDuration").remove(); - $(".sidenav").sidenav("destroy"); + Helper.removeElement("#seekToDuration"); + + M.Sidenav.getInstance(document.getElementsByClassName("sidenav")[0]).destroy(); if(!client) { if(!Helper.mobilecheck()) { - $("#chan").tooltip("destroy"); + Helper.tooltip("#chan", "destroy"); } if(M.TapTarget.getInstance($(".tap-target"))) { $('.tap-target').tapTarget('close'); @@ -588,15 +581,15 @@ var Channel = { $("meta[name=theme-color]").attr("content", "#2D2D2D"); if(!Helper.mobilecheck() && !user_auth_avoid){ - $("#playbar").remove(); - $("#main_components").remove(); - $("#player").addClass("player_bottom"); - $("#main-row").addClass("frontpage_modified_heights"); - $("#player").css("opacity", "1"); + Helper.removeElement("#playbar"); + Helper.removeElement("#main_components"); + Helper.addClass("#player", "player_bottom"); + Helper.addClass("#main-row", "frontpage_modified_heights"); + Helper.css("#player", "opacity", "1"); Helper.removeClass("#video-container", "no-opacity"); $("#main-row").prepend("
"); $("#player_bottom_overlay").append("X"); - $("#playlist").remove(); + Helper.removeElement("#playlist"); } else { try{ Player.player.destroy(); @@ -608,10 +601,10 @@ var Channel = { var response = $("
" + e + "
"); //$(".drag-target").remove(); - $("#sidenav-overlay").remove(); - $("main").attr("class", "center-align container"); + Helper.removeElement("#sidenav-overlay"); + document.getElementsByTagName("main")[0].className = "center-align container"; Helper.removeClass("#main-container", "channelpage"); - $("#main-container").attr("style", ""); + document.getElementById("main-container").setAttribute("style", ""); $("header").html($(response.find("header")).html()); $($(response.find(".section.mega"))).insertAfter("header"); $($(response.find(".section.mobile-search"))).insertAfter(".mega"); @@ -619,7 +612,7 @@ var Channel = { else $("main").append($(response.find("#main_section_frontpage")).wrap("
").parent().html()); Helper.removeClass(".page-footer", "padding-bottom-extra"); Helper.removeClass(".page-footer", "padding-bottom-novideo"); - $("#favicon").attr("href", "/assets/images/favicon-32x32.png"); + document.getElementById("favicon").setAttribute("href", "/assets/images/favicon-32x32.png"); //$(".context-menu-list").remove(); Helper.log(["Socket", socket]); @@ -635,9 +628,9 @@ var Channel = { if($("#alreadychannel").length === 0 && !user_auth_avoid){ $("head").append("
-1) { - $("#playlist").addClass("hide"); - $("#controls").addClass("hide"); - $("#player").addClass("video_only"); - $("#zoffbutton").css("bottom", "0px"); + Helper.addClass("#playlist", "hide"); + Helper.addClass("#controls", "hide"); + Helper.addClass("#player", "video_only"); + Helper.css("#zoffbutton", "bottom", "0px"); } - - $("#locked_channel").modal({ + M.Modal.init(document.getElementById("locked_channel"), { dismissible: false }); color = "#" + hash[1]; @@ -91,7 +90,7 @@ $(document).ready(function() { socket = io.connect(''+add+':8080', connection_options); socket.on('auth_required', function() { - $("#locked_channel").modal('open'); + M.Modal.getInstance(document.getElementById("locked_channel")).open(); }); socket.on("get_list", function() { @@ -198,10 +197,10 @@ function toast(msg) { msg=Helper.rnd(["That's not the right password!", "Wrong! Better luck next time...", "You seem to have mistyped the password", "Incorrect. Have you tried meditating?","Nope, wrong password!", "Wrong password. The authorities have been notified."]); //Crypt.remove_pass(chan.toLowerCase()); Admin.display_logged_out(); - $("#thumbnail_form").css("display", "none"); - $("#description_form").css("display", "none"); + Helper.css("#thumbnail_form", "display", "none"); + Helper.css("#description_form", "display", "none"); if(!Helper.mobilecheck()) { - $('#chan_thumbnail').tooltip("destroy"); + Helper.tooltip('#chan_thumbnail', "destroy"); } w_p = true; break; @@ -248,7 +247,7 @@ function toast(msg) { Helper.css("#thumbnail_form", "display", "none"); Helper.css("#description_form", "display", "none"); if(!Helper.mobilecheck()) { - $('#chan_thumbnail').tooltip("destroy"); + Helper.tooltip('#chan_thumbnail', "destroy"); } w_p = true; Helper.addClass("#playlist_loader", "hide"); @@ -289,7 +288,7 @@ function toast(msg) { $("#thumbnail_form").css("display", "inline-block"); $("#description_form").css("display", "inline-block"); if(!Helper.mobilecheck()) { - $('#chan_thumbnail').tooltip({ + Helper.tooltip('#chan_thumbnail', { delay: 5, position: "left", html: "imgur link" diff --git a/server/public/assets/js/frontpage.js b/server/public/assets/js/frontpage.js index 34e1f42b..3f6d85bc 100755 --- a/server/public/assets/js/frontpage.js +++ b/server/public/assets/js/frontpage.js @@ -307,6 +307,7 @@ var Frontpage = { }, to_channel: function(new_channel, popstate) { + console.log(new_channel); $("#channel-load").css("display", "block"); window.scrollTo(0, 0); frontpage = false; @@ -318,10 +319,10 @@ var Frontpage = { } $("#main-container").css("background-color", "#2d2d2d"); if(!Helper.mobilecheck()) { - $("#frontpage-viewer-counter").tooltip("destroy"); - $(".generate-channel-name").tooltip("destroy"); - $("#offline-mode").tooltip("destroy"); - $("#client-mode-button").tooltip("destroy"); + Helper.tooltip("#frontpage-viewer-counter", "destroy"); + Helper.tooltip(".generate-channel-name", "destroy"); + Helper.tooltip("#offline-mode", "destroy"); + Helper.tooltip("#client-mode-button", "destroy"); if($(".pin").length == 1) { $($(".pin").parent().parent().parent()).tooltip("destroy"); } @@ -355,10 +356,10 @@ var Frontpage = { var response = $("
" + e + "
"); $('select').formSelect('destroy'); - $(".mega").remove(); - $(".mobile-search").remove(); - $("main").attr("class", "container center-align main"); - $("#main-container").addClass("channelpage"); + Helper.removeElement(".mega"); + Helper.removeElement(".mobile-search"); + document.getElementsByTagName("main")[0].className = "container center-align main"; + Helper.addClass("#main-container", "channelpage"); //$("header").html($($(e)[63]).html()); $("header").html($(response.find("header")).html()); if($("#alreadychannel").length === 0 || Helper.mobilecheck() || Player.player === undefined){ @@ -373,8 +374,8 @@ var Frontpage = { Helper.removeElement("#closePlayer"); Helper.removeElement("#player_bottom_overlay"); } - $("#search").attr("placeholder", "Find song on YouTube..."); - $(".page-footer").addClass("padding-bottom-novideo"); + document.getElementById("search").setAttribute("placeholder", "Find song on YouTube..."); + Helper.addClass(".page-footer", "padding-bottom-novideo"); from_frontpage = true; if($("#alreadychannel").length == 1){ Channel.init(); @@ -411,7 +412,7 @@ var Frontpage = { }; if(window.location.hostname == "fb.zoff.me") { - $("footer").addClass("hide"); + Helper.addClass("footer", "hide"); } channel_list = $("#channel-list-container").clone().html(); @@ -435,9 +436,9 @@ var Frontpage = { setup_playlist_listener(); } - $("#about").modal(); - $("#help").modal(); - $("#contact").modal(); + M.Modal.init(document.getElementById("about")); + M.Modal.init(document.getElementById("help")); + M.Modal.init(document.getElementById("contact")); $('select').formSelect(); Helper.log([ @@ -450,7 +451,7 @@ var Frontpage = { change_offline(true, offline); } else { if(!Helper.mobilecheck()) { - $("#offline-mode").tooltip({ + Helper.tooltip("#offline-mode", { delay: 5, position: "bottom", html: "Enable local mode" @@ -458,17 +459,17 @@ var Frontpage = { } } if(!Helper.mobilecheck()) { - $("#frontpage-viewer-counter").tooltip({ + Helper.tooltip("#frontpage-viewer-counter", { delay: 5, position: "bottom", html: "Total Viewers" }); - $("#client-mode-button").tooltip({ + Helper.tooltip("#client-mode-button", { delay: 5, position: "bottom", html: "Client mode" }); - $(".generate-channel-name").tooltip({ + Helper.tooltip(".generate-channel-name", { delay: 5, position: "bottom", html: "Generate name" @@ -476,12 +477,12 @@ var Frontpage = { } Frontpage.get_frontpage_lists(); - $("#channel-load").css("display", "none"); + Helper.css("#channel-load", "display", "none"); //Materialize.toast("Try out our new feature, remote!", 8000) if(window.location.hash == "#donation") { window.location.hash = "#"; - $('#donation').modal(); - $('#donation').modal('open'); + M.Modal.init(document.getElementById("donation"));; + M.Modal.getInstance(document.getElementById("donation")).open(); } if(!localStorage.ok_cookie){ diff --git a/server/public/assets/js/functions.js b/server/public/assets/js/functions.js index dc68e609..cd1fb91a 100644 --- a/server/public/assets/js/functions.js +++ b/server/public/assets/js/functions.js @@ -47,7 +47,7 @@ function hide_native(way) { if(M.Tooltip.getInstance($(".castButton"))) { $('.castButton').tooltip('destroy'); } - $('.castButton').tooltip({ + Helper.tooltip('.castButton', { delay: 5, position: "top", html: "Stop casting" @@ -93,7 +93,7 @@ function hide_native(way) { if(M.Tooltip.getInstance($(".castButton"))) { $('.castButton').tooltip('destroy'); } - $('.castButton').tooltip({ + Helper.tooltip('.castButton', { delay: 5, position: "top", html: "Cast Zoff to TV" @@ -156,7 +156,7 @@ function start_auth() { user_auth_started = true; Helper.removeClass("#player_overlay", "hide"); Helper.css("#player_overlay", "display", "block"); - $("#user_password").modal("open"); + M.Modal.getInstance(document.getElementById("user_password")).open(); $("#user-pass-input").focus(); //Crypt.remove_userpass(chan.toLowerCase()); before_toast(); @@ -194,7 +194,7 @@ function get_list_ajax() { start_auth(); } if(client) { - $("#channel-load").remove(); + Helper.removeElement("#channel-load"); } List.populate_list(response.results); } @@ -209,7 +209,7 @@ function get_list_ajax() { }, xmlhttp.getResponseHeader("Retry-After") * 1000) } if(client) { - $("#channel-load").remove(); + Helper.removeElement("#channel-load"); } //List.populate_list(response.responseJSON.results); } @@ -235,8 +235,8 @@ function contextListener(that, e) { } else if(top < 0) { top = 15; } - Helper.css(".context-menu-root", "left", left); - Helper.css(".context-menu-root", "top", top); + Helper.css(".context-menu-root", "left", left + "px"); + Helper.css(".context-menu-root", "top", top + "px"); Helper.removeClass(".context-menu-root","hide"); if(!Helper.mobilecheck()) { mouseContext(left, top); @@ -542,7 +542,7 @@ function change_offline(enabled, already_offline){ Helper.removeClass("#offline-mode", "waves-cyan"); Helper.addClass("#offline-mode", "cyan"); if(!Helper.mobilecheck()) { - $("#offline-mode").tooltip({ + Helper.tooltip("#offline-mode", { delay: 5, position: "bottom", html: "Disable local mode" @@ -600,7 +600,7 @@ function change_offline(enabled, already_offline){ Helper.addClass("#offline-mode", "waves-cyan"); Helper.removeClass("#offline-mode", "cyan"); if(!Helper.mobilecheck()) { - $("#offline-mode").tooltip({ + Helper.tooltip("#offline-mode", { delay: 5, position: "bottom", html: "Enable local mode" @@ -613,7 +613,7 @@ function change_offline(enabled, already_offline){ $("#controls").off("mouseup"); $("#controls").off("mousemove", Channel.seekToMove); $("#controls").off("click", Channel.seekToClick); - $("#seekToDuration").remove(); + Helper.removeElement("#seekToDuration"); if(window.location.pathname != "/"){ socket.on("color", Player.setBGimage); socket.emit("pos", {channel: chan.toLowerCase()}); @@ -625,6 +625,31 @@ function change_offline(enabled, already_offline){ } } +function handleEvent(e, target, tried) { + if(dynamicListeners["click"] && dynamicListeners["click"]["#" + target.id]) { + dynamicListeners["click"]["#" + target.id].call(target); + return; + } else { + for(var i = 0; i < target.classList.length; i++) { + if(dynamicListeners["click"] && dynamicListeners["click"]["." + target.classList[i]]) { + dynamicListeners["click"]["." + target.classList[i]].call(target); + return; + } + } + }if(!tried) { + handleEvent(e, e.target.parentElement, true); + } +} + +function addListener(type, element, callback) { + if(dynamicListeners[type] == undefined) dynamicListeners[type] = {}; + dynamicListeners[type][element] = callback; +} + +function removeListener(type, element) { + delete dynamicListeners[type][element]; +} + function toast(msg) { switch(msg) { case "other_list_pass": @@ -685,7 +710,7 @@ function toast(msg) { Helper.css("#thumbnail_form", "display", "none"); Helper.css("#description_form", "display", "none"); if(!Helper.mobilecheck()) { - $('#chan_thumbnail').tooltip("destroy"); + Helper.tooltip('#chan_thumbnail', "destroy"); } w_p = true; break; @@ -734,7 +759,7 @@ function toast(msg) { Helper.css("#thumbnail_form", "display", "none"); Helper.css("#description_form", "display", "none"); if(!Helper.mobilecheck()) { - $('#chan_thumbnail').tooltip("destroy"); + Helper.tooltip('#chan_thumbnail', "destroy"); } w_p = true; Helper.addClass("#playlist_loader", "hide"); diff --git a/server/public/assets/js/helpers.js b/server/public/assets/js/helpers.js index 1b873550..c72598c2 100755 --- a/server/public/assets/js/helpers.js +++ b/server/public/assets/js/helpers.js @@ -20,16 +20,17 @@ var Helper = { css: function(element, attribute, value) { try { - if(element.substring(0,1) == "#") { + if(typeof(element) == "object") { + element.style[attribute] = value; + } else if(element.substring(0,1) == "#") { document.getElementById(element.substring(1)).style[attribute] = value; } else { - var elements = documents.getElementsByClassName(element.substring(1)); + var elements = document.getElementsByClassName(element.substring(1)); for(var i = 0; i < elements.length; i++) { elements[i].style[attribute] = value; } } } catch(e) { - console.log(e); } }, @@ -38,7 +39,7 @@ var Helper = { if(element.substring(0,1) == "#") { return document.getElementById(element.substring(1)).innerHTML; } else { - var elements = documents.getElementsByClassName(element.substring(1)); + var elements = document.getElementsByClassName(element.substring(1)); for(var i = 0; i < elements.length; i++) { return elements[i].innerHTML; } @@ -48,34 +49,49 @@ var Helper = { removeClass: function(element, className) { try { - if(element.substring(0,1) == "#") { + if(typeof(element) == "object") { + element.classList.remove(className); + } else if(element.substring(0,1) == "#") { document.getElementById(element.substring(1)).classList.remove(className); } else { - var elements = documents.getElementsByClassName(element.substring(1)); + var elements = document.getElementsByClassName(element.substring(1)); for(var i = 0; i < elements.length; i++) { elements[i].classList.remove(className); } } } catch(e) { - console.log(e); } }, removeElement: function(element) { - if(element.substring(0,1) == "#") { - var elem = document.getElementById(element.substring(1)); - elem.remove(); - } else { - var elements; - if(element.substring(0,1) == ".") { - elements = documents.getElementsByClassName(element.substring(1)); + try { + if(element.substring(0,1) == "#") { + var elem = document.getElementById(element.substring(1)); + elem.remove(); } else { - elements = document.getElementsByTagName(element); + 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]); + } + } + } else { + elements = document.getElementsByClassName(element.substring(1)); + } + } else { + elements = document.getElementsByTagName(element); + } + for(var i = 0; i < elements.length; i++) { + elements[i].remove(); + } } - for(var i = 0; i < elements.length; i++) { - elements[i].remove(); - } - } + } catch(e) {} }, setHtml: function(element, html) { @@ -85,7 +101,7 @@ var Helper = { } else { var elements; if(element.substring(0,1) == ".") { - elements = documents.getElementsByClassName(element.substring(1)); + elements = document.getElementsByClassName(element.substring(1)); } else { elements = document.getElementsByTagName(element); } @@ -95,8 +111,87 @@ var Helper = { } }, - addClass: function(element, className) { + attr: function(element, attr, value) { if(element.substring(0,1) == "#") { + var elem = document.getElementById(element.substring(1)); + elem.setAttribute(attr, value); + } 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]); + } + } + } else { + elements = document.getElementsByClassName(element.substring(1)); + } + } else { + elements = document.getElementsByTagName(element); + } + for(var i = 0; i < elements.length; i++) { + elements[i].setAttribute(attr, value); + } + } + }, + + tabs: function(element, options) { + if(element.substring(0,1) == "#") { + var elem = document.getElementById(element.substring(1)); + if(options == "destroy") { + var this_element = M.Tabs.getInstance(elem); + if(this_element != undefined) this_element.destroy(); + } else { + M.Tabs.init(elem, options); + } + } else { + var elements = document.getElementsByClassName(element.substring(1)); + for(var i = 0; i < elements.length; i++) { + if(options == "destroy") { + var this_element = M.Tabs.getInstance(elem); + if(this_element != undefined) this_element.destroy(); + } else { + M.Tabs.init(elements[i], options); + } + } + } + }, + + tooltip: function(element, options) { + try { + if(element.substring(0,1) == "#") { + var elem = document.getElementById(element.substring(1)); + if(options == "destroy") { + var this_element = M.Tooltip.getInstance(elem); + if(this_element != undefined) this_element.destroy(); + } else { + M.Tooltip.init(elem, options); + } + } else { + var elements = document.getElementsByClassName(element.substring(1)); + for(var i = 0; i < elements.length; i++) { + if(options == "destroy") { + var this_element = M.Tooltip.getInstance(elem); + if(this_element != undefined) this_element.destroy(); + } else { + M.Tooltip.init(elements[i], options); + } + } + } + } catch(e) {} + }, + + 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; @@ -104,7 +199,19 @@ var Helper = { } else { var elements; if(element.substring(0,1) == ".") { - elements = documents.getElementsByClassName(element.substring(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]); + } + } + } else { + elements = document.getElementsByClassName(element.substring(1)); + } } else { elements = document.getElementsByTagName(element); } diff --git a/server/public/assets/js/list.js b/server/public/assets/js/list.js index deaf3a69..82004d8a 100755 --- a/server/public/assets/js/list.js +++ b/server/public/assets/js/list.js @@ -11,7 +11,7 @@ var List = { channel_function: function(msg) { if(user_auth_started) { user_auth_started = false; - $("#user_password").modal("close"); + M.Modal.getInstance(document.getElementById("user_password")).close(); } switch(msg.type) { @@ -128,7 +128,7 @@ var List = { $("#wrapper > div:nth-child(" + (i) + ")").after(add); } var added = $("#wrapper").children()[i]; - $(added).css("display", display); + 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){ @@ -889,9 +889,8 @@ var List = { }, show: function() { - if(!Helper.mobilecheck() && !chromecastAvailable) - { - $("#channel-share-modal").modal("open"); + if(!Helper.mobilecheck() && !chromecastAvailable) { + M.Modal.getInstance(document.getElementById("channel-share-modal")).open(); } if(chromecastAvailable) { castSession.sendMessage("urn:x-cast:zoff.me", {type: "showJoinInfo"}); diff --git a/server/public/assets/js/listeners.js b/server/public/assets/js/listeners.js index 24f3a71d..2f433da8 100755 --- a/server/public/assets/js/listeners.js +++ b/server/public/assets/js/listeners.js @@ -5,6 +5,7 @@ var client = false; if(domain.length > 0 && domain[0] == "client") { client = true; } +var dynamicListeners = {}; var socket_connected = false; var hasadmin = 0; var list_html = $("#list-song-html").html(); @@ -167,10 +168,10 @@ if(!Helper.mobilecheck() && (window.location.host != "localhost" && window.locat
\ \
'); - $("#contact").modal(); - $("#contact").modal("open"); + M.Modal.init(document.getElementById("contact")); + M.Modal.getInstance(document.getElementById("contact")).open(); /*$("#error-report-modal").modal();*/ - $("#error-report-code").text(JSON.stringify(Helper.logs, undefined, 4)); + Helper.setHtml("#error-report-code", JSON.stringify(Helper.logs, undefined, 4)); //console.error(e.originalEvent.error); return true; }; @@ -192,7 +193,7 @@ $().ready(function(){ }); } - $("#donate").modal(); + M.Modal.init(document.getElementById("donate")); socket.on("connect", function(){ if(connect_error){ @@ -273,10 +274,10 @@ initializeCastApi = function() { if(Helper.mobilecheck()) { Player.playVideo(); } - $("#channel-load").css("display", "none"); - $('.castButton').addClass('castButton-white-active'); - $("#playpause").css("visibility", "visible"); - $("#playpause").css("pointer-events", "all"); + Helper.css("#channel-load", "display", "none"); + Helper.addClass('.castButton', 'castButton-white-active'); + Helper.css("#playpause", "visibility", "visible"); + Helper.css("#playpause", "pointer-events", "all"); break; case cast.framework.SessionState.SESSION_RESUMED: castSession = cast.framework.CastContext.getInstance().getCurrentSession(); @@ -295,10 +296,10 @@ initializeCastApi = function() { castSession.sendMessage("urn:x-cast:zoff.me", {type: "loadVideo", start: Player.np.start, end: Player.np.end, videoId: video_id, seekTo: _seekTo, channel: chan.toLowerCase()}) castSession.sendMessage("urn:x-cast:zoff.me", {type: "nextVideo", videoId: full_playlist[0].id, title: full_playlist[0].title}) hide_native(1); - $("#channel-load").css("display", "none"); - $('.castButton').addClass('castButton-white-active'); - $("#playpause").css("visibility", "visible"); - $("#playpause").css("pointer-events", "all"); + Helper.css("#channel-load", "display", "none"); + Helper.addClass('.castButton', 'castButton-white-active'); + Helper.css("#playpause", "visibility", "visible"); + Helper.css("#playpause", "pointer-events", "all"); break; case cast.framework.SessionState.SESSION_ENDED: chromecastAvailable = false; @@ -340,13 +341,13 @@ initializeCastApi = function() { } }; -$(document).on("click", "#player_overlay", function(e) { +addListener("click", "#player_overlay", function(e) { if(chromecastAvailable) { Player.playPauseVideo(); } }); -$(document).on("click", "#bitcoin-address", function(e) { +addListener("click", "#bitcoin-address", function(e) { var copyTextarea = document.querySelector('#bitcoin-address'); copyTextarea.select(); var successful = document.execCommand('copy'); @@ -357,7 +358,7 @@ $(document).on("click", "#bitcoin-address", function(e) { } }); -$(document).on("click", "#ethereum-address", function(e) { +addListener("click", "#ethereum-address", function(e) { var copyTextarea = document.querySelector('#ethereum-address'); copyTextarea.select(); var successful = document.execCommand('copy'); @@ -368,28 +369,30 @@ $(document).on("click", "#ethereum-address", function(e) { } }); -$(document).on("click", ".pagination-results a", function(e) { - e.preventDefault(); +addListener("click", ".pagination-results a", function(e) { + event.preventDefault(); var that = $(this); var pageToken = that.attr("data-pagination"); var searchInput = that.attr("data-original-search"); - $(".pagination-results a").addClass("disabled"); + + Helper.addClass(".pagination-results a", "disabled"); Search.search(searchInput, false, false, pageToken); }); -$(document).on("click", "#settings", function(e) { - e.preventDefault(); +addListener("click", "#settings", function(e) { + event.preventDefault(); + var sidenavElem = document.getElementsByClassName("sidenav")[0]; if(!M.Sidenav.getInstance($(".sidenav")).isOpen) { - $(".sidenav").sidenav("open"); + M.Sidenav.getInstance(sidenavElem).open(); } else { - $(".sidenav").sidenav("close"); + M.Sidenav.getInstance(sidenavElem).close(); } }); -$(document).on("click", ".accept-delete", function(e) { - e.preventDefault(); +addListener("click", ".accept-delete", function(e) { + event.preventDefault(); emit("delete_all", {channel: chan.toLowerCase()}); - $("#delete_song_alert").modal("close"); + M.Modal.getInstance(document.getElementById("delete_song_alert")).close(); }); $(document).keyup(function(event) { @@ -451,8 +454,8 @@ $(document).on("mouseenter", ".card.sticky-action", function(e){ }, 50); }); -$(document).on("click", "#chat_submit", function(e){ - e.preventDefault(); +addListener("click", "#chat_submit", function(e){ + event.preventDefault(); $("#chatForm").submit(); }); @@ -465,8 +468,8 @@ $(document).on("mouseleave", ".card.sticky-action", function(e){ }, 100); }); -$(document).on("click", "#offline-mode", function(e){ - e.preventDefault(); +addListener("click", "#offline-mode", function(e){ + event.preventDefault(); if(!Crypt.get_offline()){ change_offline(true, offline); } else{ @@ -474,19 +477,19 @@ $(document).on("click", "#offline-mode", function(e){ } }); -$(document).on("submit", "#thumbnail_form", function(e){ - e.preventDefault(); +addListener("submit", "#thumbnail_form", function(e){ + event.preventDefault(); emit("suggest_thumbnail", {channel: chan, thumbnail: $("#chan_thumbnail").val()}); $("#chan_thumbnail").val(""); }); -$(document).on("submit", "#description_form", function(e){ - e.preventDefault(); +addListener("submit", "#description_form", function(e){ + event.preventDefault(); emit("suggest_description", {channel: chan, description: $("#chan_description").val()}); $("#chan_description").val(""); }); -$(document).on("click", "#playpause-overlay", function(){ +addListener("click", "#playpause-overlay", function(){ if($("#play-overlay").hasClass("hide")){ Player.pauseVideo(); $("#play-overlay").toggleClass("hide"); @@ -498,44 +501,44 @@ $(document).on("click", "#playpause-overlay", function(){ } }); -$(document).on('click', '#cookieok', function(e) { - e.preventDefault(); +addListener("click", '#cookieok', function(e) { + event.preventDefault(); $(this).fadeOut(function(){ $(this).remove(); localStorage.ok_cookie = true; }); }); -$(document).on("click", ".connect_error", function(e){ - e.preventDefault(); +addListener("click", ".connect_error", function(e){ + event.preventDefault(); $(this).fadeOut(function(){ $(this).remove(); connect_error = false; }); }); -$(document).on("click", ".extra-button-search", function(e){ - e.preventDefault(); +addListener("click", ".extra-button-search", function(e){ + event.preventDefault(); $("#search").val($(this).attr("data-text")); Search.search($(this).attr("data-text")); }); -$(document).on("click", ".extra-button-delete", function(e){ - e.preventDefault(); +addListener("click", ".extra-button-delete", function(e){ + event.preventDefault(); $(this).parent().remove(); if($(".not-imported-container").children().length === 0){ $(".not-imported").toggleClass("hide"); } }); -$(document).on("click", "#context-menu-overlay", function(e) { +addListener("click", "#context-menu-overlay", function(e) { $(".context-menu-root").addClass("hide"); $("#context-menu-overlay").addClass("hide"); $(".context-menu-root").attr("data-id", ""); }); -$(document).on("click", ".copy-context-menu", function(e) { - e.preventDefault(); +addListener("click", ".copy-context-menu", function(e) { + event.preventDefault(); var that = this; var parent = $(that).parent(); var id = parent.attr("data-id"); @@ -557,8 +560,8 @@ $(document).on("click", ".copy-context-menu", function(e) { $(".context-menu-root").attr("data-id", ""); }); -$(document).on("click", ".find-context-menu", function(e) { - e.preventDefault(); +addListener("click", ".find-context-menu", function(e) { + event.preventDefault(); var that = this; var parent = $(that).parent(); var id = parent.attr("data-id"); @@ -571,7 +574,7 @@ $(document).on("click", ".find-context-menu", function(e) { $(".context-menu-root").attr("data-id", ""); }); -$(document).on("click", ".delete-context-menu", function(e) { +addListener("click", ".delete-context-menu", function(e) { var that = this; if($(that).hasClass("context-menu-disabled")) { return; @@ -598,8 +601,8 @@ $(document).on("click", ".delete-context-menu", function(e) { $(".context-menu-root").attr("data-id", ""); }) -$(document).on("click", "#closePlayer", function(e){ - e.preventDefault(); +addListener("click", "#closePlayer", function(e){ + event.preventDefault(); socket.emit("change_channel"); try{ if(chromecastAvailable){ @@ -619,19 +622,37 @@ $(document).on("click", "#closePlayer", function(e){ $("#closePlayer").remove(); }); -$(document).on("click", ".prev_page", function(e){ - e.preventDefault(); + +document.addEventListener("click", function(e) { + handleEvent(e, e.target, false); +}, false); + +document.addEventListener("input", function(e) { + handleEvent(e, e.target, false); +}, true); + +document.addEventListener("change", function(e) { + handleEvent(e, e.target, false); +}, true); + +document.addEventListener("submit", function(e) { + handleEvent(e, e.target, false); +}, true); + +addListener("click", ".prev_page", function(e) { +//addListener("click", ".prev_page", function(e){ + event.preventDefault(); List.dynamicContentPage(-1); }); -$(document).on("click", ".modal-close", function(e){ - e.preventDefault(); +addListener("click", ".modal-close", function(e){ + event.preventDefault(); }); -$(document).on("change", ".password_protected", function(e) { - e.preventDefault(); +addListener("change", ".password_protected", function(e) { + event.preventDefault(); if(this.checked) { - $("#user_password").modal('open'); + M.Modal.getInstance(document.getElementById("user_password")).open(); $("#user-pass-input").focus(); } else { userpass = ""; @@ -640,15 +661,15 @@ $(document).on("change", ".password_protected", function(e) { } }); -$(document).on("submit", "#user-password-channel-form", function(e) { - e.preventDefault(); +addListener("submit", "#user-password-channel-form", function(e) { + event.preventDefault(); if(user_auth_started) { temp_user_pass = $("#user-pass-input").val(); $("#user-pass-input").val(""); socket.emit("list", {version: parseInt(localStorage.getItem("VERSION")), channel: chan.toLowerCase(), pass: Crypt.crypt_pass(temp_user_pass)}); } else { - $("#user_password").modal('close'); + M.Modal.getInstance(document.getElementById("user_password")).close(); userpass = $("#user-pass-input").val(); user_change_password = false; $("#user-pass-input").val(""); @@ -656,25 +677,25 @@ $(document).on("submit", "#user-password-channel-form", function(e) { } }); -$(document).on("click", ".change_user_pass_btn", function(e) { - e.preventDefault(); +addListener("click", ".change_user_pass_btn", function(e) { + event.preventDefault(); user_change_password = true; - $("#user_password").modal('open'); + M.Modal.getInstance(document.getElementById("user_password")).open(); $("#user-pass-input").focus(); }); -$(document).on("contextmenu", "#context-menu-overlay", function(e) { - e.preventDefault(); +addListener("contextmenu", "#context-menu-overlay", function(e) { + event.preventDefault(); }); -$(document).on("click", ".submit-user-password", function(e) { - e.preventDefault(); +addListener("click", ".submit-user-password", function(e) { + event.preventDefault(); if(user_auth_started) { temp_user_pass = $("#user-pass-input").val(); $("#user-pass-input").val(""); socket.emit("list", {version: parseInt(localStorage.getItem("VERSION")), channel: chan.toLowerCase(), pass: Crypt.crypt_pass(temp_user_pass)}); } else { - $("#user_password").modal('close'); + M.Modal.getInstance(document.getElementById("user_password")).close(); userpass = $("#user-pass-input").val(); user_change_password = false; $("#user-pass-input").val(""); @@ -682,17 +703,17 @@ $(document).on("click", ".submit-user-password", function(e) { } }); -$(document).on("click", ".close-user-password", function() { +addListener("click", ".close-user-password", function() { if(user_auth_started) { Player.stopInterval = true; user_auth_avoid = true; if(!Helper.mobilecheck()) { - $('.castButton').tooltip("destroy"); - $("#viewers").tooltip("destroy"); + Helper.tooltip('.castButton', "destroy"); + Helper.tooltip("#viewers", "destroy"); //$('.castButton-unactive').tooltip("destroy"); - $("#offline-mode").tooltip("destroy"); - $('#chan_thumbnail').tooltip("destroy"); - $('#admin-lock').tooltip("destroy"); + Helper.tooltip("#offline-mode", "destroy"); + Helper.tooltip('#chan_thumbnail', "destroy"); + Helper.tooltip('#admin-lock', "destroy"); } window.history.pushState("to the frontpage!", "Title", "/"); Channel.onepage_load(); @@ -705,47 +726,46 @@ $(document).on("click", ".close-user-password", function() { } }); -$(document).on("click", ".delete-all-songs", function(e){ - e.preventDefault(); - $("#delete_song_alert").modal("open"); +addListener("click", ".delete-all-songs", function(e){ + event.preventDefault(); + M.Modal.getInstance(document.getElementById("delete_song_alert")).open(); }); -$(document).on("click", ".not-exported-container .not-exported-element #extra-export-container-text .extra-add-text", function(){ +addListener("click", ".not-exported-container .not-exported-element #extra-export-container-text .extra-add-text", function(){ this.select(); }); -$(document).on("click", ".next_page", function(e){ - e.preventDefault(); +addListener("click", ".next_page", function(e){ + event.preventDefault(); List.dynamicContentPage(1); }); -$(document).on("click", ".last_page", function(e){ - e.preventDefault(); +addListener("click", ".last_page", function(e){ + event.preventDefault(); List.dynamicContentPage(10); }); -$(document).on("click", ".first_page", function(e){ - e.preventDefault(); +addListener("click", ".first_page", function(e){ + event.preventDefault(); List.dynamicContentPage(-10); }); -$(document).on("click", ".donate-button", function(e) { - e.preventDefault(); +addListener("click", ".donate-button", function(e) { + event.preventDefault(); ga('send', 'event', "button-click", "donate"); - - $("#donate").modal("open"); + M.Modal.getInstance(document.getElementById("donate")).open(); }); -$(document).on('click', '#toast-container', function(){ +addListener("click", '#toast-container', function(){ before_toast(); }); -$(document).on('click', "#aprilfools", function(){ +addListener("click", "#aprilfools", function(){ $(".mega").css("-webkit-transform", "rotate(0deg)"); $(".mega").css("-moz-transform", "rotate(0deg)"); }); -$(document).on('change', '#view_channels_select', function(e) { +addListener("change", '#view_channels_select', function(e) { var that = this; if(currently_showing_channels != parseInt(that.value)) { @@ -766,49 +786,51 @@ $(document).on('keyup mouseup', '#height_embed', function(){ $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly)); }); -$(document).on('input', '#color_embed', function(){ +addListener("input", '#color_embed', function(){ var that = $(this); color = that.val().substring(1); $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly)); }); -$(document).on('click', ".chan-link", function(e){ - e.preventDefault(); - Frontpage.to_channel($(this).attr("href"), false); +addListener("click", ".chan-link", function(e){ + event.preventDefault(); + var href = this.href.replace(window.location.protocol + "//" + window.location.hostname + "/", ""); + console.log(href, e); + Frontpage.to_channel(href, false); }); -$(document).on("click", ".listen-button", function(e){ +addListener("click", ".listen-button", function(e){ if($(".room-namer").val() === ""){ - e.preventDefault(); + event.preventDefault(); Frontpage.to_channel($(".room-namer").attr("placeholder")); } }); -$(document).on("submit", ".channel-finder", function(e){ - e.preventDefault(); +addListener("submit", ".channel-finder", function(e){ + event.preventDefault(); Frontpage.to_channel($(".room-namer").val()); return false; }); -$(document).on("submit", ".channel-finder-mobile", function(e){ - e.preventDefault(); +addListener("submit", ".channel-finder-mobile", function(e){ + event.preventDefault(); Frontpage.to_channel($("#searchFrontpage").val()); return false; }); -$(document).on("change", 'input[class=remote_switch_class]', function() +addListener("change", 'input[class=remote_switch_class]', function() { Hostcontroller.change_enabled(document.getElementsByName("remote_switch")[0].checked); Crypt.set_remote(enabled); }); -$(document).on("change", 'input[class=offline_switch_class]', function() +addListener("change", 'input[class=offline_switch_class]', function() { offline = document.getElementsByName("offline_switch")[0].checked; change_offline(offline, !offline); }); -$(document).on("change", 'input[class=conf]', function() +addListener("change", 'input[class=conf]', function() { Admin.save(false); }); @@ -817,8 +839,8 @@ $("#clickme").click(function(){ Player.playVideo(); }); -$(document).on("click", "#listExport", function(e){ - e.preventDefault(); +addListener("click", "#listExport", function(e){ + event.preventDefault(); if(!youtube_authenticated){ var nonce = Helper.randomString(29); window.callback = function(data) { @@ -846,8 +868,8 @@ $(document).on("click", "#listExport", function(e){ } }); -$(document).on("click", ".export-spotify-auth", function(e){ - e.preventDefault(); +addListener("click", ".export-spotify-auth", function(e){ + event.preventDefault(); var nonce = Helper.randomString(29); window.callback = function(data) { access_token_data = data; @@ -871,8 +893,8 @@ $(document).on("click", ".export-spotify-auth", function(e){ spotify_window = window.open("/o_callback#spotify=true&nonce=" + nonce, "", "width=600, height=600"); }); -$(document).on("submit", "#listImport", function(e){ - e.preventDefault(); +addListener("submit", "#listImport", function(e){ + event.preventDefault(); var url = $("#import").val().split("https://www.youtube.com/playlist?list="); if($("#import").val() !== "" && url.length == 2){ Search.importPlaylist(url[1]); @@ -889,8 +911,8 @@ $(document).on("submit", "#listImport", function(e){ document.getElementById("import").value = ""; }); -$(document).on("submit", "#listImportZoff", function(e) { - e.preventDefault(); +addListener("submit", "#listImportZoff", function(e) { + event.preventDefault(); var new_channel = $("#import_zoff").val(); if(new_channel == "") { M.toast({html: "It seems you've entered a invalid channel-name.", displayLength: 4000}); @@ -899,14 +921,14 @@ $(document).on("submit", "#listImportZoff", function(e) { socket.emit("import_zoff", {channel: chan.toLowerCase(), new_channel: new_channel.toLowerCase()}); }); -$(document).on("click", ".import-zoff", function(e) { - e.preventDefault(); +addListener("click", ".import-zoff", function(e) { + event.preventDefault(); Helper.addClass(".import-zoff-container", "hide"); Helper.removeClass(".zoff_add_field", "hide"); }); -$(document).on("submit", "#listImportSpotify", function(e){ - e.preventDefault(); +addListener("submit", "#listImportSpotify", function(e){ + event.preventDefault(); if(spotify_authenticated && $("#import_spotify").val() !== ""){ var url = $("#import_spotify").val().split("https://open.spotify.com/user/"); if(url.length == 2) { @@ -935,43 +957,43 @@ $(window).focus(function(){ unseen = false; }); -$(document).on("change", "#autoplay", function() { +addListener("change", "#autoplay", function() { if(this.checked) embed_autoplay = "&autoplay"; else embed_autoplay = ""; $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly)); }); -$(document).on("change", "#videoonly", function() { +addListener("change", "#videoonly", function() { if(this.checked) embed_videoonly = "&videoonly"; else embed_videoonly = ""; $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly)); }); -$(document).on("click", "#playbutton_remote", function(e) { - e.preventDefault(); +addListener("click", "#playbutton_remote", function(e) { + event.preventDefault(); Mobile_remote.play_remote(); }); -$(document).on("click", "#pausebutton_remote", function(e) { - e.preventDefault(); +addListener("click", "#pausebutton_remote", function(e) { + event.preventDefault(); Mobile_remote.pause_remote(); }); -$(document).on("click", "#skipbutton_remote", function(e) { - e.preventDefault(); +addListener("click", "#skipbutton_remote", function(e) { + event.preventDefault(); Mobile_remote.skip_remote(); }); -$(document).on("click", ".skip_next_client", function(e) { - e.preventDefault(); +addListener("click", ".skip_next_client", function(e) { + event.preventDefault(); }); -$(document).on("submit", "#remoteform", function(e) { - e.preventDefault(); +addListener("submit", "#remoteform", function(e) { + event.preventDefault(); Mobile_remote.get_input($("#remote_channel").val()); }); -$(document).on("click", ".chat-link", function(){ +addListener("click", ".chat-link", function(){ $("#text-chat-input").focus(); $("#chat-btn i").css("opacity", 1); Chat.channel_received = 0; @@ -983,7 +1005,7 @@ $(document).on("click", ".chat-link", function(){ scrollChat(); }); -$(document).on("click", ".chat-tab-li", function() { +addListener("click", ".chat-tab-li", function() { scrollChat(); }); @@ -991,55 +1013,55 @@ $(document).on('keyup', ".search_input", function(event) { searchTimeout(event); }); -$(document).on("click", ".chat-tab", function(){ +addListener("click", ".chat-tab", function(){ $("#text-chat-input").focus(); }); -$(document).on("click", ".prev", function(e){ - e.preventDefault(); +addListener("click", ".prev", function(e){ + event.preventDefault(); List.skip(false); }); -$(document).on("click", ".skip", function(e){ - e.preventDefault(); +addListener("click", ".skip", function(e){ + event.preventDefault(); List.skip(true); }); -$(document).on("click", "#chan", function(e){ - e.preventDefault(); +addListener("click", "#chan", function(e){ + event.preventDefault(); List.show(); }); -$(document).on("submit", "#adminForm", function(e){ - e.preventDefault(); +addListener("submit", "#adminForm", function(e){ + event.preventDefault(); Admin.pass_save(); }); -$(document).on("click", "#channel-share-modal", function(){ - $("#channel-share-modal").modal("close") +addListener("click", "#channel-share-modal", function(){ + M.Modal.getInstance(document.getElementById("channel-share-modal")).close(); }); -$(document).on("click", ".shareface", function(e) { +addListener("click", ".shareface", function(e) { ga('send', 'event', "button-click", "share-facebook"); }); -$(document).on("click", ".android-image-link", function() { +addListener("click", ".android-image-link", function() { ga('send', 'event', "button-click", "android-playstore-link"); }); -$(document).on("click", "#twitter-code-link", function() { +addListener("click", "#twitter-code-link", function() { ga('send', 'event', "button-click", "share-twitter"); }); -$(document).on("click", ".help-button-footer", function() { +addListener("click", ".help-button-footer", function() { ga('send', 'event', "button-click", "help-footer"); }); -$(document).on("click", "#embed-button", function() { +addListener("click", "#embed-button", function() { ga('send', 'event', "button-click", "embed-channel", "channel-name", chan.toLowerCase()); }) -$(document).on("click", ".chat-link", function(e){ +addListener("click", ".chat-link", function(e){ chat_active = true; unseen = false; chat_unseen = false; @@ -1053,7 +1075,7 @@ $(document).on("click", ".chat-link", function(e){ Helper.css("#pageButtons", "display", "none"); }); -$(document).on("click", ".playlist-link", function(e){ +addListener("click", ".playlist-link", function(e){ chat_active = false; Helper.css("#chat-container", "display", "none"); Helper.css("#wrapper", "display", "block"); @@ -1061,7 +1083,7 @@ $(document).on("click", ".playlist-link", function(e){ Helper.css("#pageButtons", "display", "flex"); }); -$(document).on("click", ".suggested-link", function(e){ +addListener("click", ".suggested-link", function(e){ chat_active = false; Helper.css("#chat-container", "display", "none"); Helper.css("#wrapper", "display", "none"); @@ -1069,8 +1091,8 @@ $(document).on("click", ".suggested-link", function(e){ Helper.css("#pageButtons", "display", "none"); }); -$(document).on("click", ".import-spotify-auth", function(e){ - e.preventDefault(); +addListener("click", ".import-spotify-auth", function(e){ + event.preventDefault(); var nonce = Helper.randomString(29); window.callback = function(data) { access_token_data = data; @@ -1094,44 +1116,44 @@ $(document).on("click", ".import-spotify-auth", function(e){ spotify_window = window.open("/o_callback#spotify=true&nonce=" + nonce, "", "width=600, height=600"); }); -$(document).on("click", ".import-youtube", function(e){ - e.preventDefault(); +addListener("click", ".import-youtube", function(e){ + event.preventDefault(); Helper.css(".youtube_unclicked", "display", "none"); Helper.css(".youtube_clicked", "display", "block"); }); -$(document).on("submit", "#chatForm", function(e){ - e.preventDefault(); +addListener("submit", "#chatForm", function(e){ + event.preventDefault(); Chat.chat(document.getElementById("chatForm").input); }); -$(document).on("click", "#shuffle", function(e) +addListener("click", "#shuffle", function(e) { - e.preventDefault(); + event.preventDefault(); Admin.shuffle(); }); -$(document).on("click", "#search-btn", function(e) +addListener("click", "#search-btn", function(e) { - //e.preventDefault(); + //event.preventDefault(); Search.showSearch(); }); -$(document).on("click", "#song-title", function(e) +addListener("click", "#song-title", function(e) { - e.preventDefault(); + event.preventDefault(); Search.showSearch(); }); -$(document).on("click", "#admin-lock", function(e) +addListener("click", "#admin-lock", function(e) { - e.preventDefault(); + event.preventDefault(); Admin.log_out(); }); -$(document).on("click", "#closeSettings", function(e) +addListener("click", "#closeSettings", function(e) { - e.preventDefault(); + event.preventDefault(); Admin.hide_settings(); }); @@ -1186,8 +1208,8 @@ $(document).on( "click", ".result-object", function(e){ } }); -$(document).on("click", ".result-get-more-info", function(e) { - e.preventDefault(); +addListener("click", ".result-get-more-info", function(e) { + event.preventDefault(); var that = $(this); var parent = that.parent().parent().parent().parent(); @@ -1201,26 +1223,26 @@ $(document).on("click", ".result-get-more-info", function(e) { } }) -$(document).on('click', '#submit-contact-form', function(e) { - e.preventDefault(); +addListener("click", '#submit-contact-form', function(e) { + event.preventDefault(); $("#contact-form").submit(); }); -$(document).on('submit', '#contact-form', function(e){ - e.preventDefault(); +addListener("submit", '#contact-form', function(e){ + event.preventDefault(); var message = $("#contact-form-message").val(); var from = $("#contact-form-from").val(); Helper.send_mail(from, message); }); -$(document).on('click', ".send-error-modal", function(e) { - e.preventDefault(); +addListener("click", ".send-error-modal", function(e) { + event.preventDefault(); $("#error-report-form").submit(); }) -$(document).on('submit', "#error-report-form", function(e) { - e.preventDefault(); +addListener("submit", "#error-report-form", function(e) { + event.preventDefault(); var captcha_response = grecaptcha.getResponse(); Helper.removeClass("#send-loader", "hide"); Helper.ajax({ @@ -1331,30 +1353,30 @@ $(document).on( "click", ".del_user_suggested", function(e){ List.vote(id, "del"); }); -$(document).on('click', '#toast-container', function(){ +addListener("click", '#toast-container', function(){ $(this).fadeOut(function(){ $(this).remove(); }); }); -$(document).on("click", "#embed-area", function(){ +addListener("click", "#embed-area", function(){ this.select(); }); -$(document).on("click", ".brand-logo-navigate", function(e){ - e.preventDefault(); +addListener("click", ".brand-logo-navigate", function(e){ + event.preventDefault(); window.history.pushState("to the frontpage!", "Title", "/"); Channel.onepage_load(); }); -$(document).on("click", "#player_bottom_overlay", function(e){ +addListener("click", "#player_bottom_overlay", function(e){ if($(e.target).attr("id") == "closePlayer") return; Frontpage.to_channel(chan.toLowerCase(), false); }); -$(document).on("click", ".generate-channel-name", function(e) { - e.preventDefault(); +addListener("click", ".generate-channel-name", function(e) { + event.preventDefault(); Helper.ajax({ type: "GET", url: "/api/generate_name", @@ -1415,8 +1437,8 @@ $(document).keydown(function(event) { } }); -$(document).on("click", "#close_find_form_button", function(e) { - e.preventDefault(); +addListener("click", "#close_find_form_button", function(e) { + event.preventDefault(); find_start = false; find_started = false; $("#find_div").toggleClass("hide"); @@ -1434,8 +1456,8 @@ $(document).keyup(function(event){ } }); -$(document).on("submit", "#find_form", function(e){ - e.preventDefault(); +addListener("submit", "#find_form", function(e){ + event.preventDefault(); if(this.find_value.value != find_word) { find_word = this.find_value.value; found_array = []; diff --git a/server/public/assets/js/player.js b/server/public/assets/js/player.js index 6ddf2633..f46b39dd 100755 --- a/server/public/assets/js/player.js +++ b/server/public/assets/js/player.js @@ -630,7 +630,7 @@ var Player = { if(window.location.pathname != "/" && ((offline && c.only) || (!offline && !c.only) || (!offline && c.only))) { document.getElementById("main-container").style.backgroundColor = Helper.rgbToHsl(color,true); Helper.css("#nav", "background-color", Helper.rgbToHsl(color, true)); - helper.css(".title-container", "background-color", Helper.rgbToHsl(color, true)); + Helper.css(".title-container", "background-color", Helper.rgbToHsl(color, true)); var hexHsl = Helper.rgbToHex(color[0], color[1], color[2]); try { var hsl = Helper.rgbToHsl(color, true).replace("hsl(", "").replace(")", "").replace("%", "").replace(/ /g,'').replace("%", "").split(","); diff --git a/server/public/assets/js/remotecontroller.js b/server/public/assets/js/remotecontroller.js index b6e7cb2a..b349f4fa 100755 --- a/server/public/assets/js/remotecontroller.js +++ b/server/public/assets/js/remotecontroller.js @@ -14,9 +14,9 @@ $(document).ready(function (){ 'secure': true }; - $("#about").modal(); - $("#contact").modal(); - $("#help").modal(); + M.Modal.init(document.getElementById("about")); + M.Modal.init(document.getElementById("contact")); + M.Modal.init(document.getElementById("help")); if(window.location.hostname == "remote.zoff.me") add = "https://zoff.me"; else add = "localhost"; diff --git a/server/public/assets/js/search.js b/server/public/assets/js/search.js index bc7819bf..6d9f0931 100755 --- a/server/public/assets/js/search.js +++ b/server/public/assets/js/search.js @@ -149,7 +149,7 @@ var Search = { Helper.addClass(".prev-results-button", "disabled"); } - $(".pagination-results a").attr("data-original-search", search_input); + Helper.attr(".pagination-results a", "data-original-search", search_input); //setTimeout(function(){$(".thumb").lazyload({container: $("#results")});}, 250); diff --git a/server/public/assets/js/token_apply.js b/server/public/assets/js/token_apply.js index d4f45b71..34cc6c16 100644 --- a/server/public/assets/js/token_apply.js +++ b/server/public/assets/js/token_apply.js @@ -1,7 +1,7 @@ $(document).ready(function() { - $("#about").modal(); - $(".help-button-footer").hide(); - $("#contact").modal(); + 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: contact@zoff.me");