Skip to content
Snippets Groups Projects
Commit c0265c28 authored by Eliott Sammier's avatar Eliott Sammier
Browse files

Replace default nav buttons

parent 2f8cbacc
Branches 3-qcu-features
No related tags found
No related merge requests found
#correct-indic {
border-radius: 8px;
padding: 16px;
transition: opacity 0.1s ease-in-out;
&.hidden {
display: block;
opacity: 0;
}
p {
margin: 0;
......@@ -13,8 +19,7 @@
&.correct {
background: #dfd;
.label::before {
content: "Correct";
.label {
color: var(--sd-rating-good-color);
}
}
......@@ -23,12 +28,14 @@
background: #fdd;
}
.label::before {
content: "Incorrect";
.label {
color: var(--sd-rating-bad-color);
}
}
#sv-nav-complete {
display: none;
}
p#gapfill-container {
white-space: pre-wrap;
......
......@@ -2,20 +2,33 @@
* Checks whether a question is correct, and update the correct indicator accordingly.
*/
function checkQuestion(question) {
let indicNode = document.getElementById("correct-indic");
let commentNode = indicNode.querySelector(".comment")
if (question.isAnswerCorrect()) {
indicNode.className = "correct";
commentNode.innerText = question.getPropertyValue("correctComment", "");
correctIndic.node.className = "correct"
correctIndic.labelNode.innerText = "Correct";
correctIndic.commentNode.innerText = question.getPropertyValue("correctComment", "");
} else {
indicNode.className = "incorrect";
commentNode.innerText = question.getPropertyValue("incorrectComment", "");
correctIndic.node.className = "incorrect";
correctIndic.labelNode.innerText = "Incorrect";
correctIndic.commentNode.innerText = question.getPropertyValue("incorrectComment", "");
}
console.log("question = ", question);
console.log(" correct = ", question.isAnswerCorrect());
}
function clearQuestion(question) {
question.value = undefined;
correctIndic.node.className = "hidden";
}
let correctIndic;
$(function () {
correctIndic = {
node: document.getElementById("correct-indic"),
commentNode: document.querySelector("#correct-indic .comment"),
labelNode: document.querySelector("#correct-indic .label")
};
// Register our custom question types
Survey.CustomWidgetCollection.Instance.add(gapfillSelectWidget, gapfillSelectWidget.name);
......@@ -34,12 +47,22 @@ $(function () {
// Add "Check answers" button
survey.addNavigationItem({
id: "sv-nav-clear-page",
title: "Check",
id: "sv-nav-check",
title: "Vérifier",
action: () => {
checkQuestion(survey.currentPage.questions[0]);
},
css: "nav-button",
innerCss: "sd-btn sd-btn--action nav-input"
});
// Add "Clear answers" button
survey.addNavigationItem({
id: "sv-nav-clear",
title: "Effacer",
action: () => {
clearQuestion(survey.currentPage.questions[0]);
},
css: "nav-button",
innerCss: "sd-btn nav-input"
});
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment