frontend: doorsing has now the ability to show overlays, but backend functionallity is required

3 files changed, 166 insertions, 6 deletions

diff --git a/modules-available/locationinfo/frontend/doorsign.html b/modules-available/locationinfo/frontend/doorsign.html
index 21e2d5eb..b096ec33 100755
--- a/modules-available/locationinfo/frontend/doorsign.html
+++ b/modules-available/locationinfo/frontend/doorsign.html
@@ -63,6 +63,7 @@ optional:
 			color: white;

 			padding: 0;

 			height: 8vw;

+

 		}

 

 		.progressbar {

@@ -173,10 +174,28 @@ optional:
 			overflow: visible;

 		}

 

-		.pcImg {

+		.PCImgDiv{

 			position: absolute;

 			left: 0;

 			bottom: 0;

+			display: inline-block;

+

+		}

+		.pcImg {

+			position: absolute;

+			left: 0;

+			top: 0;

+			width: 100%;

+			height:100%;

+

+		}

+		.overlay{

+			position: absolute;

+			left: 0;

+			top: 0;

+			width: 50%;

+			height:50%;

+			z-index: 5;

 		}

 

 		.wc-scrollable-grid {

@@ -231,7 +250,16 @@ optional:
 		[class*="wc-day-"] {

 			border-color: grey;

 		}

-

+	.overlay1 {

+		width: 20%;

+		height: 50%;

+		left: 0;

+		top: 0;

+		bottom: auto;

+		right: auto;

+		background-color: white;

+		opacity: 0.5

+	}

 

 	</style>

 	<script type='text/javascript'>

@@ -281,6 +309,12 @@ optional:
 

 			}

 		};

