diff options
Diffstat (limited to 'modules/zelfoverhoor')
-rw-r--r-- | modules/zelfoverhoor/qs.html | 5 | ||||
-rw-r--r-- | modules/zelfoverhoor/qs.js | 25 |
2 files changed, 26 insertions, 4 deletions
diff --git a/modules/zelfoverhoor/qs.html b/modules/zelfoverhoor/qs.html index 32c9099..7191aeb 100644 --- a/modules/zelfoverhoor/qs.html +++ b/modules/zelfoverhoor/qs.html @@ -43,7 +43,7 @@ var questionset=/*###QUESTIONSET###*/; <div id="qsetdescr"></div><br> <br><br> <div id="qcontainer"> - <b>Vraag:</b><br> + <b>Vraag:</b> <small>(<span id="progress"></span>)</small><br> <div id="question"></div><br> <br> <input type="button" id="showAnswerButton" onclick="showAnswer()" value="Laat antwoord zien!"> @@ -56,8 +56,9 @@ var questionset=/*###QUESTIONSET###*/; </div> <div id="rescontainer"> <b>Je hebt alle vragen gehad!</b><br> - <p>Je had <span id="numcorrect"></span> vragen goed van de in totaal <span id="numtotal"></span> vragen.</p> + <p>Je had <span id="numcorrect"></span> <span id="numcorrectvraag"></span> goed van de in totaal <span id="numtotal"></span> <span id="numtotalvraag"></span>.</p> <p id="allcorrectp"><b>Gefeliciteerd met je prestatie! :D</b></p> + <p id="allwrongp"><b>Niet erg, gewoon nog een keer proberen!</b></p> <input type="button" onclick="startQuiz()" value="Nog een keer?"> </div> </body> diff --git a/modules/zelfoverhoor/qs.js b/modules/zelfoverhoor/qs.js index 6b04487..43d68f0 100644 --- a/modules/zelfoverhoor/qs.js +++ b/modules/zelfoverhoor/qs.js @@ -15,15 +15,29 @@ function startQuiz(){ showCurrent(); } +function simpleFormat(text){ + return text + .replace(/&/g,"&") + .replace(/</g,"<") + .replace(/>/g,">") + .replace(/\n/g,"<br>"); +} + +function pluralVraag(n){ + if(n==1)return "vraag"; + else return "vragen"; +} + function showCurrent(){ document.getElementById("qcontainer").classList.remove("invisible"); document.getElementById("rescontainer").classList.add("invisible"); document.getElementById("answercontainer").classList.add("invisible"); document.getElementById("showAnswerButton").classList.remove("invisible"); + document.getElementById("progress").innerHTML=(currentidx+1)+"/"+questions.length; var qdiv=document.getElementById("question"); clearElement(qdiv); - qdiv.appendChild(document.createTextNode(questions[currentidx].q)); + qdiv.innerHTML=simpleFormat(questions[currentidx].q); } function showAnswer(){ @@ -32,19 +46,26 @@ function showAnswer(){ var adiv=document.getElementById("answer"); clearElement(adiv); - adiv.appendChild(document.createTextNode(questions[currentidx].a)); + adiv.innerHTML=simpleFormat(questions[currentidx].a); } function finishQuiz(){ document.getElementById("qcontainer").classList.add("invisible"); document.getElementById("rescontainer").classList.remove("invisible"); document.getElementById("numcorrect").innerHTML=numcorrect; + document.getElementById("numcorrectvraag").innerHTML=pluralVraag(numcorrect); document.getElementById("numtotal").innerHTML=questions.length; + document.getElementById("numtotalvraag").innerHTML=pluralVraag(questions.length); if(numcorrect==questions.length){ document.getElementById("allcorrectp").classList.remove("invisible"); } else { document.getElementById("allcorrectp").classList.add("invisible"); } + if(numcorrect==0){ + document.getElementById("allwrongp").classList.remove("invisible"); + } else { + document.getElementById("allwrongp").classList.add("invisible"); + } } function advance(corr){ |