slaeforms/slaeforms/templates/layout2.html

64 lines
3.0 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css')}}"" /> <!-- styles.css {{ url_for('static', filename='styles.css')}}-->
<title>Testform</title>
<link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}">
</head>
<body>
<h2>Question: {{ current_question }}</h2>
{% if (videotype == "single")%} <!-- first figure out what video type we have -->
<div class="center">
<h3>Video 1</h3>
<iframe width="560" height="315" class="center" src="{{ video_url }}" title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen></iframe>
</div>
{% elif (videotype == "pairwise")%}
<div class="columncontainer">
<div class="columnleft center">
<h3>Video 1</h3>
<iframe width="560" height="315" class="center" src="{{ video_url_left }}" title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen></iframe>
</div>
<div class="columnright">
<h3>Video 2</h3>
<iframe width="560" height="315" src="{{ video_url_right }}" title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen></iframe>
</div>
</div>
{% else %}
<p>Error: No Videotype could be matched or was given!</p>
{% endif %}
<form action="http://localhost:5000/send" method="post">
{% for block in config["question 1"]["blocks"] %}
{% if (config["question 1"]["blocks"][block]["type"] == "likert") %}
<div class="likercontainer">
<div class="likert">
<label><input name="likertscale" type="radio" value="1" /><span>I dont like it at all</span></label>
<label><input name="likertscale" type="radio" value="2" /><span>I dont like it</span></label>
<label><input name="likertscale" type="radio" value="3" /><span>I am indifferent</span></label>
<label><input name="likertscale" type="radio" value="4" /><span>I like it</span></label>
<label><input name="likertscale" type="radio" value="5" /><span>I like it a lot</span></label>
</div>
</div>
{% elif (config["question 1"]["blocks"][block]["type"] == "textinput") %}
<label for="feedback">Additional Feedback: </label>
<textarea id="feedback" name="feedback" rows="3" cols="30" maxlength="200"></textarea>
{% else %}
<p>Error: A block could not be loaded!</p>
{% endif %}
{% endfor %}
<p><input id="submitbutton" type = "submit" value = "submit";/></p>
</form>
</body>
</html>