web/gui.js

   1 /**
   2  * @file gui.js
   3  * @purpose GUI in JavaScript using jQuery and jQuery Flot libraries
   4  * NEEDS WORK !
   5  */
   6
   7 $(document).ready(function()
   8 {
   9
  10         g_sensors = []
  11         g_numSensors = 1
  12         g_storeTime = []
  13         g_key = null
  14         g_led = 1
  15
  16         $.fn.ledFlash = function()
  17         {
  18                 //alert("Flash LED");
  19                 if (g_led == 0)
  20                 {
  21                         $.ajax({url : "api/actuators", data : {id : 0, set : 1}})
  22                         g_led = 1
  23                         $("#led").html("LED On");
  24                 }
  25                 else
  26                 {
  27                         $.ajax({url : "api/actuators", data : {id : 0, set : 0}})
  28                         g_led = 0
  29                         $("#led").html("LED Off");
  30                 }
  31         }
  32
  33         $.fn.pruneSensorData = function(id)
  34         {
  35                 var sensor = g_sensors[id]
  36                 // remove unwanted values
  37                 if (g_storeTime[id] != null)
  38                 {
  39                         var last_time = sensor[sensor.length-1][0]
  40                         //console.log("Last time: " + String(last_time))
  41                         var back_index = 0;
  42                         for (back_index = sensor.length-1; back_index > 0; --back_index)
  43                         {
  44                                 if ((last_time - sensor[back_index][0]) > g_storeTime[id])
  45                                 {
  46                                         break;
  47                                 }
  48
  49                                 //console.log("Keep point " + String(sensor[back_index][0]) + "s ago")
  50
  51                         }
  52                         if (back_index > 0)
  53                         {
  54                                 //console.log("Delete " +String(back_index))
  55                                 sensor.splice(0, back_index)
  56                         }
  57                 }
  58         }
  59
  60
  61         // update function
  62         $.fn.updateSensor = function(json)
  63         {
  64                 //console.log(json.data)
  65                 var sensor = g_sensors[0]
  66                 var most_recent = null
  67                 if (sensor.length > 0)
  68                         most_recent = sensor[sensor.length-1][0]
  69
  70                 for (var i=0; i < json.data.length; ++i)
  71                 {
  72                         if (json.data[i][0] > most_recent || most_recent == null)
  73                         {
  74                                 sensor.push(json.data[i])
  75                                 most_recent = json.data[i][0]
  76                         }
  77                 }
  78
  79                 $(this).pruneSensorData(json.id)
  80
  81                 //console.log("Plot:")
  82                 //console.log(g_sensors[json.id])
  83                 $.plot("#sensor"+String(0)+"_plot", [g_sensors[0]])
  84                 $.ajax({url : "/api/sensors", data : {id : json.id}, success : function(data) {$(this).updateSensor(data);}});
  85
  86                 //
  87         }
  88
  89         $.fn.reloadSensor = function(id)
  90         {
  91                 g_storeTime[id] = Number($("#sensor"+String(id)+"_settings").find("#storeTime").val())
  92                 console.log(String($("#sensor"+String(id)+"_settings").find("#storeTime").val()))
  93
  94
  95
  96                 $(this).pruneSensorData(id)
  97                 $.plot("#sensor"+String(id)+"_plot", [g_sensors[id]])
  98         }
  99
 100         $.fn.setPressure = function()
 101         {
 102                 var value = Number($("#control0_value").val())
 103                 $.ajax({url : "/api/control", data : {action : "set", value : String(value), id : 0, key : g_key}, success : function(json) {alert(json.description)}})
 104         }
 105
 106         $.fn.LoadGUI = function()
 107         {
 108                 //TODO: Get rid of g_numSensors; query the server for sensors?
 109
 110                 $.ajax({url : "/api/control", data : {action : "start", force : "true"}, success : function(json) {g_key = String(json.key)}, async : false})
 111                 console.log("Key is " + g_key)
 112
 113                 // Load the plots
 114                 plotsHTML = ""
 115                 for (var i = 0; i < g_numSensors; ++i)
 116                 {
 117                         g_sensors.push([new Array()])
 118                         g_storeTime.push(600)
 119                         //plotsHTML += "<div id=sensor"+String(i)+"\n"
 120                         plotsHTML += "<h2 id=sensor"+String(i)+"_name>Sensor: "+String(i)+"</h2>\n"
 121                         plotsHTML += "<div id=sensor"+String(i)+"_plot class=\"plot\" onclick=\"window.open('/api/sensors?id="+String(i)+"&dump')\"> </div>\n"
 122                         plotsHTML += "<div id=sensor"+String(i)+"_settings\n"
 123                         plotsHTML += "<p> Plot since <input type=text id=storeTime value=\""+String(g_storeTime[i])+"\"/> seconds ago\n"
 124                         plotsHTML += "<button id=update onclick=$(document).reloadSensor("+String(i)+")>Update</button></p>\n"
 125                         plotsHTML += "<button id=dump onclick=\"window.open('/api/sensors?id="+String(i)+"&dump')\">Dump All Data\n"
 126                         plotsHTML += "</div>\n" // end settings
 127                         //plotsHTML += "</div>\n" //
 128
 129                 }
 130                 $("#plots").html(plotsHTML)
 131
 132                 controlHTML = "<h2 id=control0>Controls</h2>\n"
 133                 controlHTML += "<button id=led onclick=\"$(document).ledFlash()\">LED On</button>"
 134
 135                 $("#controls").html(controlHTML)
 136
 137         }
 138
 139
 140
 141         $(this).LoadGUI()
 142
 143
 144
 145         for (var i = 0; i < g_numSensors; ++i)
 146         {
 147           $.ajax({url : "/api/sensors", data : {id : 2}, success : function(data) {$(this).updateSensor(data);}})
 148
 149         }
 150 });
 151