From ced20d7fc3ee98005ea8a2d09d2a0d99361ff0a4 Mon Sep 17 00:00:00 2001
From: Ebus-at-dockstar <ebus@dockstar>
Date: Thu, 18 Sep 2014 18:01:01 +0200
Subject: add /api/list

---
 datastore-leveldb/wwwroot_ebus/css/stylesheet.css |  10 +-
 datastore-leveldb/wwwroot_ebus/src/ebus.js        | 123 +++++++++-------------
 2 files changed, 55 insertions(+), 78 deletions(-)

(limited to 'datastore-leveldb/wwwroot_ebus')

diff --git a/datastore-leveldb/wwwroot_ebus/css/stylesheet.css b/datastore-leveldb/wwwroot_ebus/css/stylesheet.css
index 1031054..9166d34 100644
--- a/datastore-leveldb/wwwroot_ebus/css/stylesheet.css
+++ b/datastore-leveldb/wwwroot_ebus/css/stylesheet.css
@@ -6,19 +6,23 @@ body {
 	position: absolute;
 	height: calc(100% - 160px);
 	top: 2px;
-	left: 5px;
-	right: 30px;
+	left: 10px;
+	right: 45px;
 }
 
 #legend {
 	position: absolute;
 	height: 150px;
 	overflow-y: scroll;
-	right: 10px;
+	left: 40px;
 	top: 10px;
 	background: rgba(240,240,240,0.55);
 }
 
+#legend select {
+	width: 160px;
+}
+
 #overview {
 	position: absolute;
 	top: calc(100% - 150px);
