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

Working onepage_load without jQuery elements

Browse Source
This commit is contained in:
Kasper Rynning-Tønnesen
2018-04-24 19:01:40 +02:00
parent 93cffa9ded
commit f540f10cca
9 changed files with 187 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
gulpfile.js
View File

@@ -5,11 +5,11 @@ var gulp = require('gulp'),
gulp.task('js', function () { gulp.task('js', function () {
gulp.src(['server/VERSION.js', 'server/config/api_key.js', 'server/public/assets/js/*.js', '!server/public/assets/js/embed*', '!server/public/assets/js/token*', '!server/public/assets/js/remotecontroller.js', '!server/public/assets/js/callback.js']) gulp.src(['server/VERSION.js', 'server/config/api_key.js', 'server/public/assets/js/*.js', '!server/public/assets/js/embed*', '!server/public/assets/js/token*', '!server/public/assets/js/remotecontroller.js', '!server/public/assets/js/callback.js'])
.pipe(uglify({ /*.pipe(uglify({
mangle: true, mangle: true,
compress: true, compress: true,
enclose: true enclose: true
})) }))*/
.pipe(concat('main.min.js')) .pipe(concat('main.min.js'))
.pipe(gulp.dest('server/public/assets/dist')); .pipe(gulp.dest('server/public/assets/dist'));
}); });

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

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

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

@@ -84,7 +84,7 @@ var Channel = {
Channel.spotify_is_authenticated(spotify_authenticated); Channel.spotify_is_authenticated(spotify_authenticated);
result_html = document.getElementById("temp-results-container"); result_html = document.getElementById("temp-results-container");
pagination_buttons_html = "<div>" + document.getElementsByClassName("pagination-results")[0].cloneNode(true).innerHTML + "</div>"; pagination_buttons_html = "<div class='pagination-results'>" + document.getElementsByClassName("pagination-results")[0].cloneNode(true).innerHTML + "</div>";
empty_results_html = Helper.html("#empty-results-container"); empty_results_html = Helper.html("#empty-results-container");
not_import_html = Helper.html(".not-imported-container"); not_import_html = Helper.html(".not-imported-container");
not_export_html = Helper.html(".not-exported-container"); not_export_html = Helper.html(".not-exported-container");
@@ -111,9 +111,9 @@ var Channel = {
document.getElementsByClassName("offline_switch_class")[0].checked = true; document.getElementsByClassName("offline_switch_class")[0].checked = true;
change_offline(true, offline); change_offline(true, offline);
} }
if(!Helper.mobilecheck() && ($("#alreadychannel").length === 0 || !Hostcontroller.old_id || $("#code-text").text().toUpperCase() == "ABBADUR")) setup_host_initialization(); if(!Helper.mobilecheck() && (document.querySelectorAll("#alreadychannel").length === 0 || !Hostcontroller.old_id || document.getElementById("code-text").innerText.toUpperCase() == "ABBADUR")) setup_host_initialization();
if($("#alreadychannel").length === 0 || Helper.mobilecheck()){ if(document.querySelectorAll("#alreadychannel").length === 0 || Helper.mobilecheck()){
setup_youtube_listener(); setup_youtube_listener();
get_list_listener(); get_list_listener();
setup_suggested_listener(); setup_suggested_listener();
@@ -217,7 +217,6 @@ var Channel = {
} }
Helper.addClass(".close-settings", "hide"); Helper.addClass(".close-settings", "hide");
} else { } else {
//$('input#chan_description').characterCounter();
if(!client) { if(!client) {
Channel.window_width_volume_slider(); Channel.window_width_volume_slider();
} }
@@ -251,7 +250,7 @@ var Channel = {
color: "#808080", color: "#808080",
change: function(c) { change: function(c) {
color = c.toHexString().substring(1); // #ff0000 color = c.toHexString().substring(1); // #ff0000
$("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color)); document.getElementById("embed-area").value = embed_code(embed_autoplay, embed_width, embed_height, color);
}, },
appendTo: "#embed", appendTo: "#embed",
containerClassName: 'polyfill-color z-depth-4', containerClassName: 'polyfill-color z-depth-4',
@@ -262,15 +261,15 @@ var Channel = {
Helper.addClass(".sp-choose", "hide"); Helper.addClass(".sp-choose", "hide");
Helper.addClass(".sp-cancel", "btn-flat waves-effect waves-red"); Helper.addClass(".sp-cancel", "btn-flat waves-effect waves-red");
Helper.removeClass(".sp-cancel", "sp-cancel"); Helper.removeClass(".sp-cancel", "sp-cancel");
$(".sp-button-container").append("<a href='#' class='btn-flat waves-effect waves-green sp-choose-link'>CHOOSE</a>"); document.getElementsByClassName("sp-button-container")[0].insertAdjacentHTML("beforeend", "<a href='#' class='btn-flat waves-effect waves-green sp-choose-link'>CHOOSE</a>");
} }
$(".sp-choose-link").on("click", function(e) { addListener("click", ".sp-choose-link", function(e) {
e.preventDefault(); event.preventDefault();
$(".sp-choose").trigger("click"); document.getElementsByClassName("sp-choose")[0].click();
}); });
$("#results" ).hover( function() { Helper.removeClass(".result", "hoverResults"); i = 0; }, function(){ }); //$("#results" ).hover( function() { Helper.removeClass(".result", "hoverResults"); i = 0; }, function(){ });
document.getElementById("search").focus(); document.getElementById("search").focus();
Helper.css("#embed-button", "display", "inline-block"); Helper.css("#embed-button", "display", "inline-block");
document.getElementById("embed-area").value = embed_code(embed_autoplay, embed_width, embed_height, color); document.getElementById("embed-area").value = embed_code(embed_autoplay, embed_width, embed_height, color);
@@ -314,7 +313,7 @@ var Channel = {
var acceptable = ["bar", "controls", "duration"]; var acceptable = ["bar", "controls", "duration"];
if(acceptable.indexOf(e.target.getAttribute("id")) >= 0) { if(acceptable.indexOf(e.target.getAttribute("id")) >= 0) {
var total = full_playlist[full_playlist.length - 1].duration / $("#controls").width(); var total = full_playlist[full_playlist.length - 1].duration / document.getElementById("controls").offsetWidth;
total = total * e.clientX; total = total * e.clientX;
if(!chromecastAvailable){ if(!chromecastAvailable){
@@ -335,7 +334,7 @@ var Channel = {
per = 100; per = 100;
else if(duration === 0) else if(duration === 0)
per = 0; per = 0;
$("#bar").width(per+"%"); document.getElementById("bar").style.width = per + "%"
} else { } else {
castSession.sendMessage("urn:x-cast:zoff.me", {type: "seekTo", seekTo: total}); castSession.sendMessage("urn:x-cast:zoff.me", {type: "seekTo", seekTo: total});
} }
@@ -343,14 +342,14 @@ var Channel = {
}, },
seekToMove: function(e){ seekToMove: function(e){
var pos_x = e.clientX - Math.ceil($("#seekToDuration").width() / 2) - 8; var pos_x = e.clientX - Math.ceil(document.getElementById("seekToDuration").outerWidth / 2) - 8;
if(pos_x < 0) pos_x = 0; if(pos_x < 0) pos_x = 0;
else if(pos_x + $("#seekToDuration").width() > $("#controls").width()) { else if(pos_x + document.getElementById("seekToDuration").outerWidth > document.getElementById("controls").outerWidth) {
pos_x = $("#controls").width() - $("#seekToDuration").width(); pos_x = document.getElementById("controls").outerWidth - document.getElementById("seekToDuration").outerWidth;
} }
$("#seekToDuration").css("left", pos_x); Helper.css("#seekToDuration", "left", pos_x);
try{ try{
var total = full_playlist[full_playlist.length - 1].duration / $("#controls").width(); var total = full_playlist[full_playlist.length - 1].duration / document.getElementById("controls").outerWidth;
total = total * e.clientX; total = total * e.clientX;
var _time = Helper.secondsToOther(total); var _time = Helper.secondsToOther(total);
var _minutes = Helper.pad(_time[0]); var _minutes = Helper.pad(_time[0]);
@@ -359,22 +358,22 @@ var Channel = {
var acceptable = ["bar", "controls", "duration"]; var acceptable = ["bar", "controls", "duration"];
if(acceptable.indexOf(e.target.getAttribute("id")) >= 0 && dragging) { if(acceptable.indexOf(e.target.getAttribute("id")) >= 0 && dragging) {
$("#bar").width(((100 / duration) * total) + "%"); document.getElementById("bar").style.width(((100 / duration) * total) + "%");
} }
} catch(e){} } catch(e){}
}, },
set_title_width: function(start){ set_title_width: function(start){
if($(window).width() + 8 > 600){ if(window.innerWidth > 600){
var add_width = $(".brand-logo").outerWidth() var add_width = document.getElementsByClassName("brand-logo")[0].offsetWidth
if(start){ if(start){
add_width = $(window).width()*0.15; add_width = window.innerWidth * 0.15;
} }
var test_against_width = $(window).width() - $(".control-list").width() - add_width - 33; var test_against_width = window.innerWidth - document.getElementsByClassName("control-list")[0].offsetWidth - add_width - 33;
title_width = test_against_width; title_width = test_against_width;
$(".title-container").width(title_width); document.getElementsByClassName("title-container")[0].style.width = title_width + "px";
} else { } else {
$(".title-container").width("100%"); document.getElementsByClassName("title-container")[0].style.width = "100%";
} }
}, },
@@ -417,11 +416,10 @@ var Channel = {
}, },
share_link_modifier: function(){ share_link_modifier: function(){
$("#facebook-code-link").attr("href", "https://www.facebook.com/sharer/sharer.php?u=https://zoff.me/" + chan.toLowerCase()); document.getElementById("facebook-code-link").setAttribute("href", "https://www.facebook.com/sharer/sharer.php?u=https://zoff.me/" + chan.toLowerCase());
$("#facebook-code-link").attr("onclick", "window.open('https://www.facebook.com/sharer/sharer.php?u=https://zoff.me/" + chan.toLowerCase() + "', 'Share Playlist','width=600,height=300'); return false;"); document.getElementById("facebook-code-link").setAttribute("onclick", "window.open('https://www.facebook.com/sharer/sharer.php?u=https://zoff.me/" + chan.toLowerCase() + "', 'Share Playlist','width=600,height=300'); return false;");
$("#twitter-code-link").attr("href", "https://twitter.com/intent/tweet?url=https://zoff.me/" + chan.toLowerCase() + "&amp;text=Check%20out%20this%20playlist%20" + chan.toLowerCase() + "%20on%20Zoff!&amp;via=zoffmusic"); document.getElementById("twitter-code-link").setAttribute("href", "https://twitter.com/intent/tweet?url=https://zoff.me/" + chan.toLowerCase() + "&amp;text=Check%20out%20this%20playlist%20" + chan.toLowerCase() + "%20on%20Zoff!&amp;via=zoffmusic");
$("#twitter-code-link").attr("onclick", "window.open('https://twitter.com/intent/tweet?url=https://zoff.me/" + chan.toLowerCase() + "/&amp;text=Check%20out%20this%20playlist%20" + chan.toLowerCase() + "%20on%20Zoff!&amp;via=zoffmusic','Share Playlist','width=600,height=300'); return false;"); document.getElementById("twitter-code-link").setAttribute("onclick", "window.open('https://twitter.com/intent/tweet?url=https://zoff.me/" + chan.toLowerCase() + "/&amp;text=Check%20out%20this%20playlist%20" + chan.toLowerCase() + "%20on%20Zoff!&amp;via=zoffmusic','Share Playlist','width=600,height=300'); return false;");
//$("#qr-code-image-link").attr("src", "//chart.googleapis.com/chart?chs=150x150&cht=qr&chl=https://zoff.me/" + chan.toLowerCase() + "&choe=UTF-8&chld=L%7C1");
}, },
window_width_volume_slider: function() { window_width_volume_slider: function() {
@@ -436,26 +434,28 @@ var Channel = {
}, },
listeners: function(on) { listeners: function(on) {
var scrollListener = function(e) {
if(!programscroll) {
userscroll = true;
if(document.getElementById("chatchannel").scrollTop + document.getElementById("chatchannel").offsetHeight >= document.getElementById("chatchannel").scrollHeight) {
userscroll = false;
}
}
}
var scrollAllListener = function(e) {
if(!programscroll) {
userscroll = true;
if(document.getElementById("chatall").scrollTop+ document.getElementById("chatall").offsetHeight >= document.getElementById("chatall").scrollHeight) {
userscroll = false;
}
}
}
if(on) { if(on) {
$("#chatchannel").scroll(function(e) { document.getElementById("chatchannel").addEventListener("scroll", scrollListener);
if(!programscroll) { document.getElementById("chatall").addEventListener("scroll", scrollListener);
userscroll = true;
if($("#chatchannel").scrollTop() + $("#chatchannel").innerHeight() >= $("#chatchannel")[0].scrollHeight) {
userscroll = false;
}
}
});
$("#chatall").scroll(function(e) {
if(!programscroll) {
userscroll = true;
if($("#chatall").scrollTop() + $("#chatall").innerHeight() >= $("#chatall")[0].scrollHeight) {
userscroll = false;
}
}
})
} else { } else {
$("#chatchannel").off("scroll"); document.getElementById("chatchannel").removeEventListener("scroll", scrollListener);
$("#chatall").off("scroll"); document.getElementById("chatall").removeEventListener("scroll", scrollAllListener);
} }
}, },
@@ -468,7 +468,7 @@ var Channel = {
Admin.beginning = true; Admin.beginning = true;
chan = url_split[3].replace("#", ""); chan = url_split[3].replace("#", "");
$("#chan").html(Helper.upperFirst(chan)); document.getElementById("chan").innerHTML = Helper.upperFirst(chan);
var add = ""; var add = "";
w_p = true; w_p = true;
if(private_channel) add = Crypt.getCookie("_uI") + "_"; if(private_channel) add = Crypt.getCookie("_uI") + "_";
@@ -482,15 +482,14 @@ var Channel = {
var channel_before_move = chan.toLowerCase(); var channel_before_move = chan.toLowerCase();
clearTimeout(timed_remove_check); clearTimeout(timed_remove_check);
changing_to_frontpage = true; changing_to_frontpage = true;
//$.contextMenu( 'destroy', ".playlist-element" );
user_change_password = false; user_change_password = false;
clearTimeout(width_timeout); clearTimeout(width_timeout);
if(fireplace_initiated){ if(fireplace_initiated){
fireplace_initiated = false; fireplace_initiated = false;
Player.fireplace.destroy(); Player.fireplace.destroy();
$("#fireplace_player").css("display", "none"); Helper.css("#fireplace_player", "display", "none");
} }
$("#channel-load").css("display", "block"); Helper.css("#channel-load", "display", "block");
window.scrollTo(0, 0); window.scrollTo(0, 0);
Player.stopInterval = true; Player.stopInterval = true;
@@ -498,17 +497,16 @@ var Channel = {
began = false; began = false;
durationBegun = false; durationBegun = false;
$("#embed-button").css("display", "none"); Helper.css("#embed-button", "display", "none");
if(!Helper.mobilecheck()) { if(!Helper.mobilecheck()) {
Helper.tooltip('.castButton', "destroy"); Helper.tooltip('.castButton', "destroy");
Helper.tooltip("#viewers", "destroy"); Helper.tooltip("#viewers", "destroy");
//$('.castButton-unactive').tooltip("destroy");
Helper.tooltip("#offline-mode", "destroy"); Helper.tooltip("#offline-mode", "destroy");
if(M.Tooltip.getInstance($("#chan_thumbnail")) != undefined) { if(M.Tooltip.getInstance(document.getElementById("chan_thumbnail")) != undefined) {
Helper.tooltip('#chan_thumbnail', "destroy"); Helper.tooltip('#chan_thumbnail', "destroy");
} }
Helper.tooltip('#fullscreen', "destroy"); Helper.tooltip('#fullscreen', "destroy");
if(M.Tooltip.getInstance($("#admin-lock")) != undefined) { if(M.Tooltip.getInstance(document.getElementById("admin-lock")) != undefined) {
Helper.tooltip('#admin-lock', "destroy"); Helper.tooltip('#admin-lock', "destroy");
} }
Helper.tooltip(".search-btn-container", "destroy"); Helper.tooltip(".search-btn-container", "destroy");
@@ -522,11 +520,13 @@ var Channel = {
if(!Helper.mobilecheck()) { if(!Helper.mobilecheck()) {
Helper.tooltip("#chan", "destroy"); Helper.tooltip("#chan", "destroy");
} }
if(M.TapTarget.getInstance($(".tap-target"))) { var tap_1 = document.querySelectorAll(".tap-target")
$('.tap-target').tapTarget('close'); if(tap_1.length > 0 && M.TapTarget.getInstance(tap_1[0])) {
M.TapTarget.getInstance(tap_1[0]).close();
} }
if(M.TapTarget.getInstance($(".tap-target-join"))) { var tap_2 = document.querySelectorAll(".tap-target-join")
$('.tap-target-join').tapTarget('close'); if(tap_2.length > 0 && M.TapTarget.getInstance(tap_2[0])) {
M.TapTarget.getInstance(tap_2[0]).close();
} }
} }
clearTimeout(tap_target_timeout); clearTimeout(tap_target_timeout);
@@ -574,7 +574,7 @@ var Channel = {
song_title = ""; song_title = "";
} }
$("meta[name=theme-color]").attr("content", "#2D2D2D"); document.querySelectorAll("meta[name=theme-color]")[0].setAttribute("content", "#2D2D2D");
if(!Helper.mobilecheck() && !user_auth_avoid){ if(!Helper.mobilecheck() && !user_auth_avoid){
Helper.removeElement("#playbar"); Helper.removeElement("#playbar");
@@ -583,8 +583,8 @@ var Channel = {
Helper.addClass("#main-row", "frontpage_modified_heights"); Helper.addClass("#main-row", "frontpage_modified_heights");
Helper.css("#player", "opacity", "1"); Helper.css("#player", "opacity", "1");
Helper.removeClass("#video-container", "no-opacity"); Helper.removeClass("#video-container", "no-opacity");
$("#main-row").prepend("<div id='player_bottom_overlay' class='player player_bottom'></div>"); document.getElementById("main-row").insertAdjacentHTML("afterbegin", "<div id='player_bottom_overlay' class='player player_bottom'></div>");
$("#player_bottom_overlay").append("<a id='closePlayer' title='Close Player'>X</a>"); document.getElementById("player_bottom_overlay").insertAdjacentHTML("afterbegin", "<a id='closePlayer' title='Close Player'>X</a>");
Helper.removeElement("#playlist"); Helper.removeElement("#playlist");
} else { } else {
try{ try{
@@ -594,25 +594,27 @@ var Channel = {
document.title = "Zoff"; document.title = "Zoff";
} }
var response = $("<div>" + e + "</div>"); var response = document.createElement("div");
response.innerHTML = e;
//$(".drag-target").remove();
Helper.removeElement("#sidenav-overlay"); Helper.removeElement("#sidenav-overlay");
document.getElementsByTagName("main")[0].className = "center-align container"; document.getElementsByTagName("main")[0].className = "center-align container";
Helper.removeClass("#main-container", "channelpage"); Helper.removeClass("#main-container", "channelpage");
document.getElementById("main-container").setAttribute("style", ""); document.getElementById("main-container").setAttribute("style", "");
$("header").html($(response.find("header")).html()); document.getElementsByTagName("header")[0].innerHTML = response.querySelectorAll("header")[0].outerHTML;
$($(response.find(".section.mega"))).insertAfter("header");
$($(response.find(".section.mobile-search"))).insertAfter(".mega"); document.getElementsByTagName("header")[0].insertAdjacentHTML("afterend", response.querySelectorAll(".section.mega")[0].outerHTML);
if(Helper.mobilecheck() || user_auth_avoid) $("main").html($(response.find("main")).html()); //document.getElementsByTagName("header")[0].insertAdjacentHTML("afterend", response.querySelectorAll(".section.mobile-search")[0].innerHTML);
else $("main").append($(response.find("#main_section_frontpage")).wrap("<div>").parent().html()); if(Helper.mobilecheck() || user_auth_avoid) {
document.getElementsByTagName("main")[0].innerHTML = response.querySelectorAll("main")[0].innerHTML;
} else {
document.getElementsByTagName("main")[0].insertAdjacentHTML("beforeend", response.querySelectorAll("#main_section_frontpage")[0].outerHTML);
}
Helper.removeClass(".page-footer", "padding-bottom-extra"); Helper.removeClass(".page-footer", "padding-bottom-extra");
Helper.removeClass(".page-footer", "padding-bottom-novideo"); Helper.removeClass(".page-footer", "padding-bottom-novideo");
document.getElementById("favicon").setAttribute("href", "/assets/images/favicon-32x32.png"); document.getElementById("favicon").setAttribute("href", "/assets/images/favicon-32x32.png");
//$(".context-menu-list").remove();
Helper.log(["Socket", socket]); Helper.log(["Socket", socket]);
if($("#alreadyfp").length == 1){ if(document.querySelectorAll("#alreadyfp").length == 1){
Frontpage.init(); Frontpage.init();
}else { }else {
fromChannel = true; fromChannel = true;
@@ -621,8 +623,8 @@ var Channel = {
} }
changing_to_frontpage = false; changing_to_frontpage = false;
if($("#alreadychannel").length === 0 && !user_auth_avoid){ if(document.querySelectorAll("#alreadychannel").length === 0 && !user_auth_avoid){
$("head").append("<div id='alreadychannel'></div"); document.getElementsByTagName("head")[0].insertAdjacentHTML("beforeend", "<div id='alreadychannel'></div");
} else if(user_auth_avoid) { } else if(user_auth_avoid) {
Helper.removeElement("#alreadychannel"); Helper.removeElement("#alreadychannel");
} }

2
server/public/assets/js/crypt.js
View File

@@ -43,7 +43,7 @@ var Crypt = {
);*/ );*/
//return $.parseJSON(decrypted.toString(CryptoJS.enc.Utf8)); //return $.parseJSON(decrypted.toString(CryptoJS.enc.Utf8));
return $.parseJSON(atob(cookie)); return JSON.parse(atob(cookie));
}, },
decrypt_pass: function(pass) { decrypt_pass: function(pass) {

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

@@ -22,8 +22,8 @@ var Frontpage = {
]); ]);
Frontpage.all_channels = msg.channels; Frontpage.all_channels = msg.channels;
if(msg.channels.length == 0) { if(msg.channels.length == 0) {
$("#preloader").css("display", "none"); Helper.css("#preloader", "display", "none");
$("#channel-list-container").append("<p>No channels yet</p>"); document.getElementById("channel-list-container").insertAdjacentHTML("beforeend", "<p>No channels yet</p>");
} else { } else {
Frontpage.populate_channels(msg.channels, true); Frontpage.populate_channels(msg.channels, true);
} }
@@ -31,7 +31,7 @@ var Frontpage = {
}, },
populate_channels: function(lists, popular) { populate_channels: function(lists, popular) {
$("#channels").empty(); document.getElementById("channels").innerHTML = "";
var num = 0; var num = 0;
@@ -64,7 +64,7 @@ var Frontpage = {
Frontpage.add_backdrop(lists, 0); Frontpage.add_backdrop(lists, 0);
} }
pre_card = $(channel_list); pre_card = channel_list;
Helper.log([ Helper.log([
"Pre_card: ", "Pre_card: ",
@@ -83,37 +83,40 @@ var Frontpage = {
} }
var song_count = lists[x].count; var song_count = lists[x].count;
var card = document.createElement("div");
var card = pre_card.clone(); card.innerHTML += pre_card;
//card.innerHTML = card.children[0];
if(song_count > 4) { if(song_count > 4) {
if(lists[x].pinned == 1) { if(lists[x].pinned == 1) {
card.find(".pin").attr("style", "display:block;"); card.querySelector(".pin").setAttribute("style", "display:block;");
//card.find(".card").attr("title", "Featured list"); //card.find(".card").attr("title", "Featured list");
} else { } else {
/*card.find(".pin").attr("style", "display:none;"); /*card.find(".pin").attr("style", "display:none;");
card.find(".card").attr("title", "");*/ card.find(".card").attr("title", "");*/
card.find(".pin").remove(); card.querySelector(".pin").remove();
} }
card.find(".chan-name").text(chan); card.querySelector(".chan-name").innerText = chan;
card.find(".chan-name").attr("title", chan); card.querySelector(".chan-name").setAttribute("title", chan);
card.find(".chan-views").text(viewers); card.querySelector(".chan-views").innerText = viewers;
card.find(".chan-songs").text(song_count); card.querySelector(".chan-songs").innerText = song_count;
card.find(".chan-bg").attr("style", img); card.querySelector(".chan-bg").setAttribute("style", img);
card.find(".chan-link").attr("href", chan + "/"); card.querySelector(".chan-link").setAttribute("href", chan + "/");
if(description != "" && description != undefined && !Helper.mobilecheck()) { if(description != "" && description != undefined && !Helper.mobilecheck()) {
card.find(".card-title").text(chan); card.querySelector(".card-title").innerText = chan;
card.find(".description_text").text(description); card.querySelector(".description_text").innerText = description;
description = ""; description = "";
} else { } else {
card.find(".card-reveal").remove(); card.querySelector(".card-reveal").remove();
card.find(".card").removeClass("sticky-action") Helper.removeClass(card.querySelector(".card"), "sticky-action")
} }
$("#channels").append(card.html()); document.getElementById("channels").insertAdjacentHTML("beforeend", card.children[0].innerHTML);
//console.log(card.children[0].children[0]);
} else { } else {
num--; num--;
} }
} }
num++; num++;
} }
@@ -125,18 +128,18 @@ var Frontpage = {
for(var x in options_list) { for(var x in options_list) {
data[options_list[x]._id] = null; data[options_list[x]._id] = null;
} }
if($(".pin").length == 1 && !Helper.mobilecheck()) { if(document.querySelectorAll(".pin").length == 1 && !Helper.mobilecheck()) {
$($(".pin").parent().parent().parent()).tooltip({ Helper.tooltip(document.querySelectorAll(".pin")[0].parent().parent().parent(), {
delay: 5, delay: 5,
position: "top", position: "top",
html: "Featured playlist" html: "Featured playlist"
}); });
} }
var to_autocomplete = "input.autocomplete"; var to_autocomplete = document.querySelectorAll("input.autocomplete")[0];
//if(Helper.mobilecheck()) to_autocomplete = "input.mobile-search"; //if(Helper.mobilecheck()) to_autocomplete = "input.mobile-search";
$(to_autocomplete).autocomplete({ M.Autocomplete.init(to_autocomplete, {
data: data, data: data,
limit: 5, // The max amount of results that can be shown at once. Default: Infinity. limit: 5, // The max amount of results that can be shown at once. Default: Infinity.
onAutocomplete: function(val) { onAutocomplete: function(val) {
@@ -147,7 +150,7 @@ var Frontpage = {
document.getElementById("preloader").style.display = "none"; document.getElementById("preloader").style.display = "none";
//Materialize.fadeInImage('#channels'); //Materialize.fadeInImage('#channels');
$("#channels").fadeIn(800); $("#channels").fadeIn(800);
$("#searchFrontpage").focus(); document.getElementById("autocomplete-input").focus();
num = 0; num = 0;
}, },
@@ -308,7 +311,7 @@ var Frontpage = {
to_channel: function(new_channel, popstate) { to_channel: function(new_channel, popstate) {
console.log(new_channel); console.log(new_channel);
$("#channel-load").css("display", "block"); Helper.css("#channel-load", "display", "block");
window.scrollTo(0, 0); window.scrollTo(0, 0);
frontpage = false; frontpage = false;
new_channel = new_channel.toLowerCase(); new_channel = new_channel.toLowerCase();
@@ -317,14 +320,14 @@ var Frontpage = {
Helper.log(["removing all listeners"]); Helper.log(["removing all listeners"]);
removeAllListeners(); removeAllListeners();
} }
$("#main-container").css("background-color", "#2d2d2d"); Helper.css("#main-container", "background-color", "#2d2d2d");
if(!Helper.mobilecheck()) { if(!Helper.mobilecheck()) {
Helper.tooltip("#frontpage-viewer-counter", "destroy"); Helper.tooltip("#frontpage-viewer-counter", "destroy");
Helper.tooltip(".generate-channel-name", "destroy"); Helper.tooltip(".generate-channel-name", "destroy");
Helper.tooltip("#offline-mode", "destroy"); Helper.tooltip("#offline-mode", "destroy");
Helper.tooltip("#client-mode-button", "destroy"); Helper.tooltip("#client-mode-button", "destroy");
if($(".pin").length == 1) { if(document.querySelectorAll(".pin").length == 1) {
$($(".pin").parent().parent().parent()).tooltip("destroy"); Helper.tooltip(document.querySelectorAll(".pin")[0].parent().parent().parent(), "destroy");
} }
} }
currently_showing_channels = 1; currently_showing_channels = 1;
@@ -339,7 +342,8 @@ var Frontpage = {
//Player.player.destroy(); //Player.player.destroy();
socket.emit("change_channel", {channel: chan.toLowerCase()}); socket.emit("change_channel", {channel: chan.toLowerCase()});
} }
$("#frontpage_player").empty(); var _player = document.querySelectorAll("#frontpage_player");
if(_player.length > 0) _player[0].innerHTML = "";
if(Helper.mobilecheck()) { if(Helper.mobilecheck()) {
//Helper.log("disconnecting"); //Helper.log("disconnecting");
//socket.disconnect(); //socket.disconnect();
@@ -353,21 +357,24 @@ var Frontpage = {
window.chan = new_channel; window.chan = new_channel;
} }
var response = $("<div>" + e + "</div>"); var response = document.createElement("div");
response.innerHTML = e;
$('select').formSelect('destroy'); M.FormSelect.getInstance(document.querySelector("#view_channels_select")).destroy();
//$('select').formSelect('destroy');
Helper.removeElement(".mega"); Helper.removeElement(".mega");
Helper.removeElement(".mobile-search"); Helper.removeElement(".mobile-search");
document.getElementsByTagName("main")[0].className = "container center-align main"; document.getElementsByTagName("main")[0].className = "container center-align main";
Helper.addClass("#main-container", "channelpage"); Helper.addClass("#main-container", "channelpage");
//$("header").html($($(e)[63]).html());
$("header").html($(response.find("header")).html()); document.getElementsByTagName("header")[0].innerHTML = response.querySelectorAll("header")[0].innerHTML;
if($("#alreadychannel").length === 0 || Helper.mobilecheck() || Player.player === undefined){
$("main").html($(response.find("main")).html()); if(document.querySelectorAll("#alreadychannel").length === 0 || Helper.mobilecheck() || Player.player === undefined){
document.getElementsByTagName("main")[0].innerHTML = response.querySelectorAll("main")[0].innerHTML;
} else { } else {
$("#main-row").append($(response.find("#playlist").wrap("<div>").parent().html())); document.getElementById("main-row").insertAdjacentHTML("beforeend", response.querySelectorAll("#playlist")[0].outerHTML);
$("#video-container").append($(response.find("#main_components").wrap("<div>").parent().html())); document.getElementById("video-container").insertAdjacentHTML("beforeend", response.querySelectorAll("#main_components")[0].outerHTML);
$("#main-row").append("<div id='playbar'></div>"); document.getElementById("main-row").insertAdjacentHTML("beforeend", "<div id='playbar'></div>");
Helper.removeClass("#player", "player_bottom"); Helper.removeClass("#player", "player_bottom");
Helper.removeClass("#main-row", "frontpage_modified_heights"); Helper.removeClass("#main-row", "frontpage_modified_heights");
Helper.removeElement("#main_section_frontpage"); Helper.removeElement("#main_section_frontpage");
@@ -377,13 +384,13 @@ var Frontpage = {
document.getElementById("search").setAttribute("placeholder", "Find song on YouTube..."); document.getElementById("search").setAttribute("placeholder", "Find song on YouTube...");
Helper.addClass(".page-footer", "padding-bottom-novideo"); Helper.addClass(".page-footer", "padding-bottom-novideo");
from_frontpage = true; from_frontpage = true;
if($("#alreadychannel").length == 1){ if(document.querySelectorAll("#alreadychannel").length == 1){
Channel.init(); Channel.init();
}else{ }else{
fromFront = true; fromFront = true;
Channel.init(); Channel.init();
} }
if($("#alreadyfp").length === 0) $("head").append("<div id='alreadyfp'></div>"); if(document.querySelectorAll("#alreadyfp").length === 0) document.getElementsByTagName("head")[0].insertAdjacentHTML("beforeend", "<div id='alreadyfp'></div>");
} }
}); });
@@ -394,8 +401,8 @@ var Frontpage = {
var date = new Date(); var date = new Date();
Frontpage.blob_list = []; Frontpage.blob_list = [];
if(date.getMonth() == 3 && date.getDate() == 1){ if(date.getMonth() == 3 && date.getDate() == 1){
$(".mega").css("-webkit-transform", "rotate(180deg)"); Helper.css(".mega", "-webkit-transform", "rotate(180deg)");
$(".mega").css("-moz-transform", "rotate(180deg)"); Helper.css(".mega", "-moz-transform", "rotate(180deg)");
//Materialize.toast('<p id="aprilfools">We suck at pranks..<a class="waves-effect waves-light btn light-green" style="pointer-events:none;">Agreed</a></p>', 100000); //Materialize.toast('<p id="aprilfools">We suck at pranks..<a class="waves-effect waves-light btn light-green" style="pointer-events:none;">Agreed</a></p>', 100000);
} }
@@ -415,7 +422,7 @@ var Frontpage = {
Helper.addClass("footer", "hide"); Helper.addClass("footer", "hide");
} }
channel_list = $("#channel-list-container").clone().html(); channel_list = document.getElementById("channel-list-container").cloneNode(true).innerHTML;
if(window.location.hostname != "fb.zoff.me") Frontpage.share_link_modifier(); if(window.location.hostname != "fb.zoff.me") Frontpage.share_link_modifier();
@@ -439,7 +446,8 @@ var Frontpage = {
M.Modal.init(document.getElementById("about")); M.Modal.init(document.getElementById("about"));
M.Modal.init(document.getElementById("help")); M.Modal.init(document.getElementById("help"));
M.Modal.init(document.getElementById("contact")); M.Modal.init(document.getElementById("contact"));
$('select').formSelect(); var elem = document.querySelector('select');
var instance = M.FormSelect.init(elem);
Helper.log([ Helper.log([
"Sending frontpage_lists", "Sending frontpage_lists",
@@ -492,21 +500,21 @@ var Frontpage = {
var pad = 0; var pad = 0;
$(".zicon").on("click", function(e) { /*$(".zicon").on("click", function(e) {
e.preventDefault(); e.preventDefault();
pad += 10; pad += 10;
$(".zicon").css("padding-left", pad + "vh"); Helper.css(".zicon", "padding-left", pad + "vh");
if(pad >= 80) if(pad >= 80)
window.location.href = 'http://etys.no'; window.location.href = 'http://etys.no';
}); });*/
if(!Helper.mobilecheck() && Frontpage.winter) { if(!Helper.mobilecheck() && Frontpage.winter) {
$(".mega").prepend('<div id="snow"></div>'); document.getElementsByClassName("mega")[0].insertAdjacentHTML("afterbegin", '<div id="snow"></div>');
} }
if(Helper.mobilecheck()){ if(Helper.mobilecheck()){
$('input#autocomplete-input').characterCounter(); //$('input#autocomplete-input').characterCounter();
} }
window['__onGCastApiAvailable'] = function(loaded, errorInfo) { window['__onGCastApiAvailable'] = function(loaded, errorInfo) {
@@ -518,10 +526,10 @@ var Frontpage = {
}, },
share_link_modifier: function() { share_link_modifier: function() {
$("#facebook-code-link").attr("href", "https://www.facebook.com/sharer/sharer.php?u=https://zoff.me/"); document.getElementById("facebook-code-link").setAttribute("href", "https://www.facebook.com/sharer/sharer.php?u=https://zoff.me/");
$("#facebook-code-link").attr("onclick", "window.open('https://www.facebook.com/sharer/sharer.php?u=https://zoff.me/', 'Share Zoff','width=600,height=300'); return false;"); document.getElementById("facebook-code-link").setAttribute("onclick", "window.open('https://www.facebook.com/sharer/sharer.php?u=https://zoff.me/', 'Share Zoff','width=600,height=300'); return false;");
$("#twitter-code-link").attr("href", "https://twitter.com/intent/tweet?url=https://zoff.me/&amp;text=Check%20out%20Zoff!&amp;via=zoffmusic"); document.getElementById("twitter-code-link").setAttribute("href", "https://twitter.com/intent/tweet?url=https://zoff.me/&amp;text=Check%20out%20Zoff!&amp;via=zoffmusic");
$("#twitter-code-link").attr("onclick", "window.open('https://twitter.com/intent/tweet?url=https://zoff.me/&amp;text=Check%20out%20Zoff!&amp;via=zoffmusic','Share Playlist','width=600,height=300'); return false;"); document.getElementById("twitter-code-link").setAttribute("onclick", "window.open('https://twitter.com/intent/tweet?url=https://zoff.me/&amp;text=Check%20out%20Zoff!&amp;via=zoffmusic','Share Playlist','width=600,height=300'); return false;");
//$("#qr-code-link").attr("href", "//chart.googleapis.com/chart?chs=500x500&cht=qr&chl=https://zoff.me/&choe=UTF-8&chld=L%7C1"); //$("#qr-code-link").attr("href", "//chart.googleapis.com/chart?chs=500x500&cht=qr&chl=https://zoff.me/&choe=UTF-8&chld=L%7C1");
//$("#qr-code-image-link").attr("src", "//chart.googleapis.com/chart?chs=150x150&cht=qr&chl=https://zoff.me/&choe=UTF-8&chld=L%7C1"); //$("#qr-code-image-link").attr("src", "//chart.googleapis.com/chart?chs=150x150&cht=qr&chl=https://zoff.me/&choe=UTF-8&chld=L%7C1");
} }

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

@@ -44,8 +44,8 @@ function hide_native(way) {
$('.castButton').addClass('castButton-white-active'); $('.castButton').addClass('castButton-white-active');
} }
if(!Helper.mobilecheck()) { if(!Helper.mobilecheck()) {
if(M.Tooltip.getInstance($(".castButton"))) { if(M.Tooltip.getInstance(document.getElementsByClassName("castButton")[0])) {
$('.castButton').tooltip('destroy'); Helper.tooltip('.castButton', 'destroy');
} }
Helper.tooltip('.castButton', { Helper.tooltip('.castButton', {
delay: 5, delay: 5,
@@ -90,8 +90,8 @@ function hide_native(way) {
$("#player_overlay_text").toggleClass("hide"); $("#player_overlay_text").toggleClass("hide");
} else if(way == 0){ } else if(way == 0){
if(!Helper.mobilecheck()) { if(!Helper.mobilecheck()) {
if(M.Tooltip.getInstance($(".castButton"))) { if(M.Tooltip.getInstance(document.getElementsByClassName("castButton")[0])) {
$('.castButton').tooltip('destroy'); Helper.tooltip('.castButton', 'destroy');
} }
Helper.tooltip('.castButton', { Helper.tooltip('.castButton', {
delay: 5, delay: 5,
@@ -524,8 +524,8 @@ function change_offline(enabled, already_offline){
ga('send', 'event', "button-click", "offline", "", offline ? 1 : 0); ga('send', 'event', "button-click", "offline", "", offline ? 1 : 0);
socket.emit("offline", {status: enabled, channel: chan != undefined ? chan.toLowerCase() : ""}); socket.emit("offline", {status: enabled, channel: chan != undefined ? chan.toLowerCase() : ""});
if(!Helper.mobilecheck()) { if(!Helper.mobilecheck()) {
if($("#offline-mode").length == 1 && M.Tooltip.getInstance($("#offline-mode"))) { if(document.querySelectorAll("#offline-mode").length == 1 && M.Tooltip.getInstance(document.getElementById("offline-mode"))) {
$("#offline-mode").tooltip('destroy'); Helper.tooltip("#offline-mode", 'destroy');
} }
} }
if(enabled){ if(enabled){
@@ -625,19 +625,20 @@ function change_offline(enabled, already_offline){
} }
} }
function handleEvent(e, target, tried) { function handleEvent(e, target, tried, type) {
if(dynamicListeners["click"] && dynamicListeners["click"]["#" + target.id]) { if(dynamicListeners[type] && dynamicListeners[type]["#" + target.id]) {
dynamicListeners["click"]["#" + target.id].call(target); dynamicListeners[type]["#" + target.id].call(target);
return; return;
} else { } else {
for(var i = 0; i < target.classList.length; i++) { for(var i = 0; i < target.classList.length; i++) {
if(dynamicListeners["click"] && dynamicListeners["click"]["." + target.classList[i]]) { if(dynamicListeners[type] && dynamicListeners[type]["." + target.classList[i]]) {
dynamicListeners["click"]["." + target.classList[i]].call(target); dynamicListeners[type]["." + target.classList[i]].call(target);
return; return;
} }
} }
}if(!tried) { }
handleEvent(e, e.target.parentElement, true); if(!tried) {
handleEvent(e, e.target.parentElement, true, type);
} }
} }
@@ -842,7 +843,7 @@ function before_toast(){
} }
function scrollChat() { function scrollChat() {
var current = $(".chat-tab.active").attr("href"); var current = $(".chat-tab active").attr("href");
if(current == "#channelchat") { if(current == "#channelchat") {
$('#chatchannel').scrollTop($('#chatchannel')[0].scrollHeight); $('#chatchannel').scrollTop($('#chatchannel')[0].scrollHeight);
} else if(current == "#all_chat") { } else if(current == "#all_chat") {

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

@@ -347,6 +347,8 @@ addListener("click", "#player_overlay", function(e) {
} }
}); });
addListener("click", "#bitcoin-address", function(e) { addListener("click", "#bitcoin-address", function(e) {
var copyTextarea = document.querySelector('#bitcoin-address'); var copyTextarea = document.querySelector('#bitcoin-address');
copyTextarea.select(); copyTextarea.select();
@@ -624,19 +626,19 @@ addListener("click", "#closePlayer", function(e){
document.addEventListener("click", function(e) { document.addEventListener("click", function(e) {
handleEvent(e, e.target, false); handleEvent(e, e.target, false, "click");
}, false); }, false);
document.addEventListener("input", function(e) { document.addEventListener("input", function(e) {
handleEvent(e, e.target, false); handleEvent(e, e.target, false, "input");
}, true); }, true);
document.addEventListener("change", function(e) { document.addEventListener("change", function(e) {
handleEvent(e, e.target, false); handleEvent(e, e.target, false, "change");
}, true); }, true);
document.addEventListener("submit", function(e) { document.addEventListener("submit", function(e) {
handleEvent(e, e.target, false); handleEvent(e, e.target, false, "submit");
}, true); }, true);
addListener("click", ".prev_page", function(e) { addListener("click", ".prev_page", function(e) {
@@ -767,8 +769,8 @@ addListener("click", "#aprilfools", function(){
addListener("change", '#view_channels_select', function(e) { addListener("change", '#view_channels_select', function(e) {
var that = this; var that = this;
console.log("test", that.value)
if(currently_showing_channels != parseInt(that.value)) { if(currently_showing_channels != parseInt(that.value)) {
Frontpage.populate_channels(Frontpage.all_channels, (parseInt(that.value) == 1 ? true : false)); Frontpage.populate_channels(Frontpage.all_channels, (parseInt(that.value) == 1 ? true : false));
} }
currently_showing_channels = parseInt(that.value); currently_showing_channels = parseInt(that.value);

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

@@ -615,6 +615,7 @@ var Player = {
} }
Player.readyLooks(); Player.readyLooks();
Playercontrols.initYoutubeControls(Player.player); Playercontrols.initYoutubeControls(Player.player);
Player.player.setVolume(Crypt.get_volume());
Playercontrols.initSlider(); Playercontrols.initSlider();
Player.player.setVolume(Crypt.get_volume()); Player.player.setVolume(Crypt.get_volume());
}catch(e){ }catch(e){

60
server/public/partials/channel/panel.handlebars
View File

@@ -1,13 +1,13 @@
<li class="no-padding">
<div class="nav-btn close-settings clickable" title="Close" id="closeSettings"> <div class="nav-btn close-settings clickable" title="Close" id="closeSettings">
<i class="material-icons auto-margin">close</i> <i class="material-icons auto-margin">close</i>
</div> </div>
<ul class="collapsible collapsible-accordion"> <ul class="collapsible collapsible-accordion settings-collapsible">
<li> <li class="no-padding">
<a class="col s9 collapsible-header bold waves-effect admin-settings"> <div class="col s9 collapsible-header bold waves-effect admin-settings">
Channel Settings Channel Settings
<i class="material-icons">tune</i> <i class="material-icons">tune</i>
</a> </div>
<div class="collapsible-body"> <div class="collapsible-body">
<form action="#" id="adminForm" onsubmit="return false;"> <form action="#" id="adminForm" onsubmit="return false;">
<ul> <ul>
@@ -143,14 +143,10 @@
</form> </form>
</div> </div>
</li> </li>
</ul>
</li>
<li class="no-padding"> <li class="no-padding">
<ul class="collapsible collapsible-accordion"> <div class="collapsible-header bold waves-effect">Channel Info
<li>
<a class="collapsible-header bold waves-effect">Channel Info
<i class="material-icons">info_outline</i> <i class="material-icons">info_outline</i>
</a> </div>
<div class="collapsible-body"> <div class="collapsible-body">
<ul> <ul>
<li> <li>
@@ -177,15 +173,11 @@
</ul> </ul>
</div> </div>
</li> </li>
</ul>
</li>
{{#unless client}} {{#unless client}}
<li class="no-padding remote-panel hide-on-small-only"> <li class="no-padding remote-panel hide-on-small-only">
<ul class="collapsible collapsible-accordion"> <div class="collapsible-header bold waves-effect">Remote Control
<li>
<a class="collapsible-header bold waves-effect">Remote Control
<i class="material-icons">settings_remote</i> <i class="material-icons">settings_remote</i>
</a> </div>
<div class="collapsible-body"> <div class="collapsible-body">
<ul> <ul>
<li> <li>
@@ -211,14 +203,10 @@
</ul> </ul>
</div> </div>
</li> </li>
</ul>
</li>
<li class="no-padding offline-panel"> <li class="no-padding offline-panel">
<ul class="collapsible collapsible-accordion"> <div class="collapsible-header bold waves-effect">Local Mode
<li>
<a class="collapsible-header bold waves-effect">Local Mode
<i class="material-icons">visibility_off</i> <i class="material-icons">visibility_off</i>
</a> </div>
<div class="collapsible-body"> <div class="collapsible-body">
<ul> <ul>
<li> <li>
@@ -239,15 +227,11 @@
</ul> </ul>
</div> </div>
</li> </li>
</ul>
</li>
<li class="no-padding show-only-mobile mobile-remote-panel"> <li class="no-padding show-only-mobile mobile-remote-panel">
<ul class="collapsible collapsible-accordion"> <div class="collapsible-header bold waves-effect import-a">Remote Controller
<li>
<a class="collapsible-header bold waves-effect import-a">Remote Controller
<i class="material-icons">settings_remote</i> <i class="material-icons">settings_remote</i>
</a> </div>
<div class="collapsible-body"> <div class="collapsible-body">
<ul id="remote-mobile-container"> <ul id="remote-mobile-container">
<li class="white-bg"> <li class="white-bg">
@@ -284,15 +268,11 @@
</ul> </ul>
</div> </div>
</li> </li>
</ul>
</li>
<li class="no-padding import-panel"> <li class="no-padding import-panel">
<ul class="collapsible collapsible-accordion"> <div class="collapsible-header bold waves-effect import-a">Import Playlist
<li>
<a class="collapsible-header bold waves-effect import-a">Import Playlist
<i class="material-icons">keyboard_arrow_down</i> <i class="material-icons">keyboard_arrow_down</i>
</a> </div>
<div class="collapsible-body"> <div class="collapsible-body">
<ul> <ul>
<li class="white-bg"> <li class="white-bg">
@@ -364,15 +344,11 @@
</ul> </ul>
</div> </div>
</li> </li>
</ul>
</li>
<li class="no-padding export-panel"> <li class="no-padding export-panel">
<ul class="collapsible collapsible-accordion white-bg"> <div class="collapsible-header bold waves-effect export-a">Export Playlist
<li>
<a class="collapsible-header bold waves-effect export-a">Export Playlist
<i class="material-icons">keyboard_arrow_up</i> <i class="material-icons">keyboard_arrow_up</i>
</a> </div>
<div class="collapsible-body"> <div class="collapsible-body">
<ul> <ul>
<li class="white-bg"> <li class="white-bg">
@@ -421,7 +397,5 @@
</ul> </ul>
</div> </div>
</li> </li>
</ul>
</li>
{{/unless}} {{/unless}}
</ul> </ul>