Subversion-Projekte lars-tiefland.laravel_shop

Revision

Zur aktuellen Revision | Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
148 lars 1 
<!DOCTYPE html>
2 
<html lang="en">
3 
 <head>
4 
  <meta charset="UTF-8">
5 
  <title>Dashboard for {{full_path}}</title>
6 
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7 
  <link href="{{path_to_root}}_css/bootstrap.min.css" rel="stylesheet" type="text/css">
8 
  <link href="{{path_to_root}}_css/nv.d3.min.css" rel="stylesheet" type="text/css">
9 
  <link href="{{path_to_root}}_css/style.css" rel="stylesheet" type="text/css">
10 
  <link href="{{path_to_root}}_css/custom.css" rel="stylesheet" type="text/css">
11 
 </head>
12 
 <body>
13 
  <header>
14 
   <div class="container-fluid">
15 
    <div class="row">
16 
     <div class="col-md-12">
17 
      <nav aria-label="breadcrumb">
18 
       <ol class="breadcrumb">
19 
{{breadcrumbs}}
20 
       </ol>
21 
      </nav>
22 
     </div>
23 
    </div>
24 
   </div>
25 
  </header>
26 
  <div class="container-fluid">
27 
   <div class="row">
28 
    <div class="col-md-12">
29 
     <h2>Classes</h2>
30 
    </div>
31 
   </div>
32 
   <div class="row">
33 
    <div class="col-md-6">
34 
     <h3>Coverage Distribution</h3>
35 
     <div id="classCoverageDistribution" style="height: 300px;">
36 
       <svg></svg>
37 
     </div>
38 
    </div>
39 
    <div class="col-md-6">
40 
     <h3>Complexity</h3>
41 
     <div id="classComplexity" style="height: 300px;">
42 
       <svg></svg>
43 
     </div>
44 
    </div>
45 
   </div>
46 
   <div class="row">
47 
    <div class="col-md-6">
48 
     <h3>Insufficient Coverage</h3>
49 
     <div class="scrollbox">
50 
      <table class="table">
51 
       <thead>
52 
        <tr>
53 
         <th>Class</th>
54 
         <th class="text-right">Coverage</th>
55 
        </tr>
56 
       </thead>
57 
       <tbody>
58 
{{insufficient_coverage_classes}}
59 
       </tbody>
60 
      </table>
61 
     </div>
62 
    </div>
63 
    <div class="col-md-6">
64 
     <h3>Project Risks</h3>
65 
     <div class="scrollbox">
66 
      <table class="table">
67 
       <thead>
68 
        <tr>
69 
         <th>Class</th>
70 
         <th class="text-right"><abbr title="Change Risk Anti-Patterns (CRAP) Index">CRAP</abbr></th>
71 
        </tr>
72 
       </thead>
73 
       <tbody>
74 
{{project_risks_classes}}
75 
       </tbody>
76 
      </table>
77 
     </div>
78 
    </div>
79 
   </div>
80 
   <div class="row">
81 
    <div class="col-md-12">
82 
     <h2>Methods</h2>
83 
    </div>
84 
   </div>
85 
   <div class="row">
86 
    <div class="col-md-6">
87 
     <h3>Coverage Distribution</h3>
88 
     <div id="methodCoverageDistribution" style="height: 300px;">
89 
       <svg></svg>
90 
     </div>
91 
    </div>
92 
    <div class="col-md-6">
93 
     <h3>Complexity</h3>
94 
     <div id="methodComplexity" style="height: 300px;">
95 
       <svg></svg>
96 
     </div>
97 
    </div>
98 
   </div>
99 
   <div class="row">
100 
    <div class="col-md-6">
101 
     <h3>Insufficient Coverage</h3>
102 
     <div class="scrollbox">
103 
      <table class="table">
104 
       <thead>
105 
        <tr>
106 
         <th>Method</th>
107 
         <th class="text-right">Coverage</th>
108 
        </tr>
109 
       </thead>
110 
       <tbody>
111 
{{insufficient_coverage_methods}}
112 
       </tbody>
113 
      </table>
114 
     </div>
115 
    </div>
116 
    <div class="col-md-6">
117 
     <h3>Project Risks</h3>
118 
     <div class="scrollbox">
119 
      <table class="table">
120 
       <thead>
121 
        <tr>
122 
         <th>Method</th>
123 
         <th class="text-right"><abbr title="Change Risk Anti-Patterns (CRAP) Index">CRAP</abbr></th>
124 
        </tr>
125 
       </thead>
126 
       <tbody>
127 
{{project_risks_methods}}
128 
       </tbody>
129 
      </table>
130 
     </div>
131 
    </div>
132 
   </div>
133 
   <footer>
134 
    <hr/>
135 
    <p>
136 
     <small>Generated by <a href="https://github.com/sebastianbergmann/php-code-coverage" target="_top">php-code-coverage {{version}}</a> using {{runtime}}{{generator}} at {{date}}.</small>
