Support for tables

examples/dummy-web-server.pl

@@ -430,7 +430,8 @@ sub process_user_comm_voltage
   my $voltage = (((time - $startTime) % 60) - 30) / 30.0 + 4.0;
   $voltage = sprintf("%.2f V", $voltage);
   
-  my $r = '{"voltage": "' . $voltage . '"}';
+  my $table = ', "table": [["Time", "Min", "AVG", "Max"], ["0s-10s", "1 V", "3 V", "5 V"], ["10s-20s", "1 V", "2 V", "3 V"]]';
+  my $r = '{"voltage": "' . $voltage . '"' . $table . '}';
   return content_response($r, $http->{url});
 }
 

examples/web-server/Voltage.html

@@ -6,5 +6,8 @@
 
   <div class="content">
     <p id="voltage" align="center" style="font-size: 800%"/>
+
+    <table class="pure-table pure-table-bordered" align="center" id="table"/>
   </div>
+  
 </body></html>

html/userpage.js

@@ -27,7 +27,8 @@ function notifyResponse( data )
     var elem = document.getElementById(v);
     if( elem != null )
     {
-      if(elem.tagName == "P" || elem.tagName == "DIV")
+      if(elem.tagName == "P" || elem.tagName == "DIV" || elem.tagName == "SPAN" || elem.tagName == "TR" || elem.tagName == "TH" || elem.tagName == "TD" ||
+         elem.tagName == "TEXTAREA" )
       {
         elem.innerHTML = data[v];
       }
@@ -40,6 +41,36 @@ function notifyResponse( data )
           html = html.concat("<li>" + list[i] + "</li>");
         }
 
+        elem.innerHTML = html;
+      }
+      if(elem.tagName == "TABLE")
+      {
+        var list = data[v];
+        var html = "";
+
+        if( list.length > 0 )
+        {
+          var ths = list[0];
+          html = html.concat("<tr>");
+
+          for (var i=0; i<ths.length; i++) {
+            html = html.concat("<th>" + ths[i] + "</th>");
+          }
+
+          html = html.concat("</tr>");
+        }
+
+        for (var i=1; i<list.length; i++) {
+          var tds = list[i];
+          html = html.concat("<tr>");
+
+          for (var j=0; j<tds.length; j++) {
+            html = html.concat("<td>" + tds[j] + "</td>");
+          }
+          
+          html = html.concat("</tr>");
+        }
+        
         elem.innerHTML = html;
       }
     }