Added LED control button to test GUI
[matches/MCTX3420.git] / 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

UCC git Repository :: git.ucc.asn.au