diff --git a/datastore-leveldb/wwwroot_ebus/src/ebus.js b/datastore-leveldb/wwwroot_ebus/src/ebus.js
index a76c62e..fae08cd 100644
--- a/datastore-leveldb/wwwroot_ebus/src/ebus.js
+++ b/datastore-leveldb/wwwroot_ebus/src/ebus.js
@@ -17,7 +17,7 @@ $(document).ready(function(){
     var to = d.now;
     var fromOverview = d.now - 1.5 * d.month;
     var toOverview = d.now;
-    var numberOfValues = jQuery("#ebusgraph").width();
+    var numberOfValues = function() { return jQuery("#ebusgraph").width(); };
 
     var datasetDetail = [];
     var datasetOverview = [];
@@ -25,11 +25,11 @@ $(document).ready(function(){
     var plotOverview = null;
     var plotDetail = null;
     var indexFound = null;
-    var sensorConfigList = [
+    var defaultSensorConfigList = [
 {
     "name":"heizkreisregler10.betriebsdatenRegler1.kesselTemperatur",
     "description":"Kessel Temperatur",
-    "values":Math.ceil(jQuery("#ebusgraph").width()/8),
+    "values":Math.ceil(jQuery("#ebusgraph").width()/6),
     "lines":{fill: true, lineWidth: 1, fillColor: "rgba(80,40,100, 0.05)"},
     "show":true, 
     "color":"rgb(80,40,100)"
@@ -50,14 +50,6 @@ $(document).ready(function(){
     "show":false, 
     "color":"rgba(252,133,34,0.5)"
 },
-{
-    "name":"feuerungsautomat1.betriebsdatenRegler1.aussenTemperatur",
-    "description":"Aussentemperatur (ebus)",
-    "values":Math.ceil(jQuery("#ebusgraph").width()/4),
-    "show":false, 
-    "lines":{fill: true, fillColor: "rgba(250, 250, 0, 0.2)"},
-    "color":"rgb(250,250,0)"
-},
 {
     "name":"heizkreisregler10.betriebsdatenRegler1.boilerTemperatur",
     "description":"Boilertemperatur",
@@ -69,42 +61,10 @@ $(document).ready(function(){
     "name":"de.wettermichel.temperature",
     "description":"Temperatur (Celsius) (wettermichel)",
     "show":false,
-    "values":Math.ceil(jQuery("#ebusgraph").width()/16),
+    "values":Math.ceil(jQuery("#ebusgraph").width()/4),
     "lines":{fill: true, fillColor: "rgba(132, 181, 0, 0.2)"},
     "color":"#84b500"
 },
-{
-    "name":"de.wettermichel.rainToday",
-    "description": "Regen heute (mm) (wettermichel)",
-    "show":false,
-    "values":Math.ceil(jQuery("#ebusgraph").width()/16),
-    "lines":{fill: true, fillColor: "rgba(10, 18, 250, 0.2)"},
-    "color":"blue"
-},
-{
-    "name":"de.wettermichel.humidity",
-    "description": "Luftfeuchtigkeit (%) (wettermichel)",
-    "show": false,
-    "values":Math.ceil(jQuery("#ebusgraph").width()/8),
-    "lines":{fill: false, lineWidth:1},
-    "color":"rgb(100,100,200)"
-},
-{
-    "name":"adsl.in.percent",
-    "description": "ADSL In/Download",
-    "show":false,
-    "values":Math.ceil(jQuery("#ebusgraph").width()/8),
-    "lines":{fill: false, lineWidth:1},
-    "color":"black",
-},
-{
-    "name":"adsl.out.percent",
-    "description": "ADSL Out/Upload",
-    "show":false,
-    "values":Math.ceil(jQuery("#ebusgraph").width()/8),
-    "lines":{fill: false, lineWidth:1},
-    "color":"gray",
-},
 {
     "name":"dockstar.load5",
     "description":"System Load (5m, *10)",
@@ -113,20 +73,6 @@ $(document).ready(function(){
     "color":"blue",
     "mapFunc":function(d){return [d[0],d[1]*10]}
 },
-{
-    "name":"dockstar.fs.ROOT",
-    "description":"Filesystem / Free (%)",
-    "lines":{lineWidth:1},
-    "show":false,
-    "color":"black",
-},
-{
-    "name":"yves.laserjet.tonerstatus",
-    "description":"Yves Tonerstatus (%)",
-    "lines":{lineWidth:1},
-    "show":false,
-    "color":"black",
-},
 {
     "name":"dockstar.internet.latency_ns",
     "description":"Internet latency in ms",
@@ -136,6 +82,7 @@ $(document).ready(function(){
     "mapFunc":function(d){return [d[0],d[1]/1000/1000]}
 },
     ];
+    var sensorConfigList = JSON.parse(window.localStorage.getItem("ebusConfig")) || defaultSensorConfigList;
 
 var pickSensorConfig = function(sensorname) {
     var sensorConfigFound;
@@ -155,7 +102,7 @@ var replot = function() {
     plotDetail.draw();
 }
 
-var insertLegend = function() {
+var redrawLegend = function() {
     $("#legend").children().remove();
     var table = jQuery("<table>");
     for (var i = 0; i < sensorConfigList.length; i++) {
@@ -182,6 +129,32 @@ var insertLegend = function() {
 
         table.append(row);
     }
+    $("#legend").append($("<button>").text("Reset").click(function(){
+        sensorConfigList = defaultSensorConfigList;
+        init();
+    }));
+    var select = jQuery("<select>");
+    $("#legend").append(select);
+    jQuery.getJSON("/api/list", function(list) {
+        list.sort();
+        for (var i in list) {
+            jQuery("<option>").attr("value", list[i]).text(list[i]).appendTo(select);
+        }
+    });
+    $("#legend").append($("<button>").text("Add").click(function(){
+        var name = select.val();
+        var namePath = name.split(".");
+        var desc = window.prompt("Beschreibung des Datensatzes", namePath[namePath.length-1]);
+        var config = { "name":name,
+            "description": desc,
+        "show":true,
+        "lines": {fill: false, lineWidth:1},
+        "color":"gray",
+        };
+        sensorConfigList.push(config);
+        redrawLegend();
+        plotSensor(config);
+    }));
     $("#legend").append(table);
 };
 
@@ -192,16 +165,18 @@ var replotOverview = function() {
     plotOverview.draw();
 };
 var plotSensor = function(sensorConfig) {
+    window.localStorage.setItem("ebusConfig", JSON.stringify(sensorConfigList));
     plotSensorDetail(sensorConfig);
     plotSensorOverview(sensorConfig);
 };
 var unplotSensor = function(sensorname) {
+    window.localStorage.setItem("ebusConfig", JSON.stringify(sensorConfigList));
     unplotSensorDetail(sensorname);
     unplotSensorOverview(sensorname);
 };
 var plotSensorDetail = function(sensorConfig) {
     jQuery("#ebusgraph").animate({opacity:0.2}, 200);
-    var values = sensorConfig.values || numberOfValues;
+    var values = sensorConfig.values || plotDetail.width();
     $.getJSON("/api/range/"+escape(sensorConfig["name"])+"/"+from+"/"+to+"/" + values,
             function(response) {
                 if (!response.error) {
@@ -239,7 +214,7 @@ var unplotSensorDetail = function(sensorname) {
 };
 
 var plotSensorOverview = function(sensorConfig) {
-    var values = sensorConfig.values || Math.ceil(numberOfValues/2);
+    var values = sensorConfig.values || plotOverview.width();
     $.getJSON("api/range/"+escape(sensorConfig["name"])+"/"+fromOverview+"/"+toOverview+ "/" + values,
             function(response) {
                 if (!response.error) {
@@ -341,20 +316,18 @@ $("#overview").bind("plotselected", function (event, ranges) {
     update_range(range_from, range_to);
 });
 
-insertLegend();
-$.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);
+var init = function() {
+    redrawLegend();
+    datasetDetail = [];
+    datasetOverview = [];
+    $.each(sensorConfigList, function(i,sensorConfig) {
+        if (sensorConfig.show) {
+            //Plot
+            plotSensor(sensorConfig);
+        }
+    });
+}
+init();
 
-    if (sensorConfig.show) {
-        //Plot
-        plotSensor(sensorConfig);
-        //$(pickerCheckbox).attr("checked","checked");
-    }
-});
 // TODO http://people.iola.dk/olau/flot/examples/annotating.html
-
 });
-- 
cgit v1.2.1