").addClass("legend").css({position: "absolute", right: "0px", top: "0px", background: "rgba(240,240,240,0.55)"}); - var table = jQuery("").appendTo(legend); +var insertLegend = function() { + $("#legend").children().remove(); + var table = jQuery("

"); for (var i = 0; i < sensorConfigList.length; i++) { var config = sensorConfigList[i]; var row = jQuery(""); @@ -129,9 +182,9 @@ var replot = function() { table.append(row); } - legend.appendTo($("#ebusgraph")); - + $("#legend").append(table); }; + var replotOverview = function() { plotOverview.setData(datasetOverview); plotOverview.setSelection({xaxis: {"from": timeToLocal(from), "to": timeToLocal(to)}}, true); @@ -288,6 +341,7 @@ $("#overview").bind("plotselected", function (event, ranges) { update_range(range_from, range_to); }); +insertLegend(); $.each(sensorConfigList, function(i,sensorConfig) { //var pickerDiv = $("

").addClass("picker").appendTo("#sensorpicker"); //var pickerCheckbox = $("").attr("type","checkbox").appendTo(pickerDiv); 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 = $("

").addClass("picker").appendTo("#sensorpicker"); + var pickerCheckbox = $("").attr("type","checkbox").appendTo(pickerDiv); + pickerCheckbox.data("name", sensorConfig["name"]); + + $("").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); + } +}); + +}); -- cgit v1.2.1