summaryrefslogtreecommitdiffstats
path: root/application/views/scripts/statistics/type.phtml
blob: 2677f4ebda634eff7d0e343d9c414fe7a12fc3a0 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<h1>Statistics</h1>
<h2>What types of events are used?</h2>

<link
  rel="stylesheet" type="text/css"
  href="/media/css/jquery.jqplot.min.css" />

<select id="poolselectbox" name="PoolSelectbox"
  onclick="setPoolIDtmp();" onChange="fetchPoolEvents();">
  <option value="default">Please choose a Pool</option>
  <option value="all">All Pools</option>
</select>

<script>

//fetch all poolevents of the selected #poolselectbox value
function fetchPoolEvents() {
  poolID = $("#poolselectbox option:selected").val();
  plot();
}

function setPoolIDtmp() {
    poolIDtmp = $("#poolselectbox option:selected").val();
  }

function plot() {
    poolID = $("#poolselectbox option:selected").val();
    $.get("/statistics/typelist/poolID/" + poolID, function(data) {
          if(data.dataBar == '0,other,0,repeat,0,immediate' && poolID != 'default') {
              $('#plotBar').empty();
              $('#plotPie').empty();
              $( "#noEventsDialog" ).dialog('open');
            } else if (poolID == 'default') {
              $('#plotBar').empty();
              $('#plotPie').empty();
            } else refreshPlot(data.dataBar, data.dataPie, data.color);
        }, "json");
}

function refreshPlot(dataBar, dataPie, color) {
    $('#plotBar').empty();
    $.jqplot('plotBar', dataBar, {
          seriesDefaults: {
          //renderer: $.jqplot.PieRenderer,
          renderer:$.jqplot.BarRenderer,
          pointLabels: { show: true, location: 'e', edgeTolerance: -15 },
          shadowAngle: 135,
          rendererOptions: {
              //showDataLabels: true,
              barDirection: 'horizontal',
              varyBarColor : true
          }
      },
      axes: {
          yaxis: {
              renderer: $.jqplot.CategoryAxisRenderer
          }
      },
      seriesColors: color,
      highlighter: { show: false }
      });
    $('#plotPie').empty();
    $.jqplot('plotPie', dataPie,
                    {
                      seriesDefaults: {
                        // Make this a pie chart.
                        renderer: jQuery.jqplot.PieRenderer,
                        rendererOptions: {
                          // Put data labels on the pie slices.
                          // By default, labels show the percentage of the slice.
                          showDataLabels: true,
                          lineLabels: true,
                          varyBarColor : true
                        }
                      },
                      seriesColors: color
                      //legend: { show:true, location: 'e' }
                    });
  }

$(document).ready(function(){

   //fetch poollist from pbs database
    $.get("/event/getpoollist/", function(getpoollistresult){
      $("#poolselectbox").append(getpoollistresult);
      poolIDtmp = $("#poolselectbox option:selected").val();
      fetchPoolEvents();
      });
});

$(function() {
    $( "#noEventsDialog" ).dialog({
            autoOpen: false,
            width: 600,
      modal: true,
      title: "No Events",
            buttons: { 
              "OK": function() { 
                $(this).dialog("close");
              }
            },
      open: function () {
                $(".ui-dialog-titlebar-close").hide();
                //$(this).parents(".ui-dialog:first").find(".ui-dialog-titlebar").addClass("ui-state-error");
            }
    });
  }); 

</script>

<div>
<div id="plotBar" class="spalte"
  style="height: 300px; width: 350px;"></div>
<div id="plotPie" class="spalte"
  style="height: 300px; width: 350px;"></div>
</div>

<!-- no events -->
<div id="noEventsDialog" style="display: none">
<p>There are no events in this pool to plot a statistic.</p>
</div>