summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--README13
-rw-r--r--docs/nginx.conf.example9
-rw-r--r--index.html29
-rw-r--r--jarmon.js (renamed from jrrd.js)70
4 files changed, 65 insertions, 56 deletions
diff --git a/README b/README
index 9c79362..39ce717 100644
--- a/README
+++ b/README
@@ -1,4 +1,4 @@
-jrrd 0.0.1
+Jarmon 0.0.1
What is this?
@@ -19,15 +19,16 @@ This demo is designed to work with the RRD files generated by
$ aptitude install collectd
# Create a project folder and check out the code
-$ mkdir ~/Projects
-$ cd ~/Projects
-$ bzr branch lp:~richardw/+junk/rrd2flot
-$ cd rrd2flot
+$ mkdir -p ~/Projects/Jarmon
+$ cd ~/Projects/Jarmon
+$ bzr branch lp:~richardw/jarmon/trunk
+$ cd trunk
# Link to the collectd rrd folder
$ ln -s /var/lib/collectd/rrd/localhost data
-# Start a local webserver
+# Start a local webserver - here we use Twisted, but there are other web server
+# config examples in docs/
$ aptitude install twisted
$ twistd -n web --port 8080 --path .
diff --git a/docs/nginx.conf.example b/docs/nginx.conf.example
index 402999c..73420f1 100644
--- a/docs/nginx.conf.example
+++ b/docs/nginx.conf.example
@@ -34,7 +34,14 @@ http {
fastcgi_temp_path /tmp/nginx_fastcgi;
types {
- application/octet-stream rrd;
+ application/octet-stream rrd;
+ text/html html htm shtml;
+ text/css css;
+ text/xml xml rss;
+ image/gif gif;
+ image/jpeg jpeg jpg;
+ application/x-javascript js;
+ text/plain txt;
}
server {
diff --git a/index.html b/index.html
index a09903b..ad73251 100644
--- a/index.html
+++ b/index.html
@@ -2,7 +2,8 @@
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
- <title>RRD Charts</title>
+ <title>Jarmon - customisable, Javascript generated charts from
+ Collectd RRD data</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<link rel="stylesheet" type="text/css" href="assets/css/style.css" />
@@ -22,12 +23,12 @@
<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.2/all/jquery.tools.min.js"></script>
- <script type="text/javascript" src="jrrd.js"></script>
+ <script type="text/javascript" src="jarmon.js"></script>
<script type="text/javascript">
// Recipes for the charts on this page
var application_recipes = [
{
- title: 'Twisted Web TCP Stats',
+ title: 'Jarmon Webserver TCP Stats',
data: [
['tcpconns-8080-local/tcp_connections-CLOSE_WAIT.rrd', 0, 'CLOSE_WAIT', ''],
['tcpconns-8080-local/tcp_connections-SYN_RECV.rrd', 0, 'SYN_RECV', ''],
@@ -41,7 +42,7 @@
['tcpconns-8080-local/tcp_connections-SYN_SENT.rrd', 0, 'SYN_SENT', ''],
['tcpconns-8080-local/tcp_connections-CLOSING.rrd', 0, 'CLOSING', '']
],
- options: jQuery.extend(true, {}, jrrd.Chart.BASE_OPTIONS, jrrd.Chart.STACKED_OPTIONS)
+ options: jQuery.extend(true, {}, jarmon.Chart.BASE_OPTIONS, jarmon.Chart.STACKED_OPTIONS)
},
];
@@ -62,7 +63,7 @@
}
}
- var cc = new jrrd.ChartCoordinator($('.chartRangeControl'));
+ var cc = new jarmon.ChartCoordinator($('.chartRangeControl'));
var t;
// Initialise tabs and update charts when tab is clicked
$(".css-tabs:first").bind('click', function(i) {
@@ -73,22 +74,22 @@
});
cc.charts = [].concat(
- jrrd.Chart.fromRecipe(
+ jarmon.Chart.fromRecipe(
rrdUrlList,
[].concat(
- jrrd.COLLECTD_RECIPES.cpu,
- jrrd.COLLECTD_RECIPES.memory,
- jrrd.COLLECTD_RECIPES.load),
+ jarmon.COLLECTD_RECIPES.cpu,
+ jarmon.COLLECTD_RECIPES.memory,
+ jarmon.COLLECTD_RECIPES.load),
templateFactory('.system-charts')),
- jrrd.Chart.fromRecipe(
+ jarmon.Chart.fromRecipe(
rrdUrlList,
- jrrd.COLLECTD_RECIPES.interface,
+ jarmon.COLLECTD_RECIPES.interface,
templateFactory('.network-charts')),
- jrrd.Chart.fromRecipe(
+ jarmon.Chart.fromRecipe(
rrdUrlList,
- jrrd.COLLECTD_RECIPES.dns,
+ jarmon.COLLECTD_RECIPES.dns,
templateFactory('.dns-charts')),
- jrrd.Chart.fromRecipe(
+ jarmon.Chart.fromRecipe(
rrdUrlList,
application_recipes,
templateFactory('.application-charts'))
diff --git a/jrrd.js b/jarmon.js
index a0a59e4..67b4522 100644
--- a/jrrd.js
+++ b/jarmon.js
@@ -14,8 +14,8 @@
* - MochiKit.Async: http://www.mochikit.com/
*/
-if(typeof jrrd == 'undefined') {
- var jrrd = {};
+if(typeof jarmon == 'undefined') {
+ var jarmon = {};
}
/**
@@ -25,7 +25,7 @@ if(typeof jrrd == 'undefined') {
* @return: A I{MochiKit.Async.Deferred} which will callback with an instance of
* I{javascriptrrd.BinaryFile}
**/
-jrrd.downloadBinary = function(url) {
+jarmon.downloadBinary = function(url) {
var d = new MochiKit.Async.Deferred();
$.ajax({
@@ -74,12 +74,12 @@ jrrd.downloadBinary = function(url) {
* @param cfName: A {String} name of an RRD consolidation function
* @return: A flot compatible data series object
**/
-jrrd.RrdQuery = function(rrd, unit) {
+jarmon.RrdQuery = function(rrd, unit) {
this.rrd = rrd;
this.unit = unit;
};
-jrrd.RrdQuery.prototype.getData = function(startTime, endTime, dsId, cfName) {
+jarmon.RrdQuery.prototype.getData = function(startTime, endTime, dsId, cfName) {
/**
* Generate a Flot compatible data object containing rows between start and
* end time. The rows are taken from the first RRA whose data spans the
@@ -171,14 +171,14 @@ jrrd.RrdQuery.prototype.getData = function(startTime, endTime, dsId, cfName) {
* @param url: The url I{String} of a remote RRD file
* @param unit: The unit suffix I{String} of this data eg 'bit/sec'
**/
-jrrd.RrdQueryRemote = function(url, unit) {
+jarmon.RrdQueryRemote = function(url, unit) {
this.url = url;
this.unit = unit;
this.lastUpdate = 0;
this._download = null;
};
-jrrd.RrdQueryRemote.prototype.getData = function(startTime, endTime, dsId) {
+jarmon.RrdQueryRemote.prototype.getData = function(startTime, endTime, dsId) {
/**
* Return a Flot compatible data series asynchronously.
*
@@ -194,7 +194,7 @@ jrrd.RrdQueryRemote.prototype.getData = function(startTime, endTime, dsId) {
// end time.
// Don't start another download if one is already in progress.
if(!this._download || (this._download.fired > -1 && this.lastUpdate < endTimestamp )) {
- this._download = jrrd.downloadBinary(this.url)
+ this._download = jarmon.downloadBinary(this.url)
.addCallback(
function(self, binary) {
// Upon successful download convert the resulting binary
@@ -210,7 +210,7 @@ jrrd.RrdQueryRemote.prototype.getData = function(startTime, endTime, dsId) {
// returning a flot compatible data object to the caller.
var ret = new MochiKit.Async.Deferred().addCallback(
function(self, startTime, endTime, dsId, rrd) {
- return new jrrd.RrdQuery(rrd, self.unit).getData(startTime, endTime, dsId);
+ return new jarmon.RrdQuery(rrd, self.unit).getData(startTime, endTime, dsId);
}, this, startTime, endTime, dsId);
// Add a pair of callbacks to the current download which will callback the
@@ -235,13 +235,13 @@ jrrd.RrdQueryRemote.prototype.getData = function(startTime, endTime, dsId) {
* @param rrdQuery: An I{RrdQueryRemote}
* @param dsId: An index or keyname of an RRD DS
**/
-jrrd.RrdQueryDsProxy = function(rrdQuery, dsId) {
+jarmon.RrdQueryDsProxy = function(rrdQuery, dsId) {
this.rrdQuery = rrdQuery;
this.dsId = dsId;
this.unit = rrdQuery.unit;
};
-jrrd.RrdQueryDsProxy.prototype.getData = function(startTime, endTime) {
+jarmon.RrdQueryDsProxy.prototype.getData = function(startTime, endTime) {
/**
* Call I{RrdQueryRemote.getData} with a particular dsId
**/
@@ -257,7 +257,7 @@ jrrd.RrdQueryDsProxy.prototype.getData = function(startTime, endTime) {
* @param options: An I{Object} containing Flot options which describe how the
* chart should be drawn.
**/
-jrrd.Chart = function(template, options) {
+jarmon.Chart = function(template, options) {
this.template = template;
this.options = jQuery.extend(true, {yaxis: {}}, options);
this.data = [];
@@ -327,7 +327,7 @@ jrrd.Chart = function(template, options) {
};
};
-jrrd.Chart.prototype.addData = function(label, db, enabled) {
+jarmon.Chart.prototype.addData = function(label, db, enabled) {
/**
* Add details of a remote RRD data source whose data will be added to this
* chart.
@@ -344,7 +344,7 @@ jrrd.Chart.prototype.addData = function(label, db, enabled) {
this.data.push([label, db, enabled]);
};
-jrrd.Chart.prototype.switchDataEnabled = function(label) {
+jarmon.Chart.prototype.switchDataEnabled = function(label) {
/**
* Enable / Disable a single data source
*
@@ -358,7 +358,7 @@ jrrd.Chart.prototype.switchDataEnabled = function(label) {
}
};
-jrrd.Chart.prototype.setTimeRange = function(startTime, endTime) {
+jarmon.Chart.prototype.setTimeRange = function(startTime, endTime) {
/**
* Alter the time range of this chart and redraw
*
@@ -370,7 +370,7 @@ jrrd.Chart.prototype.setTimeRange = function(startTime, endTime) {
return this.draw();
}
-jrrd.Chart.prototype.draw = function() {
+jarmon.Chart.prototype.draw = function() {
/**
* Draw the chart
* A 'chart_loading' event is triggered before the data is requested
@@ -457,7 +457,7 @@ jrrd.Chart.prototype.draw = function() {
};
-jrrd.Chart.fromRecipe = function(rrdUrlList, recipes, templateFactory) {
+jarmon.Chart.fromRecipe = function(rrdUrlList, recipes, templateFactory) {
/**
* A factory function to generate a list of I{Chart} from a list of recipes
* and a list of available rrd files in collectd path format.
@@ -491,15 +491,15 @@ jrrd.Chart.fromRecipe = function(rrdUrlList, recipes, templateFactory) {
for(x=0; x<match.length; x++) {
if(typeof dataDict[match[x]] == 'undefined') {
- dataDict[match[x]] = new jrrd.RrdQueryRemote(match[x], unit);
+ dataDict[match[x]] = new jarmon.RrdQueryRemote(match[x], unit);
}
- chartData.push([label, new jrrd.RrdQueryDsProxy(dataDict[match[x]], ds)]);
+ chartData.push([label, new jarmon.RrdQueryDsProxy(dataDict[match[x]], ds)]);
}
}
if(chartData.length > 0) {
template = templateFactory();
template.find('.title').text(recipe['title']);
- c = new jrrd.Chart(template.find('.chart'), recipe['options']);
+ c = new jarmon.Chart(template.find('.chart'), recipe['options']);
for(j=0; j<chartData.length; j++) {
c.addData.apply(c, chartData[j]);
}
@@ -511,7 +511,7 @@ jrrd.Chart.fromRecipe = function(rrdUrlList, recipes, templateFactory) {
// Options common to all the chart on this page
-jrrd.Chart.BASE_OPTIONS = {
+jarmon.Chart.BASE_OPTIONS = {
grid: {
clickable: false,
borderWidth: 1,
@@ -543,7 +543,7 @@ jrrd.Chart.BASE_OPTIONS = {
};
// Extra options to generate a stacked chart
-jrrd.Chart.STACKED_OPTIONS = {
+jarmon.Chart.STACKED_OPTIONS = {
series: {
stack: true,
lines: {
@@ -553,7 +553,7 @@ jrrd.Chart.STACKED_OPTIONS = {
};
-jrrd.COLLECTD_RECIPES = {
+jarmon.COLLECTD_RECIPES = {
'cpu': [
{
title: 'CPU Usage',
@@ -565,8 +565,8 @@ jrrd.COLLECTD_RECIPES = {
['cpu-0/cpu-user.rrd', 0, 'CPU-0 User', '%'],
['cpu-1/cpu-user.rrd', 0, 'CPU-1 User', '%']
],
- options: jQuery.extend(true, {}, jrrd.Chart.BASE_OPTIONS,
- jrrd.Chart.STACKED_OPTIONS)
+ options: jQuery.extend(true, {}, jarmon.Chart.BASE_OPTIONS,
+ jarmon.Chart.STACKED_OPTIONS)
},
],
@@ -579,8 +579,8 @@ jrrd.COLLECTD_RECIPES = {
['memory/memory-cached.rrd', 0, 'Cached', 'B'],
['memory/memory-free.rrd', 0, 'Free', 'B']
],
- options: jQuery.extend(true, {}, jrrd.Chart.BASE_OPTIONS,
- jrrd.Chart.STACKED_OPTIONS)
+ options: jQuery.extend(true, {}, jarmon.Chart.BASE_OPTIONS,
+ jarmon.Chart.STACKED_OPTIONS)
}
],
@@ -593,7 +593,7 @@ jrrd.COLLECTD_RECIPES = {
['dns/dns_qtype-SOA.rrd', 0, 'SOA', 'Q/s'],
['dns/dns_qtype-SRV.rrd', 0, 'SRV', 'Q/s']
],
- options: jQuery.extend(true, {}, jrrd.Chart.BASE_OPTIONS)
+ options: jQuery.extend(true, {}, jarmon.Chart.BASE_OPTIONS)
},
{
@@ -603,7 +603,7 @@ jrrd.COLLECTD_RECIPES = {
['dns/dns_rcode-NXDOMAIN.rrd', 0, 'NXDOMAIN', 'Q/s'],
['dns/dns_rcode-SERVFAIL.rrd', 0, 'SERVFAIL', 'Q/s']
],
- options: jQuery.extend(true, {}, jrrd.Chart.BASE_OPTIONS)
+ options: jQuery.extend(true, {}, jarmon.Chart.BASE_OPTIONS)
}
],
@@ -615,7 +615,7 @@ jrrd.COLLECTD_RECIPES = {
['load/load.rrd', 'midterm', 'Medium Term', ''],
['load/load.rrd', 'longterm', 'Long Term', '']
],
- options: jQuery.extend(true, {}, jrrd.Chart.BASE_OPTIONS)
+ options: jQuery.extend(true, {}, jarmon.Chart.BASE_OPTIONS)
}
],
@@ -626,7 +626,7 @@ jrrd.COLLECTD_RECIPES = {
['interface/if_octets-wlan0.rrd', 'tx', 'Transmit', 'b/s'],
['interface/if_octets-wlan0.rrd', 'rx', 'Receive', 'b/s']
],
- options: jQuery.extend(true, {}, jrrd.Chart.BASE_OPTIONS)
+ options: jQuery.extend(true, {}, jarmon.Chart.BASE_OPTIONS)
}
]
};
@@ -639,7 +639,7 @@ jrrd.COLLECTD_RECIPES = {
* @param ui: A one element I{jQuery} containing an input form and placeholders
* for the timeline and for the series of charts.
**/
-jrrd.ChartCoordinator = function(ui) {
+jarmon.ChartCoordinator = function(ui) {
this.ui = ui;
this.charts = [];
@@ -681,7 +681,7 @@ jrrd.ChartCoordinator = function(ui) {
});
};
-jrrd.ChartCoordinator.prototype.update = function() {
+jarmon.ChartCoordinator.prototype.update = function() {
/**
* Grab the start and end time from the ui form, highlight the range on the
* range timeline and set the time range of all the charts and redraw.
@@ -751,7 +751,7 @@ jrrd.ChartCoordinator.prototype.update = function() {
}, this, startTime, endTime);
};
-jrrd.ChartCoordinator.prototype.setTimeRange = function(startTime, endTime) {
+jarmon.ChartCoordinator.prototype.setTimeRange = function(startTime, endTime) {
/**
* Set the start and end time fields in the form and trigger an update
*
@@ -763,7 +763,7 @@ jrrd.ChartCoordinator.prototype.setTimeRange = function(startTime, endTime) {
return this.update();
};
-jrrd.ChartCoordinator.prototype.reset = function() {
+jarmon.ChartCoordinator.prototype.reset = function() {
/**
* Reset all charts and the input form to the default time range - last hour
**/