Fixed list-populate error

- Fixed issue where updating a list would cause it to be empty visually on update for users
This commit is contained in:
Kasper Rynning-Tønnesen
2018-04-26 12:24:54 +02:00
parent 61647e96c7
commit 58ccdada3b
5 changed files with 42 additions and 22 deletions

View File

@@ -5,11 +5,11 @@ var gulp = require('gulp'),
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'])
.pipe(uglify({
/*.pipe(uglify({
mangle: true,
compress: true,
enclose: true
}))
}))*/
.pipe(concat('main.min.js'))
.pipe(gulp.dest('server/public/assets/dist'));
});

View File

@@ -18,6 +18,14 @@ var Helper = {
return arr[Math.floor(Math.random() * arr.length)];
},
computedStyle: function(element, type) {
try {
return parseInt(window.getComputedStyle(document.querySelector(element), null).getPropertyValue(type).replace("px", ""))
} catch(e) {
return 0;
}
},
toggleClass: function(element, className) {
try {
if(typeof(element) == "object") {
@@ -60,7 +68,9 @@ var Helper = {
}
}
}
}catch(e) {}
}catch(e) {
//console.log(e);
}
},
css: function(element, attribute, value) {
@@ -89,6 +99,7 @@ var Helper = {
}
}
} catch(e) {
//console.log(e);
}
},
@@ -102,7 +113,9 @@ var Helper = {
return elements[i].innerHTML;
}
}
} catch(e){}
} catch(e){
//console.log(e);
}
},
removeClass: function(element, className) {
@@ -118,6 +131,7 @@ var Helper = {
}
}
} catch(e) {
//console.log(e);
}
},
@@ -149,7 +163,9 @@ var Helper = {
elements[i].remove();
}
}
} catch(e) {}
} catch(e) {
//console.log(e);
}
},
setHtml: function(element, html) {
@@ -170,7 +186,9 @@ var Helper = {
elements[i].innerHTML = html;
}
}
} catch(e) {}
} catch(e) {
//console.log(e);
}
},
attr: function(element, attr, value) {

View File

@@ -2,8 +2,8 @@ var List = {
empty: false,
page: 0,
can_fit: document.querySelectorAll("#wrapper").length > 0 ? Math.round(parseInt(window.getComputedStyle(document.querySelector("#wrapper"), null).getPropertyValue("height").replace("px", "")) / 71) : 0,
element_height: document.querySelectorAll("#wrapper").length > 0 ? (parseInt(window.getComputedStyle(document.querySelector("#wrapper"), null).getPropertyValue("height").replace("px", "")) / Math.round(parseInt(window.getComputedStyle(document.querySelector("#wrapper"), null).getPropertyValue("height").replace("px", "")) / 71)) - 25 : 0,
can_fit: document.querySelectorAll("#wrapper").length > 0 ? Math.round(Helper.computedStyle("#wrapper", "height") / 71) : 0,
element_height: document.querySelectorAll("#wrapper").length > 0 ? (Helper.computedStyle("#wrapper", "height") / Math.round(Helper.computedStyle("#wrapper", "height") / 71)) - 25 : 0,
uris: [],
not_found: [],
num_songs: 0,
@@ -153,24 +153,25 @@ var List = {
populate_list: function(msg, no_reset) {
// This math is fucked and I don't know how it works. Should be fixed sometime
if(!Helper.mobilecheck() && !embed && !client){
List.can_fit = Math.round((document.querySelector("#wrapper").offsetHeight) / 71);
List.element_height = ((document.querySelector("#wrapper").offsetHeight) / List.can_fit)-5.3;
List.can_fit = Math.round(Helper.computedStyle("#wrapper", "height") / 71);
List.element_height = (Helper.computedStyle("#wrapper", "height") / List.can_fit)-5.3;
} else if(embed) {
List.can_fit = Math.round((document.querySelector("#wrapper").offsetHeight) / 91) + 1;
List.element_height = ((document.querySelector("#wrapper").offsetHeight) / List.can_fit)-4;
List.can_fit = Math.round(Helper.computedStyle("#wrapper", "height") / 91) + 1;
List.element_height = (Helper.computedStyle("#wrapper", "height") / List.can_fit)-4;
} else if(!client){
List.can_fit = Math.round((window.innerHeight - parseInt(window.getComputedStyle(document.querySelector(".tabs"), null).getPropertyValue("height").replace("px", "")) - parseInt(window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height").replace("px", "")) - 64 - 40) / 71)+1;
List.element_height = ((window.innerHeight - parseInt(window.getComputedStyle(document.querySelector(".tabs"), null).getPropertyValue("height").replace("px", "")) - parseInt(window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height").replace("px", "")) - 64 - 40) / List.can_fit)-5;
List.can_fit = Math.round((Helper.computedStyle(".tabs", "height") - Helper.computedStyle("header", "height") - 64 - 40) / 71)+1;
List.element_height = ((window.innerHeight - Helper.computedStyle(".tabs", "height") - Helper.computedStyle("header", "height") - 64 - 40) / List.can_fit)-5;
} else {
List.can_fit = Math.round((window.innerHeight - parseInt(window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height").replace("px", ""))) / 80)+1;
List.element_height = ((window.innerHeight - parseInt(window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height").replace("px", ""))) / List.can_fit) - 8;
List.can_fit = Math.round(window.innerHeight - Helper.computedStyle("header", "height") / 80)+1;
List.element_height = (window.innerHeight - Helper.computedStyle("header", "height") / List.can_fit) - 8;
}
if(List.element_height < 55.2 && !client){
List.can_fit = List.can_fit - 1;
List.element_height = 55.2;
List.can_fit = Math.round((window.innerHeight - parseInt(window.getComputedStyle(document.querySelector(".tabs"), null).getPropertyValue("height").replace("px", "")) - parseInt(window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height").replace("px", "")) - 64 - 40) / 71);
List.element_height = ((window.innerHeight - parseInt(window.getComputedStyle(document.querySelector(".tabs"), null).getPropertyValue("height").replace("px", "")) - parseInt(window.getComputedStyle(document.querySelector("header"), null).getPropertyValue("height").replace("px", "")) - 64 - 40) / List.can_fit)-5;
List.can_fit = Math.round((window.innerHeight - Helper.computedStyle(".tabs", "height") - Helper.computedStyle("header", "height") - 64 - 40) / 71);
List.element_height = ((window.innerHeight - Helper.computedStyle(".tabs", "height") - Helper.computedStyle("header", "height") - 64 - 40) / List.can_fit)-5;
}
console.log(List.can_fit, List.element_height, List.page);
if(list_html === undefined) list_html = Helper.html("#list-song-html");
full_playlist = msg;
if(offline && !no_reset){
@@ -314,6 +315,7 @@ var List = {
}
} else {
if(way==-10) {
console.log(wrapperChildren, List.page, List.can_fit);
Helper.css(wrapperChildren.slice(List.page, List.page + List.can_fit), "display", "none");
List.page = 0;
Helper.css(wrapperChildren.slice(List.page, List.page + List.can_fit), "display", "inline-flex");

View File

@@ -1218,7 +1218,7 @@ window.addEventListener("focus", function(event) {
window.addEventListener("resize", function(){
if(chan && !Helper.mobilecheck()){
var temp_fit = Math.round((window.getComputedStyle(document.querySelector("#wrapper"), null).getPropertyValue("height")) / 71)+1;
var temp_fit = Math.round(Helper.computedStyle("#wrapper", "height") / 71)+1;
if(temp_fit > List.can_fit || temp_fit < List.can_fit){
List.dynamicContentPage(-10);
}
@@ -1228,10 +1228,10 @@ window.addEventListener("resize", function(){
Helper.css(document.querySelector("#wrapper").children[List.page + temp_fit], "display", "none");
}
List.can_fit = temp_fit;
List.element_height = ((window.getComputedStyle(document.querySelector("#wrapper"), null).getPropertyValue("height")) / List.can_fit)-5.3;
List.element_height = (Helper.computedStyle("#wrapper", "height") / List.can_fit)-5.3;
Helper.css(".list-song", "height", List.element_height + "px");
Channel.set_title_width();
var controlsPosition = document.querySelector("#controls").offsetHeight - window.getComputedStyle(document.querySelector("#controls"), null).getPropertyValue("height");
var controlsPosition = document.querySelector("#controls").offsetHeight - Helper.computedStyle("#controls", "height");
if(document.querySelectorAll("#controls").length > 0 && !Helper.mobilecheck()) {
Helper.css(document.querySelector("#seekToDuration"), "top", controlsPosition - 55);
} else if(document.querySelectorAll("#controls").length > 0) {

View File

@@ -649,7 +649,7 @@ var Player = {
document.getElementsByClassName("video-container")[0].style.width = val + "px";
if(!Helper.mobilecheck()) {
if(window.innerWidth > 769) {
var test_against_width = window.innerWidth - window.getComputedStyle(document.querySelector(".control-list"), null).getPropertyValue("width") - document.querySelector(".zbrand").offsetWidth - document.querySelector(".brand-logo-navigate").offsetWidth - 66;
var test_against_width = window.innerWidth - Helper.computedStyle(".control-list", "width") - document.querySelector(".zbrand").offsetWidth - document.querySelector(".brand-logo-navigate").offsetWidth - 66;
title_width = test_against_width;
document.querySelector(".title-container").style.width = title_width + "px";
} else {