X-Git-Url: https://git.archive.openwrt.org/?p=project%2Fluci.git;a=blobdiff_plain;f=applications%2Fluci-livestats%2Fhtdocs%2Fluci-static%2Fresources%2Flivestats%2FGraphRPC.js;h=712d8b1f76be62b9ccb5956ad7c869f21dbde442;hp=9ac291fd02308d8f50f3059f3f94f6f5ded510c2;hb=5c61c377c14730ac2de9d022d890f5918b46b001;hpb=e39b2bff3f01f299201d6c394cbeb7e28e852758

diff --git a/applications/luci-livestats/htdocs/luci-static/resources/livestats/GraphRPC.js b/applications/luci-livestats/htdocs/luci-static/resources/livestats/GraphRPC.js
index 9ac291fd0..712d8b1f7 100644
--- a/applications/luci-livestats/htdocs/luci-static/resources/livestats/GraphRPC.js
+++ b/applications/luci-livestats/htdocs/luci-static/resources/livestats/GraphRPC.js
@@ -1,4 +1,4 @@
-function Graph(container, id, options, transform) {
+function Graph(container, id, options, transform, legend) {
 	if( !options ) options = { };
 
 	this.id        = id;
@@ -7,11 +7,15 @@ function Graph(container, id, options, transform) {
 	this.options   = options;
 	this.transform = transform;
 	this.dataset   = {};
-
+	this.legend    = legend;
+	this.lastvalue = {};
+	
+	var name  = (options.instanceNames && options.instanceNames[id])
+		? options.instanceNames[id] : id;
 	var graph = document.createElement('div');
 	var label = document.createElement('h2');
 		label.innerHTML = options.title
-			? options.title.replace("%s", id ) : id;
+			? options.title.replace("%s", name) : name;
 
 	container.appendChild( label );
 	container.appendChild( graph );
@@ -25,7 +29,6 @@ function Graph(container, id, options, transform) {
 }
 
 Graph.prototype.addDataset = function(name, ds) {
-	if( window.console ) console.debug("AddDataset: " + name);
 	if( !this.layout ) {
 		this.layout = new PlotKit.Layout( this.type, this.options );
 	}
@@ -41,7 +44,6 @@ Graph.prototype.addDataset = function(name, ds) {
 }
 
 Graph.prototype.updateDataset = function(name, value) {
-	if( window.console ) console.debug("UpdateDataset: " + name + " " + value);
 	if( this.dataset[name] ) {
 		var ds = this.dataset[name];
 
@@ -51,8 +53,9 @@ Graph.prototype.updateDataset = function(name, value) {
 		value = Math.abs( parseFloat(value) || 0 );
 
 		if( this.transform ) {
-			value = ( ds[this.cols-1][1] > 0 )
-				? this.transform(value, ds[this.cols-1][1]) : 0.01;
+			var orgvalue = value;
+			value = (this.lastvalue[name]) ? this.transform(value, this.lastvalue[name]) : 0;
+			this.lastvalue[name] = orgvalue;
 		}
 
 		ds[this.cols-1][1] = value;
@@ -68,6 +71,13 @@ Graph.prototype.draw = function( options ) {
 
 		this.layout.evaluate();
 		this.plotter.render();
+
+		legend_opt = {
+			"legendStyle": 'li'
+		};
+
+		legend = new LegendRenderer(this.legend, this.layout, legend_opt);
+		legend.render();
 	}
 }
 
@@ -80,7 +90,7 @@ Graph.prototype.redraw = function() {
 }
 
 
-function GraphRPC(container, uri, action, interval, datasources, options, transform) {
+function GraphRPC(container, uri, action, interval, datasources, options, transform, legend) {
 	this.ds        = datasources;
 	this.uri       = uri
 	this.action    = action;
@@ -89,6 +99,7 @@ function GraphRPC(container, uri, action, interval, datasources, options, transf
 	this.transform = transform;
 	this.proxy     = new MochiKit.JsonRpc.JsonRpcProxy(uri, [action]);
 	this.graphs    = new Object();
+	this.legend    = legend;
 
 	this.requestData();
 
@@ -128,7 +139,7 @@ GraphRPC.prototype.dispatchResponse = function(response) {
 				if( !this.graphs[gid] ) {
 					this.options.title = otle.replace('%s', instance) + ': ' + name;
 					this.graphs[gid] = new Graph(
-						this.container, gid, this.options, this.transform
+						this.container, gid, this.options, this.transform, this.legend
 					);
 
 					this.graphs[gid].addDataset(name);
@@ -137,42 +148,56 @@ GraphRPC.prototype.dispatchResponse = function(response) {
 				}
 				else
 				{
-					this.graphs[gid].updateDataset(
-						name, instance
+					var datum = null;
+					if (typeof (this.ds[i]) == "function") {
+						datum = this.ds[i](
+							instance ? response[instance] : response
+						);
+					} else {
+						datum = instance
 							? response[instance][this.ds[i]]
-							: response[parseInt(this.ds[i])]
+							: response[this.ds[i]]
+					}
+					this.graphs[gid].updateDataset(
+						name, datum
 					);
 					this.graphs[gid].redraw();
 				}
 			}
 		}
 		else {
-			if( !this.graphs[instance] ) {
-				this.graphs[instance] = new Graph(
-					this.container, instance, this.options, this.transform
+			var gid = instance || 'livegraph';
+			if( !this.graphs[gid] ) {
+				this.graphs[gid] = new Graph(
+					this.container, gid, this.options, this.transform, this.legend
 				);
-				if( window.console ) console.debug("NG: " + instance);
 
 				for( var i = 0; i < this.ds.length; i += 2 ) {
 					var name = this.ds[i+1] || this.ds[i];
-					if( window.console ) console.debug("ADS: " + name);
-					this.graphs[instance].addDataset(name);
+					this.graphs[gid].addDataset(name);
 				}
 
-				this.graphs[instance].draw();
+				this.graphs[gid].draw();
 			}
 			else {
 				for( var i = 0; i < this.ds.length; i += 2 ) {
 					var name = this.ds[i+1] || this.ds[i];
-					if( window.console ) console.debug("UDS: " + name + " " + response[instance][this.ds[i]]);
-					this.graphs[instance].updateDataset(
-						name, instance
+					var datum = null;
+					if (typeof (this.ds[i]) == "function") {
+						datum = this.ds[i](
+							instance ? response[instance] : response
+						);
+					} else {
+						datum = instance
 							? response[instance][this.ds[i]]
-							: response[parseInt(this.ds[i])]
+							: response[this.ds[i]]
+					}
+					this.graphs[gid].updateDataset(
+						name, datum
 					);
 				}
 
-				this.graphs[instance].redraw();
+				this.graphs[gid].redraw();
 			}
 		}
 	}