Merge branch 'query_work'

8 files changed, 105 insertions, 31 deletions

diff --git a/python/gras/query/__init__.py b/python/gras/query/__init__.py
index e25e22d..06c7b70 100644
--- a/python/gras/query/__init__.py
+++ b/python/gras/query/__init__.py
@@ -1,6 +1,6 @@
 import time
 import BaseHTTPServer
-
+import json
 import os
 __path__ = os.path.abspath(os.path.dirname(__file__))
 
@@ -16,15 +16,21 @@ class MyHandler(BaseHTTPServer.BaseHTTPRequestHandler):
     def do_GET(s):
         """Respond to a GET request."""
         args = server_registry[s.server]
-        if s.path.endswith('.json'):
+        path = s.path
+        if path.startswith('/'): path = path[1:]
+        if not path: path = 'main.html'
+        if path.endswith('.json'):
             s.send_response(200)
             s.send_header("Content-type", "application/json")
             s.end_headers()
-            s.wfile.write(args['top_block'].query(s.path))
+            if path == 'args.json':
+                arg_strs = dict((str(k), str(v)) for k, v in args.iteritems())
+                s.wfile.write(json.dumps(arg_strs))
+            elif path == 'stats.json':
+                s.wfile.write(args['top_block'].query(s.path))
+            else:
+                s.wfile.write(json.dumps({}))
             return
-        path = s.path
-        if path.startswith('/'): path = path[1:]
-        if not path: path = 'main.html'
         target = os.path.join(__path__, path)
         if os.path.exists(target):
             s.send_response(200)
