Skip to content

Commit

Permalink
Merge pull request #114 from jorisdebock/gh-pages
Browse files Browse the repository at this point in the history 
add table overview of all benchmarks
  • Loading branch information
@mathieuancelin
mathieuancelin authored May 30, 2017
2 parents 263229e + 5c122fd commit 04684fc
Show file tree
Hide file tree
Showing 8 changed files with 555 additions and 213 deletions.
20 changes: 10 additions & 10 deletions ENV.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,10 +24,10 @@ var ENV = ENV || (function() {
var className = 'Query elapsed';
if (elapsed >= 10.0) {
className += ' warn_long';
}
}
else if (elapsed >= 1.0) {
className += ' warn';
}
}
else {
className += ' short';
}
Expand All @@ -38,10 +38,10 @@ var ENV = ENV || (function() {
var countClassName = "label";
if (queries >= 20) {
countClassName += " label-important";
}
}
else if (queries >= 10) {
countClassName += " label-warning";
}
}
else {
countClassName += " label-success";
}
Expand Down Expand Up @@ -177,6 +177,7 @@ var ENV = ENV || (function() {
function mutations(value) {
if (value) {
mutationsValue = value;
document.querySelector('#ratioval').innerHTML = 'mutations : ' + (mutationsValue * 100).toFixed(0) + '%';
return mutationsValue;
} else {
return mutationsValue;
Expand All @@ -186,7 +187,7 @@ var ENV = ENV || (function() {
var body = document.querySelector('body');
var theFirstChild = body.firstChild;

var sliderContainer = document.createElement( 'div' );
var sliderContainer = document.createElement('div');
sliderContainer.style.cssText = "display: flex";
var slider = document.createElement('input');
var text = document.createElement('label');
Expand All @@ -196,13 +197,12 @@ var ENV = ENV || (function() {
slider.style.cssText = 'margin-bottom: 10px; margin-top: 5px';
slider.addEventListener('change', function(e) {
ENV.mutations(e.target.value / 100);
document.querySelector('#ratioval').innerHTML = 'mutations : ' + (ENV.mutations() * 100).toFixed(0) + '%';
});
sliderContainer.appendChild( text );
sliderContainer.appendChild( slider );
body.insertBefore( sliderContainer, theFirstChild );
sliderContainer.appendChild(text);
sliderContainer.appendChild(slider);
body.insertBefore(sliderContainer, theFirstChild);

return {
return {
generateData: getData,
rows: 50,
timeout: 0,
Expand Down
189 changes: 189 additions & 0 deletions all.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,189 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>dbmon</title>
<link href="http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700" rel="stylesheet" type="text/css">
<style>
body {
background-color: rgb(28, 28, 28);
font-family: "Open Sans Condensed", "Helvetica Neue";
}

#render-frame {
background-color: white;
}

#render-info {
color: white;
}

#ranking {
color: white;
}

.title {
color: rgb(102, 102, 102);
font-weight: bold;
}

@media(min-width: 1025px) {
.title {
font-size: 80px;
}
}

@media(max-width: 1024px) {
.title {
font-size: 40px;
}
}

a {
color: white;
text-decoration: none;
width: 100%;
}

.optimized {
background-color: #FF6347;
/*#FF6347;*/
}

.todo {
background-color: #2167FF;
/*#0EB26D;*/
}

.naive {
background-color: #EBA636;
/*rgb(100, 100, 100);*/
}

.container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
padding: 0;
margin: 0;
justify-content: flex-start;
}

.legend {
display: flex;
flex-direction: column;
justify-content: flex-end;
}

.child {
padding: 0px;
width: 200px;
height: 200px;
margin-top: 10px;
margin-left: 5px;
margin-right: 5px;
color: white;
font-weight: bold;
font-size: 20px;
text-align: center;
display: flex;
align-items: center;
cursor: pointer;
}

.child:hover {
animation-name: blop;
animation-iteration-count: infinite;
animation-timing-function: linear;
animation-duration: 2s;
}

.legendChild {
width: 200px;
margin-top: 5px;
color: white;
text-align: center;
display: flex;
align-items: center;
}

.color {
width: 15px;
height: 15px;
}

.fw {
margin-left: 10px;
margin-right: 10px;
font-size: 12px;
color: white;
width: 120px;
text-align: right;
}

tr {
text-align: center;
}

@keyframes blop {
0% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
100% {
transform: scale(1);
}
}
</style>
</head>

<body>
<div style="display: flex; justify-content: space-between; flex-wrap: wrap;">
<span class="title">REPAINT RATE CHALLENGE</span>
<div class="legend">
<div class="legendChild">
<span class="fw">Todo implementation</span>
<div class="color todo"></div>
</div>
<div class="legendChild">
<span class="fw">Naive implementation</span>
<div class="color naive"></div>
</div>
<div class="legendChild">
<span class="fw">Optimized implementation</span>
<div class="color optimized"></div>
</div>
</div>
</div>
<div id="render-box">
<div id="render-info"></div>
<iframe id="render-frame" height="1080" width="1920"></iframe>
</div>
<div>
<table id="ranking">
<thead>
<tr>
<th style="min-width:25px"></th>
<th style="min-width:250px">Name</th>
<th style="min-width:100px">Rate/sec 1%</th>
<th style="min-width:100px">25%</th>
<th style="min-width:100px">50%</th>
<th data-sort-default aria-sort="descending" style="min-width:100px">100%</th>
</tr>
</thead>
<tbody id="ranking-body">
</tbody>
</table>
</div>
<script src="./elem-vdom/elem.js"></script>
<script src="./list.js"></script>
<script src="./lib/monitor-all.js"></script>
<script src="./ga.js"></script>
<script src="https://cdn.rawgit.com/tristen/tablesort/gh-pages/dist/tablesort.min.js"></script>
<script src="https://cdn.rawgit.com/tristen/tablesort/gh-pages/dist/sorts/tablesort.number.min.js"></script>
</body>

</html>
Loading

0 comments on commit 04684fc

Please sign in to comment.