# HG changeset patch
# User Michiel Broek <mbroek@mbse.eu>
# Date 1533912777 -7200
# Node ID 366f270a24462142f5b514cbaf497d544ed82eaf
# Parent  36387e45a194cd816bdabf8fc1bcc95d0c793eae
Nodes auto refresh added.

diff -r 36387e45a194 -r 366f270a2446 www/index.php
--- a/www/index.php	Fri Aug 10 13:46:23 2018 +0200
+++ b/www/index.php	Fri Aug 10 16:52:57 2018 +0200
@@ -25,7 +25,7 @@
     /*
      * Different right panel pages
      */
-    var aNode = '<div class="nodeContainer">Node scherm </div>';
+    var refreshIntervalId = 0;
     var aFermenter = '<div class="fermenterContainer">Fermenter scherm  </div>';
     $("#splitter").jqxSplitter({ theme: "<?php echo $my_style; ?>", width: 1278, height: 618, panels: [{ size: 250}] });
     $("#jqxTree").jqxTree({ theme: "<?php echo $my_style; ?>", height: "100%", width: "100%" });
@@ -35,7 +35,6 @@
     var nodeByID = $("#jqxTree").find("#Nodes")[0];
     $.getJSON("getnodes.php", function(data) {
       for( i = 0; i < data.length; i++ ) {
-        console.log( "JSON Data: " + data[i].uuid + " " + data[ i ].node );
         $("#jqxTree").jqxTree("addTo", { id: 'node-' + data[i].uuid, label: data[i].node, icon: 'images/folder.png'  }, nodeByID);
       }
     });
@@ -54,6 +53,14 @@
 
     $("#jqxTree").on("select", function (event) {
       /*
+       * Cancel a running refresh loop.
+       */
+      if (refreshIntervalId > 0) {
+	console.log( "RefreshIIntervald: " + refreshIntervalId + " stopped" );
+        clearInterval(refreshIntervalId);
+	refreshIntervalId = 0;
+      }
+      /*
        * Process the selected id from the left panel tree and show the correct page in the right panel.
        */
       var estr = event.args.element.id;
@@ -101,7 +108,9 @@
                 html += "<tr><td>Uuid</td><td>" + record.uuid + "</td></tr>";
                 html += "<tr><td>Systeem</td><td>" + record.node + "</td></tr>";
 	        html += "<tr><td>Online</td><td>" + record.online + "</td></tr>";
-	        html += "<tr><td>Type</td><td>" + record.group_id + "</td></tr>";
+		html += "<tr><td>Type</td><td>" + record.group_id + "</td></tr>";
+		html += "<tr><td>Eerst gezien</td><td>" + record.firstseen + "</td></tr>";
+		html += "<tr><td>Laatst gezien</td><td>" + record.lastseen + "</td></tr>";
 	        html += "<tr><td>Hardware maker</td><td>" + record.hardwaremake+ "</td></tr>";
 		html += "<tr><td>Hardware model</td><td>" + record.harwaremodel+ "</td></tr>";
 		html += "<tr><td>OS</td><td>" + record.os + " versie: " + record.os_version + "</td></tr>";
@@ -115,15 +124,18 @@
 	        html += "</div>";
 	    $("#ContentPanel").html(html);
 	  }
-	/*     Data formatteren etc. Zie https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxdataadapter/index.htm#demos/jqxdataadapter/bindingtojson.htm */
-        });
-        dataAdapter.dataBind();
+	});
+	// Get the data immediatly and then at regular intervals to refresh.
+	dataAdapter.dataBind();
+	refreshIntervalId = setInterval(function(){
+          dataAdapter.dataBind();
+	}, 30000);
 
       } else if (estr.indexOf("fermenter-", 0) == 0) {
         var uuid = estr.substr(10);
         $("#ContentPanel").html("<div style='margin: 10px;'>" + uuid + "</div>");
       } else if (event.args.element.id == "Nodes") {
-        $("#ContentPanel").html(aNode);
+        $("#ContentPanel").html("<div></div");
       } else {
         $("#ContentPanel").html("<div style='margin: 10px;'>" + event.args.element.id + "</div>");
       }
@@ -152,7 +164,7 @@
          </li>
          <li id="Fermenters">
           <img style='float: left; margin-right: 5px;' src='images/folder.png' />
-          <span item-title="true">Klimatkasten</span>
+          <span item-title="true">Klimaatkasten</span>
           <!-- Subtree fermenters -->
          </li>
          <li id="Brewboards">