From e2efe6cd01aacc81b377a98a0e5654863bf34b05 Mon Sep 17 00:00:00 2001
From: Michael Scherle
Date: Tue, 28 Mar 2017 19:08:21 +0200
Subject: frontend: panel added basic arraning alg
---
modules-available/locationinfo/frontend/panel.html | 126 +++++++++++++++++++--
1 file changed, 119 insertions(+), 7 deletions(-)
(limited to 'modules-available/locationinfo/frontend/panel.html')
diff --git a/modules-available/locationinfo/frontend/panel.html b/modules-available/locationinfo/frontend/panel.html
index f4c9783f..eb8c2fd8 100644
--- a/modules-available/locationinfo/frontend/panel.html
+++ b/modules-available/locationinfo/frontend/panel.html
@@ -25,8 +25,9 @@
background-color: white;
display: inline-block;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
- padding: 1vmin;
- float:left
+ padding: 5px;
+ float:left;
+
}
.childWithBorder{
display: inline-flex;
@@ -42,7 +43,7 @@
}
.border{
display: inline-flex;
- padding: 0.4vmin;
+ padding: 5px;
}
.borderout{
display: inline-flex;
@@ -54,6 +55,7 @@
font-size: 2vmin;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: bold;
+ overflow: hidden;
}
.headerFont{
font-size: 4vmin;
@@ -76,6 +78,7 @@
}
+
.divPcOn {
background-color: green;
text-align: center;
@@ -135,11 +138,104 @@
generateLayout(result);
setInterval(update,1000);
-
+ arrange();
});
}
+ /**
+ * Main Fuction for aranging the divs
+ */
+ function arrange() {
+ var height = $( window ).height();
+ var width = $( window ).width();
+ var childs = $(".childWithBorder");
+ var parents = [];
+ for(var i = 0; i < childs.length;i++){
+ var parent= $(childs[i]).parent();
+ if($.inArray(parent[0],parents)==-1){
+ parents.push(parent[0]);
+ }
+ }
+ for (var i = 0; i < parents.length;i++) {
+ childs = $(parents[i]).children();
+
+ if(checkForLineBreak(parents[i],childs) > 0){
+ makeItFit(parents[i],childs,childs.length/2);
+ }
+
+ }
+
+ }
+ /**
+ * rekursive calls itselfs and trys to find the best number off childs
+ * which should be side by side.
+ * @param parent Parent div
+ * @param childs Child divs
+ * @param breakAfter number after the divs should go in the next row
+ */
+ function makeItFit(parent,childs,breakAfter) {
+ breakAfter= Math.abs(breakAfter);
+ var width = checkIfFit(parent,childs,breakAfter)
+ if(width > 0){
+ $(parent).width(width+20);
+ } else {
+ makeItFit(parent, childs, breakAfter-1);
+ }
+ }
+
+ /**
+ * checks if a given number off divs(side by side) would fit on the screen
+ * @param parent Parent div
+ * @param childs Child divs
+ * @param breakAfter number after the divs should go in the next row
+ * @returns -1 if it wouldn't fit else the width the div should have
+ */
+ function checkIfFit(parent,childs,breakAfter) {
+ var parentWidth = $(parent).width();
+ var maxWidth = 0;
+ var curWidth = 0;
+ var t = 0;
+ for (var i = 0; i < childs.length;i++) {
+ var childWidth = $(childs[i]).width();
+ if((curWidth + childWidth > parentWidth && breakAfter > 1)){
+ return -1;
+ }
+ curWidth += childWidth;
+ t++;
+ if(t == breakAfter){
+ maxWidth =Math.max(curWidth,maxWidth);
+ curWidth = 0;
+ t=0;
+ }
+
+ }
+ return maxWidth
+ }
+
+ /**
+ * return the number of Linebreaks the divs would make
+ * @param parent Parent div
+ * @param childs Child divs
+ * @returns the number of Linebreaks the divs would make
+ */
+ function checkForLineBreak (parent,childs){
+ var linebreaks = 0;
+ var curWidth = 0;
+ var parentWidth = $(parent).width();
+ for (var i = 0; i < childs.length;i++) {
+ var childWidth = $(childs[i]).width();
+ if(curWidth + childWidth < parentWidth ){
+ curWidth += childWidth;
+ } else {
+ linebreaks++;
+
+ curWidth = childWidth;
+ }
+ }
+ return linebreaks;
+ }
+
function SetUpDate(d) {
startdate = d.getTime()-new Date().getTime();
}
@@ -174,7 +270,7 @@
function generateObject(json,myParent,outermost){
var obj;
if(json.childs.length == 0) {
- obj =generateChild(myParent,json.id,json.name,outermost)
+ obj =generateChild(myParent,json.id,json.name,outermost);
} else {
obj = generateParent(myParent,json.id,json.name,outermost);
for (var i = 0; i < json.childs.length;i++){
@@ -186,6 +282,22 @@
}
+ /**
+ * Retruns the number of childs of the current node (inklusive childs of childs)
+ * @param json Json of the room tree
+ * @returns number of childs of the current node
+ */
+ function getAllchildsRekusivly(json){
+ var childs = 0;
+ for (var i = 0; i < json.childs.length;i++){
+ childs++;
+ if(json.childs[i].childs.length != 0){
+ childs = getAllchildsRekusivly(json.childs[i]);
+ }
+ }
+ return childs;
+ }
+
/**
* Retruns the number of leaveschilds of the current node (inklusive leaves childs of childs)
* @param json Json of the room tree
@@ -243,7 +355,6 @@
if (timeSteps > 9) {
timeSteps = 0;
-
var calendarUpdateIds = "";
var rommUpdateIds = "";
for (var property in rooms) {
@@ -651,8 +762,9 @@
""+0+"
" +
""+0+"
" +
"" +
+ "";
+ "";
var obj = $(target).append(text);
getConfig((id));
return obj
--
cgit v1.2.3-55-g7522