137 
    </p>
138 
   </footer>
139 
  </div>
140 
  <script src="{{path_to_root}}_js/jquery.min.js" type="text/javascript"></script>
141 
  <script src="{{path_to_root}}_js/d3.min.js" type="text/javascript"></script>
142 
  <script src="{{path_to_root}}_js/nv.d3.min.js" type="text/javascript"></script>
143 
  <script type="text/javascript">
144 
$(document).ready(function() {
145 
  nv.addGraph(function() {
146 
    var chart = nv.models.multiBarChart();
147 
    chart.tooltips(false)
148 
      .showControls(false)
149 
      .showLegend(false)
150 
      .reduceXTicks(false)
151 
      .staggerLabels(true)
152 
      .yAxis.tickFormat(d3.format('d'));
153 
 
154 
    d3.select('#classCoverageDistribution svg')
155 
      .datum(getCoverageDistributionData({{class_coverage_distribution}}, "Class Coverage"))
156 
      .transition().duration(500).call(chart);
157 
 
158 
    nv.utils.windowResize(chart.update);
159 
 
160 
    return chart;
161 
  });
162 
 
163 
  nv.addGraph(function() {
164 
    var chart = nv.models.multiBarChart();
165 
    chart.tooltips(false)
166 
      .showControls(false)
167 
      .showLegend(false)
168 
      .reduceXTicks(false)
169 
      .staggerLabels(true)
170 
      .yAxis.tickFormat(d3.format('d'));
171 
 
172 
    d3.select('#methodCoverageDistribution svg')
173 
      .datum(getCoverageDistributionData({{method_coverage_distribution}}, "Method Coverage"))
174 
      .transition().duration(500).call(chart);
175 
 
176 
    nv.utils.windowResize(chart.update);
177 
 
178 
    return chart;
179 
  });
180 
 
181 
  function getCoverageDistributionData(data, label) {
182 
    var labels = [
183 
      '0%',
184 
      '0-10%',
185 
      '10-20%',
186 
      '20-30%',
187 
      '30-40%',
188 
      '40-50%',
189 
      '50-60%',
190 
      '60-70%',
191 
      '70-80%',
192 
      '80-90%',
193 
      '90-100%',
194 
      '100%'
195 
    ];
196 
    var values = [];
197 
    $.each(labels, function(key) {
198 
      values.push({x: labels[key], y: data[key]});
199 
    });
200 
 
201 
    return [
202 
      {
203 
        key: label,
204 
        values: values,
205 
        color: "#4572A7"
206 
      }
207 
    ];
208 
  }
209 
  nv.addGraph(function() {
210 
    var chart = nv.models.scatterChart()
211 
      .showDistX(true)
212 
      .showDistY(true)
213 
      .showLegend(false)
214 
      .forceX([0, 100]);
215 
    chart.tooltipContent(function(graph) {
216 
      return '<p>' + graph.point.class + '</p>';
217 
    });
218 
 
219 
    chart.xAxis.axisLabel('Code Coverage (in percent)');
220 
    chart.yAxis.axisLabel('Cyclomatic Complexity');
221 
 
222 
    d3.select('#classComplexity svg')
223 
      .datum(getComplexityData({{complexity_class}}, 'Class Complexity'))
224 
      .transition()
225 
      .duration(500)
226 
      .call(chart);
227 
 
228 
    nv.utils.windowResize(chart.update);
229 
 
230 
    return chart;
231 
  });
232 
 
233 
  nv.addGraph(function() {
234 
    var chart = nv.models.scatterChart()
235 
      .showDistX(true)
236 
      .showDistY(true)
237 
      .showLegend(false)
238 
      .forceX([0, 100]);
239 
    chart.tooltipContent(function(graph) {
240 
      return '<p>' + graph.point.class + '</p>';
241 
    });
242 
 
243 
    chart.xAxis.axisLabel('Code Coverage (in percent)');
244 
    chart.yAxis.axisLabel('Method Complexity');
245 
 
246 
    d3.select('#methodComplexity svg')
247 
      .datum(getComplexityData({{complexity_method}}, 'Method Complexity'))
248 
      .transition()
249 
      .duration(500)
250 
      .call(chart);
251 
 
252 
    nv.utils.windowResize(chart.update);
253 
 
254 
    return chart;
255 
  });
256 
 
257 
  function getComplexityData(data, label) {
258 
    var values = [];
259 
    $.each(data, function(key) {
260 
      var value = Math.round(data[key][0]*100) / 100;
261 
      values.push({
262 
        x: value,
263 
        y: data[key][1],
264 
        class: data[key][2],
265 
        size: 0.05,
266 
        shape: 'diamond'
267 
      });
268 
    });
269 
 
270 
    return [
271 
      {
272 
        key: label,
273 
        values: values,
274 
        color: "#4572A7"
275 
      }
276 
    ];
277 
  }
278 
});
279 
  </script>
280 
 </body>
281 
</html>