Changeset 9643

Timestamp:

06/18/13 17:24:29 (11 years ago)

Author:

pfleck

Message:

#2063:
Added time selection for charts.
Implemented redrawing of charts using Ajax.

Location:

branches/HiveStatistics/sources/HeuristicLab.Services.Hive.Statistics/3.3

Files:

• App_Code/ChartHelper.cshtml (modified) (2 diffs)
• Controllers/ChartDataController.cs (modified) (3 diffs)
• Views/Home/Index.cshtml (modified) (3 diffs)

branches/HiveStatistics/sources/HeuristicLab.Services.Hive.Statistics/3.3/App_Code/ChartHelper.cshtml

@@ -50 +50 @@
             },
             dataRenderer: ajaxDataRenderer,
-            dataRendererOptions: {
-                unusedOptionalUrl: "@url"
-            },
             axes: {
                 xaxis: {
@@ -97 +94 @@
     </script>
 }
+
+@helper RefreshChart(string destinationTag, string url, string startDateVar, string endDateVar) {
+    @:$.ajax({url: "@(new HtmlString(url))?start=" + @startDateVar + "&end=" + @endDateVar, datatype: "json", success: function(result) {
+    @:    for (var i = 0; i < result.length; i++) {
+    @:        @(destinationTag)Plot.series[i].data = result[i];
+    @:    }
+    @:    @(destinationTag)Plot.replot( {resetAxes: true} )
+    @:}});
+}

branches/HiveStatistics/sources/HeuristicLab.Services.Hive.Statistics/3.3/Controllers/ChartDataController.cs

@@ -84 +84 @@
 
       return from ci in db.FactClientInfos
-             where ci.DimTime.Time > start && ci.DimTime.Time < end
-             group ci by ci.DimTime.Time into timeGroup
+             where ci.Time > start && ci.Time < end
+             group ci by ci.Time into timeGroup
              orderby timeGroup.Key
              select timeGroup;
@@ -93 +93 @@
       return selectors.Select(selector =>
         data.Select(x => new[] {
-          timeSelector(x).ToString("yyyy-MM-dd HH:mm"),
+          //timeSelector(x).ToString("yyyy-MM-dd HH:mm"),
+          timeSelector(x).ToUnixTimestamp(),
           selector(x)
         })
@@ -99 +100 @@
     }
   }
+
+  public static class DateTimeExtensions {
+    public static long ToUnixTimestamp(this DateTime d) {
+      var duration = d - new DateTime(1970, 1, 1, 0, 0, 0);
+
+      return (long)duration.TotalMilliseconds;
+    }
+  }
 }

branches/HiveStatistics/sources/HeuristicLab.Services.Hive.Statistics/3.3/Views/Home/Index.cshtml

@@ -36 +36 @@
 </section>
 
+<fieldset>
+        <legend>Range</legend>
+        <ol>
+            <li>Start</li>
+            <li>
+                @Html.TextBox("Start", (DateTime.Now - new TimeSpan(1, 0, 0, 0)).ToString("yyyy-MM-dd"), new { @class = "date" })
+            </li>
+            <li>End</li>
+            <li>
+                @Html.TextBox("End", DateTime.Now.ToString("yyyy-MM-dd"), new { @class = "date" })
+            </li>
+        </ol>
+        <button id="refresh">Refresh</button>
+    </fieldset>
+
 <section class="charts">
     <div id="AverageCpuUtilization"></div>
@@ -44 +59 @@
 @section Styles {
     @Styles.Render("~/Styles/jqPlot/jquery.jqplot")
+    @Styles.Render("~/Content/themes/base/css")
 }
 
 @section Scripts {
+    @Scripts.Render("~/bundles/jqueryui")
+    <script>
+    $("#refresh").button({
+        icons: {
+            primary: "ui-icon-refresh"
+        }
+    });
+    </script>
+
     @Scripts.Render("~/Scripts/jqPlot/jquery.jqplot")
     @ChartHelper.AjaxDataRenderer()
@@ -68 +93 @@
         title: "Memory / Used Memory (GB)",
         minY: 0)
+
+    <script>
+        $(document).ready(function () {
+            $(".date").datepicker({
+                dateFormat: "yy-mm-dd",
+                onSelect: function () { refreshCharts(); }
+            });
+
+            $("#refresh").click(function() {
+                refreshCharts();
+            });
+
+            
+        });
+        
+        function refreshCharts() {
+            var startDate = $('#Start').val();
+            var endDate = $('#End').val();
+            
+                        @*
+            var url = "@Url.Action("AverageCpuUtilization", "ChartData")?start=" + startDate + "&end" + endDate;
+            
+            @ChartHelper.LineChartTime(
+                "AverageCpuUtilization",
+                "url",
+                title: "Avg. CPU Utilization History of all Slaves",
+                axisYFormat: "%.2f%%",
+                minY: 0, maxY: 100)
+            *@
+
+            @ChartHelper.RefreshChart("AverageCpuUtilization", Url.Action("AverageCpuUtilization", "ChartData"), "startDate", "endDate")
+            @ChartHelper.RefreshChart("UsedCores", Url.Action("UsedCores", "ChartData"), "startDate", "endDate")
+            @ChartHelper.RefreshChart("UsedMemory", Url.Action("UsedMemory", "ChartData"), "startDate", "endDate")
+        }
+    </script>
 }