<!DOCTYPE html>

<!–

Copyright (c) 2014 Oracle and/or its affiliates. All rights reserved. This
code is released under a tri EPL/GPL/LGPL license. You can use it,
redistribute it and/or modify it under the terms of the:

Eclipse Public License version 1.0
GNU General Public License version 2
GNU Lesser General Public License version 2.1

–>

<html>

<head>

<title>Ruby Benchmarks Report</title>

<script src="jquery.js"></script>
<script src="bootstrap.js"></script>
<script src="chart.js"></script>
<script src="data.js"></script>
<script src="report.js"></script>

<link rel="stylesheet" type="text/css" href="bootstrap.css">
<link rel="stylesheet" type="text/css" href="bootstrap-theme.css">

<style>
  body {
    margin-bottom: 2em;
  }

  .control-label {
    font-weight: normal;
  }

  canvas {
    padding-left: 0;
    padding-right: 0;
    margin-left: auto;
    margin-right: auto;
    padding-top: 2em;
    padding-bottom: 2em;
    display: block;
  }

  .tab-pane {
    padding-top: 2em;
  }

  .xaxis {
    text-align: center;
  }

  .yaxis {
    text-align: center;
    position: absolute;
    width: 400px;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin:    0 0;
    -ms-transform-origin:     0 0;
    -o-transform-origin:      0 0;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
  }
</style>

<meta name="viewport" content="width=device-width, initial-scale=1">

</head>

<body>

<div class=“container”>

<h1>Ruby Benchmarks Report</h1>

<ul class=“nav nav-tabs” role=“tablist”>

<li class="active"><a href="#speedup" role="tab" data-toggle="tab">Speedup</a></li>
<li><a href="#warmup" role="tab" data-toggle="tab">Warmup</a></li>
<li><a href="#failures" role="tab" data-toggle="tab">Failures</a></li>
<li><a href="#notes" role="tab" data-toggle="tab">Notes</a></li>

</ul>

<div class=“tab-content”>

<div class="tab-pane active" id="speedup">

  <canvas id="speedup_chart" width="600" height="400"></canvas>
  <div class="yaxis">Speedup relative to<br>baseline implementation (s/s)</div>
  <div class="xaxis">Implementation</div>

  <hr>

  <form role="form" class="form-horizontal">

    <div class="form-group">
      <div><label>Options</label></div>
      <div class="col-sm-offset-2 col-sm-8"><div class="checkbox"><label><input type="checkbox" checked id="summary-summarised"> Summarise</label></div></div>
    </div>

    <div class="form-group">
      <label class="col-sm-2 control-label">Baseline</label>
      <div class="col-sm-8">
        <select class="form-control" id="speedup-baseline">
        </select>
      </div>
    </div>

    <div class="form-group" id="speedup-implementations">
      <div><label>Implementations</label></div>

      <div class="btn-group col-sm-offset-2 col-sm-8">
        <button type="button" class="btn btn-default" id="speedup-impl-all">All</button>
        <button type="button" class="btn btn-default" id="speedup-impl-none">None</button>
        <button type="button" class="btn btn-default" id="speedup-impl-best">Best</button>
      </div>
    </div>

    <div class="form-group" id="speedup-benchmarks">
      <div><label>Benchmarks</label></div>

      <div class="btn-group col-sm-offset-2 col-sm-8">
        <button type="button" class="btn btn-default" id="speedup-bench-all">All</button>
        <button type="button" class="btn btn-default" id="speedup-bench-none">None</button>
        <button type="button" class="btn btn-default" id="speedup-bench-synth">Synthetic</button>
        <button type="button" class="btn btn-default" id="speedup-bench-prod">Production</button>
      </div>
    </div>
  </form>

</div>

<div class="tab-pane" id="warmup">

  <canvas id="warmup_chart" width="600" height="400"></canvas>
  <div class="yaxis">Time for iteration (s)</div>
  <div class="xaxis">Iteration number</div>

  <hr>

  <form role="form" class="form-horizontal">
    <div class="form-group">
      <label class="col-sm-2 control-label">Benchmark</label>
      <div class="col-sm-8">
        <select class="form-control" id="warmup-benchmark">
        </select>
      </div>
    </div>

    <div class="form-group" id="warmup-implementations">
      <div><label>Implementations</label></div>

      <div class="btn-group col-sm-offset-2 col-sm-8">
        <button type="button" class="btn btn-default" id="warmup-impl-all">All</button>
        <button type="button" class="btn btn-default" id="warmup-impl-none">None</button>
        <button type="button" class="btn btn-default" id="warmup-impl-best">Best</button>
      </div>
    </div>
  </form>

</div>

<div class="tab-pane" id="failures">
  <ul id="failures-list">
  </ul>
</div>

<div class="tab-pane" id="notes">
  <!-- notes -->
</div>

</div>

</div>

</body>

</html>