feat: port benchmark page to tera
This commit is contained in:
parent
82d293a159
commit
e5bf7feebe
GPG key ID:
AD9F0F08E855ED88
2 changed files with 165 additions and 154 deletions
|
|
@ -14,46 +14,55 @@
|
||||||
* You should have received a copy of the GNU Affero General Public License
|
* You should have received a copy of the GNU Affero General Public License
|
||||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||||
*/
|
*/
|
||||||
use std::str::FromStr;
|
use std::cell::RefCell;
|
||||||
|
|
||||||
|
use actix_web::http::header::ContentType;
|
||||||
use actix_web::{web, HttpResponse, Responder};
|
use actix_web::{web, HttpResponse, Responder};
|
||||||
use lazy_static::lazy_static;
|
use tera::Context;
|
||||||
use my_codegen::get;
|
|
||||||
use sailfish::TemplateOnce;
|
|
||||||
use uuid::Uuid;
|
use uuid::Uuid;
|
||||||
|
|
||||||
use crate::errors::*;
|
use crate::AppData;
|
||||||
use crate::pages::errors::ErrorPage;
|
|
||||||
use crate::PAGES;
|
use crate::PAGES;
|
||||||
|
|
||||||
#[derive(TemplateOnce)]
|
pub use super::*;
|
||||||
#[template(path = "bench/index.html")]
|
|
||||||
struct Bench<'a> {
|
|
||||||
error: Option<ErrorPage<'a>>,
|
|
||||||
}
|
|
||||||
const PAGE: &str = "Survey";
|
|
||||||
|
|
||||||
impl<'a> Default for Bench<'a> {
|
pub struct Bench {
|
||||||
fn default() -> Self {
|
ctx: RefCell<Context>,
|
||||||
Bench { error: None }
|
}
|
||||||
|
|
||||||
|
pub const BENCH: TemplateFile = TemplateFile::new("new_campaign", "bench/index.html");
|
||||||
|
|
||||||
|
impl CtxError for Bench {
|
||||||
|
fn with_error(&self, e: &ReadableError) -> String {
|
||||||
|
self.ctx.borrow_mut().insert(ERROR_KEY, e);
|
||||||
|
self.render()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
lazy_static! {
|
impl Bench {
|
||||||
static ref BENCH: String = Bench::default().render_once().unwrap();
|
pub fn new(settings: &Settings) -> Self {
|
||||||
|
let ctx = RefCell::new(context(settings, "Login"));
|
||||||
|
Self { ctx }
|
||||||
|
}
|
||||||
|
|
||||||
|
pub fn render(&self) -> String {
|
||||||
|
TEMPLATES.render(BENCH.name, &self.ctx.borrow()).unwrap()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#[get(
|
#[actix_web_codegen_const_routes::get(
|
||||||
path = "PAGES.panel.campaigns.bench",
|
path = "PAGES.panel.campaigns.bench",
|
||||||
wrap = "crate::api::v1::bench::get_check_login()"
|
wrap = "crate::api::v1::bench::get_check_login()"
|
||||||
)]
|
)]
|
||||||
pub async fn bench(path: web::Path<String>) -> PageResult<impl Responder> {
|
pub async fn bench(
|
||||||
let path = path.into_inner();
|
data: AppData,
|
||||||
|
_path: web::Path<Uuid>,
|
||||||
match Uuid::from_str(&path) {
|
) -> PageResult<impl Responder, Bench> {
|
||||||
Err(_) => Err(PageError::PageDoesntExist),
|
let bench = Bench::new(&data.settings).render();
|
||||||
Ok(_) => Ok(HttpResponse::Ok()
|
let html = ContentType::html();
|
||||||
.content_type("text/html; charset=utf-8")
|
Ok(HttpResponse::Ok().content_type(html).body(bench))
|
||||||
.body(&*BENCH.as_str())),
|
}
|
||||||
}
|
|
||||||
|
pub fn services(cfg: &mut actix_web::web::ServiceConfig) {
|
||||||
|
cfg.service(bench);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,143 +1,145 @@
|
||||||
<. include!("../components/base/top.html"); .>
|
{% extends 'base' %}
|
||||||
<body class="survey__body">
|
{% block body %}
|
||||||
<main class="survey__container">
|
<body class="survey__body">
|
||||||
<. include!("../components/error/index.html"); .>
|
<main class="survey__container">
|
||||||
<div id="pre-bench">
|
{% include "error_comp" %}
|
||||||
<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> -->
|
<div id="pre-bench">
|
||||||
<button id="start" class="form__submit" type="submit">Start</button>
|
<h1>Click to Start Benchmark</h1>
|
||||||
</form>
|
<form class="new-campaign__form" accept-charset="utf-8">
|
||||||
</div>
|
<label class="form__label" for="name">
|
||||||
|
Device name
|
||||||
|
<input
|
||||||
|
class="form__input"
|
||||||
|
name="name"
|
||||||
|
required
|
||||||
|
id="name"
|
||||||
|
type="text"
|
||||||
|
/>
|
||||||
|
</label>
|
||||||
|
|
||||||
<noscript>
|
<!-- <button id="start" type="submit">Start</button> -->
|
||||||
<b>
|
<button id="start" class="form__submit" type="submit">Start</button>
|
||||||
This is a WASM benchmark, please enable JavScript to run it. We don't
|
</form>
|
||||||
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="winner-instructions">
|
|
||||||
<h2>Winner Announcement</h2>
|
|
||||||
<p>
|
|
||||||
The winners will be announed on the organisation website
|
|
||||||
<a href="https://mcaptcha.org/blog/survey" target="_blank">here</a> on
|
|
||||||
December 1, 2021. The winning submission IDs will be published and the
|
|
||||||
winners expected to provide the submission proof to claim their
|
|
||||||
rewards.
|
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
<div id="submission-proof"></div>
|
|
||||||
|
|
||||||
<div class="advance-log" id="device-info"></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>
|
||||||
|
|
||||||
<table class="advance-log">
|
<div id="bench">
|
||||||
<thead>
|
<h1 id="status" class="name">Running benchmark</h1>
|
||||||
<tr>
|
<div id="counter"></div>
|
||||||
<th>Difficulty factor</th>
|
<button class="btn" id="advance">Show Advanced Log</button>
|
||||||
<th>Duration(ms)</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody id="stats"></tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
<. include!("../components/footer/index.html"); .>
|
|
||||||
</body>
|
|
||||||
<style>
|
|
||||||
body {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 0;
|
|
||||||
display: hidden;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#pre-bench,
|
<div id="winner-instructions">
|
||||||
#bench {
|
<h2>Winner Announcement</h2>
|
||||||
width: 100%;
|
<p>
|
||||||
display: flex;
|
The winners will be announed on the organisation website
|
||||||
margin: 40px auto;
|
<a href="https://mcaptcha.org/blog/survey" target="_blank">here</a> on
|
||||||
align-items: center;
|
December 1, 2021. The winning submission IDs will be published and the
|
||||||
flex-direction: column;
|
winners expected to provide the submission proof to claim their
|
||||||
}
|
rewards.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div id="submission-proof"></div>
|
||||||
|
|
||||||
#bench {
|
<div class="advance-log" id="device-info"></div>
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.survey__container {
|
<table class="advance-log">
|
||||||
flex: 2;
|
<thead>
|
||||||
margin: 0 auto;
|
<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;
|
||||||
|
}
|
||||||
|
|
||||||
#status {
|
#pre-bench,
|
||||||
max-width: 80%;
|
#bench {
|
||||||
margin: auto;
|
width: 100%;
|
||||||
}
|
display: flex;
|
||||||
|
margin: 40px auto;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
table {
|
#bench {
|
||||||
border-collapse: collapse;
|
display: none;
|
||||||
margin: 40px auto;
|
}
|
||||||
width: 40%;
|
|
||||||
}
|
|
||||||
|
|
||||||
td,
|
.survey__container {
|
||||||
th {
|
flex: 2;
|
||||||
border: 1px solid #999;
|
margin: 0 auto;
|
||||||
padding: 0.5rem;
|
}
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
th {
|
#status {
|
||||||
color: green;
|
max-width: 80%;
|
||||||
}
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
#device-info {
|
table {
|
||||||
margin: auto;
|
border-collapse: collapse;
|
||||||
font-size: 0.8rem;
|
margin: 40px auto;
|
||||||
}
|
width: 40%;
|
||||||
|
}
|
||||||
|
|
||||||
.advance-log > b,
|
td,
|
||||||
div {
|
th {
|
||||||
font-size: 0.8rem;
|
border: 1px solid #999;
|
||||||
}
|
padding: 0.5rem;
|
||||||
.advance-log {
|
text-align: left;
|
||||||
display: none;
|
}
|
||||||
}
|
|
||||||
#winner-instructions {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#submission-proof {
|
th {
|
||||||
margin: 15px auto;
|
color: green;
|
||||||
}
|
}
|
||||||
|
|
||||||
#submission-proof > div,
|
#device-info {
|
||||||
b {
|
margin: auto;
|
||||||
font-size: 1.2rem;
|
font-size: 0.8rem;
|
||||||
font-family: monospace, monospace;
|
}
|
||||||
}
|
|
||||||
</style>
|
.advance-log > b,
|
||||||
<script src="<.= &*crate::GLUE .>"></script>
|
div {
|
||||||
<. include!("../components/base/bottom.html"); .>
|
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 %}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue