hdf support

1 files changed, 120 insertions, 0 deletions

diff --git a/ebus/webhdf/static/src/d3.control.js b/ebus/webhdf/static/src/d3.control.js
new file mode 100644
index 0000000..489edea
--- /dev/null
+++ b/ebus/webhdf/static/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);
+};