updated web interface

1 files changed, 296 insertions, 0 deletions

diff --git a/datastore-leveldb/wwwroot_ebus/src/ebus_debug.js b/datastore-leveldb/wwwroot_ebus/src/ebus_debug.js
new file mode 100644
index 0000000..6e118da
--- /dev/null
+++ b/datastore-leveldb/wwwroot_ebus/src/ebus_debug.js
@@ -0,0 +1,296 @@
+// vim: set filetype=javascript expandtab tabstop=4 shiftwidth=4 autoindent smartindent:
+var d = new Object();
+d.ms = 1;
+d.sec = 1000*d.ms;
+d.min = 60 * d.sec;
+d.hour = 60 * d.min;
+d.day = 24 * d.hour;
+d.week = 7 * d.day;
+d.month = 30.5 * d.day;
+d.now = new Date().getTime();
+
+var timeToUTC = function(d) { return d + new Date().getTimezoneOffset() * 60 * 1000; }
+var timeToLocal = function(d) { return d - new Date().getTimezoneOffset() * 60 * 1000; }
+
+$(document).ready(function(){
+    var from = d.now - 2*d.day;
+    var to = d.now;
+    var fromOverview = d.now - 1.5 * d.month;
+    var toOverview = d.now;
+    var numberOfValues = jQuery("#ebusgraph").width();
+
+    var datasetDetail = [];
+    var datasetOverview = [];
+
+    var plotOverview = null;
+    var plotDetail = null;
+    var indexFound = null;
+    var sensorConfigList = [
+{
+    "name":"heizkreisregler10.betriebsdatenRegler1.kesselTemperatur",
+    "description":"Kessel Temperatur",
+    "values":Math.ceil(jQuery("#ebusgraph").width()/8),
+    "lines":{fill: true, fillColor: "rgba(80,40,100, 0.1)"},
+    "show":true, 
+    "color":"rgb(80,40,100)"
+},
+{
+    "name":"heizkreisregler9.solarDaten.tempKollektor",
+    "description":"Kollektortemperatur",
+    "lines":{fill: true, fillColor: "rgba(255, 0, 0, 0.4)"},
+    "values":Math.ceil(jQuery("#ebusgraph").width()/1),
+    "show":true, 
+    "color":"#f30000"
+},
+{
+    "name":"heizkreisregler9.solarDaten.tempWarmwasserSolar",
+    "description":"Warmwasser Solar",
+    "lines":{fill: true, fillColor: "rgba(30,250,20,0.05)"},
+    "values":Math.ceil(jQuery("#ebusgraph").width()/8),
+    "show":true, 
+    "color":"rgba(30,250,20,0.5)"
+},
+{
+    "name":"feuerungsautomat1.betriebsdatenRegler1.aussenTemperatur",
+    "description":"Aussentemperatur (ebus)",
+    "values":Math.ceil(jQuery("#ebusgraph").width()/4),
+    "show":true, 
+    "lines":{fill: true, fillColor: "rgba(250, 250, 0, 0.2)"},
+    "color":"rgb(250,250,0)"
+},
+{
+    "name":"dockstar.load5",
+    "description":"System Load (5m, *10)",
+    "lines":{lineWidth:1},
+    "show":false,
+    "color":"blue",
+    "mapFunc":function(d){return [d[0],d[1]*10]}
+},
+{
+    "name":"dockstar.fs.ROOT",
+    "description":"Rootfs free percent",
+    "values":Math.ceil(jQuery("#ebusgraph").width()/16),
+    "show":false,
+    "color":"red"
+},
+{
+    "name":"heizkreisregler10.betriebsdatenRegler1.boilerTemperatur",
+    "description":"Boilertemperatur",
+    "values":Math.ceil(jQuery("#ebusgraph").width()/8),
+    "show":false,
+    "color":"#48b4ff"
+},
+{
+    "name":"de.wettermichel.temperature",
+    "description":"Aussentemperatur (wettermichel)",
+    "show":false,
+    "values":Math.ceil(jQuery("#ebusgraph").width()/16),
+    "lines":{fill: true, fillColor: "rgba(132, 181, 0, 0.2)"},
+    "color":"#84b500"
+},
+    ];
+
+var pickSensorConfig = function(sensorname) {
+    var sensorConfigFound;
+    $.each(sensorConfigList, function(i,sensorConfig) {
+        if (sensorConfig["name"] == sensorname) {
+            sensorConfigFound = sensorConfig;
+            return false;
+        }
+    });
+    return sensorConfigFound;
+}
+var replot = function() {
+    plotDetail.setData(datasetDetail);
+    plotDetail.getOptions().xaxes[0].min = timeToLocal(from);
+    plotDetail.getOptions().xaxes[0].max = timeToLocal(to);
+    plotDetail.setupGrid();
+    plotDetail.draw();
+};
+var replotOverview = function() {
+    plotOverview.setData(datasetOverview);
+    plotOverview.setSelection({xaxis: {"from": timeToLocal(from), "to": timeToLocal(to)}}, true);
+    plotOverview.setupGrid();
+    plotOverview.draw();
+};
+var plotSensor = function(sensorConfig) {
+    plotSensorDetail(sensorConfig);
+    plotSensorOverview(sensorConfig);
+};
+var unplotSensor = function(sensorname) {
+    unplotSensorDetail(sensorname);
+    unplotSensorOverview(sensorname);
+};
+var plotSensorDetail = function(sensorConfig) {
+    jQuery("#ebusgraph").animate({opacity:0.2}, 200);
+    var values = sensorConfig.values || numberOfValues;
+    $.getJSON("/api/range/"+escape(sensorConfig["name"])+"/"+from+"/"+to+"/" + values,
+            function(response) {
+                if (!response.error) {
+                    response.data = response.data.map(function(d) {
+                        return [ timeToLocal(d[0]), d[1] ]; 
+                    });
+                    if (sensorConfig.mapFunc) {
+                        response.data = response.data.map( sensorConfig.mapFunc )
+                    }
+                    datasetDetail.push({"data":response["data"],
+                        "userData":sensorConfig["name"],
+                        "lines":sensorConfig.lines || {},
+                        "label":sensorConfig.description,
+                        "color":sensorConfig.color});
+
+                    jQuery("#ebusgraph").animate({opacity:1.0}, 200);
+                    replot();
+                } else {
+                    jQuery("#ebusgraph").animate({backgroundColor: "lightRed"},200);
+                    alert("Fehler: " + response["error"]);
+                }
+            }).fail(function(a) {
+                jQuery("#ebusgraph").animate({backgroundColor: "lightRed"},200);
+            });
+};
+
+var unplotSensorDetail = function(sensorname) {
+    $.each(datasetDetail, function(i, sensor) {
+        if (sensor["userData"] == sensorname) {
+            datasetDetail.splice(i,1);
+            replot();
+            return false;
+        }
+    });   
+};
+
+var plotSensorOverview = function(sensorConfig) {
+    var values = sensorConfig.values || Math.ceil(numberOfValues/2);
+    $.getJSON("api/range/"+escape(sensorConfig["name"])+"/"+fromOverview+"/"+toOverview+ "/" + values,
+            function(response) {
+                if (!response.error) {
+                    response.data = response.data.map(function(d) { 
+                        return [ timeToLocal(d[0]), d[1] ]; 
+                    });
+                    if (sensorConfig.mapFunc) {
+                        response.data = response.data.map( sensorConfig.mapFunc)
+                    }
+                    datasetOverview.push({"data":response["data"],
+                        "userData":sensorConfig["name"],
+                        "label":sensorConfig["name"],
+                        "color":sensorConfig.color});
+                    replotOverview();
+                } else {
+                    alert("Overview Fehler: " + response["error"]);
+                }
+            });
+
+};
+var unplotSensorOverview = function(sensorname) {
+    $.each(datasetOverview, function(i, sensor) {
+        if (sensor["userData"] == sensorname) {
+            datasetOverview.splice(i,1);
+            replotOverview();
+            return false;
+        }
+    });
+}
+
+
+plotDetail = $.plot($("#ebusgraph"), 
+        datasetDetail, 
+        { 
+           xaxis: { 
+               mode: "time", 
+           min: timeToLocal(from), 
+           max:timeToLocal(to),
+           panRange: [timeToLocal(fromOverview), timeToLocal(toOverview)]
+           },
+           yaxis: { min: -16, max: 100, panRange: [-16,100] },
+                    pan: {
+                        interactive: true,
+           frameRate: 16,
+           cursor:"move"
+                },
+           legend: { show : true}
+        });
+$("#ebusgraph").bind('plotpan', function (event, plot) {
+    var axes = plot.getAxes();
+    plotOverview.setSelection({xaxis: {"from": Math.round(axes.xaxis.min), "to": Math.round(axes.xaxis.max)}}, true);
+    if (plot.getPlaceholder().css('cursor') == "move")
+        return;
+    // On drag end:
+    update_range(Math.round(axes.xaxis.min), Math.round(axes.xaxis.max));
+});
+
+plotOverview = $.plot($("#overview"),
+        datasetOverview,
+        { // options
+            series: {
+                lines: { show: true, lineWidth: 1 },
+             shadowSize: 0
+            },
+             xaxis: { mode: "time", min: timeToLocal(fromOverview), max:timeToLocal(toOverview)},
+             yaxis: { ticks: [], min: -26, max: 100, autoscaleMargin: 0.1 },
+             legend: { show: false },
+             selection: { mode: "x" }
+        });
+
+function update_range(range_from, range_to) {
+    if (timeToUTC(range_to) == to && timeToUTC(range_from) == from) {
+        return;
+    }
+    // max selection range 
+    if (range_to - range_from > 4*d.month) {
+        // reset selection
+        plotOverview.setSelection({xaxis: {"from": from, "to": to}}, true);
+        return;
+    } else {
+        from = timeToUTC(range_from);
+        to = timeToUTC(range_to);
+    }
+    sensors = [];
+    for (elem in datasetOverview) {
+        sensor = datasetDetail[elem]["userData"];
+        sensors.push(sensor);
+    }
+    datasetDetail =[];
+    for (i in sensors) {
+        plotSensorDetail(pickSensorConfig(sensors[i]));
+    }
+}
+
+$("#overview").bind("plotselected", function (event, ranges) {
+    var range_from = Math.round(ranges.xaxis.from);
+    var range_to = Math.round(ranges.xaxis.to);
+    update_range(range_from, range_to);
+});
+
+$.each(sensorConfigList, function(i,sensorConfig) {
+    var pickerDiv = $("<div>").addClass("picker").appendTo("#sensorpicker");
+    var pickerCheckbox = $("<input>").attr("type","checkbox").appendTo(pickerDiv);
+    pickerCheckbox.data("name", sensorConfig["name"]);
+
+    $("<span>").text( sensorConfig.description + " (" + sensorConfig.sensorname + ")").appendTo(pickerDiv);
+
+    if (sensorConfig.show) {
+        //Plot
+        plotSensor(sensorConfig);
+        $(pickerCheckbox).attr("checked","checked");
+    }
+});
+
+
+function printDetail(
+
+
+// TODO http://people.iola.dk/olau/flot/examples/annotating.html
+
+
+$(".picker input").click( function() {
+    var sensorname = $(this).data("name");
+    if ($(this).is(":checked")) {
+        if (typeof console != "undefined") console.log(sensorname);
+        plotSensor(pickSensorConfig(sensorname));
+    } else {
+        unplotSensor(sensorname);
+    }
+});
+
+});