Modify top tiles to allow multiple devices with the same IDX. Issue #61

wez3 · Jan 14, 2017 · 3cfaa2e · 3cfaa2e
1 parent 2059063
commit 3cfaa2e
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 11 deletions.
diff --git a/static/js/domoboard.js b/static/js/domoboard.js
@@ -102,24 +102,24 @@ function refreshTopTiles(updateDivs, block, tilesPreviousArray, updateDivsTypeAr
 		tilesArray = re.exec(data);
 		if (tilesArray != null) {
 			if (tilesArray[1] < tilesPreviousArray[i]) {
-				$("#" + block + divID).html(tilesArray[1] + "<font size='3'>" + tilesArray[2] + " <i class='fa fa-caret-down fa-lg' style='color:red'></font>");
+				$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(tilesArray[1] + "<font size='3'>" + tilesArray[2] + " <i class='fa fa-caret-down fa-lg' style='color:red'></font>");
 				tilesPreviousArray[i] = tilesArray[1];
 			} else if (tilesArray[1] > tilesPreviousArray[i]) {
-				$("#" + block + divID).html(tilesArray[1] + "<font size='3'>" + tilesArray[2] + " <i class='fa fa-caret-up fa-lg' style='color:green'></font>");
+				$("#" + block + divID  + "_" + updateDivsTypeArray[i]).html(tilesArray[1] + "<font size='3'>" + tilesArray[2] + " <i class='fa fa-caret-up fa-lg' style='color:green'></font>");
 				tilesPreviousArray[i] = tilesArray[1];
 			}
 		} else {
-			$("#" + block + divID).html(data);
+			$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(data);
 		}
 		if(data == "On") {
-			$("#" + block + divID).removeClass("red");
-			$("#" + block + divID).addClass("green");
+			$("#" + block + divID + "_" + updateDivsTypeArray[i]).removeClass("red");
+			$("#" + block + divID + "_" + updateDivsTypeArray[i]).addClass("green");
 		} else if(data == "Off") {
-			$("#" + block + divID).removeClass("green");
-			$("#" + block + divID).addClass("red");
+			$("#" + block + divID + "_" + updateDivsTypeArray[i]).removeClass("green");
+			$("#" + block + divID + "_" + updateDivsTypeArray[i]).addClass("red");
 		} else {
-			$("#" + block + divID).removeClass("green");
-			$("#" + block + divID).removeClass("red");
+			$("#" + block + divID + "_" + updateDivsTypeArray[i]).removeClass("green");
+			$("#" + block + divID + "_" + updateDivsTypeArray[i]).removeClass("red");
 		}
 	});
     i = i++;

diff --git a/templates/top_tiles.html b/templates/top_tiles.html
@@ -5,7 +5,7 @@
     <div class="left"></div>
     <div class="right">
       <span class="count_top"><i class="fa fa-{{v[2]}}"></i> {{k}}</span>
-      <div class="count{% if v[2] == "On" %} green{% elif v[2] == "Off" %} red{% endif %} loading" id="top_tiles_block_{{count}}_{{v[1]}}" style="white-space: nowrap;"></div>
+      <div class="count{% if v[2] == "On" %} green{% elif v[2] == "Off" %} red{% endif %} loading" id="top_tiles_block_{{count}}_{{v[1]}}_{% if v[3] %}{{v[3]}}{% else %}Data{% endif %}" style="white-space: nowrap;"></div>
     </div>
   </div>
   {% endfor %}
@@ -26,8 +26,10 @@
 
   tilesPreviousArray_{{count}} = refreshTopTiles(updateDivs_block_{{count}}, "top_tiles_block_{{count}}_", tilesPreviousArray_{{count}}, updateDivsType_block_{{count}});
   tilesPreviousArray_{{count}} = setInterval(refreshTopTiles, 9000, updateDivs_block_{{count}}, "top_tiles_block_{{count}}_", tilesPreviousArray_{{count}}, updateDivsType_block_{{count}});
+  var counter = 0;
   for (var i in updateDivs_block_{{count}}) {
-    $("#top_tiles_block_{{count}}_" + updateDivs_block_{{count}}[i]).removeClass("loading");
+    $("#top_tiles_block_{{count}}_" + updateDivs_block_{{count}}[i] + "_" + updateDivsType_block_{{count}}[counter]).removeClass("loading");
+    counter += 1;
   }
 });
 </script>