summaryrefslogtreecommitdiff
path: root/datastore-leveldb/wwwroot/public/src
diff options
context:
space:
mode:
authorYves Fischer <yvesf-git@xapek.org>2013-04-18 02:01:04 +0200
committerYves Fischer <yvesf-git@xapek.org>2013-04-18 02:01:04 +0200
commitbe1f8059cc901e0bb43b35d85767f03310aee4f9 (patch)
tree25b6259cac35113894c94d5906f6c0fc331f4a8d /datastore-leveldb/wwwroot/public/src
parent3a996c7e34b397f8b03262532d022424b372ec8e (diff)
downloadebus-alt-be1f8059cc901e0bb43b35d85767f03310aee4f9.tar.gz
ebus-alt-be1f8059cc901e0bb43b35d85767f03310aee4f9.zip
leveldb: mongoose
Diffstat (limited to 'datastore-leveldb/wwwroot/public/src')
-rw-r--r--datastore-leveldb/wwwroot/public/src/d3.control.js120
-rw-r--r--datastore-leveldb/wwwroot/public/src/d3.plot.js99
-rw-r--r--datastore-leveldb/wwwroot/public/src/ebus.js231
3 files changed, 450 insertions, 0 deletions
diff --git a/datastore-leveldb/wwwroot/public/src/d3.control.js b/datastore-leveldb/wwwroot/public/src/d3.control.js
new file mode 100644
index 0000000..489edea
--- /dev/null
+++ b/datastore-leveldb/wwwroot/public/src/d3.control.js
@@ -0,0 +1,120 @@
+var d3_control = function(element, svgurl, mapping) {
+ this.mapping = mapping;
+ this.element = element;
+ var control = this;
+ d3.xml(svgurl, "image/svg+xml", function(xml) {
+ element[0][0].appendChild(xml.documentElement);
+ element.select("svg")
+ .style("width","100%").style("height", "100%");
+
+ // Setup mapping
+ for (var element_id in this.mapping) {
+ control.initElement(element_id);
+ }
+ d3.json("../all_values", function(response) {
+ control.process(response.data);
+ control.reload(response.time_stop);
+ });
+ });
+};
+
+d3_control.prototype = {
+ initElement:function(element_id) {
+ var options = this.mapping[element_id];
+ d3.select(document.getElementById(element_id))
+ .on("mouseover",
+ function() {
+ if( typeof(options._plot) == "undefined") {
+ options._plot = d3.select(this.ownerSVGElement)
+ .append("svg:g")
+ .classed("d3.control_popup", true);
+
+ var startdate = (new Date().getTime()/1000) - 7*60*60*24;
+ var enddate = (new Date().getTime()/1000);
+ var plot = d3.plot(options._plot);
+ d3.json("../sensor/"+options.sensor+"/" + startdate + "/" + enddate,
+ function(resp) {
+ var data = resp.data.map(function(d) {
+ return [new Date(d[0]), d[1]];
+ });
+ plot.draw(data);
+ });
+
+ options._plot.on("mouseout",
+ function() {
+ if (options._plot.node().contains(d3.event.relatedTarget))
+ return;
+ options._plot
+ .transition()
+ .duration(1000)
+ .style("opacity", 0.0)
+ .remove();
+ });
+
+ var drag = d3.behavior.drag()
+ .on("dragstart", function() {
+ options._plot.on("mouseout", null);
+ options._plot.transition().duration(1000).style("opacity", 1.0);
+
+ delete options._plot;
+ d3.select(this).select("rect")
+ .style("stroke", "gray")
+ .style("stroke-width", "3px");
+ })
+ .on("drag", function(d,i){
+ d=[];
+ d.x = d3.event.x;
+ d.y = d3.event.y;
+ d3.select(this).attr("transform", "translate("+d.x+","+d.y+")");
+ })
+ .on("dragend", function() {
+ d3.select(this).on("mousedown.drag", null);
+ d3.select(this).on("click", function() { d3.select(this).remove(); });
+ });
+
+ options._plot.call(drag);
+ } else {
+ this.ownerSVGElement
+ .appendChild(options._plot.node());
+
+ options._plot.style("opacity", 1);
+ }
+
+ var xy = d3.svg.mouse(this.ownerSVGElement);
+ options._plot.attr("transform", "translate("+xy[0]+","+xy[1]+")");
+ });
+ },
+ process:function(data) {
+ for (var i in data) {
+ var row = data[i];
+
+ if (typeof(console) != "undefined") {
+ console.log("[" + d3.format("02d")(row.timestamp) + "] " +
+ row.name + " Value: " + row.value_real + " - " +
+ row.value_string);
+ }
+
+ for (var element_id in this.mapping) {
+ var options = this.mapping[element_id];
+ if (row.name == options.sensor){
+ d3.select(document.getElementById(element_id))
+ .text(""+row.value_real);
+ }
+ }
+ }
+ },
+ reload:function(time_stop) {
+ var url = "../stream";
+ if (time_stop != null)
+ url += "/" + time_stop;
+ var control = this;
+ d3.json(url, function(response) {
+ control.process(response.data);
+ control.reload(response.time_stop);
+ });
+ }
+};
+
+d3.control = function(element, svgurl, mapping) {
+ return new d3_control(element,svgurl,mapping);
+};
diff --git a/datastore-leveldb/wwwroot/public/src/d3.plot.js b/datastore-leveldb/wwwroot/public/src/d3.plot.js
new file mode 100644
index 0000000..d9a7d04
--- /dev/null
+++ b/datastore-leveldb/wwwroot/public/src/d3.plot.js
@@ -0,0 +1,99 @@
+(function(){
+
+function d3_plot(container) {
+ this.opt = {
+ w:550, h:200, margin:30
+ };
+ this.element = container.append("svg:g")
+ .classed("d3.plot_plot",true)
+ .attr("width", this.opt.w)
+ .attr("height", this.opt.h);
+
+ this.element.append("svg:rect")
+ .attr("width", this.opt.w)
+ .attr("height", this.opt.h)
+ .style("fill", "white");
+
+ this.element.append("svg:text")
+ .classed("d3-plot_wait", true)
+ .attr("x", this.opt.w/2)
+ .attr("y", this.opt.h/2)
+ .attr("text-anchor", "center")
+ .text("Bitte warten");
+};
+
+d3_plot.prototype = {
+ draw: function(data) {
+ var x_min = d3.min(data, function(d){return d[0];}),
+ x_max = d3.max(data, function(d){return d[0];}),
+ y_min = d3.min(data, function(d){return d[1];}),
+ y_max = d3.max(data, function(d){return d[1];});
+
+ var x = d3.time.scale()
+ .domain([x_min, x_max])
+ .range([0+this.opt.margin, this.opt.w-this.opt.margin]);
+
+ var y = d3.scale.linear()
+ .domain([y_min, y_max])
+ .range([0+this.opt.margin, this.opt.h-(this.opt.margin/2)]);
+
+
+ var g = this.element.append("svg:g")
+ .attr("transform", "translate(0, "+this.opt.h+")");
+
+ var line = d3.svg.line()
+ .x(function(d,i){ return x(d[0]); })
+ .y(function(d) {return -1*y(d[1]);});
+
+ g.append("svg:path")
+ .attr("d", line(data));
+
+ // Axes X-Line
+ g.append("svg:line")
+ .attr("x1", 0)
+ .attr("y1", -1*y(y_min))
+ .attr("x2", x(x_max))
+ .attr("y2", -1 * y(y_min));
+
+
+ // Tick Labels
+ var tick_format = d3.time.format("%d.%m");
+ g.selectAll(".xlabel")
+ .data(x.ticks(5)).enter()
+ .append("svg:text")
+ .text(function(d){return tick_format(d);})
+ .attr("x", function(d) {return x(d);})
+ .attr("y", -5)
+ .attr("text-anchor", "center");
+
+ g.selectAll(".ylabel")
+ .data(y.ticks(5)).enter()
+ .append("svg:text")
+ .text(String)
+ .attr("x", 0)
+ .attr("y", function(d) {return -1*y(d);})
+ .attr("text-anchor", "right");
+
+ // X-Lines
+ g.selectAll(".xlines")
+ .data(x.ticks(5)).enter()
+ .append("svg:line")
+ .style("fill", "none")
+ .style("stroke", "#000000")
+ .style("stroke-width", 0.5)
+ .style("stroke-dasharray", "6,1")
+ .attr("x1", function(d){return x(d);})
+ .attr("y1", -1*y(y_min)+(this.opt.margin/3))
+ .attr("x2", function(d){return x(d);})
+ .attr("y2", -1*y(y_max));
+
+ //
+ this.element.select(".d3-plot_wait").style("display","none");
+ }
+};
+
+d3.plot = function(container) {
+ return new d3_plot(container);
+};
+
+})(); \ No newline at end of file
diff --git a/datastore-leveldb/wwwroot/public/src/ebus.js b/datastore-leveldb/wwwroot/public/src/ebus.js
new file mode 100644
index 0000000..27802a9
--- /dev/null
+++ b/datastore-leveldb/wwwroot/public/src/ebus.js
@@ -0,0 +1,231 @@
+// vim: autoindent tabstop=4 shiftwidth=4 expandtab softtabstop=4 filetype=javascript
+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 - 1*d.day;
+ var to = d.now;
+ var fromOverview = d.now - 30*d.day;
+ var toOverview = d.now;
+ var datasetDetail = []
+ var datasetOverview = [];
+ var plotOverview = null;
+ var plotDetail = null;
+ var indexFound = null;
+ var sensorConfigList = [
+ {"sensorname":"heizkreisregler9.solarDaten.tempKollektor",
+ "description":"Kollektortemperatur",
+ "show":true,
+ "color":"#f30000"},
+ {"sensorname":"heizkreisregler10.betriebsdatenRegler1.kesselTemperatur",
+ "description":"Kessel Temperatur",
+ "show":true,
+ "color":"#283074"},
+ {"sensorname":"heizkreisregler9.solarDaten.tempWarmwasserSolar",
+ "description":"Warmwasser Solar",
+ "show":false,
+ "color":"#f0ff4c"},
+ {"sensorname":"feuerungsautomat1.betriebsdatenRegler1.aussenTemperatur",
+ "description":"Aussentemperatur",
+ "show":false,
+ "color":"#84b500"},
+ {"sensorname":"dockstar.load1",
+ "description":"System Load (1m, *10)",
+ "show":false,
+ "color":"blue",
+ "mapFunc":function(d){return [d[0],d[1]*10]}},
+ {"sensorname":"dockstar.load5",
+ "description":"System Load (5m, *10)",
+ "show":false,
+ "color":"blue",
+ "mapFunc":function(d){return [d[0],d[1]*10]}},
+ {"sensorname":"dockstar.diskfree.rootfs",
+ "description":"Rootfs free percent",
+ "show":false,
+ "color":"red"},
+ {"sensorname":"heizkreisregler10.betriebsdatenRegler1.boilerTemperatur",
+ "description":"Boilertemperatur",
+ "show":true,
+ "color":"#48b4ff"},
+ {"sensorname":"feuerungsautomat1.betriebsdatenRegler1.kesselTemperatur",
+ "description":"Kesseltemperatur",
+ "show":false,
+ "color":"blue"},
+ {"sensorname":"de.wettermichel.temperature",
+ "description":"Aussentemperatur",
+ "show":true,
+ "color":"yellow"},
+ {"sensorname":"yves.laserjet.tonerstatus",
+ "description":"Fuellstand Toner %",
+ "show":true,
+ "color":"black"}
+ ];
+
+ var pickSensorConfig = function(sensorname) {
+ var sensorConfigFound;
+ $.each(sensorConfigList, function(i,sensorConfig) {
+ if (sensorConfig.sensorname == sensorname) {
+ sensorConfigFound = sensorConfig;
+ return false;
+ }
+ });
+ return sensorConfigFound;
+ }
+ var replot = function() {
+ plotDetail = $.plot($("#ebusgraph"),
+ datasetDetail,
+ {
+ xaxis: { mode: "time", min: timeToUTC(from), max:timeToUTC(to) },
+ yaxis: { min: -16, max: 100 },
+ legend: { show : true}
+ });
+ };
+ var replotOverview = function() {
+ if (plotOverview == null) {
+ plotOverview = $.plot($("#overview"),
+ datasetOverview,
+ { // options
+ series: {
+ lines: { show: true, lineWidth: 1 },
+ shadowSize: 0
+ },
+ xaxis: { mode: "time", min: timeToUTC(fromOverview), max:timeToUTC(toOverview) },
+ yaxis: { ticks: [], min: -26, max: 100, autoscaleMargin: 0.1 },
+ legend: { show: false },
+ selection: { mode: "x" }
+ });
+ } else {
+ plotOverview.setData(datasetOverview);
+ plotOverview.draw();
+ }
+ plotOverview.setSelection({xaxis: {'from': from, 'to': to}}, true);
+ };
+ var plotSensor = function(sensorConfig) {
+ plotSensorDetail(sensorConfig);
+ plotSensorOverview(sensorConfig);
+ };
+ var unplotSensor = function(sensorname) {
+ unplotSensorDetail(sensorname);
+ unplotSensorOverview(sensorname);
+ };
+ var plotSensorDetail = function(sensorConfig) {
+ $.getJSON("sensor/"+escape(sensorConfig.sensorname)+"/"+timeToLocal(from)+"/"+timeToLocal(to),
+ function(response) {
+ if (!response.error) {
+ response.data = response.data.map(function(d) {
+ return [ timeToUTC(d[0]), d[1] ];
+ });
+ if (sensorConfig.mapFunc) {
+ response.data = response.data.map( sensorConfig.mapFunc )
+ }
+ datasetDetail.push({'data':response['data'],
+ 'userData':sensorConfig.sensorname,
+ 'label':sensorConfig.description,
+ 'color':sensorConfig.color});
+ replot();
+ } else {
+ alert("Fehler: " + response["error"]);
+ }
+ });
+ };
+
+ var unplotSensorDetail = function(sensorname) {
+ $.each(datasetDetail, function(i, sensor) {
+ if (sensor.userData == sensorname) {
+ datasetDetail.splice(i,1);
+ replot();
+ return false;
+ }
+ });
+ };
+
+ var plotSensorOverview = function(sensorConfig) {
+ $.getJSON("avg/"+escape(sensorConfig.sensorname)+"/"+timeToLocal(fromOverview)+"/"+timeToLocal(toOverview),
+ function(response) {
+ if (!response.error) {
+ response.data = response.data.map(function(d) {
+ return [ timeToUTC(d[0]), d[1] ];
+ });
+ if (sensorConfig.mapFunc) {
+ response.data = response.data.map( sensorConfig.mapFunc)
+ }
+ datasetOverview.push({'data':response['data'],
+ 'label':sensorConfig.sensorname,
+ 'color':sensorConfig.color});
+ replotOverview();
+ } else {
+ alert("Overview Fehler: " + response["error"]);
+ }
+ });
+
+ };
+ var unplotSensorOverview = function(sensorname) {
+ $.each(datasetOverview, function(i, sensor) {
+ if (sensor.label == sensorname) {
+ datasetOverview.splice(i,1);
+ replotOverview();
+ return false;
+ }
+ });
+ }
+
+ $("#overview").bind("plotselected", function (event, ranges) {
+ range_from = Math.round(ranges.xaxis.from);
+ range_to = Math.round(ranges.xaxis.to);
+ // max selection range
+ if (range_to - range_from > d.month) {
+ // reset selection
+ plotOverview.setSelection({xaxis: {'from': from, 'to': to}}, true);
+ return;
+ } else {
+ from = timeToLocal( range_from );
+ to = timeToLocal( range_to );
+ }
+ sensors = [];
+ for (elem in datasetOverview) {
+ sensor = datasetDetail[elem]["userData"];
+ sensors.push(sensor);
+ }
+ datasetDetail =[];
+ for (i in sensors) {
+ plotSensorDetail(pickSensorConfig(sensors[i]));
+ }
+ });
+
+ $.each(sensorConfigList, function(i,sensorConfig) {
+ var pickerDiv = $("<div>").attr("id","pick_"+sensorConfig.sensorname.replace(/\./g,"_"))
+ .addClass("picker")
+ .appendTo("#sensorpicker");
+
+ var pickerCheckbox = $("<input>").attr("type","checkbox")
+ .appendTo(pickerDiv);
+ pickerDiv.append($("<span>").text( sensorConfig.description + " (" + sensorConfig.sensorname + ")") );
+ if (sensorConfig.show) {
+ //Plot
+ plotSensor(sensorConfig);
+ $(pickerCheckbox).attr("checked","checked");
+ }
+ });
+ // TODO http://people.iola.dk/olau/flot/examples/annotating.html
+
+
+ $('.picker input').click( function() {
+ var sensorname = $(this).parent().attr("id").replace("pick_","").replace(/_/g,".");
+ if ($(this).is(":checked")) {
+ if (typeof console != "undefined") console.log(sensorname);
+ plotSensor(pickSensorConfig(sensorname));
+ } else {
+ unplotSensor(sensorname);
+ }
+ });
+});