144 lines
2.8 KiB
HTML
144 lines
2.8 KiB
HTML
{% extends 'base' %}
|
|
|
|
{% block nav %}
|
|
{% include "pub_nav" %}
|
|
{% endblock nav %}
|
|
|
|
|
|
{% block body %}
|
|
<body class="survey__body">
|
|
<main class="survey__container">
|
|
{% include "error_comp" %}
|
|
|
|
<div id="pre-bench">
|
|
<h1>Click to Start Benchmark</h1>
|
|
<form class="new-campaign__form" accept-charset="utf-8">
|
|
<label class="form__label" for="name">
|
|
Device name
|
|
<input
|
|
class="form__input"
|
|
name="name"
|
|
required
|
|
id="name"
|
|
type="text"
|
|
/>
|
|
</label>
|
|
|
|
<!-- <button id="start" type="submit">Start</button> -->
|
|
<button id="start" class="form__submit" type="submit">Start</button>
|
|
</form>
|
|
</div>
|
|
|
|
<noscript>
|
|
<b>
|
|
This is a WASM benchmark, please enable JavScript to run it. We don't
|
|
collect any data and
|
|
<a href="https://github.com/mCaptcha/survey"
|
|
>source code is available here</a
|
|
>
|
|
</b>
|
|
</noscript>
|
|
|
|
<div id="bench">
|
|
<h1 id="status" class="name">Running benchmark</h1>
|
|
<div id="counter"></div>
|
|
<button class="btn" id="advance">Show Advanced Log</button>
|
|
|
|
<div id="submission-proof"></div>
|
|
|
|
<div class="advance-log" id="device-info"></div>
|
|
|
|
<table class="advance-log">
|
|
<thead>
|
|
<tr>
|
|
<th>Difficulty factor</th>
|
|
<th>Duration(ms)</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="stats"></tbody>
|
|
</table>
|
|
</div>
|
|
</main>
|
|
</body>
|
|
<style>
|
|
body {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 0;
|
|
display: hidden;
|
|
align-items: center;
|
|
}
|
|
|
|
#pre-bench,
|
|
#bench {
|
|
width: 100%;
|
|
display: flex;
|
|
margin: 40px auto;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
}
|
|
|
|
#bench {
|
|
display: none;
|
|
}
|
|
|
|
.survey__container {
|
|
flex: 2;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
#status {
|
|
max-width: 80%;
|
|
margin: auto;
|
|
}
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
margin: 40px auto;
|
|
width: 40%;
|
|
}
|
|
|
|
td,
|
|
th {
|
|
border: 1px solid #999;
|
|
padding: 0.5rem;
|
|
text-align: left;
|
|
}
|
|
|
|
th {
|
|
color: green;
|
|
}
|
|
|
|
#device-info {
|
|
margin: auto;
|
|
font-size: 0.8rem;
|
|
}
|
|
|
|
.advance-log > b,
|
|
div {
|
|
font-size: 0.8rem;
|
|
}
|
|
.advance-log {
|
|
display: none;
|
|
}
|
|
#winner-instructions {
|
|
display: none;
|
|
}
|
|
|
|
#submission-proof {
|
|
margin: 15px auto;
|
|
}
|
|
|
|
#submission-proof > div,
|
|
b {
|
|
font-size: 1.2rem;
|
|
font-family: monospace, monospace;
|
|
}
|
|
</style>
|
|
|
|
<!--
|
|
<script src="{{ assets.glue }}"></script>
|
|
-->
|
|
{% endblock body %}
|