Updated materialize to v0.98 and made changes accordingly

- Made improvements to how the remotecontroller on mobile looks
- Added thumbnails some places
- Started using googles new material font because of materializecss
This commit is contained in:
Kasper Rynning-Tønnesen
2017-01-28 18:16:57 +01:00
parent da45f27cd1
commit 3d4ed9b66c
49 changed files with 375 additions and 14640 deletions

View File

@@ -83,7 +83,15 @@ var Admin = {
}
$(".card-action").removeClass("hide");
$("#admin-lock").removeClass("mdi-action-lock");
$("#admin-lock").addClass("clickable");
$("#admin-lock").html("lock_open");
if(!Helper.mobilecheck()){
$('#admin-lock').tooltip({
delay: 5,
position: "left",
tooltip: "Logout"
});
}
$("#password").val("");
$("#password").attr("placeholder", "Change channel password");
//if(!Helper.mobilecheck()){
@@ -95,8 +103,17 @@ var Admin = {
//$("#wrapper").toggleClass("tabs_height");
//}
if(!Helper.contains($("#admin-lock").attr("class").split(" "), "mdi-action-lock-open"))
$("#admin-lock").addClass("mdi-action-lock-open clickable");
if($("#admin-lock").html() != "lock_open"){
$("#admin-lock").addClass("clickable");
$("#admin-lock").html("lock_open");
if(!Helper.mobilecheck()){
$('#admin-lock').tooltip({
delay: 5,
position: "left",
tooltip: "Logout"
});
}
}
$('ul.playlist-tabs-loggedIn').tabs('select_tab', $(".playlist-tabs li a.active").attr("href").substring(1));
},
@@ -144,8 +161,12 @@ var Admin = {
$("input[name="+names[i]+"]").attr("disabled", true);
}
if(!Helper.contains($("#admin-lock").attr("class").split(" "), "mdi-action-lock")){
$("#admin-lock").addClass("mdi-action-lock");
if($("#admin-lock").html() != "lock"){
$("#admin-lock").removeClass("clickable");
$("#admin-lock").html("lock");
if(!Helper.mobilecheck()){
$('#admin-lock').tooltip('remove');
}
}
if(!Helper.contains($(".playlist-tabs-loggedIn").attr("class").split(" "), "hide")){
@@ -166,7 +187,7 @@ var Admin = {
} else {
$('ul.playlist-tabs').tabs('select_tab', $(".playlist-tabs-loggedIn li a.active").attr("href").substring(1));
}
$("#admin-lock").removeClass("mdi-action-lock-open clickable");
$("#admin-lock").removeClass("clickable");
$("#password").attr("placeholder", "Enter channel password");
//$("#top-button").removeClass("top-button-with-tabs");
},
@@ -200,7 +221,7 @@ var Admin = {
}
if((hasadmin)){
if($(".mdi-action-lock").length === 0) Admin.display_logged_out();
if($("#admin-lock").html() != "lock") Admin.display_logged_out();
}else if(!hasadmin && Crypt.get_pass(chan.toLowerCase()) === undefined){
if(!Helper.contains($(".playlist-tabs").attr("class").split(" "), "hide")) {
$(".playlist-tabs-loggedIn").removeClass("hide");

View File

@@ -250,7 +250,7 @@ var Frontpage = {
set_viewers: function(viewers){
//if(viewers > 0){
//var to_add = viewers > 1 ? "listeners" : "listener";
$("#frontpage-viewer-counter").html("<i class='mdi-action-visibility frontpage-viewers'></i>" + viewers);
$("#frontpage-viewer-counter").html("<i class='material-icons frontpage-viewers'>visibility</i>" + viewers);
//}
},
@@ -366,6 +366,10 @@ function initfp(){
setup_playlist_listener();
}
$("#about").modal();
$("#help").modal();
$("#contact").modal();
Helper.log("----");
Helper.log("Sending frontpage_lists");
Helper.log("Socket", socket);

View File

@@ -124,7 +124,7 @@ var List = {
}
});
if($("#wrapper").children().length > List.can_fit && !$("#pageButtons").length){
$('<div id="pageButtons"><span class="first_page_hide btn-flat">|<</span><a class="first_page waves-effect waves-light btn-flat">|<</a><span class="prev_page_hide btn-flat">< prev</span><a class="prev_page waves-effect waves-light btn-flat">< prev</a> <span id="pageNumber" class="btn-flat">1</span> <a class="last_page waves-effect waves-light btn-flat">>|</a><span class="last_page_hide btn-flat">>|</span><a class="next_page waves-effect waves-light btn-flat">next ></a><span class="next_page_hide btn-flat">next ></span></div>').insertAfter("#wrapper");
$('<div id="pageButtons"><span class="first_page_hide btn-flat"><i class="material-icons">first_page</i></span><a class="first_page waves-effect waves-light btn-flat"><i class="material-icons">first_page</i></a><span class="prev_page_hide btn-flat"><i class="material-icons">navigate_before</i> prev</span><a class="prev_page waves-effect waves-light btn-flat"><i class="material-icons">navigate_before</i> prev</a> <span id="pagenumber">1</span> <a class="last_page waves-effect waves-light btn-flat"><i class="material-icons">last_page</i></a><span class="last_page_hide btn-flat"><i class="material-icons">last_page</i></span><a class="next_page waves-effect waves-light btn-flat">next <i class="material-icons">navigate_next</i></a><span class="next_page_hide btn-flat">next <i class="material-icons">navigate_next</i></span></div>').insertAfter("#wrapper");
$(".prev_page").css("display", "none");
$(".first_page").css("display", "none");
$(".next_page_hide").css("display","none");
@@ -136,13 +136,13 @@ var List = {
$(".last_page").removeClass("hide");
}*/
} else if(!$("#pageButtons").length){
$('<div id="pageButtons"><span class="first_page_hide btn-flat">|<</span><a class="first_page waves-effect waves-light btn-flat">|<</a><span class="prev_page_hide btn-flat">< prev</span><a class="prev_page waves-effect waves-light btn-flat">< prev</a> <span id="pageNumber" class="btn-flat">1</span> <a class="last_page waves-effect waves-light btn-flat">>|</a><span class="last_page_hide btn-flat">>|</span><a class="next_page waves-effect waves-light btn-flat">next ></a><span class="next_page_hide btn-flat">next ></span></div>').insertAfter("#wrapper");
$('<div id="pageButtons"><span class="first_page_hide btn-flat"><i class="material-icons">first_page</i></span><a class="first_page waves-effect waves-light btn-flat"><i class="material-icons">first_page</i></a><span class="prev_page_hide btn-flat"><i class="material-icons">navigate_before</i> prev</span><a class="prev_page waves-effect waves-light btn-flat"><i class="material-icons">navigate_before</i> prev</a> <span id="pagenumber">1</span> <a class="last_page waves-effect waves-light btn-flat"><i class="material-icons">last_page</i></a><span class="last_page_hide btn-flat"><i class="material-icons">last_page</i></span><a class="next_page waves-effect waves-light btn-flat">next <i class="material-icons">navigate_next</i></a><span class="next_page_hide btn-flat">next <i class="material-icons">navigate_next</i></span></div>').insertAfter("#wrapper");
$(".prev_page").css("display", "none");
$(".next_page").css("display", "none");
$(".last_page").css("display", "none");
$(".first_page").css("display", "none");
$(".next_page_hide").css("display","inline-block");
$(".prev_page_hide").css("display","inline-block");
$(".next_page_hide").css("display","flex");
$(".prev_page_hide").css("display","flex");
}
List.dynamicContentPage(-10);
@@ -160,15 +160,15 @@ var List = {
List.empty = true;
$("#wrapper").append("<span id='empty-channel-message'>The playlist is empty.</span>");
if(!$("#pageButtons").length){
$('<div id="pageButtons"><span class="first_page_hide btn-flat">|<</span><a class="first_page waves-effect waves-light btn-flat">|<</a><span class="prev_page_hide btn-flat">< prev</span><a class="prev_page waves-effect waves-light btn-flat">< prev</a> <span id="pageNumber" class="btn-flat">1</span> <a class="last_page waves-effect waves-light btn-flat">>|</a><span class="last_page_hide btn-flat">>|</span><a class="next_page waves-effect waves-light btn-flat">next ></a><span class="next_page_hide btn-flat">next ></span></div>').insertAfter("#wrapper");
$('<div id="pageButtons"><span class="first_page_hide btn-flat"><i class="material-icons">first_page</i></span><a class="first_page waves-effect waves-light btn-flat"><i class="material-icons">first_page</i></a><span class="prev_page_hide btn-flat"><i class="material-icons">navigate_before</i> prev</span><a class="prev_page waves-effect waves-light btn-flat"><i class="material-icons">navigate_before</i> prev</a> <span id="pagenumber">1</span> <a class="last_page waves-effect waves-light btn-flat"><i class="material-icons">last_page</i></a><span class="last_page_hide btn-flat"><i class="material-icons">last_page</i></span><a class="next_page waves-effect waves-light btn-flat">next <i class="material-icons">navigate_next</i></a><span class="next_page_hide btn-flat">next <i class="material-icons">navigate_next</i></span></div>').insertAfter("#wrapper");
}
$(".prev_page").css("display", "none");
$(".next_page").css("display", "none");
$(".last_page").css("display", "none");
$(".last_page_hide").css("display", "inline-block");
$(".last_page_hide").css("display", "flex");
$(".first_page").css("display", "none");
$(".next_page_hide").css("display","inline-block");
$(".prev_page_hide").css("display","inline-block");
$(".next_page_hide").css("display","flex");
$(".prev_page_hide").css("display","flex");
}
$("#settings").css("visibility", "visible");
$("#settings").css("opacity", "1");
@@ -182,16 +182,16 @@ var List = {
List.page = page;
$("#wrapper").children().slice(List.page, List.page + List.can_fit).show();
if(List.page > 0 && $(".prev_page").css("display") == "none"){
$(".prev_page").css("display", "inline-block");
$(".prev_page").css("display", "flex");
$(".prev_page_hide").css("display", "none");
$(".first_page").css("display", "inline-block");
$(".first_page").css("display", "flex");
$(".first_page_hide").css("display", "none");
}
if(List.page + List.can_fit >= $("#wrapper").children().length){
$(".next_page_hide").css("display", "inline-block");
$(".next_page_hide").css("display", "flex");
$(".next_page").css("display", "none");
$(".last_page_hide").css("display", "inline-block");
$(".last_page_hide").css("display", "flex");
$(".last_page").css("display", "none");
}
@@ -205,16 +205,16 @@ var List = {
List.page = List.page + List.can_fit;
$("#wrapper").children().slice(List.page, List.page + List.can_fit).show();
if(List.page > 0 && $(".prev_page").css("display") == "none"){
$(".prev_page").css("display", "inline-block");
$(".prev_page").css("display", "flex");
$(".prev_page_hide").css("display", "none");
$(".first_page").css("display", "inline-block");
$(".first_page").css("display", "flex");
$(".first_page_hide").css("display", "none");
}
if(List.page + List.can_fit >= $("#wrapper").children().length){
$(".next_page_hide").css("display", "inline-block");
$(".next_page_hide").css("display", "flex");
$(".next_page").css("display", "none");
$(".last_page_hide").css("display", "inline-block");
$(".last_page_hide").css("display", "flex");
$(".last_page").css("display", "none");
}
//$("#wrapper").scrollTop(0);
@@ -224,16 +224,16 @@ var List = {
$("#wrapper").children().slice(List.page, List.page + List.can_fit).show();
if(List.page > 0 && $(".prev_page").css("display") == "none"){
$(".prev_page").css("display", "inline-block");
$(".prev_page").css("display", "flex");
$(".prev_page_hide").css("display", "none");
$(".first_page").css("display", "inline-block");
$(".first_page").css("display", "flex");
$(".first_page_hide").css("display", "none");
}
if(List.page + List.can_fit >= $("#wrapper").children().length){
$(".next_page_hide").css("display", "inline-block");
$(".next_page_hide").css("display", "flex");
$(".next_page").css("display", "none");
$(".last_page_hide").css("display", "inline-block");
$(".last_page_hide").css("display", "flex");
$(".last_page").css("display", "none");
}
} else if(way==-10){
@@ -242,21 +242,21 @@ var List = {
$("#wrapper").children().slice(List.page, List.page + List.can_fit).show();
if(List.page == 0 && $(".prev_page").css("display") != "none"){
$(".prev_page").css("display", "none");
$(".prev_page_hide").css("display", "inline-block");
$(".prev_page_hide").css("display", "flex");
$(".first_page").css("display", "none");
$(".first_page_hide").css("display", "inline-block");
$(".first_page_hide").css("display", "flex");
} else if($(".prev_page").css("display") == "none"){
$(".prev_page_hide").css("display", "inline-block");
$(".first_page_hide").css("display", "inline-block");
$(".prev_page_hide").css("display", "flex");
$(".first_page_hide").css("display", "flex");
} else {
$(".prev_page_hide").css("display", "none");
$(".first_page_hide").css("display", "none");
}
if(List.page + List.can_fit < $("#wrapper").children().length){
$(".next_page_hide").css("display", "none");
$(".next_page").css("display", "inline-block");
$(".next_page").css("display", "flex");
$(".last_page_hide").css("display", "none");
$(".last_page").css("display", "inline-block");
$(".last_page").css("display", "flex");
}
} else {
$("#wrapper").children().slice(List.page - List.can_fit, List.page).show();
@@ -265,12 +265,12 @@ var List = {
//$("#wrapper").scrollTop(0);
if(List.page == 0 && $(".prev_page").css("display") != "none"){
$(".prev_page").css("display", "none");
$(".prev_page_hide").css("display", "inline-block");
$(".prev_page_hide").css("display", "flex");
$(".first_page").css("display", "none");
$(".first_page_hide").css("display", "inline-block");
$(".first_page_hide").css("display", "flex");
} else if($(".prev_page").css("display") == "none"){
$(".prev_page_hide").css("display", "inline-block");
$(".first_page_hide").css("display", "inline-block");
$(".prev_page_hide").css("display", "flex");
$(".first_page_hide").css("display", "flex");
} else {
$(".prev_page_hide").css("display", "none");
$(".first_page_hide").css("display", "none");
@@ -278,9 +278,9 @@ var List = {
if(List.page + List.can_fit < $("#wrapper").children().length){
$(".next_page_hide").css("display", "none");
$(".next_page").css("display", "inline-block");
$(".next_page").css("display", "flex");
$(".last_page_hide").css("display", "none");
$(".last_page").css("display", "inline-block");
$(".last_page").css("display", "flex");
}
}
$("#pageNumber").html((List.page / List.can_fit) + 1);
@@ -306,9 +306,9 @@ var List = {
if($("#wrapper").children().length > List.page + List.can_fit){
$(".next_page_hide").css("display", "none");
$(".next_page").removeClass("hide");
$(".next_page").css("display", "inline-block");
$(".next_page").css("display", "flex");
} else {
$(".next_page_hide").css("display", "inline-block");
$(".next_page_hide").css("display", "flex");
$(".next_page").css("display", "none");
}
}
@@ -333,14 +333,14 @@ var List = {
if(List.page >= $("#wrapper").children().length - 1){
List.dynamicContentPage(-1);
$(".next_page_hide").css("display", "inline-block");
$(".next_page_hide").css("display", "flex");
$(".next_page").css("display", "none");
$(".last_page_hide").css("display", "inline-block");
$(".last_page_hide").css("display", "flex");
$(".last_page").css("display", "none");
} else if(List.page + List.can_fit + 1 >= $("#wrapper").children().length - 1){
$(".next_page_hide").css("display", "inline-block");
$(".next_page_hide").css("display", "flex");
$(".next_page").css("display", "none");
$(".last_page_hide").css("display", "inline-block");
$(".last_page_hide").css("display", "flex");
$(".last_page").css("display", "none");
}
setTimeout(function()
@@ -355,7 +355,7 @@ var List = {
if(List.page >= $("#wrapper").children().length){
List.dynamicContentPage(-1);
} else if(List.page + List.can_fit >= $("#wrapper").children().length){
$(".next_page_hide").css("display", "inline-block");
$(".next_page_hide").css("display", "flex");
$(".next_page").css("display", "none");
}*/
if(chromecastAvailable){
@@ -385,7 +385,7 @@ var List = {
$("#suggested-"+deleted).remove();
if(List.page + List.can_fit < $("#wrapper").children().length + 1){
//$(".next_page_hide").css("display", "none");
//$(".next_page").css("display", "inline-block");
//$(".next_page").css("display", "flex");
}
if(List.page >= $("#wrapper").children().length){
List.dynamicContentPage(-1);

View File

@@ -162,6 +162,9 @@ function init(){
$('.collapsible').collapsible({
accordion : true // A setting that changes the collapsible behavior to expandable instead of the default accordion style
});
$("#help").modal();
$("#contact").modal();
$("#embed").modal();
spotify_is_authenticated(spotify_authenticated);
@@ -259,7 +262,7 @@ function init(){
$("#search").attr("placeholder", "Find song on YouTube...");
if(!/chrom(e|ium)/.test(navigator.userAgent.toLowerCase()) && !Helper.mobilecheck()){
$(".castButton").css("display", "none");
$(".castButton-unactive").css("display", "none");
}
if(chromecastAvailable){
@@ -285,7 +288,7 @@ initializeCastApi = function() {
receiverApplicationId: "E6856E24",
autoJoinPolicy: chrome.cast.AutoJoinPolicy.ORIGIN_SCOPED});
var context = cast.framework.CastContext.getInstance();
$(".castButton").css("display", "block");
//$(".castButton-unactive").css("display", "block");
context.addEventListener(
cast.framework.CastContextEventType.SESSION_STATE_CHANGED,
function(event) {
@@ -333,14 +336,18 @@ initializeCastApi = function() {
break;
}
});
Helper.log(cast.framework.CastContext.getInstance().getCastState());
if(cast.framework.CastContext.getInstance().getCastState() == "NO_DEVICES_AVAILABLE"){
$(".castButton").css("display", "none");
}
var cast_state = cast.framework.CastContext.getInstance();
cast_state.addEventListener(cast.framework.CastContextEventType.CAST_STATE_CHANGED, function(event){
if(event.castState == "NOT_CONNECTED"){
$(".castButton-unactive").css("display", "block");
} else if(event.castState == "NO_DEVICES_AVAILABLE"){
$(".castButton-unactive").css("display", "none");
}
});
};
function hide_native(way){
$(".castButton").toggleClass("hide");
$(".castButton-unactive").toggleClass("hide");
$(".castButton-active").toggleClass("hide");
if(way == 1){
$("#duration").toggleClass("hide");
@@ -600,12 +607,12 @@ $(document).keyup(function(e) {
if(Helper.contains($("#song-title").attr("class").split(" "), "hide"))
$("#song-title").toggleClass("hide");
if($("#search-btn i").attr('class') == "mdi-navigation-close")
if($("#search-btn i").html() == "close")
{
$("#search-btn i").toggleClass("mdi-navigation-close");
$("#search-btn i").toggleClass("mdi-action-search");
//$("#search-btn i").html("mdi-navigation-close");
$("#search-btn i").html("search");
}
if(!Helper.contains($("#search-container").attr("class").split(" "), "hide")){
if(!Helper.contains($(".search-container").attr("class").split(" "), "hide")){
$("#results").toggleClass("hide");
}
}
@@ -633,13 +640,17 @@ $(document).on("click", "#playpause-overlay", function(){
}
});
$(document).on("click", ".castButton-unactive", function(e){
$(".castButton").trigger("click");
});
$(document).on("click", ".castButton-active", function(e){
e.preventDefault();
var castSession = cast.framework.CastContext.getInstance().getCurrentSession();
// End the session and pass 'true' to indicate
// that receiver application should be stopped.
castSession.endSession(true);
})
});
$(document).on('click', '#cookieok', function() {
$(this).fadeOut(function(){

View File

@@ -18,7 +18,8 @@ var Mobile_remote = {
$("#remote_channel").val("");
$("#remote_channel").attr("placeholder", "Change channel");
$("#remote_header").html("Controlling " + id);
$("#volume-control-remote").css("display", "block");
$("#volume-control-remote").css("display", "inline-block");
$(".slider-vol").attr("style", "display: inline-block !important");
},
set_channel: function(channel_name) {

View File

@@ -281,7 +281,7 @@ var Player = {
getTitle: function(titt, v)
{
var outPutWord = "<i class='mdi-action-visibility'></i>"//v > 1 ? "viewers" : "viewer";
var outPutWord = "<i class='material-icons'>visibility</i>"//v > 1 ? "viewers" : "viewer";
var title = decodeURIComponent(titt);
if(window.location.pathname != "/"){
var elem = document.getElementById('song-title');

View File

@@ -13,6 +13,10 @@ $(document).ready(function (){
'sync disconnect on unload':true,
'secure': true
};
$("#about").modal();
$("#contact").modal();
if(window.location.hostname == "remote.zoff.no") add = "https://zoff.no";
else add = "localhost";
socket = io.connect(add + ':8080', connection_options);

View File

@@ -12,8 +12,12 @@ var Search = {
$("#song-title").toggleClass("hide");
//$("#results").toggleClass("hide");
$("#results").empty();
$("#search-btn i").toggleClass("mdi-navigation-close");
$("#search-btn i").toggleClass("mdi-action-search");
if($("#search-btn i").html() == "close"){
$("#search-btn i").html("search");
} else {
$("#search-btn i").html("close");
}
//$("#search-btn i").html("search");
$("#search").focus();
},