This commit is contained in:
Paul Zinselmeyer 2023-11-05 23:01:47 +01:00
parent f5485b773b
commit 4ce5c5270b
Signed by: pfzetto
GPG key ID: 4EEF46A5B276E648
11 changed files with 1206 additions and 131 deletions

View file

@ -31,10 +31,12 @@ answers = [ "A", "B", "C", "D"]
correct = 0
</pre>
<span id="error" style="color: red;"></span>
<form method="post" hx-post="" hx-target="#error" hx-swap="innerHTML" enctype="multipart/form-data">
<input type="file" name="quizfile"/>
<button type="submit">Create Quiz</button>
<button type="submit">
Create Quiz
<small id="error" style="color: red;"></small>
</button>
</form>
</main>
<a class="watermark" href="https://git2.zettoit.eu/zettoit"><img src="/static/zettoit-style/zettoit.svg" alt="zettoIT Logo"></a>

View file

@ -11,21 +11,15 @@
<main class="container" hx-sse="connect:/<%= id %>/events?player=<%=player_id%> swap:message">
<% } %>
<% if let PlayerState::NotStarted = state { %>
<article>
<center>The Quiz hasn't started yet. Please wait for the first question.</center>
</article>
<center>The Quiz hasn't started yet. Please wait for the first question.</center>
<% } else if let PlayerState::Answering{ inner_body } = state { %>
<%- inner_body %>
<% } else if let PlayerState::Waiting(_) = state{ %>
<article aria-busy="true">
You answered the current question. Please wait for the results.
</article>
<center>You answered the current question. Please wait for the results.</center>
<% } else if let PlayerState::Result{ inner_body } = state{ %>
<%- inner_body %>
<% } else if let PlayerState::Completed(correct) = state { %>
<article>
The Quiz finished. You can close this tab now. You answered <b><%= correct*100.0 %>%</b> correctly.
</article>
<center>The Quiz finished. You can close this tab now. You answered <b><%= correct*100.0 %>%</b> correctly.</center>
<% } %>
<% if !htmx { %>

View file

@ -1,10 +1,8 @@
<article>
<h1><%= name %></h1>
<% for (index, answer) in answers.iter().enumerate() { %>
<form method="POST" hx-post="" hx-target="closest main">
<input type="hidden" name="player_id" value="<%= player_id %>"></input>
<input type="hidden" name="value" value="<%= index %>"></input>
<button type="submit"><%= answer %></button>
</form>
<% } %>
</article>
<h1><%= name %></h1>
<% for (index, answer) in answers.iter().enumerate() { %>
<form method="POST" hx-post="" hx-target="closest main">
<input type="hidden" name="player_id" value="<%= player_id %>"></input>
<input type="hidden" name="value" value="<%= index %>"></input>
<button type="submit"><%= answer %></button>
</form>
<% } %>

View file

@ -1,18 +1,14 @@
<% if is_correct { %>
<article class="centered">
<h1>Correct</h1>
<p>Your answer is correct. The correct answer is <b><%= correct_answer %></b>.</p>
</article>
<h1>Correct</h1>
<p>Your answer is correct. The correct answer is <b><%= correct_answer %></b>.</p>
<% } else { %>
<article class="centered">
<h1>Wrong</h1>
<p>
Your answer is incorrect. The correct answer is <b><%= correct_answer %></b>.
<% if let Some(player_answer) = player_answer { %>
You answered <b><%= player_answer %></b>.
<% } else { %>
You didn't answer the question.
<% } %>
</p>
</article>
<h1>Wrong</h1>
<p>
Your answer is incorrect. The correct answer is <b><%= correct_answer %></b>.
<% if let Some(player_answer) = player_answer { %>
You answered <b><%= player_answer %></b>.
<% } else { %>
You didn't answer the question.
<% } %>
</p>
<% } %>

View file

@ -1,7 +1,6 @@
<h2><%= name %></h2>
<span>Total Participants: <b><%= total_submissions %></b></span>
<% if show_result { %>
<br/>
<span>The correct answer is: <b><%= correct_answer %></b></span>
<% } %>
@ -18,34 +17,72 @@
"<%= answer %>",
<% } %>
],
<% if show_result { %>
datasets: [
{
label: "correct answers",
data: [
<% for submissions in submissions_correct.iter() { %>
<%= submissions %>,
<% } %>
],
borderWidth: 1,
borderColor: '#fff',
backgroundColor: '#fff',
},
{
label: "wrong answers",
data: [
<% for submissions in submissions_wrong.iter() { %>
<%= submissions %>,
<% } %>
],
borderWidth: 2,
borderColor: '#fff',
backgroundColor: [ pattern.draw('diagonal-right-left', '#000000') ],
}
]
<% } else { %>
datasets: [{
label: "# der Stimmen",
data: [
<% for submissions in submissions.iter() { %>
<%= submissions %>,
<% } %>
],
borderWidth: 1
borderWidth: 2,
borderColor: '#FFF',
backgroundColor: [ pattern.draw('diagonal-right-left', '#000000') ]
}]
<% } %>
},
options: {
legend: {
display: false
plugins: {
legend: {
display: false
}
},
scales: {
x: {
stacked: true,
ticks: {
font: {
size: 64
}
size: 64,
family: 'monospace'
},
color: '#FFF'
}
},
y: {
beginAtZero: true,
stacked: true,
ticks: {
font: {
size:24
}
size: 16,
family: 'monospace'
},
color: '#FFF'
}
}
}

View file

@ -11,11 +11,14 @@
filter: invert();
width: 100%;
height: auto;
max-height: 90vh;
max-width: 90wh;
}
</style>
</head>
<body>
<script src="/static/chart.js"></script>
<script src="/static/patternomaly.js"></script>
<main class="container" hx-sse="connect:/<%= id %>/view/events swap:message">
<% } %>
<% if let ViewerState::Answering{ inner_body } = state { %>
@ -34,15 +37,11 @@
<% } %>
<% } else if let ViewerState::NotStarted((player, qrcode, url)) = state { %>
</article>
<center class="qrcode"><%- qrcode %></center>
<center>or visit <%= url %></center>
<button hx-post="" class="outline">Start Quiz with <b><%= player %></b> Players</button>
</article>
<center class="qrcode"><%- qrcode %></center>
<center>or visit <%= url %></center>
<button hx-post="" class="outline">Start Quiz with <b><%= player %></b> Players</button>
<% } else {%>
<article>
The Quiz finished. You can close this tab now.
</article>
The Quiz finished. You can close this tab now.
<% } %>
<% if !htmx { %>
</main>