+		var overlay = {

+			"1": { 	name:"1.svg",

+					class:"overlay1"

+

+			}

+		}

 

 

 		$(document).ready(function () {

@@ -844,7 +878,7 @@ optional:
 			var columnWidth = document.getElementById("calendar_" + room.id).getElementsByClassName("wc-day-1")[0].clientWidth;

 

 			if (room.config.scaledaysauto) {

-				var result = (44 + cal.weekCalendar("option", "daysToShow") * columnWidth) / 100;

+				var result = (cal.weekCalendar("option", "daysToShow") * columnWidth) / 100;

 				result = parseInt(Math.min(Math.max(Math.abs(result), 1), 7));

 				if (result != parseInt(cal.weekCalendar("option", "daysToShow"))) {

 

@@ -1162,6 +1196,7 @@ optional:
 		function preInitRoom(room) {

 

 			$.getJSON("../../../api.php?do=locationinfo&action=roominfo&id=" + room.id + "&coords=1", function (result) {

+				console.log(result);

 				generateRoomLayoutDiv((100 - room.config.scale) + "%", room);

 				if (result[0] == null) {

 

@@ -1283,16 +1318,33 @@ optional:
 			for (var i = 0; i < layout.length; i++) {

 

 				if (layout[i].y != null && layout[i].x != null && !isNaN(layout[i].y) && !isNaN(layout[i].x)) {

+					var text =  "<div class= 'PCImgDiv'  id ='layout_PC_div_" + room.id + "_"+layout[i].id +"'>" +

+							"<img class= 'pcImg' id ='layout_PC_" + room.id + "_"+layout[i].id +"'> </img" +

+						"</div>";

+

+					$('#roomLayout_' + room.id).append(text);

+					addOverlay($('#layout_PC_div_'+ room.id + "_"+layout[i].id),1);

+					/*

 					var img = $('<img />',

 						{

 							id: "layout_PC_" + room.id + "_" + layout[i].id,

 							class: "pcImg"

 						})

 						.appendTo($('#roomLayout_' + room.id));

+						*/

 				}

 			}

 		}

 

+		function addOverlay(object,overlayId) {

+

+			var text = $("<img class='overlay'  src='img/overlay/"+ overlay[overlayId].name+ "'></img>")

+			text.addClass(overlay[overlayId].class);

+

+			object.append(text);

+

+		}

+

 		// querys Pc states

 		function queryRooms(ids) {

 			$.ajax({

@@ -1336,10 +1388,12 @@ optional:
 			}

 			for (var i = 0; i < room.layout.length; i++) {

 				if (room.layout[i].y != null && room.layout[i].x != null && !isNaN(room.layout[i].y) && !isNaN(room.layout[i].x)) {

-					var tmp = document.getElementById("layout_PC_" + room.id + "_" + room.layout[i].id);

+					var tmp = document.getElementById("layout_PC_div_" + room.id + "_" + room.layout[i].id);

+					var img  = document.getElementById("layout_PC_" + room.id + "_" + room.layout[i].id);

 					if (tmp != null) {

-						tmp.width = (picSizeX * room.scale);

-						tmp.height = (picSizeY * room.scale);

+						tmp.style.width = (picSizeX * room.scale);

+						tmp.setAttribute("style","width:"+(picSizeX * room.scale)+"px");

+						tmp.style.height = (picSizeY * room.scale)+"px";

 						tmp.style.left = ((parseInt(room.layout[i].x) + room.xOffset) * room.scale) + "px";

 						tmp.style.top = ((parseInt(room.layout[i].y) + room.yOffset) * room.scale ) + "px";

 					}

diff --git a/modules-available/locationinfo/frontend/img/overlay/1.svg b/modules-available/locationinfo/frontend/img/overlay/1.svg
new file mode 100755
index 00000000..8237d543
--- /dev/null
+++ b/modules-available/locationinfo/frontend/img/overlay/1.svg
@@ -0,0 +1,104 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://web.resource.org/cc/"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.0"
+   width="240"
+   height="360"
+   id="svg2"
+   sodipodi:version="0.32"
+   inkscape:version="0.44.1"
+   sodipodi:docname="Rollstuhl_aus_Zusatzzeichen_1044-10.svg"
+   sodipodi:docbase="L:\Wiki\pedia\ksh\svg">
+  <metadata
+     id="metadata4235">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title>Symbol: Rollstuhl</dc:title>
+        <dc:creator>
+          <cc:Agent>
+            <dc:title>Purodha Blissenbach</dc:title>
+          </cc:Agent>
+        </dc:creator>
+        <dc:source>
+http://commons.mediawiki.org/wiki/Image:Rollstuhl_Zusatzzeichen_1044-10.svg</dc:source>
+        <cc:license
+           rdf:resource="http://web.resource.org/cc/PublicDomain" />
+      </cc:Work>
+      <cc:License
+         rdf:about="http://web.resource.org/cc/PublicDomain">
+        <cc:permits
+           rdf:resource="http://web.resource.org/cc/Reproduction" />
+        <cc:permits
+           rdf:resource="http://web.resource.org/cc/Distribution" />
+        <cc:permits
+           rdf:resource="http://web.resource.org/cc/DerivativeWorks" />
+      </cc:License>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     inkscape:window-height="734"
+     inkscape:window-width="1001"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="1"
+     guidetolerance="10.0"
+     gridtolerance="10.0"
+     objecttolerance="10.0"
+     borderopacity="1.0"
+     bordercolor="#666666"
+     pagecolor="white"
+     id="base"
+     inkscape:zoom="1.0806949"
+     inkscape:cx="150"
+     inkscape:cy="171.76267"
+     inkscape:window-x="169"
+     inkscape:window-y="84"
+     inkscape:current-layer="svg2"
+     height="360px"
+     width="240px"
+     inkscape:showpageshadow="false"
+     gridempspacing="20"
+     showgrid="true" />
+  <defs
+     id="defs4" />
+  <g
+     transform="matrix(7.357704,0,0,7.357704,434.9445,-2099.79)"
+     id="g8408">
+    <path
+       d="M -35.212572,318.50098 C -35.211894,322.66083 -38.583928,326.03341 -42.743778,326.03341 C -46.903628,326.03341 -50.275662,322.66083 -50.274984,318.50098 C -50.275662,314.34113 -46.903628,310.96855 -42.743778,310.96855 C -38.583928,310.96855 -35.211894,314.34113 -35.212572,318.50098 L -35.212572,318.50098 z "
+       transform="matrix(1.103775,0,0,1.103775,8.653227,-30.10701)"
+       style="opacity:1;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:black;stroke-width:1.81196344;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+       id="path3069" />
+    <path
+       d="M -36.78532,312.21483 C -36.78532,316.98239 -36.78532,314.68153 -36.78532,314.68153"
+       style="fill:none;fill-opacity:1;fill-rule:evenodd;stroke:white;stroke-width:1.76695538px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       id="path6617" />
+    <path
+       d="M -47.292192,317.15326 C -41.96024,317.15326 -44.051937,317.15326 -44.051937,317.15326"
+       style="fill:none;fill-opacity:1;fill-rule:evenodd;stroke:white;stroke-width:1.976125px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       id="path5730" />
+    <path
+       d="M -44.56103,313.67108 C -39.229078,313.67108 -41.320775,313.67108 -41.320775,313.67108"
+       style="fill:none;fill-opacity:1;fill-rule:evenodd;stroke:white;stroke-width:1.976125px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       id="path8406" />
+    <path
+       d="M -55.667836,330.11748 C -54.347105,325.16278 -51.67252,315.22275 -51.515523,314.89338 C -51.186883,314.20393 -51.121917,313.65381 -50.034883,313.60631 L -42.886955,313.69168 L -42.886955,310.66214 L -50.333498,310.66214 C -50.178853,309.98746 -50.383012,309.31278 -49.164921,308.6381 L -42.934292,308.6381 L -42.934292,302.66225 C -42.934292,301.09614 -37.064554,301.09983 -37.064554,302.66225 L -37.064554,314.73308 C -37.064554,315.9654 -38.193966,316.81589 -39.857413,316.81589 L -49.324732,316.81589 L -53.490353,330.16481 C -53.745584,331.11734 -55.667836,330.83456 -55.667836,330.11748 z "
+       style="fill:black;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       id="path6630" />
+    <path
+       d="M -53.443015,298.59131 C -53.442426,300.16032 -54.714197,301.43257 -56.283211,301.43257 C -57.852224,301.43257 -59.123995,300.16032 -59.123406,298.59131 C -59.123995,297.0223 -57.852224,295.75005 -56.283211,295.75005 C -54.714197,295.75005 -53.442426,297.0223 -53.443015,298.59131 z "
+       transform="matrix(1.083333,0,0,1.083333,20.67569,-26.8545)"
+       style="opacity:1;fill:black;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+       id="path6632" />
+  </g>
+</svg>
diff --git a/modules-available/locationinfo/frontend/panel.html b/modules-available/locationinfo/frontend/panel.html
index d899ffd2..9da9cbc8 100644
--- a/modules-available/locationinfo/frontend/panel.html
+++ b/modules-available/locationinfo/frontend/panel.html
@@ -89,6 +89,8 @@
 		var roomidsString = "";
 		var lastPcUpdate;
 		var lastTimeTableUpdate;
+
+		// Todo change these
 		var pcStateUpdateTime = 60; // in seconds
 		var TimeTableUpdateTime = 60*30; //in seconds