frontend: panel added basic arraning alg

1 files changed, 119 insertions, 7 deletions

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++){
@@ -187,6 +283,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
          * @returns number of leaveschilds of the current node
@@ -243,7 +355,6 @@
 
             if (timeSteps > 9) {
                 timeSteps = 0;
-
                 var calendarUpdateIds = "";
                 var rommUpdateIds = "";
                 for (var property in rooms) {
@@ -651,8 +762,9 @@
 				"<div id = 'div_pc_Off_"+id+"' class='divPcPcOff'>"+0+"</div>" +
 				"<div id = 'div_pc_Defect_"+id+"' class='divPcPcDefect'>"+0+"</div>" +
 				"</div>" +
+				"<div class='aroundCourse'>"+
 				"<div id = 'div_course"+id+"'class='courseFont'></div>" +
-				"<div id = 'div_Time_"+id+"'class='courseFont'></div></div></div>";
+				"<div id = 'div_Time_"+id+"'class='courseFont'></div></div></div></div>";
 			var obj = $(target).append(text);
             getConfig((id));
             return obj