2018-03-27 20:41:57 +02:00
|
|
|
{% extends "base.html" %}
|
2018-04-02 19:12:35 +02:00
|
|
|
{% block title %}
|
2018-04-28 18:22:11 +02:00
|
|
|
Stack Exchange Simulator Quiz - {{ question.title.text }}
|
|
|
|
{% endblock %}
|
|
|
|
{% block extrameta %}
|
|
|
|
<meta property="og:image" name="twitter:image" itemprop="image primaryImageOfPage"
|
|
|
|
content="{{ url_for("image",_external=True) }}"/>
|
|
|
|
<meta name="twitter:domain" content="se-simulator.lw1.at"/>
|
|
|
|
<meta name="twitter:title" property="og:title" itemprop="title name" content="Stack Exchange Simulator Quiz"/>
|
|
|
|
<meta name="twitter:description" property="og:description" itemprop="description"
|
|
|
|
content="Generating fun Stack Overflow and Stack Exchange Questions using Markov Chains">
|
2018-04-02 19:12:35 +02:00
|
|
|
{% endblock %}
|
2018-04-13 21:28:25 +02:00
|
|
|
{% block extraclasses %}quiz{% endblock %}
|
2018-03-27 20:41:57 +02:00
|
|
|
{% block body %}
|
|
|
|
|
2018-03-28 15:01:16 +02:00
|
|
|
<header>
|
2018-04-28 18:22:11 +02:00
|
|
|
<h1>Stack Exchange Simulator Quiz</h1>
|
2018-03-28 15:01:16 +02:00
|
|
|
</header>
|
|
|
|
|
2018-04-13 21:28:25 +02:00
|
|
|
{% if stats.correct <3 %}
|
|
|
|
<div class="tutorial">
|
|
|
|
<h3>Tutorial:</h3>
|
|
|
|
<p>Guess which of the Stack Exchange sites this question could belong to.</p>
|
|
|
|
{% if difficulty=="easy" %}
|
|
|
|
<p>There are four possible answers below.</p>
|
|
|
|
<p>Press <strong>Next</strong> to get to the next Question.</p>
|
|
|
|
<p>
|
|
|
|
If you think this is too easy, you can try out
|
|
|
|
<a href="{{ url_for("quiz",difficulty="hard") }}">the hard quiz</a>
|
|
|
|
which doesn't have possible answers.
|
|
|
|
</p>
|
|
|
|
{% else %}
|
|
|
|
<p>
|
|
|
|
Then enter your guess into the textbox below, select the website
|
|
|
|
and click on <strong>check</strong> to confirm your guess.
|
|
|
|
</p>
|
|
|
|
<p>Alternativly you can select a site with the arrow keys and press enter twice to confirm it.</p>
|
|
|
|
<p>
|
|
|
|
If you think this is too hard, you can try out
|
|
|
|
<a href="{{ url_for("quiz",difficulty="easy") }}">the easy quiz</a>
|
|
|
|
which does have possible answers to choose from.
|
|
|
|
</p>
|
|
|
|
{% endif %}
|
|
|
|
</div>
|
|
|
|
{% endif %}
|
2018-03-28 15:01:16 +02:00
|
|
|
|
2018-03-30 22:42:38 +02:00
|
|
|
{% if difficulty=="easy" %}
|
|
|
|
<div id="quizchoices" data-id="{{ question.id }}">
|
|
|
|
{% for choice in choices %}
|
|
|
|
<button data-id="{{ choice.id }}" data-url="{{ choice.url }}"
|
2018-04-05 21:01:06 +02:00
|
|
|
style="color: {{ choice.foreground_color }};background-color: {{ choice.background_color }};
|
|
|
|
{{ ("border: solid 1px " + choice.foreground_color) if choice.background_color and is_light_color(choice.background_color) }}"
|
2018-03-30 22:42:38 +02:00
|
|
|
>{{ choice.name }}</button>
|
|
|
|
{% endfor %}
|
|
|
|
</div>
|
|
|
|
{% else %}
|
|
|
|
<div id="quizselector">
|
2018-04-26 18:57:56 +02:00
|
|
|
<input title="guess the correct site" id="siteselector" data-mode="quiz"
|
|
|
|
data-id="{{ question.id }}" data-matomo-unmask autocomplete='off'>
|
2018-03-30 22:42:38 +02:00
|
|
|
<button id="check">Check</button>
|
|
|
|
</div>
|
|
|
|
{% endif %}
|
2018-03-28 15:01:16 +02:00
|
|
|
<div id="result">
|
|
|
|
<div id="correct">
|
|
|
|
Correct!
|
|
|
|
</div>
|
|
|
|
<div id="incorrect">
|
|
|
|
Incorrect!
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="stats">
|
|
|
|
<div>Total<br><span>{{ stats.total }}</span></div>
|
|
|
|
<div>Correct<br><span>{{ stats.correct }}</span></div>
|
2018-03-30 22:42:38 +02:00
|
|
|
<div>Ratio<br><span>{{ '%d' | format((stats.correct / stats.total * 100) if stats.correct > 0 else 0) }}</span>%
|
|
|
|
</div>
|
2018-04-04 17:40:22 +02:00
|
|
|
<button id="next">Next</button>
|
2018-03-28 15:01:16 +02:00
|
|
|
</div>
|
|
|
|
|
|
|
|
<header class="siteheader"
|
|
|
|
style="">
|
|
|
|
</header>
|
|
|
|
|
2018-03-27 20:41:57 +02:00
|
|
|
|
|
|
|
<h1>{{ question.title.text }}</h1>
|
|
|
|
<div class="content question">
|
2018-03-28 15:01:16 +02:00
|
|
|
<div class="vote" data-id="{{ question.id }}" data-type="question">
|
2018-03-27 20:41:57 +02:00
|
|
|
<a class="up"></a>
|
|
|
|
<div>{{ question.upvotes - question.downvotes }}</div>
|
|
|
|
<a class="down"></a>
|
|
|
|
</div>
|
|
|
|
<div class="contentbox">
|
|
|
|
|
|
|
|
{% for paragraph in question.text.split("\n") %}
|
|
|
|
<p>{{ paragraph }}</p>
|
|
|
|
{% endfor %}
|
|
|
|
<div class="contentfooter">
|
|
|
|
<div class="authorbox">
|
|
|
|
asked {{ prettydate(question.datetime) }}
|
|
|
|
<br>
|
|
|
|
{{ question.user.username }}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
{% endblock %}
|