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