Mehr Notizfläche, neu Andordnung von Start und Ende
This commit is contained in:
parent
eeee58220d
commit
27464b8e25
88
Klausur.html
88
Klausur.html
|
@ -2,7 +2,7 @@
|
||||||
<!--
|
<!--
|
||||||
MIT License
|
MIT License
|
||||||
|
|
||||||
Copyright (c) 2022 (Pingger Shikkoken)
|
Copyright (c) 2024 (Pingger Shikkoken)
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
@ -15,7 +15,6 @@
|
||||||
<!-- IT WORKS! DON'T TOUCH IT -->
|
<!-- IT WORKS! DON'T TOUCH IT -->
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body style="background-color: #fff;">
|
<body style="background-color: #fff;">
|
||||||
<div id="header">
|
<div id="header">
|
||||||
|
@ -30,6 +29,11 @@
|
||||||
<li style="left: calc(75vw - 2.5px); top: 0; list-style: none; position: absolute; height: 3vh; width:5px; background-color: #0ff8;" />
|
<li style="left: calc(75vw - 2.5px); top: 0; list-style: none; position: absolute; height: 3vh; width:5px; background-color: #0ff8;" />
|
||||||
</ul>
|
</ul>
|
||||||
<h1 id="clock" class="time" style="text-align: center">...</h1>
|
<h1 id="clock" class="time" style="text-align: center">...</h1>
|
||||||
|
<div style="display:block" id="inExamTimes">
|
||||||
|
<div style="position: absolute; left: 1vw; top: 4vh; font-size: 5vh;" class="inExam">Start: <span class="time" id="inExamExamStart">--:--</span></div>
|
||||||
|
<div style="position: absolute; right: 1vw; top: 4vh; font-size: 5vh;" class="inExam">Ende: <span class="time" id="inExamEnd">--:--</span></div>
|
||||||
|
<div style="position: absolute; right: 1vw; top: 11vh; font-size: 3vh;" id="displayEarlyCutoff" class="inExam">vz. Abgabe bis: <span class="time" id="inExamEarlyCutoff">--:--</span></div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="left">
|
<div id="left">
|
||||||
<div id="seating">
|
<div id="seating">
|
||||||
|
@ -65,6 +69,9 @@
|
||||||
<td><label for="inputExtraDuration">Extra Zeit</label></td>
|
<td><label for="inputExtraDuration">Extra Zeit</label></td>
|
||||||
<td><input id="inputExtraDuration" name="inputExtraDuration" type="number" pattern="[0-9]+" value="5" max="30" min="0" required="required" /><label for="inputExtraDuration"> Minuten</label></td>
|
<td><input id="inputExtraDuration" name="inputExtraDuration" type="number" pattern="[0-9]+" value="5" max="30" min="0" required="required" /><label for="inputExtraDuration"> Minuten</label></td>
|
||||||
</tr>
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td colspan="100%" style="font-size: 70%"><label for="inputExtraDuration">Diese Zeit wird beim Klicken des Start Buttons automatisch hinzugerechnet. (Start um 9:05 mit 5 min extra zeit, sorgt für "Start: 9:10")</label></td>
|
||||||
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td><label for="inputEarlyCutoff">Vorzeitige Abgabefrist</label></td>
|
<td><label for="inputEarlyCutoff">Vorzeitige Abgabefrist</label></td>
|
||||||
<td><input id="inputEarlyCutoff" name="inputEarlyCutoff" type="number" pattern="[0-9]+" value="15" max="180" min="0" required="required" /><label for="inputEarlyCutoff"> Minuten vor Ende der Bearbeitungszeit</label></td>
|
<td><input id="inputEarlyCutoff" name="inputEarlyCutoff" type="number" pattern="[0-9]+" value="15" max="180" min="0" required="required" /><label for="inputEarlyCutoff"> Minuten vor Ende der Bearbeitungszeit</label></td>
|
||||||
|
@ -143,29 +150,14 @@
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div id="inExam" style="display: none;">
|
<div id="inExam" style="display: none;">
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<td>Start: </td>
|
|
||||||
<td class="time" id="inExamStart"></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>Start der Bearbeitungszeit: </td>
|
|
||||||
<td class="time" id="inExamExamStart"></td>
|
|
||||||
</tr>
|
|
||||||
<tr id="inExamEarlyCutoffRow">
|
|
||||||
<td>Vorzeitige Abgabe bis: </td>
|
|
||||||
<td class="time" id="inExamEarlyCutoff"></td>
|
|
||||||
</tr>
|
|
||||||
<tr style="text-decoration: underline; font-size: 5vh;">
|
|
||||||
<td>Ende der Bearbeitungszeit: </td>
|
|
||||||
<td class="time" id="inExamEnd"></td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
|
<textarea id="notes2" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" style="display:none; font-size: 4vh; border: 0px; margin-top: 5vh;width:100%; height: 100%; background-color: #0000;"></textarea>
|
||||||
</div>
|
</div>
|
||||||
<div id="start_btn"><input type="submit" value="Start" autofocus="autofocus" /></div>
|
<div id="start_btn"><input type="submit" value="Start" autofocus="autofocus" /></div>
|
||||||
<div id="reset_btn"><input type="submit" value="Reset" /></div>
|
<div id="reset_btn"><input type="submit" value="Reset" /></div>
|
||||||
<div id="fullscreen_btn"><input type="submit" value="Vollbild" /></div>
|
<div id="fullscreen_btn"><input type="submit" value="Vollbild" /></div>
|
||||||
|
<div id="stopfullscreen_btn"><input type="submit" value="KEIN Vollbild" /></div>
|
||||||
<div id="copyright" style="position: absolute; right:0; bottom: 0;"><!-- Dieser Copyright-Hinweis darf nicht entfernt werden --><a href="https://git.cs.tu-dortmund.de/felix.homa/KlausurSlide" target="_blank">git.cs.tu-dortmund.de/felix.homa/KlausurSlide</a></div>
|
<div id="copyright" style="position: absolute; right:0; bottom: 0;"><!-- Dieser Copyright-Hinweis darf nicht entfernt werden --><a href="https://git.cs.tu-dortmund.de/felix.homa/KlausurSlide" target="_blank">git.cs.tu-dortmund.de/felix.homa/KlausurSlide</a></div>
|
||||||
<script>
|
<script>
|
||||||
var startTime = null;
|
var startTime = null;
|
||||||
|
@ -217,7 +209,7 @@
|
||||||
var on_load_time = new Date();
|
var on_load_time = new Date();
|
||||||
console.log(on_load_time.toLocaleString('sv'));
|
console.log(on_load_time.toLocaleString('sv'));
|
||||||
|
|
||||||
var inputs=["inputExamDuration","inputExtraDuration","inputEarlyCutoff","inputHelpSheet","inputSeatingRowsUsed","inputSeatingRowsFree","inputSeatingSeatsFree","inputExamTitle","inputDarkMode","notes"];
|
var inputs=["inputExamDuration","inputExtraDuration","inputEarlyCutoff","inputHelpSheet","inputSeatingRowsUsed","inputSeatingRowsFree","inputSeatingSeatsFree","inputExamTitle","inputDarkMode","notes", "notes2"];
|
||||||
function start_exam() {
|
function start_exam() {
|
||||||
document.getElementById("start_btn").onclick=""; // Aktion für den Start-Button deaktivieren
|
document.getElementById("start_btn").onclick=""; // Aktion für den Start-Button deaktivieren
|
||||||
document.getElementById("start_btn").innerHTML=""; // Start-Button entfernen
|
document.getElementById("start_btn").innerHTML=""; // Start-Button entfernen
|
||||||
|
@ -225,6 +217,10 @@
|
||||||
document.getElementById("Vorbereitung").style.display="none";
|
document.getElementById("Vorbereitung").style.display="none";
|
||||||
document.getElementById("seating").style.display="none";
|
document.getElementById("seating").style.display="none";
|
||||||
document.getElementById("inExam").style.display="block";
|
document.getElementById("inExam").style.display="block";
|
||||||
|
document.getElementById("inExamTimes").style.display="block";
|
||||||
|
document.getElementById("fullscreen_btn").style.display="block";
|
||||||
|
document.getElementById("stopfullscreen_btn").style.display="block";
|
||||||
|
|
||||||
fullscreenFunc();
|
fullscreenFunc();
|
||||||
var now = new Date();
|
var now = new Date();
|
||||||
|
|
||||||
|
@ -256,7 +252,7 @@
|
||||||
|
|
||||||
examCutoffTime = new Date(endTime);
|
examCutoffTime = new Date(endTime);
|
||||||
examCutoffTime.setMinutes(endTime.getMinutes()-early_cutoff);
|
examCutoffTime.setMinutes(endTime.getMinutes()-early_cutoff);
|
||||||
|
document.getElementById("displayEarlyCutoff").style.display=(early_cutoff>=exam_duration)?"none":"block";
|
||||||
halfHourWarningTime = new Date(endTime);
|
halfHourWarningTime = new Date(endTime);
|
||||||
halfHourWarningTime.setMinutes(endTime.getMinutes()-30);
|
halfHourWarningTime.setMinutes(endTime.getMinutes()-30);
|
||||||
|
|
||||||
|
@ -283,11 +279,11 @@
|
||||||
/*
|
/*
|
||||||
* "InExam"-Setzen. Also die Zeiten Anzeigen
|
* "InExam"-Setzen. Also die Zeiten Anzeigen
|
||||||
*/
|
*/
|
||||||
document.getElementById("inExamStart").innerHTML=startTime.getHours()+":"+(startTime.getMinutes()<10?"0":"")+startTime.getMinutes();
|
|
||||||
document.getElementById("inExamExamStart").innerHTML=examStartTime.getHours()+":"+(examStartTime.getMinutes()<10?"0":"")+examStartTime.getMinutes();
|
document.getElementById("inExamExamStart").innerHTML=examStartTime.getHours()+":"+(examStartTime.getMinutes()<10?"0":"")+examStartTime.getMinutes();
|
||||||
document.getElementById("inExamEarlyCutoff").innerHTML=examCutoffTime.getHours()+":"+(examCutoffTime.getMinutes()<10?"0":"")+examCutoffTime.getMinutes();
|
document.getElementById("inExamEarlyCutoff").innerHTML=examCutoffTime.getHours()+":"+(examCutoffTime.getMinutes()<10?"0":"")+examCutoffTime.getMinutes();
|
||||||
document.getElementById("inExamEnd").innerHTML=endTime.getHours()+":"+(endTime.getMinutes()<10?"0":"")+endTime.getMinutes();
|
document.getElementById("inExamEnd").innerHTML=endTime.getHours()+":"+(endTime.getMinutes()<10?"0":"")+endTime.getMinutes();
|
||||||
document.getElementById("notes").style.display="block";
|
document.getElementById("notes").style.display="block";
|
||||||
|
document.getElementById("notes2").style.display="block";
|
||||||
if(early_cutoff==0) {
|
if(early_cutoff==0) {
|
||||||
document.getElementById("inExamEarlyCutoffRow").style.display="none";
|
document.getElementById("inExamEarlyCutoffRow").style.display="none";
|
||||||
}
|
}
|
||||||
|
@ -421,6 +417,11 @@
|
||||||
document.getElementById("vorHelpsheet").innerHTML=(sp%2==0?sp/2:sp)+" "+(sp%2==0?sp>2?"Bl&amul;tter":"Blatt":sp>1?"Seiten":"Seite") + " DIN-A4 <i>Spickzettel</i> (<b>handbeschrieben</b>)"
|
document.getElementById("vorHelpsheet").innerHTML=(sp%2==0?sp/2:sp)+" "+(sp%2==0?sp>2?"Bl&amul;tter":"Blatt":sp>1?"Seiten":"Seite") + " DIN-A4 <i>Spickzettel</i> (<b>handbeschrieben</b>)"
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var exam_duration = document.getElementById("inputExamDuration").valueAsNumber; // Normale Bearbeitungszeit in Minuten
|
||||||
|
var early_cutoff = document.getElementById("inputEarlyCutoff").valueAsNumber; // Frühzeitige Abgabefrist in Minuten vom Ende
|
||||||
|
|
||||||
|
document.getElementById("displayEarlyCutoff").style.display=(early_cutoff>=exam_duration)?"none":"block";
|
||||||
|
|
||||||
// Start-Button Animation
|
// Start-Button Animation
|
||||||
document.getElementById("start_btn").style.display="block";
|
document.getElementById("start_btn").style.display="block";
|
||||||
setTimeout(function() {
|
setTimeout(function() {
|
||||||
|
@ -433,11 +434,20 @@
|
||||||
}
|
}
|
||||||
function fullscreenFunc() {
|
function fullscreenFunc() {
|
||||||
document.body.requestFullscreen().then(function() {
|
document.body.requestFullscreen().then(function() {
|
||||||
var b = document.getElementById("fullscreen_btn").style;
|
/*var b = document.getElementById("fullscreen_btn").style;
|
||||||
b.transform="scale(1)";
|
b.transform="scale(1)";
|
||||||
b.right="25vw";
|
b.right="25vw";
|
||||||
b.bottom=0;
|
b.bottom=0;
|
||||||
b.display="block";
|
b.display="block";*/
|
||||||
|
}).catch(function(rej){});
|
||||||
|
}
|
||||||
|
function stopFullscreenFunc() {
|
||||||
|
document.exitFullscreen().then(function() {
|
||||||
|
/*var b = document.getElementById("fullscreen_btn").style;
|
||||||
|
b.transform="scale(1)";
|
||||||
|
b.right="25vw";
|
||||||
|
b.bottom=0;
|
||||||
|
b.display="block";*/
|
||||||
}).catch(function(rej){});
|
}).catch(function(rej){});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -475,6 +485,9 @@
|
||||||
document.getElementById("fullscreen_btn").onclick=fullscreenFunc;
|
document.getElementById("fullscreen_btn").onclick=fullscreenFunc;
|
||||||
document.getElementById("fullscreen_btn").firstChild.onsubmit=fullscreenFunc;
|
document.getElementById("fullscreen_btn").firstChild.onsubmit=fullscreenFunc;
|
||||||
|
|
||||||
|
document.getElementById("stopfullscreen_btn").onclick=stopFullscreenFunc;
|
||||||
|
document.getElementById("stopfullscreen_btn").firstChild.onsubmit=stopFullscreenFunc;
|
||||||
|
|
||||||
|
|
||||||
document.getElementById("inputDarkMode").onchange=function() {
|
document.getElementById("inputDarkMode").onchange=function() {
|
||||||
if(document.getElementById("inputDarkMode").checked) {
|
if(document.getElementById("inputDarkMode").checked) {
|
||||||
|
@ -503,9 +516,13 @@
|
||||||
document.getElementById("notes").onkeypress=document.getElementById("notes").onchange;
|
document.getElementById("notes").onkeypress=document.getElementById("notes").onchange;
|
||||||
document.getElementById("notes").onkeyup=document.getElementById("notes").onchange;
|
document.getElementById("notes").onkeyup=document.getElementById("notes").onchange;
|
||||||
document.getElementById("notes").onkeydown=document.getElementById("notes").onchange;
|
document.getElementById("notes").onkeydown=document.getElementById("notes").onchange;
|
||||||
|
document.getElementById("notes2").onchange=document.getElementById("notes").onchange;
|
||||||
|
document.getElementById("notes2").onkeypress=document.getElementById("notes").onchange;
|
||||||
|
document.getElementById("notes2").onkeyup=document.getElementById("notes").onchange;
|
||||||
|
document.getElementById("notes2").onkeydown=document.getElementById("notes").onchange;
|
||||||
if(("inputExamStart" in get_params)) {
|
if(("inputExamStart" in get_params)) {
|
||||||
console.log(document.getElementById("fullscreen_btn").style.display="block");
|
console.log(document.getElementById("fullscreen_btn").style.display="block");
|
||||||
|
document.getElementById("stopfullscreen_btn").style.display="block";
|
||||||
settingsFormSubmitFunc();
|
settingsFormSubmitFunc();
|
||||||
console.log("Yay");
|
console.log("Yay");
|
||||||
}
|
}
|
||||||
|
@ -548,7 +565,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.time {
|
.time {
|
||||||
/*font-family: monospace;*/
|
font-family: monospace, monospace;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -638,11 +655,22 @@
|
||||||
transition-property: all;
|
transition-property: all;
|
||||||
}
|
}
|
||||||
#fullscreen_btn {
|
#fullscreen_btn {
|
||||||
transform: scale(10);
|
/*transform: scale(10);*/
|
||||||
width: 5vw;
|
width: 5vw;
|
||||||
height: 2vh;
|
height: 2vh;
|
||||||
bottom: 60vh;
|
bottom: 0vh;
|
||||||
right: 70vw;
|
right: 45vw;
|
||||||
|
position: absolute;
|
||||||
|
display: none;
|
||||||
|
transition-duration: 1s;
|
||||||
|
transition-property: all;
|
||||||
|
}
|
||||||
|
#stopfullscreen_btn{
|
||||||
|
/*transform: scale(10);*/
|
||||||
|
width: 5vw;
|
||||||
|
height: 2vh;
|
||||||
|
bottom: 0vh;
|
||||||
|
right: 40vw;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
display: none;
|
display: none;
|
||||||
transition-duration: 1s;
|
transition-duration: 1s;
|
||||||
|
|
Loading…
Reference in New Issue