186 lines
7.4 KiB
HTML
186 lines
7.4 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='icons/favicon.ico') }}">
|
|
<script>const ICON_PATHS = {
|
|
cameraofficon: "{{ url_for('static', filename='icons/camera-off-icon.png') }}",
|
|
cameraicon: "{{ url_for('static', filename='icons/camera-icon.png') }}",
|
|
stopicon: "{{ url_for('static', filename='icons/stop-icon.png') }}",
|
|
recordicon: "{{ url_for('static', filename='icons/record-icon.png') }}"
|
|
};</script>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<video controls>
|
|
<source src="{{ url_for('static', filename='videos/GLEISvariations.mp4') }}" type="video/mp4">
|
|
</video>
|
|
|
|
<div class="container">
|
|
<form class="formlayout" id="question_form" action="{{ url_for('sendpage') }}" method="post">
|
|
|
|
|
|
<div class="likertcontainer">
|
|
<div class="likert" style="--likert-rows: 7">
|
|
|
|
<label>
|
|
<input class="inputs" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 1 </span>
|
|
</label>
|
|
<label>
|
|
<input class="inputs" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 2 </span>
|
|
</label>
|
|
<label>
|
|
<input class="inputs" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 3 </span>
|
|
</label>
|
|
<label>
|
|
<input class="inputs" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 4 </span>
|
|
</label>
|
|
<label>
|
|
<input class="inputs" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 5 </span>
|
|
</label>
|
|
<label>
|
|
<input class="inputs" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 6 </span>
|
|
</label>
|
|
<label>
|
|
<input class="inputs" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 7 </span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="normal-likert-container" style="--likert-rows: 7">
|
|
|
|
<label class="likertlabel">
|
|
<input class="likertinput" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 1 </span>
|
|
</label>
|
|
<label class="likertlabel">
|
|
<input class="likertinput" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 2 </span>
|
|
</label>
|
|
<label class="likertlabel">
|
|
<input class="likertinput" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 3 </span>
|
|
</label>
|
|
<label class="likertlabel">
|
|
<input class="likertinput" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 4 </span>
|
|
</label>
|
|
<label class="likertlabel">
|
|
<input class="likertinput" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 5 </span>
|
|
</label>
|
|
<label class="likertlabel">
|
|
<input class="likertinput" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 6 </span>
|
|
</label>
|
|
<label class="likertlabel">
|
|
<input class="likertinput" name="test1" type="radio"
|
|
id="test1"
|
|
value="1"
|
|
required /><span> Option 7 </span>
|
|
</label>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="textarea-container">
|
|
<label class="textarea-label">
|
|
<textarea class="inputs" id="text"
|
|
name="text" rows="6" cols="60"
|
|
maxlength="200"></textarea>
|
|
</label>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="spacer" aria-hidden="true" style="height:30px"></div>
|
|
|
|
|
|
<div class="centertext">
|
|
<button type="button" class="videocontrols" id="buttonCamera" onclick="cameraButton()">
|
|
<img id="buttonCameraIcon" src="{{ url_for('static', filename='icons/camera-icon.png')}}"
|
|
alt="Camera Icon">
|
|
</button>
|
|
|
|
|
|
<div class="spacer" aria-hidden="true" style="height:30px"></div>
|
|
|
|
|
|
<button type="button" class="videocontrols" id="buttonRecord" style="display:none"
|
|
onclick="recordButton()">
|
|
<img id="buttonRecordIcon" src="{{ url_for('static', filename='icons/record-icon.png')}}"
|
|
alt="Camera Icon">
|
|
</button>
|
|
|
|
<button type="button" class="videocontrols" id="buttonDelete" style="display:none" disabled
|
|
onclick="deleteButton()">
|
|
<img id="buttonDeleteIcon" src="{{ url_for('static', filename='icons/trash-icon.png')}}"
|
|
alt="Delete Icon" class="buttondisable">
|
|
</button>
|
|
</div>
|
|
|
|
<div class="spacer" aria-hidden="true" style="height:15px"></div>
|
|
<div id="videoContainer" style="display:none" class="video-container">
|
|
<video autoplay muted playsinline id="videoDisplay"></video>
|
|
</div>
|
|
|
|
<script src="{{ url_for('static', filename='videoscript.js')}}">
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<div class="button-container">
|
|
<input class="inputs" id="submitbutton" type="submit" value="submit" />
|
|
<!-- TODO maybe I want to use this instead: <button id="submitbutton" type="submit">Submit</button> -->
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |