Free cookie consent management tool by TermsFeed Policy Generator

Ignore:
Timestamp:
06/24/14 16:20:29 (11 years ago)
Author:
mroscoe
Message:
 
File:
1 edited

Legend:

Unmodified
Added
Removed

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

    r11030 r11036  
    8484        });
    8585       
    86         @(destinationTag)Plot.replot({ resetAxes: true });
    87        
    88         $('#@destinationTag').contextmenu(function() {
    89             @(destinationTag)Plot.resetZoom();
    90             @(destinationTag)Plot.replot({ resetAxes: true });
    91             return false;
    92         });
    93        
    9486        $(window).resize(function() {
    9587            @(destinationTag)Plot.replot({ resetAxes: true });
    … …  
    9890}
    9991
    100 @helper RefreshChart(string destinationTag, string url, string startDateVar, string endDateVar)
    101 {
    102   <text>
    103   $.ajax({url: "@(new HtmlString(url))?start=" + @startDateVar + "&end=" + @endDateVar, datatype: "json", success: function(result) {
     92@helper RefreshChart(string destinationTag, string url, string startDate, string endDate)
     93{
     94  <text>
     95  $.ajax({url: "@(new HtmlString(url))?start=" + @startDate + "&end=" + @endDate, datatype: "json", success: function(result) {
    10496    for (var i = 0; i < result.length; i++) {
    10597      @(destinationTag)Plot.series[i].data = result[i];
    … …  
    110102}
    111103
    112 @helper TasksForUser(string container, string destinationTag, string pageUrl, string taskUrl, string functionName, string userName, string limit, string startDate = null, string endDate = null, string jobId=null, string taskState=null, string pageNumber=null)
     104@helper NumberPages(string records, string limit, string container, string functionName, string currentPage = null)
     105{
     106  <text>
     107    if(@(records).length > @limit) {
     108      $("#@container").append('<label class="pageTitle">Page: </label>')
     109      var pages = Math.floor(@(records).length/@(limit)) + 1;
     110      for(var i=0; i < pages; i++) {
     111        $("#" + "@container").append('<a id="@(container)Page' + (i + 1) + '" class="page">' + (i + 1) + '</a>')
     112      }
     113      if(@currentPage != null) {
     114        $("#@(container)Page" + @currentPage).css('color','#F7921D');
     115      }
     116      else {
     117        $("#@(container)Page1").css('color','#F7921D');
     118      }
     119      $(".page").click(function () {
     120        pageNumber = $(this).html();
     121        @(functionName)();
     122      });
     123      if(@currentPage != null) {
     124        @(records).splice(0,(@(currentPage)-1)*@(limit));
     125        if (@(records).length > @(limit)) {
     126          @(records).splice(@(limit), @(records).length - @(limit));
     127        }
     128      }
     129      else {
     130        @(records).splice(@(limit), @(records).length - @(limit));
     131      }
     132    }
     133  </text>
     134}
     135
     136@helper TasksForUser(string container, string destinationTag, string url, string functionName, string userName, string limit, string startDate = null, string endDate = null, string jobId=null, string taskState=null, string pageNumber=null)
    113137{
    114138  <text>
    … …  
    134158      @:}
    135159    }
    136     $.ajax({async: false, url: "@(new HtmlString(pageUrl))" + GetRequest, datatype: "json", success: function(result) {
    137       if(result > 1) {
    138         $("#@container").append('<label class="pageTitle">Page: </label>')
    139         for(var i=0; i < result; i++) {
    140           $("#" + "@container").append('<a id="Page' + (i + 1) + '" class="page">' + (i + 1) + '</a>')
    141         }
    142         if(@pageNumber != null) {
    143           $("#Page" + @pageNumber).css('color','#F7921D');
    144         }
    145         else {
    146           $("#Page1").css('color','#F7921D');
    147         }
    148       }
    149     }});
    150     @if(pageNumber!=null) {
    151       @:if(@(pageNumber)!=null) {
    152         @:GetRequest += "&currentPage=" + @pageNumber;
    153       @:}
    154     }
    155     $.ajax({url: "@(new HtmlString(taskUrl))" + GetRequest, datatype: "json", success: function(result) {
    156       if(result.Key.length==0) {
     160    $.ajax({
     161      async: false, url: "@(new HtmlString(url))" + GetRequest, datatype: "json", success: function(result) {
     162      if(result.length==0) {
    157163        $("#@container").append(
    158164          '<section class="chartContainer"><h1 class="title">' + @userName + ' has no tasks for the specified filters!</h1></section>'
    … …  
    164170      var seriesDescriptions = ["Time waiting","Time transferring","Time calculating"];
    165171
     172      //Checks if multipage display, if it is then trims results to
     173      //the results for the page to be displayed
     174      @ChartHelper.NumberPages("result",limit,container,functionName,pageNumber)
     175
    166176      //Globally accesible, for use when resizing, eliminates extra DB request
    167       window["numberTasks"] = result.Key.length;
     177      window["numberTasks"] = result.length;
    168178
    169179      //Set display of all errors to none, errors matching the tasks will be reset below
    … …  
    171181
    172182      //For each result create a seperate collapsable section with a chart and info label
    173       for(var i = 0; i < result.Key.length; i++){
     183      for(var i = 0; i < result.length; i++){
    174184        $("#" + "@container").append(
    175           '<section class="chartContainer"><h1 class="title" id="' + result.Key[i] + '">Task ' + result.Key[i] +
     185          '<section class="chartContainer"><h1 class="title" id="' + result[i].Key + '">Task ' + result[i].Key +
    176186          '</h1><button class="collapse" onclick="collapseSection(this)">+</button><div id="@(destinationTag)' + i +
    177187          '"></div><label id="@(destinationTag)' + i + 'Info"></label></section>'
    178188        )
     189        //Re-enables the error display if any of the tasks on the page have Ids matching
     190        //those of errors
    179191        $(".errorTask").each(function() {
    180           if($(this).html()==result.Key[i]) {
    181             $("#" + result.Key[i]).css("color","red");
    182             $("#" + result.Key[i]).append(" - ERROR");
     192          if($(this).html()==result[i].Key) {
     193            $("#" + result[i].Key).css("color","red");
     194            $("#" + result[i].Key).append(" - ERROR");
    183195            $(".errorContainer, .errorTitle, .underline").css('display','inline-block');
    184196            $(this).css('display','inline-block');
    … …  
    186198          }
    187199        });
    188         waitTime = [result.Value[0][i]];
    189         transferTime = [result.Value[1][i]];
    190         runTime = [result.Value[2][i]];
     200        waitTime = [result[i].Value[0]];
     201        transferTime = [result[i].Value[1]];
     202        runTime = [result[i].Value[2]];
    191203        window["@(destinationTag)Plot" + i] = $.jqplot("@destinationTag" + i, [waitTime,transferTime,runTime], {
    192204          seriesDefaults:{
    … …  
    225237        });
    226238
    227         window["@(destinationTag)Plot" + i].replot({ resetAxes: true });
    228 
    229         $('#@destinationTag' + i).contextmenu(function() {
    230           window["@(destinationTag)Plot" + i].resetZoom();
    231           window["@(destinationTag)Plot" + i].replot({ resetAxes: true });
    232           return false;
    233         });
    234 
    235239        collapsedByDefault(document.getElementById("@(destinationTag)" + i));
    236240      }
    237241    }});
    238 
    239     $(".page").click(function () {
    240       pageNumber = $(this).html();
    241       @(functionName)();
    242     });
    243242  </text>
    244243}
    … …  
    247246{
    248247  <text>
     248  //Resize event, resets bar width for task charts and replots them
    249249  $(window).resize(function() {
    250250    for(var i = 0; i < numberTasks; i++) {
    … …  
    393393  </text>
    394394}
     395
     396@helper SlaveInfoChart(string destinationTag, string url, string limit, string startDate, string endDate, string userName, string functionName, string pageNumber=null)
     397{
     398  <text>
     399  var GetRequest = "?limit=" + @(limit);
     400  @if(startDate!=null) {
     401    @:if(@(startDate)!=null) {
     402      @:GetRequest += "&start=" + @startDate;
     403    @:}
     404  }
     405  @if(endDate!=null) {
     406    @:if(@(endDate)!=null) {
     407      @:GetRequest += "&end=" + @endDate;
     408    @:}
     409  }
     410  @if (userName != null) {
     411    @:if(@(userName)!=null) {
     412      @:GetRequest += "&userName=" + @userName;
     413    @:}
     414  }
     415  $.ajax({
     416    async: false, url: "@(new HtmlString(url))" + GetRequest, datatype: "json", success: function(result) {
     417    $("#@(destinationTag)").html("");
     418    var time = new Date();
     419
     420    //Checks if multipage display, if it is then trims results to
     421    //the results for the page to be displayed
     422    @ChartHelper.NumberPages("result",limit,destinationTag,functionName,pageNumber)
     423
     424    for(i = 0; i < result.length; i++) {
     425      var coreSeries = [];
     426      coreSeries[0] = [];
     427      coreSeries[1] = [];
     428      var memorySeries = [];
     429      memorySeries[0] = [];
     430      memorySeries[1] = [];
     431      var cpuSeries = [];
     432      cpuSeries[0] = [];
     433      $("#@(destinationTag)").append('<section class="chartContainer"><h1 class="title" id="' + result[i][0].SlaveID + '">Slave '
     434        + result[i][0].SlaveID + '</h1><button class="collapse" onclick="collapseSection(this)">+</button>' +
     435        '<div id="TotalUsedCores' + result[i][0].SlaveID + '"></div><div id="TotalUsedMemory' + result[i][0].SlaveID + '"></div>' +
     436        '<div id="CPUUtilization' + result[i][0].SlaveID + '"></div></section>');
     437        for(j = 0; j < result[i].length; j++) {
     438          time.setTime(result[i][j].Time.replace(/\D/g,''));
     439          coreSeries[0].push([time.toUTCString(),result[i][j].TotalCores]);
     440          coreSeries[1].push([time.toUTCString(),result[i][j].UsedCores]);
     441          memorySeries[0].push([time.toUTCString(),(result[i][j].TotalMemory / 1000)]);
     442          memorySeries[1].push([time.toUTCString(),(result[i][j].UsedMemory / 1000)]);
     443          cpuSeries[0].push([time.toUTCString(),result[i][j].CPUUtilization]);
     444        }
     445      if(result[i].length > 1) {
     446        @ChartHelper.LineChartGivenSeries("TotalUsedCores","result[i][0].SlaveID","coreSeries","Total/Used Cores")
     447        @ChartHelper.LineChartGivenSeries("TotalUsedMemory","result[i][0].SlaveID","memorySeries","Total/Used Memory")
     448        @ChartHelper.LineChartGivenSeries("CPUUtilization","result[i][0].SlaveID","cpuSeries","CPU Utilization",0,100,"%.1f%%")
     449      }
     450      else {
     451        @ChartHelper.BarChartGivenSeries("TotalUsedCores","result[i][0].SlaveID","coreSeries","Total/Used Cores")
     452        @ChartHelper.BarChartGivenSeries("TotalUsedMemory","result[i][0].SlaveID","memorySeries","Total/Used Memory")
     453        @ChartHelper.BarChartGivenSeries("CPUUtilization","result[i][0].SlaveID","cpuSeries","CPU Utilization",0,100,"%.1f%%")
     454      }
     455      collapsedByDefault(document.getElementById("UsedTotalCores" + result[i][0].SlaveID));
     456      collapsedByDefault(document.getElementById("UsedTotalMemory" + result[i][0].SlaveID));
     457      collapsedByDefault(document.getElementById("CPUUtilization" + result[i][0].SlaveID));
     458    }
     459  }});
     460  </text>
     461}
     462
     463@helper LineChartGivenSeries(string destinationTag, string chartId, string series, string title, double? minY = null, double? maxY = null, string axisYFormat = null)
     464{
     465  <text>
     466  window["@(destinationTag)" + @(chartId) + "Plot"] = $.jqplot("@(destinationTag)" + @(chartId), @series, {
     467    title: "@title",
     468    axes: {
     469      xaxis: {
     470        renderer: $.jqplot.DateAxisRenderer,
     471        tickOptions:{formatString:'%b %#d, %y'},
     472        pad: 0
     473      },
     474      yaxis: {
     475        @if (axisYFormat != null) {
     476          <text>
     477          tickOptions: {
     478              formatString: "@axisYFormat"
     479          },
     480          </text>
     481        }
     482        @if (minY != null) {
     483            @:min: @minY,
     484        }
     485        @if (maxY != null) {
     486            @:max: @maxY,
     487        }
     488        pad: 0
     489      }
     490    },
     491    gridPadding: { left: 50, right: 10 },
     492    cursor: {
     493      show: true,
     494      showTooltip: false,
     495      zoom: true,
     496      clickReset: false,
     497      dblClickReset: false,
     498      constrainZoomTo: 'x'
     499    }
     500  });
     501
     502  $(window).resize(function() {
     503    window["@(destinationTag)" + @(chartId) + "Plot"].replot({ resetAxes: true });
     504  });
     505  </text>
     506}
     507
     508@helper BarChartGivenSeries(string destinationTag, string chartId, string series, string title, double? minY = null, double? maxY = null, string axisYFormat = null)
     509{
     510  <text>
     511  window["@(destinationTag)" + @(chartId) + "Plot"] = $.jqplot("@(destinationTag)" + @(chartId), @series, {
     512    title: "@title",
     513    seriesDefaults:{
     514      renderer:$.jqplot.BarRenderer,
     515      shadowAngle: 135,
     516      pointLabels: {show: true, formatString: '%.2f'}
     517    },
     518    axes: {
     519      xaxis: {
     520        renderer: $.jqplot.CategoryAxisRenderer,
     521        tickOptions:{formatString:'%b %#d, %y'},
     522        pad: 0
     523      },
     524      yaxis: {
     525        @if (axisYFormat != null) {
     526          <text>
     527          tickOptions: {
     528              formatString: "@axisYFormat"
     529          },
     530          </text>
     531        }
     532        @if (minY != null) {
     533            @:min: @minY,
     534        }
     535        @if (maxY != null) {
     536            @:max: @maxY,
     537        }
     538        pad: 0
     539      }
     540    },
     541    gridPadding: { left: 50, right: 10 },
     542    cursor: {
     543      show: true,
     544      showTooltip: false,
     545      zoom: true,
     546      clickReset: false,
     547      dblClickReset: false,
     548      constrainZoomTo: 'x'
     549    }
     550  });
     551
     552  $(window).resize(function() {
     553    $.each(window["@(destinationTag)" + @(chartId) + "Plot"].series, function(index, series) {
     554      series.barWidth = undefined;
     555    });
     556    window["@(destinationTag)" + @(chartId) + "Plot"].replot({ resetAxes: true });
     557  });
     558
     559  </text>
     560}
Note: See TracChangeset for help on using the changeset viewer.