@model HeuristicLab.Services.Hive.Statistics.Models.OverallStatus

@{
  ViewBag.Title = "Status Monitor";
}

<h1>Current Status</h1>
<section class="chartContainer">
  <h1 class="title">Current Hive Status</h1>
  <button class="collapse">-</button>
  <div id="CurrentCPUUtilization"></div>
  <div id="CurrentTotalUsedCores"></div>
  <div id="CurrentTotalUsedMemory"></div>
</section>

<section class="chartContainer">
  <h1 class="title">Historic Hive Status</h1>
  <button class="collapse">-</button>
  <fieldset>
    <legend>Range</legend>
    <label>Start</label>
    @Html.TextBox("Start", (DateTime.Now - new TimeSpan(1, 0, 0, 0)).ToString("yyyy-MM-dd"), new { @class = "date" })
    <label>End</label>
    @Html.TextBox("End", (DateTime.Now + new TimeSpan(1, 0, 0, 0)).ToString("yyyy-MM-dd"), new { @class = "date" })
    <button id="Refresh">Refresh</button>
  </fieldset>
  <div id="AverageCpuUtilization"></div>
  <div id="UsedCores"></div>
  <div id="UsedMemory"></div>
</section>

@section Styles {
  @Styles.Render("~/Styles/jqPlot/jquery.jqplot")
  @Styles.Render("~/Content/themes/base/css")
}

@section Scripts {
  @Scripts.Render("~/bundles/jqueryui")
  @Scripts.Render("~/Scripts/smoothie.js")
  @Scripts.Render("~/Scripts/SmoothieChartResize.js")
  @Scripts.Render("~/Scripts/CollapsingSection.js")
  <script>
    $("#Refresh").button({
      icons: {
        primary: "ui-icon-refresh"
      }
    });
  </script>

  @Scripts.Render("~/Scripts/jqPlot/jquery.jqplot")
  @ChartHelper.AjaxDataRenderer()

  @ChartHelper.LineChartTime(
        "AverageCpuUtilization",
        Url.Action("AverageCpuUtilization", "ChartData"),
        title: "Avg. CPU Utilization History of all Slaves",
        axisYFormat: "%.2f%%",
        minY: 0, maxY: 100)

  @ChartHelper.LineChartTime(
        "UsedCores",
        Url.Action("UsedCores", "ChartData"),
        title: "Cores / Used Cores",
        minY: 0)

  @ChartHelper.LineChartTime(
        "UsedMemory",
        Url.Action("UsedMemory", "ChartData"),
        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();

      @ChartHelper.RefreshChart("AverageCpuUtilization", Url.Action("AverageCpuUtilization", "ChartData"), "startDate", "endDate",0,100)
      @ChartHelper.RefreshChart("UsedCores", Url.Action("UsedCores", "ChartData"), "startDate", "endDate",0)
      @ChartHelper.RefreshChart("UsedMemory", Url.Action("UsedMemory", "ChartData"), "startDate", "endDate",0)
    }

    $(document).ready(function () {
      @ChartHelper.SetStreamingProperties(1000,20,10)

      @ChartHelper.CreateStreamChart("CurrentCPU", "CurrentCPUUtilization",Url.Action("CurrentCpuUtilization","ChartData"),"Current CPU Utilization","%.2f%%",100.00)
      @ChartHelper.CreateStreamChart("CurrentCores", "CurrentTotalUsedCores",Url.Action("CurrentCores","ChartData"),"Current Total vs. Used Cores")
      @ChartHelper.CreateStreamChart("CurrentMemory", "CurrentTotalUsedMemory",Url.Action("CurrentMemory","ChartData"),"Current Total vs. Used Memory")

      function DoUpdate() {
        @ChartHelper.UpdateStreamChart("CurrentCPU","CurrentCPUUtilization", Url.Action("CurrentCpuUtilization","ChartData"),"FixedY")
        @ChartHelper.UpdateStreamChart("CurrentCores","CurrentTotalUsedCores", Url.Action("CurrentCores","ChartData"))
        @ChartHelper.UpdateStreamChart("CurrentMemory","CurrentTotalUsedMemory", Url.Action("CurrentMemory","ChartData"))
        setTimeout(DoUpdate, refreshRate);
      }

      DoUpdate();

    });
  </script>
}