summaryrefslogtreecommitdiff
path: root/python/gras/stats
diff options
context:
space:
mode:
Diffstat (limited to 'python/gras/stats')
-rw-r--r--python/gras/stats/CMakeLists.txt7
-rw-r--r--python/gras/stats/chart_factory.js209
-rw-r--r--python/gras/stats/chart_handler_breakdown.js37
-rw-r--r--python/gras/stats/chart_overall_throughput.js46
-rw-r--r--python/gras/stats/chart_overhead_compare.js37
-rw-r--r--python/gras/stats/chart_total_io_counts.js62
-rw-r--r--python/gras/stats/charts.js174
-rw-r--r--python/gras/stats/main.css29
-rw-r--r--python/gras/stats/main.html62
-rw-r--r--python/gras/stats/main.js81
-rw-r--r--python/gras/stats/registry.js36
-rw-r--r--python/gras/stats/utils.js24
12 files changed, 509 insertions, 295 deletions
diff --git a/python/gras/stats/CMakeLists.txt b/python/gras/stats/CMakeLists.txt
index a8e4828..54502a5 100644
--- a/python/gras/stats/CMakeLists.txt
+++ b/python/gras/stats/CMakeLists.txt
@@ -14,9 +14,12 @@ INSTALL(
FILES
main.html
main.js
- registry.js
utils.js
- charts.js
+ chart_factory.js
+ chart_overhead_compare.js
+ chart_overall_throughput.js
+ chart_handler_breakdown.js
+ chart_total_io_counts.js
main.css
DESTINATION ${GR_PYTHON_DIR}/gras/stats
COMPONENT ${GRAS_COMP_PYTHON}
diff --git a/python/gras/stats/chart_factory.js b/python/gras/stats/chart_factory.js
new file mode 100644
index 0000000..3d2b0bc
--- /dev/null
+++ b/python/gras/stats/chart_factory.js
@@ -0,0 +1,209 @@
+/***********************************************************************
+ * Chart registry for now chart types
+ **********************************************************************/
+var gras_chart_get_registry = function()
+{
+ return [
+ {key:'overhead_compare', name:'Overhead Compare', factory:GrasChartOverheadCompare},
+ {key:'overall_throughput', name:'Overall Throughput', factory:GrasChartOverallThroughput},
+ {key:'handler_breakdown', name:'Handler Breakdown', factory:GrasChartHandlerBreakdown},
+ {key:'total_io_counts', name:'I/O port Totals', factory:GrasChartTotalIoCounts},
+ ];
+}
+
+/***********************************************************************
+ * One time setup
+ **********************************************************************/
+function gras_chart_factory_setup(registry, point)
+{
+ var id = $('gras_stats:first', point).attr('id');
+ registry.top_id = id;
+ $('#top_name').append(' - ' + id);
+ $('block', point).each(function(index, block)
+ {
+ var id = $(block).attr('id');
+ registry.block_ids.push(id);
+ var container = $('#chart_designer_blocks');
+ var div = $('<div />');
+ $(div).append('<label>' + id + '</label>');
+ var input = $('<input />').attr({
+ type: 'checkbox',
+ name: id
+ });
+ input.attr('checked', false);
+ $(div).append(input);
+ $(container).append(div);
+ });
+}
+
+/***********************************************************************
+ * chart factory input handler
+ **********************************************************************/
+function gras_chart_factory_handle_input(registry)
+{
+ //get a list of the selected blocks
+ var selected_blocks = new Array();
+ $.each($('#chart_designer_blocks input'), function(index, input)
+ {
+ var input = $(input);
+ if (input.is(':checked'))
+ {
+ selected_blocks.push(input.attr('name'));
+ }
+ });
+
+ //get the type of chart to create
+ var chart_type = $('#chart_type_selector').val();
+
+ //create args for the factory make
+ var args = {
+ block_ids:selected_blocks,
+ chart_type:chart_type,
+ };
+
+ //call into the factory with args
+ gras_chart_factory_make(registry, args);
+}
+
+/***********************************************************************
+ * save/load to/from local storage
+ **********************************************************************/
+function gras_chart_save(registry)
+{
+ if (typeof(Storage) === "undefined") return;
+ var all_args = new Array();
+ $.each(registry.active_charts, function(index, info)
+ {
+ all_args.push(info.args);
+ });
+ localStorage.setItem(registry.top_id, JSON.stringify(all_args));
+}
+
+function gras_chart_load(registry)
+{
+ if (typeof(Storage) === "undefined") return;
+ var chart_args = JSON.parse(localStorage.getItem(registry.top_id));
+ if (!chart_args) return;
+ $.each(chart_args, function(args_i, args)
+ {
+ //check that the blocks saved in the args actually exist
+ var do_make = true;
+ $.each(args.block_ids, function(block_id_i, block_id)
+ {
+ if ($.inArray(block_id, registry.block_ids) < 0)
+ {
+ do_make = false;
+ }
+ });
+ if (do_make) gras_chart_factory_make(registry, args);
+ });
+}
+
+/***********************************************************************
+ * chart factory make routine
+ **********************************************************************/
+function gras_chart_factory_make(registry, args)
+{
+ //create containers
+ var chart_box = $('<table />').attr({class:'chart_container'});
+ var tr = $('<tr />');
+ var td = $('<td />');
+ tr.append(td);
+
+ //call into the factory
+ args.panel = td.get(0);
+ try
+ {
+ var chart = new registry.chart_factories[args.chart_type](args);
+ }
+ catch(err)
+ {
+ return;
+ }
+
+ //setup the title
+ var tr_title = $('<tr />');
+ var th_title = $('<th />');
+ tr_title.append(th_title);
+ th_title.text(chart.title);
+
+ //register the chart
+ var chart_info = {chart:chart,args:args};
+ registry.active_charts.push(chart_info);
+ $('#charts_panel').append(chart_box);
+
+ //close button
+ var close_div = $('<div/>').attr({class:'chart_designer_block_close'});
+ var close_href = $('<a />').attr({href:'#', class:"ui-dialog-titlebar-close ui-corner-all", role:"button"});
+ var close_span = $('<span />').attr({class:"ui-icon ui-icon-closethick"}).text('close');
+ close_div.append(close_href);
+ close_href.append(close_span);
+ th_title.append(close_div);
+ $(close_href).click(function()
+ {
+ var index = $.inArray(chart_info, registry.active_charts);
+ registry.active_charts.splice(index, 1);
+ chart_box.remove();
+ gras_chart_save(registry);
+ });
+ gras_chart_save(registry);
+
+ //finish gui building
+ chart_box.append(tr_title);
+ chart_box.append(tr);
+}
+
+/***********************************************************************
+ * chart factory handle online/offline
+ **********************************************************************/
+function gras_chart_factory_online(registry)
+{
+ if (!registry.online) registry.offline_count++;
+ if (registry.online) $('#page').css('background-color', '#EEEEFF');
+ else if (registry.offline_count%2 == 0) $('#page').css('background-color', '#FF4848');
+ else if (registry.offline_count%2 == 1) $('#page').css('background-color', '#EEEEFF');
+}
+
+/***********************************************************************
+ * chart factory init
+ **********************************************************************/
+function gras_chart_factory_init(registry)
+{
+ //init registry containers
+ registry.active_charts = new Array();
+ registry.chart_factories = new Array();
+
+ //install callback for chart factory
+ $('#chart_factory_button').click(function()
+ {
+ gras_chart_factory_handle_input(registry);
+ });
+
+ //init the chart selection input
+ $.each(gras_chart_get_registry(), function(index, options)
+ {
+ registry.chart_factories[options.key] = options.factory;
+ var option = $('<option />').attr({value: options.key});
+ option.text(options.name);
+ $('#chart_type_selector').append(option);
+ });
+
+ //init overall config gui element for rate
+ var overall_rate = $('#chart_update_rate');
+ overall_rate.val(registry.overall_rate);
+ overall_rate.change(function()
+ {
+ registry.overall_rate = overall_rate.val();
+ });
+
+ //init overall config gui element for activity
+ registry.overall_active = true;
+ var overall_active = $('#chart_active_state');
+ overall_active.attr('checked', registry.overall_active);
+ overall_active.change(function()
+ {
+ registry.overall_active = overall_active.is(':checked');
+ if (registry.overall_active) gras_query_stats(registry);
+ else window.clearInterval(registry.timeout_handle);
+ });
+}
diff --git a/python/gras/stats/chart_handler_breakdown.js b/python/gras/stats/chart_handler_breakdown.js
new file mode 100644
index 0000000..8e90fc3
--- /dev/null
+++ b/python/gras/stats/chart_handler_breakdown.js
@@ -0,0 +1,37 @@
+function GrasChartHandlerBreakdown(args)
+{
+ //input checking
+ if (args.block_ids.length != 1) throw gras_error_dialog(
+ "GrasChartHandlerBreakdown",
+ "Error making handler breakdown chart.\n"+
+ "Specify only one block for this chart."
+ );
+
+ //save enable
+ this.block_id = args.block_ids[0];
+
+ //make new chart
+ this.chart = new google.visualization.PieChart(args.panel);
+
+ this.title = "Handler Breakdown - " + this.block_id;
+}
+
+GrasChartHandlerBreakdown.prototype.update = function(point)
+{
+ var percents = gras_extract_percent_times(point, this.block_id);
+ var data = google.visualization.arrayToDataTable([
+ ['Task', 'Percent'],
+ ['Work prep', percents['prep']],
+ ['Work task', percents['work']],
+ ['Work post', percents['post']],
+ ['Input tasks', percents['input']],
+ ['Output tasks', percents['output']],
+ ]);
+
+ var options = {
+ width:GRAS_CHARTS_STD_WIDTH,
+ chartArea:{left:5,top:0,right:5,bottom:0,width:"100%",height:"100%"},
+ };
+
+ this.chart.draw(data, options);
+};
diff --git a/python/gras/stats/chart_overall_throughput.js b/python/gras/stats/chart_overall_throughput.js
new file mode 100644
index 0000000..4947479
--- /dev/null
+++ b/python/gras/stats/chart_overall_throughput.js
@@ -0,0 +1,46 @@
+function GrasChartOverallThroughput(args)
+{
+ //save enables
+ this.ids = args.block_ids;
+
+ //input checking
+ if (this.ids.length == 0) throw gras_error_dialog(
+ "GrasChartOverallThroughput",
+ "Error making overall thoughput chart.\n"+
+ "Specify at least 1 block for this chart."
+ );
+
+ //make new chart
+ this.chart = new google.visualization.LineChart(args.panel);
+
+ this.title = "Overall Throughput vs Time";
+ this.history = new Array();
+}
+
+GrasChartOverallThroughput.prototype.update = function(point)
+{
+ this.history.push(point);
+ if (this.history.length == 1) this.p0 = point;
+ if (this.history.length < 2) return;
+ if (this.history.length > 10) this.history.splice(0, 1);
+
+ var data_set = [['Throughput'].concat(this.ids)];
+ for (var i = 1; i < this.history.length; i++)
+ {
+ var row = new Array();
+ row.push(gras_extract_stat_time_delta(this.p0, this.history[i]).toFixed(2).toString());
+ for (var j = 0; j < this.ids.length; j++)
+ {
+ row.push(gras_extract_throughput_delta(this.history[i-1], this.history[i], this.ids[j])/1e6);
+ }
+ data_set.push(row);
+ }
+
+ var chart_data = google.visualization.arrayToDataTable(data_set);
+ var options = {
+ width:GRAS_CHARTS_STD_WIDTH*2,
+ chartArea:{left:0,top:0,right:0,bottom:0,width:"100%",height:"85%"},
+ legend: {'position': 'bottom'},
+ };
+ this.chart.draw(chart_data, options);
+};
diff --git a/python/gras/stats/chart_overhead_compare.js b/python/gras/stats/chart_overhead_compare.js
new file mode 100644
index 0000000..c373142
--- /dev/null
+++ b/python/gras/stats/chart_overhead_compare.js
@@ -0,0 +1,37 @@
+function GrasChartOverheadCompare(args)
+{
+ //save enables
+ this.ids = args.block_ids;
+
+ //input checking
+ if (this.ids.length <= 1) throw gras_error_dialog(
+ "GrasChartOverheadCompare",
+ "Error making overhead compare chart.\n"+
+ "Specify at least 2 blocks for this chart."
+ );
+
+ //make new chart
+ this.chart = new google.visualization.PieChart(args.panel);
+
+ this.title = "Overhead Comparison";
+}
+
+GrasChartOverheadCompare.prototype.update = function(point)
+{
+ var data_set = new Array();
+ data_set.push(['Task', 'Percent']);
+ $.each(this.ids, function(index, id)
+ {
+ var percents = gras_extract_percent_times(point, id);
+ data_set.push([id, percents['total']]);
+ });
+
+ var data = google.visualization.arrayToDataTable(data_set)
+
+ var options = {
+ width:GRAS_CHARTS_STD_WIDTH,
+ chartArea:{left:5,top:0,right:5,bottom:0,width:"100%",height:"100%"},
+ };
+
+ this.chart.draw(data, options);
+};
diff --git a/python/gras/stats/chart_total_io_counts.js b/python/gras/stats/chart_total_io_counts.js
new file mode 100644
index 0000000..5aaaf24
--- /dev/null
+++ b/python/gras/stats/chart_total_io_counts.js
@@ -0,0 +1,62 @@
+function GrasChartTotalIoCounts(args)
+{
+ //input checking
+ if (args.block_ids.length != 1) throw gras_error_dialog(
+ "GrasChartTotalIoCounts",
+ "Error making total IO counts chart.\n"+
+ "Specify only one block for this chart."
+ );
+
+ //settings
+ this.block_id = args.block_ids[0];
+ this.div = $('<div />').attr({class:'chart_total_io_counts'});
+ $(args.panel).append(this.div);
+ this.title = "I/O Totals - " + this.block_id;
+}
+
+GrasChartTotalIoCounts.prototype.update = function(point)
+{
+ var block_data = $('block[id="' + this.block_id + '"]', point);
+ var ul = $('<ul />');
+ $('ul', this.div).remove(); //clear old lists
+ this.div.append(ul);
+
+ {
+ var init_time = parseInt($('init_time', block_data).text());
+ var stats_time = parseInt($('stats_time', block_data).text());
+ var tps = parseInt($('tps', block_data).text());
+ var duration = (stats_time - init_time)/tps;
+ var li = $('<li />');
+ var strong = $('<strong />').text('Elapsed' + ': ');
+ var span = $('<span />').text(duration.toFixed(2).toString() + ' secs');
+ li.append(strong);
+ li.append(span);
+ ul.append(li);
+ }
+
+ var stuff = [
+ ['Input', 'items', 'items_consumed'],
+ ['Input', 'tags', 'tags_consumed'],
+ ['Input', 'msgs', 'msgs_consumed'],
+ ['Output', 'items', 'items_produced'],
+ ['Output', 'tags', 'tags_produced'],
+ ['Output', 'msgs', 'msgs_produced'],
+ ];
+
+ $.each(stuff, function(contents_i, contents)
+ {
+ var dir = contents[0];
+ var units = contents[1];
+ var key = contents[2];
+ $(key, block_data).each(function(index, elem)
+ {
+ var count = parseInt($(elem).text());
+ var li = $('<li />');
+ var strong = $('<strong />').text(dir + index.toString() + ': ');
+ var span = $('<span />').text(count.toString() + ' ' + units);
+ li.append(strong);
+ li.append(span);
+ if (count > 0) ul.append(li);
+ });
+ });
+}
diff --git a/python/gras/stats/charts.js b/python/gras/stats/charts.js
deleted file mode 100644
index 0fb6952..0000000
--- a/python/gras/stats/charts.js
+++ /dev/null
@@ -1,174 +0,0 @@
-/***********************************************************************
- * Throughput chart
- **********************************************************************/
-var gras_setup_overall_chart = function(registry)
-{
- var div = $('#overall_chart:first');
- var td = $('td:last', div);
- var chart = new google.visualization.LineChart(td.get(0));
- registry.overall_chart = chart;
-}
-
-var gras_update_throughput_chart = function(registry)
-{
- if (registry.history.length == 1)
- {
- var id = $('gras_stats:first', registry.history[0]).attr('id');
- $('h1:first').append(' - ' + id);
- gras_setup_individual_charts(registry);
- return;
- }
- if (registry.history.length < 2) return;
-
- var ids = new Array();
- $.each(registry.getBlockIds(), function(index, id)
- {
- if (registry.block_enables[id]) ids.push(id);
- });
-
- var data_set = [['Throughput'].concat(ids)];
- for (var i = Math.max(registry.history.length-10, 1); i < registry.history.length; i++)
- {
- var row = new Array();
- row.push(i.toString());
- for (var j = 0; j < ids.length; j++)
- {
- row.push(gras_extract_throughput_delta(registry.history[i-1], registry.history[i], ids[j])/1e6);
- }
- data_set.push(row);
- }
-
- var chart_data = google.visualization.arrayToDataTable(data_set);
- var options = {
- width:$('#page').width()*0.9,
- height:'250',
- chartArea:{left:0,top:0,right:0,bottom:0,width:"100%",height:"85%"},
- legend: {'position': 'bottom'},
- };
- registry.overall_chart.draw(chart_data, options);
-}
-
-/***********************************************************************
- * Overhead comparison chart
- **********************************************************************/
-var gras_setup_overall_chart_pie = function(registry)
-{
- var div = $('#overall_chart_pie:first');
- var td = $('td:last', div);
- var chart = new google.visualization.PieChart(td.get(0));
- registry.overall_chart_pie = chart;
-}
-
-var gras_update_time_compare_chart = function(registry)
-{
- var point = registry.history[registry.history.length-1];
- var data_set = new Array();
- data_set.push(['Task', 'Percent']);
- $.each(registry.getBlockIds(), function(index, id)
- {
- if (registry.block_enables[id])
- {
- var percents = gras_extract_percent_times(point, id);
- data_set.push([id, percents['total']]);
- }
- });
-
- var data = google.visualization.arrayToDataTable(data_set)
-
- var options = {
- width:$('#page').width()/5,
- chartArea:{left:5,top:0,right:5,bottom:0,width:"100%",height:"100%"},
- };
-
- var chart = registry.overall_chart_pie;
- chart.draw(data, options);
-}
-
-/***********************************************************************
- * Block handler breakdown chart
- **********************************************************************/
-var gras_setup_per_block_enable_checkbox = function(elem, id, registry)
-{
- $(elem).append('<label>' + id + '</label>');
- var input = $('<input />').attr({
- type: 'checkbox',
- name: id
- });
- registry.block_enables[id] = false;
- input.attr('checked', registry.block_enables[id]);
- input.change(function()
- {
- registry.block_enables[id] = input.is(':checked');
- //gras_update_throughput_chart(registry);
- var div = $('#per_block_charts');
- gras_animate_show_hide($('table[name="' + id + '"]', div), registry.block_enables[id]);
- });
- $(elem).append(input);
- $(elem).append('&nbsp;');
- input.change();
-}
-
-var gras_setup_per_block_charts = function(id, registry)
-{
- var div = $('#per_block_charts');
- var table = $('<table />');
- table.attr('name', id);
- div.append(table);
- table.append('<tr><th></th></tr>');
- $('th:last', table).text(id);
- table.append('<tr><td></td></tr>');
- var td = $('td:last', table);
- var chart = new google.visualization.PieChart(td.get(0));
- registry.block_charts[id] = chart;
-}
-
-var gras_setup_individual_charts = function(registry)
-{
- var point = registry.history[0];
- var div = $('#block_enables:first');
- var config = $('td:last', div);
- var count = 0;
- $.each(registry.getBlockIds(), function(index, id)
- {
- gras_setup_per_block_charts(id, registry);
- gras_setup_per_block_enable_checkbox(config, id, registry);
- count++;
- if (count == Math.round(registry.getBlockIds().length/2))
- {
- var table = $('table:last', div);
- $(table).append('<tr><td></td></tr>');
- config = $('td:last', div);
- }
- });
-}
-
-var gras_update_per_block_chart = function(id, registry)
-{
- var point = registry.history[registry.history.length-1];
- var percents = gras_extract_percent_times(point, id);
- var data = google.visualization.arrayToDataTable([
- ['Task', 'Percent'],
- ['Work prep', percents['prep']],
- ['Work task', percents['work']],
- ['Work post', percents['post']],
- ['Input tasks', percents['input']],
- ['Output tasks', percents['output']],
- ]);
-
- var options = {
- width:$('#page').width()/5,
- chartArea:{left:5,top:0,right:5,bottom:0,width:"100%",height:"100%"},
- };
-
- var chart = registry.block_charts[id];
- chart.draw(data, options);
-}
-
-var gras_update_per_block_charts = function(registry)
-{
- if (registry.history.length == 0) return;
- $.each(registry.getBlockIds(), function(index, id)
- {
- gras_update_per_block_chart(id, registry);
- });
-}
diff --git a/python/gras/stats/main.css b/python/gras/stats/main.css
index 43ecae1..b5f62f1 100644
--- a/python/gras/stats/main.css
+++ b/python/gras/stats/main.css
@@ -10,22 +10,37 @@ color:black;
background-color:white;
}
-#overall_chart_pie table
+.chart_designer_block_close
{
-float:left;
+float:right;
}
-#per_block_charts table
+#chart_designer_blocks div
{
float:left;
}
-#overall_config
+#chart_designer_blocks label
{
-float:left;
+text-decoration:underline;
+}
+
+#chart_designer_blocks input
+{
+margin-right:10px;
+margin-left:2px;
}
-#block_enables
+.chart_total_io_counts li
+{
+list-style-type:none;
+text-align: left;
+padding: 0px;
+margin: 0px;
+font-size:90%;
+}
+
+.chart_container
{
float:left;
}
@@ -33,7 +48,7 @@ float:left;
#page{
padding:10px;
color:inherit;
-/*background-color:#F0FFF0;*/
+background-color:inherit;
}
#page h1{
diff --git a/python/gras/stats/main.html b/python/gras/stats/main.html
index 9217847..eeb221d 100644
--- a/python/gras/stats/main.html
+++ b/python/gras/stats/main.html
@@ -5,11 +5,16 @@
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>GRAS Status Monitor</title>
<link rel="stylesheet" type="text/css" href="/main.css" />
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+ <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
+ <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
+ <script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
- <script type="text/javascript" src="/registry.js"></script>
<script type="text/javascript" src="/utils.js"></script>
- <script type="text/javascript" src="/charts.js"></script>
+ <script type="text/javascript" src="/chart_factory.js"></script>
+ <script type="text/javascript" src="/chart_overhead_compare.js"></script>
+ <script type="text/javascript" src="/chart_overall_throughput.js"></script>
+ <script type="text/javascript" src="/chart_handler_breakdown.js"></script>
+ <script type="text/javascript" src="/chart_total_io_counts.js"></script>
<script type="text/javascript" src="/main.js"></script>
<script type="text/javascript">
google.load('visualization', '1.0', {'packages':['corechart']});
@@ -18,43 +23,26 @@
</head>
<body id='page'>
- <h1>GRAS Status Monitor</h1>
- <div id="overall_config">
+ <div id="chart_designer">
<table>
- <tr><th colspan="2">Throughput options</th></tr>
- <tr>
- <td colspan="2">Updates/sec: <input type="number" name="rate" min="1" max="10" size="4" /></td>
- </tr>
- <tr>
- <td><label>Active?</label><input type="checkbox" name="active" /></td>
- <td><label>Show?</label><input type="checkbox" name="show" /></td>
- </tr>
+ <tr>
+ <th id="top_name">Blocks Available</th>
+ <th>Chart Types</th>
+ <th>Global Options</th>
+ </tr>
+ <tr>
+ <td id="chart_designer_blocks" rowspan='2'></td>
+ <td><select id="chart_type_selector" /></td>
+ <td><label>Updates/sec:</label><input id="chart_update_rate" type="number" name="rate" min="1" max="10" size="4" /></td>
+ </tr>
+ <tr>
+ <td><input type="submit" value="Create New Chart" id="chart_factory_button" /></td>
+ <td><label>Active?</label><input id="chart_active_state" type="checkbox" name="active" /></td>
+ </tr>
</table>
</div>
- <div id="block_enables">
- <table>
- <tr><th>Block enables</th></tr>
- <tr><td></td></tr>
- </table>
- </div>
- <div style="clear:both;"></div>
- <div id="overall_chart">
- <table>
- <tr><th>Thoughput (MIps) per block vs time (seconds)</th></tr>
- <tr>
- <td></td>
- </tr>
- </table>
- </div>
- <div id="overall_chart_pie">
- <table>
- <tr><th>Overhead compare</th></tr>
- <tr>
- <td></td>
- </tr>
- </table>
- </div>
- <div id="per_block_charts">
+ <div id="charts_panel"></div>
+ <div style="display:none" id="div-dialog-warning">
</div>
</body>
diff --git a/python/gras/stats/main.js b/python/gras/stats/main.js
index dc04e73..a27c0b7 100644
--- a/python/gras/stats/main.js
+++ b/python/gras/stats/main.js
@@ -1,4 +1,23 @@
/***********************************************************************
+ * Some constants
+ **********************************************************************/
+var GRAS_CHARTS_STD_WIDTH = 250;
+
+/***********************************************************************
+ * Stats registry data structure
+ **********************************************************************/
+var GrasStatsRegistry = function()
+{
+ this.init = false;
+ this.overall_rate = 2.0;
+ this.overall_active = true;
+ this.block_ids = new Array();
+ this.top_id = 'top';
+ this.online = true;
+ this.offline_count = 0;
+}
+
+/***********************************************************************
* Query stats
**********************************************************************/
var gras_query_stats = function(registry)
@@ -10,14 +29,22 @@ var gras_query_stats = function(registry)
dataType: "xml",
success: function(xml)
{
+ registry.online = true;
+ gras_chart_factory_online(registry);
if (registry.overall_active)
{
if ($(xml, "gras_stats") !== undefined)
{
- registry.appendPoint(xml);
- gras_update_throughput_chart(registry);
- gras_update_time_compare_chart(registry);
- gras_update_per_block_charts(registry);
+ if (!registry.init)
+ {
+ gras_chart_factory_setup(registry, xml);
+ try{gras_chart_load(registry);}catch(e){}
+ registry.init = true;
+ }
+ $.each(registry.active_charts, function(index, chart_info)
+ {
+ chart_info.chart.update(xml);
+ });
}
registry.timeout_handle = window.setTimeout(function()
@@ -25,7 +52,16 @@ var gras_query_stats = function(registry)
gras_query_stats(registry);
}, Math.round(1000/registry.overall_rate));
}
- }
+ },
+ error: function()
+ {
+ registry.online = false;
+ gras_chart_factory_online(registry);
+ registry.timeout_handle = window.setTimeout(function()
+ {
+ gras_query_stats(registry);
+ }, 1000);
+ },
});
}
@@ -35,39 +71,6 @@ var gras_query_stats = function(registry)
var gras_stats_main = function()
{
var registry = new GrasStatsRegistry();
- var overall_config = $('#overall_config').get(0);
-
- gras_setup_overall_chart(registry);
- gras_setup_overall_chart_pie(registry);
-
- //init overall config gui element for rate
- var overall_rate = $('input[name="rate"]', overall_config);
- overall_rate.val(registry.overall_rate);
- overall_rate.change(function()
- {
- registry.overall_rate = overall_rate.val();
- });
-
- //init overall config gui element for activity
- registry.overall_active = true;
- var overall_active = $('input[name="active"]', overall_config);
- overall_active.attr('checked', registry.overall_active);
- overall_active.change(function()
- {
- registry.overall_active = overall_active.is(':checked');
- if (registry.overall_active) gras_query_stats(registry);
- else window.clearInterval(registry.timeout_handle);
- });
-
- //init overall config gui element for showing
- var overall_show = $('input[name="show"]', overall_config);
- overall_show.attr('checked', false);
- overall_show.change(function()
- {
- var chart = $('#overall_chart');
- gras_animate_show_hide(chart, overall_show.is(':checked'));
- });
- overall_show.change();
-
+ gras_chart_factory_init(registry);
gras_query_stats(registry);
}
diff --git a/python/gras/stats/registry.js b/python/gras/stats/registry.js
deleted file mode 100644
index e663583..0000000
--- a/python/gras/stats/registry.js
+++ /dev/null
@@ -1,36 +0,0 @@
-/***********************************************************************
- * Stats registry data structure
- **********************************************************************/
-var GrasStatsRegistry = function()
-{
- this.ids = new Array();
- this.enables = new Array();
- this.history = new Array();
- this.block_enables = new Array();
- this.overall_rate = 2.0;
- this.overall_active = true;
- this.block_charts = new Array();
-}
-
-GrasStatsRegistry.prototype.appendPoint = function(point)
-{
- this.history.push(point);
- var self = this;
- if (this.history.length == 1)
- {
- $('block', this.history[0]).each(function()
- {
- self.ids.push($(this).attr('id'));
- });
- }
-};
-
-GrasStatsRegistry.prototype.getBlockIds = function()
-{
- var ids = new Array();
- $('block', this.history[0]).each(function()
- {
- ids.push($(this).attr('id'));
- });
- return ids;
-};
diff --git a/python/gras/stats/utils.js b/python/gras/stats/utils.js
index cb7cbf2..f5e5ee8 100644
--- a/python/gras/stats/utils.js
+++ b/python/gras/stats/utils.js
@@ -34,6 +34,14 @@ var gras_extract_throughput = function(point, id)
return (total_items*tps)/(stats_time-start_time);
}
+var gras_extract_stat_time_delta = function(p0, p1)
+{
+ var t0 = parseInt($('now', p0).text());
+ var t1 = parseInt($('now', p1).text());
+ var tps = parseInt($('tps', p0).first().text());
+ return (t1-t0)/(tps);
+}
+
var gras_extract_percent_times = function(point, id)
{
var block_data = $('block[id="' + id + '"]', point);
@@ -58,3 +66,19 @@ var gras_animate_show_hide = function(elem, show)
if (show) elem.slideDown("fast");
else elem.slideUp("fast");
}
+
+var gras_error_dialog = function(error_title, error_text)
+{
+ $("#div-dialog-warning").text(error_text);
+ $("#div-dialog-warning").dialog({
+ title: error_title,
+ resizable: false,
+ height: 160,
+ modal: true,
+ buttons: {
+ "Ok" : function () {
+ $(this).dialog("close");
+ }
+ }
+ }).parent().addClass("ui-state-error");
+}