diff --git a/python/gras/query/chart_factory.js b/python/gras/query/chart_factory.js
index 682a968..210ee18 100644
--- a/python/gras/query/chart_factory.js
+++ b/python/gras/query/chart_factory.js
@@ -12,13 +12,26 @@ var gras_chart_get_registry = function()
 }
 
 /***********************************************************************
+ * update after new query event
+ **********************************************************************/
+function gras_chart_factory_update(registry, point)
+{
+    $.each(registry.active_charts, function(index, chart_info)
+    {
+        chart_info.point = point; //store last data point
+        chart_info.chart.update(point);
+    });
+}
+
+/***********************************************************************
  * One time setup
  **********************************************************************/
 function gras_chart_factory_setup(registry, point)
 {
-    var id = point.id;
-    registry.top_id = id;
-    $('#top_name').append(' - ' + id);
+    //gui init for factory controls
+    gras_chart_factory_init(registry);
+
+    //block registry and checkboxes init
     $.each(point.blocks, function(id, block)
     {
         registry.block_ids.push(id);
@@ -33,6 +46,9 @@ function gras_chart_factory_setup(registry, point)
         $(div).append(input);
         $(container).append(div);
     });
+
+    //try to load last settings
+    try{gras_chart_load(registry);}catch(e){}
 }
 
 /***********************************************************************
@@ -127,7 +143,7 @@ function gras_chart_factory_make(registry, args)
     th_title.text(chart.title);
 
     //register the chart
-    var chart_info = {chart:chart,args:args};
+    var chart_info = {chart:chart,args:args,panel:chart_box};
     registry.active_charts.push(chart_info);
     $('#charts_panel').append(chart_box);
 
@@ -150,6 +166,35 @@ function gras_chart_factory_make(registry, args)
     //finish gui building
     chart_box.append(tr_title);
     chart_box.append(tr);
+
+    //implement draggable and resizable from jquery ui
+    var handle_stop = function(event, ui)
+    {
+        args['width'] = chart_box.width();
+        args['height'] = chart_box.height();
+        args['position'] = chart_box.offset();
+        chart.gc_resize = false;
+        chart.update(chart_info.point);
+        gras_chart_save(registry);
+    };
+
+    if ('default_width' in chart) chart_box.width(chart.default_width);
+    chart_box.resizable({stop: handle_stop, create: function(event, ui)
+    {
+        if ('width' in args) chart_box.width(args.width);
+        if ('height' in args) chart_box.height(args.height);
+    },
+    start: function(event, ui)
+    {
+        chart.gc_resize = true;
+        chart.update(chart_info.point);
+    }});
+
+    chart_box.css('position', 'absolute');
+    chart_box.draggable({stop: handle_stop, create: function(event, ui)
+    {
+        if ('position' in args) chart_box.offset(args.position);
+    }});
 }
 
 /***********************************************************************
@@ -188,7 +233,10 @@ function gras_chart_factory_init(registry)
     });
 
     //init overall config gui element for rate
-    var overall_rate = $('#chart_update_rate');
+    var overall_rate = $('#chart_update_rate').attr({size:3});
+    overall_rate.spinner({
+        min: 1, max: 10, stop: function(event, ui){$(this).change();}
+    });
     overall_rate.val(registry.overall_rate);
     overall_rate.change(function()
     {
diff --git a/python/gras/query/chart_handler_breakdown.js b/python/gras/query/chart_handler_breakdown.js
index 8e90fc3..459c2d3 100644
--- a/python/gras/query/chart_handler_breakdown.js
+++ b/python/gras/query/chart_handler_breakdown.js
@@ -14,6 +14,7 @@ function GrasChartHandlerBreakdown(args)
     this.chart = new google.visualization.PieChart(args.panel);
 
     this.title = "Handler Breakdown - " + this.block_id;
+    this.default_width = GRAS_CHARTS_STD_WIDTH;
 }
 
 GrasChartHandlerBreakdown.prototype.update = function(point)
@@ -29,9 +30,10 @@ GrasChartHandlerBreakdown.prototype.update = function(point)
     ]);
 
     var options = {
-        width:GRAS_CHARTS_STD_WIDTH,
         chartArea:{left:5,top:0,right:5,bottom:0,width:"100%",height:"100%"},
     };
+    if (this.gc_resize) options.width = 50;
+    if (this.gc_resize) options.height = 50;
 
     this.chart.draw(data, options);
 };
diff --git a/python/gras/query/chart_overall_throughput.js b/python/gras/query/chart_overall_throughput.js
index 4947479..280c10a 100644
--- a/python/gras/query/chart_overall_throughput.js
+++ b/python/gras/query/chart_overall_throughput.js
@@ -13,8 +13,9 @@ function GrasChartOverallThroughput(args)
     //make new chart
     this.chart = new google.visualization.LineChart(args.panel);
 
-    this.title = "Overall Throughput vs Time";
+    this.title = "Overall Throughput vs Time in MIps";
     this.history = new Array();
+    this.default_width = 2*GRAS_CHARTS_STD_WIDTH;
 }
 
 GrasChartOverallThroughput.prototype.update = function(point)
@@ -38,9 +39,9 @@ GrasChartOverallThroughput.prototype.update = function(point)
 
     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'},
     };
+    if (this.gc_resize) options.width = 50;
+    if (this.gc_resize) options.height = 50;
     this.chart.draw(chart_data, options);
 };
diff --git a/python/gras/query/chart_overhead_compare.js b/python/gras/query/chart_overhead_compare.js
index c373142..9ad324c 100644
--- a/python/gras/query/chart_overhead_compare.js
+++ b/python/gras/query/chart_overhead_compare.js
@@ -14,6 +14,7 @@ function GrasChartOverheadCompare(args)
     this.chart = new google.visualization.PieChart(args.panel);
 
     this.title = "Overhead Comparison";
+    this.default_width = GRAS_CHARTS_STD_WIDTH;
 }
 
 GrasChartOverheadCompare.prototype.update = function(point)
@@ -29,9 +30,10 @@ GrasChartOverheadCompare.prototype.update = function(point)
     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%"},
     };
+    if (this.gc_resize) options.width = 50;
+    if (this.gc_resize) options.height = 50;
 
     this.chart.draw(data, options);
 };
diff --git a/python/gras/query/main.css b/python/gras/query/main.css
index b5f62f1..2665e32 100644
--- a/python/gras/query/main.css
+++ b/python/gras/query/main.css
@@ -31,6 +31,12 @@ margin-right:10px;
 margin-left:2px;
 }
 
+#charts_panel
+{
+width:100%;
+height:100%;
+}
+
 .chart_total_io_counts li
 {
 list-style-type:none;
@@ -42,7 +48,7 @@ font-size:90%;
 
 .chart_container
 {
-float:left;
+float:none;
 }
 
 #page{
diff --git a/python/gras/query/main.html b/python/gras/query/main.html
index eeb221d..04e5a49 100644
--- a/python/gras/query/main.html
+++ b/python/gras/query/main.html
@@ -3,7 +3,7 @@
 <head>
     <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
     <meta http-equiv="Content-Style-Type" content="text/css" />
-    <title>GRAS Status Monitor</title>
+    <title>GRAS Query Client</title>
     <link rel="stylesheet" type="text/css" href="/main.css" />
     <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>
@@ -33,7 +33,10 @@
             <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>
+                <td>
+                    <label for="spinner">Updates/sec:</label>
+                    <input id="chart_update_rate" type="spinner" />
+                </td>
             </tr>
             <tr>
                 <td><input type="submit" value="Create New Chart" id="chart_factory_button" /></td>
diff --git a/python/gras/query/main.js b/python/gras/query/main.js
index 80791b9..8a261f9 100644
--- a/python/gras/query/main.js
+++ b/python/gras/query/main.js
@@ -8,7 +8,6 @@ var GRAS_CHARTS_STD_WIDTH = 250;
  **********************************************************************/
 var GrasStatsRegistry = function()
 {
-    this.init = false;
     this.overall_rate = 2.0;
     this.overall_active = true;
     this.block_ids = new Array();
@@ -33,16 +32,7 @@ var gras_query_stats = function(registry)
             gras_chart_factory_online(registry);
             if (registry.overall_active)
             {
-                if (!registry.init)
-                {
-                    gras_chart_factory_setup(registry, response);
-                    try{gras_chart_load(registry);}catch(e){}
-                    registry.init = true;
-                }
-                $.each(registry.active_charts, function(index, chart_info)
-                {
-                    chart_info.chart.update(response);
-                });
+                gras_chart_factory_update(registry, response);
 
                 registry.timeout_handle = window.setTimeout(function()
                 {
@@ -67,7 +57,23 @@ var gras_query_stats = function(registry)
  **********************************************************************/
 var gras_stats_main = function()
 {
+    //create a new registry - storage for gui state
     var registry = new GrasStatsRegistry();
-    gras_chart_factory_init(registry);
+
+    //query various server args
+    $.getJSON('/args.json', function(data)
+    {
+        registry.top_id = data.name;
+        $('#top_name').append(' - ' + registry.top_id);
+        document.title += ' - ' + registry.top_id;
+    });
+
+    //query the stats for initial setup
+    $.getJSON('/stats.json', function(data)
+    {
+        gras_chart_factory_setup(registry, data);
+    });
+
+    //start the query loop in the background
     gras_query_stats(registry);
 }