testing/MCTXWeb/public_html/static/mctx.graph.js

   1 /**
   2  * Graph sensor and/or actuator values
   3  */
   4
   5 //TODO: Clean this file up, I bow to Jeremy's superior JavaScript knowledge
   6
   7
   8 mctx.graph = {};
   9 mctx.graph.api = {};
  10 mctx.graph.api.sensors = mctx.api + "sensors";
  11 mctx.graph.api.actuators = mctx.api + "actuators";
  12 mctx.sensors = {};
  13 mctx.actuators = {};
  14 mctx.graph.dependent = null;
  15 mctx.graph.independent = null;
  16 mctx.graph.timer = null;
  17
  18 /**
  19  * Helper - Calculate pairs of (dependent, independent) values
  20  * Given input as (time, value) pairs for dependent and independent
  21  * Appends each value pair to the result
  22  * @returns result
  23  */
  24 function dataMerge(dependent, independent, result) {
  25
  26         var j = 0;
  27         for (var i = 0; i < dependent.length-1; ++i) {
  28                 var start = dependent[i][0];
  29                 var end = dependent[i+1][0];
  30                 var average = 0; var n = 0;
  31                 for (; j < independent.length; ++j) {
  32                         if (independent[j][0] < start)
  33                                 continue;
  34                         else if (independent[j][0] >= end)
  35                                 break;
  36                         average += independent[j][1];
  37                         n += 1;
  38                 }
  39                 if (n > 0) {
  40                         average /= n;
  41                         result.push([dependent[i][1], average]);
  42                 }
  43         }
  44         return result;
  45 }
  46
  47 /**
  48  * Helper function adds the sensors and actuators to a form
  49  */
  50 $.fn.deployDevices = function(input_type, check_first) {
  51   var formhtml = $(this).html();
  52   var formname = $(this).attr("id");
  53  // formhtml += "<i> Sensors </i>"
  54   var checked = "checked";
  55   if (!check_first)
  56     checked = "";
  57   $.each(mctx.sensors, function(key, val) {
  58     formhtml += "<input type=\""+input_type+"\" value=\""+val+"\" id=\"sensors\" name=\""+formname+"\""+checked+">" + val + "</input>";
  59     checked = "";
  60   });
  61  // formhtml += "<i> Actuators </i>"
  62   $.each(mctx.actuators, function(key, val) {
  63     formhtml += "<input type=\""+input_type+"\" value=\""+val+"\" id=\"actuators\" name=\""+formname+"\""+checked+">" + val + "</input>";
  64     checked = "";
  65   });
  66   $(this).html(formhtml);
  67 };
  68
  69 /**
  70  * Identify sensors/actuators
  71  * @returns itself (Is this right?)
  72  */
  73 $.fn.setDevices = function() {
  74         // Query for sensors and actuators
  75   var sensor_curtime = 0;
  76   var actuator_curtime = 0;
  77   return $.when(
  78         $.ajax({url : mctx.api + "?sensors"}).done(function(data) {
  79                 mctx.sensors = $.extend(mctx.sensors, data.sensors);
  80       sensor_curtime = data.running_time;
  81     }),
  82     $.ajax({url : mctx.api + "?actuators"}).done(function(data) {
  83       mctx.actuators = $.extend(mctx.actuators, data.actuators);
  84       actuator_curtime = data.running_time;
  85     })
  86   ).then(function() {
  87     $("#xaxis").deployDevices("radio", false);
  88     $("#yaxis").deployDevices("checkbox", true);
  89     var c = Math.max(actuator_curtime, sensor_curtime);
  90     $("input[name=current_time]", "#time_range").val(c);
  91
  92
  93   });
  94 };
  95
  96
  97
  98
  99 /**
 100  * Sets the graphs to graph stuff.
 101  * @returns {$.fn}
 102  */
 103 $.fn.setGraph = function () {
 104   clearTimeout(mctx.graph.timer);
 105   var sensor_url = mctx.api + "sensors";
 106   var actuator_url = mctx.api + "actuators";
 107
 108   var updateData = function(json, data) {
 109     for (var i = 0; i < json.data.length; ++i)
 110       data.push(json.data[i]);
 111     return data;
 112   };
 113   var graphdiv = this;
 114
 115
 116   // Determine which actuator/sensors to plot
 117
 118   var xaxis = $("input[name=xaxis]:checked", "#xaxis");
 119   var yaxis = $("input[name=yaxis]:checked", "#yaxis");
 120   var start_time = $("#start_time").val();
 121   var end_time = $("#end_time").val();
 122   if (!$.isNumeric(start_time)) {
 123     start_time = null;
 124   }
 125   if (!$.isNumeric(end_time)) {
 126     end_time = null;
 127   }
 128
 129   var devices = {};
 130   xaxis.each(function() {
 131     devices[$(this).val()] = {};
 132     devices[$(this).val()]["url"] = mctx.api + $(this).attr("id");
 133     devices[$(this).val()]["data"] = [];
 134     devices[$(this).val()]["start_time"] = start_time;
 135     devices[$(this).val()]["end_time"] = end_time;
 136   });
 137   yaxis.each(function() {
 138     devices[$(this).val()] = {};
 139     devices[$(this).val()]["url"] = mctx.api + $(this).attr("id");
 140     devices[$(this).val()]["data"] = [];
 141     devices[$(this).val()]["start_time"] = start_time;
 142     devices[$(this).val()]["end_time"] = end_time;
 143   });
 144
 145
 146   var updater = function () {
 147     var time_limit = 20;
 148     var responses = [];
 149     var ctime =  $("#current_time");
 150
 151
 152     $.each(devices, function(key, val) {
 153       if (devices[key].url === sensor_url || devices[key].url === actuator_url) {
 154        // alert("AJAX");
 155         //alert(key);
 156         //alert(devices[key].url);
 157         parameters = {name : key};
 158         if (start_time != null) {
 159           //alert("start_time = " + start_time);
 160           parameters = $.extend(parameters, {start_time : start_time});
 161         }
 162         if (end_time != null)
 163           parameters = $.extend(parameters, {end_time : end_time});
 164         responses.push($.ajax({url : devices[key].url, data : parameters}).done(function(json) {
 165           //alert("Hi from " + json.name);
 166           var dev = devices[json.name].data;
 167           for (var i = 0; i < json.data.length; ++i) {
 168             if (dev.length <= 0 || json.data[i][0] > dev[dev.length-1][0]) {
 169               dev.push(json.data[i]);
 170             }
 171           }
 172           ctime.val(json.running_time);
 173           //alert(devices[json.name].data);
 174         }));
 175       }
 176     });
 177
 178     //... When the response is received, then() will happen (I think?)
 179     $.when.apply(this, responses).then(function () {
 180
 181       var plot_data = [];
 182       yaxis.each(function() {
 183         //alert("Add " + $(this).val() + " to plot");
 184         if (xaxis.val() === "time") {
 185           //alert("Against time");
 186           plot_data.push(devices[$(this).val()].data);
 187         }
 188         else {
 189           var result = []
 190           dataMerge(devices[xaxis.val()].data, devices[$(this).val()].data, result);
 191           /*
 192           var astr = "[";
 193           for (var i = 0; i < result.length; ++i)
 194             astr += "[" + result[i][0] + "," + result[i][1] + "]" + ",";
 195           astr += "]";
 196           alert(astr);
 197           */
 198           plot_data.push(result);
 199         }
 200       });
 201
 202       //alert(plot_data + "");
 203       //alert("Plot happened");
 204       $.plot("#graph", plot_data);
 205       mctx.graph.timer = setTimeout(updater, 1000);
 206     }, function () {alert("Graph crashed");});
 207   };
 208
 209   updater();
 210   return this;
 211 };
 212
 213 $.fn.runButton = function() {
 214   //alert($(this).val());
 215   if ($(this).val() === "Run") {
 216     $("#graph").setGraph();
 217     $(this).val("Pause");
 218   }
 219   else {
 220     clearTimeout(mctx.graph.timer);
 221     $(this).val("Run");
 222   }
 223 };