+
${val.hide_answer == 1 ? "" : val.answer}
`);
@@ -1191,14 +1385,24 @@ async function askQuestion(totalQuizQuestions, counter, fromBack) {
});
if (!atleastOneImage) {
- if (!$("#page3 .questionRow").hasClass("no-image")) $("#page3 .questionRow").addClass("no-image");
+ if (!$("#page3 .questionRow").hasClass("no-image"))
+ $("#page3 .questionRow").addClass("no-image");
}
- $(".sliderRanges div").css("width", `${parseFloat(1 / ques.answers.length) * 100}%`);
+ $(".sliderRanges div").css(
+ "width",
+ `${parseFloat(1 / ques.answers.length) * 100}%`
+ );
if (alreadyAnswered && alreadyAnswered.answer) {
$(`#typeSlide #myRange`).val(parseFloat(alreadyAnswered.slider_value));
$("#myRange").trigger("input", [true]);
- } else if (currenQuesAnswerObj && currenQuesAnswerObj.answer && !alreadyAnswered) {
- $(`#typeSlide #myRange`).val(parseFloat(currenQuesAnswerObj.slider_value));
+ } else if (
+ currenQuesAnswerObj &&
+ currenQuesAnswerObj.answer &&
+ !alreadyAnswered
+ ) {
+ $(`#typeSlide #myRange`).val(
+ parseFloat(currenQuesAnswerObj.slider_value)
+ );
$("#myRange").trigger("input", [true]);
}
} // type 6 ends here
@@ -1211,25 +1415,39 @@ async function askQuestion(totalQuizQuestions, counter, fromBack) {
if (val.answer) {
$("#typeSelection .answerInner").append(`
-
+
`);
}
});
+ // Add 'None of the above' button
+ $("#typeSelection .answerInner").append(`
+
+
+
+ `);
if (alreadyAnswered && alreadyAnswered.answer) {
if (Array.isArray(alreadyAnswered.answer)) {
alreadyAnswered.answer.forEach((answer) => {
if (!["Banana", "Olive", "Sunflowers"].includes(answer)) {
- $(`#typeSelection button[data-val="${answer}"]`).trigger("click", [true]);
+ $(`#typeSelection button[data-val="${answer}"]`).trigger("click", [
+ true,
+ ]);
}
});
}
- } else if (currenQuesAnswerObj && currenQuesAnswerObj.answer && !alreadyAnswered) {
+ } else if (
+ currenQuesAnswerObj &&
+ currenQuesAnswerObj.answer &&
+ !alreadyAnswered
+ ) {
if (Array.isArray(currenQuesAnswerObj.answer)) {
currenQuesAnswerObj.answer.forEach((answer) => {
if (!["Banana", "Olive", "Sunflowers"].includes(answer)) {
- $(`#typeSelection button[data-val="${answer}"]`).trigger("click", [true]);
+ $(`#typeSelection button[data-val="${answer}"]`).trigger("click", [
+ true,
+ ]);
}
});
}
@@ -1244,7 +1462,11 @@ async function askQuestion(totalQuizQuestions, counter, fromBack) {
if (alreadyAnswered && alreadyAnswered.answer) {
$("#typeGeo input#city").val(alreadyAnswered.answer);
$("#typeGeo #city_id").val(alreadyAnswered.city_id);
- } else if (currenQuesAnswerObj && currenQuesAnswerObj.answer && !alreadyAnswered) {
+ } else if (
+ currenQuesAnswerObj &&
+ currenQuesAnswerObj.answer &&
+ !alreadyAnswered
+ ) {
$("#typeGeo input#city").val(currenQuesAnswerObj.answer);
$("#typeGeo #city_id").val(currenQuesAnswerObj.city_id);
}
@@ -1261,6 +1483,8 @@ async function askQuestion(totalQuizQuestions, counter, fromBack) {
$("#questionRow h1").html(ques.question);
}
currentQuestionCounter++;
+ // At the end of askQuestion, always update the nav bar
+ renderQuestionNavBar();
}
async function storeAnswer(currentQuestion, currentActiveAnswerType) {
@@ -1285,12 +1509,18 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
dataToReturn.push(temp);
} else {
const dependedOnQuestions = dataToReturn.filter((ansObj, index) => {
- if (ansObj.question.depends_on && ansObj.question.depends_on.split("|")[0] == temp["question"].id) {
+ if (
+ ansObj.question.depends_on &&
+ ansObj.question.depends_on.split("|")[0] == temp["question"].id
+ ) {
ansObj.obj_index = index;
return ansObj;
}
});
- if (dependedOnQuestions && temp["answer"] !== dataToReturn[answerExists].answer) {
+ if (
+ dependedOnQuestions &&
+ temp["answer"] !== dataToReturn[answerExists].answer
+ ) {
dependedOnQuestions.forEach((dq) => {
dataToReturn.splice(dq.obj_index, 1);
});
@@ -1328,12 +1558,18 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
dataToReturn.push(temp);
} else {
const dependedOnQuestions = dataToReturn.filter((ansObj, index) => {
- if (ansObj.question.depends_on && ansObj.question.depends_on.split("|")[0] == temp["question"].id) {
+ if (
+ ansObj.question.depends_on &&
+ ansObj.question.depends_on.split("|")[0] == temp["question"].id
+ ) {
ansObj.obj_index = index;
return ansObj;
}
});
- if (dependedOnQuestions && temp["answer"] !== dataToReturn[answerExists].answer) {
+ if (
+ dependedOnQuestions &&
+ temp["answer"] !== dataToReturn[answerExists].answer
+ ) {
dependedOnQuestions.forEach((dq) => {
dataToReturn.splice(dq.obj_index, 1);
});
@@ -1367,12 +1603,18 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
dataToReturn.push(temp);
} else {
const dependedOnQuestions = dataToReturn.filter((ansObj, index) => {
- if (ansObj.question.depends_on && ansObj.question.depends_on.split("|")[0] == temp["question"].id) {
+ if (
+ ansObj.question.depends_on &&
+ ansObj.question.depends_on.split("|")[0] == temp["question"].id
+ ) {
ansObj.obj_index = index;
return ansObj;
}
});
- if (dependedOnQuestions && temp["answer"] !== dataToReturn[answerExists].answer) {
+ if (
+ dependedOnQuestions &&
+ temp["answer"] !== dataToReturn[answerExists].answer
+ ) {
dependedOnQuestions.forEach((dq) => {
dataToReturn.splice(dq.obj_index, 1);
});
@@ -1406,12 +1648,18 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
dataToReturn.push(temp);
} else {
const dependedOnQuestions = dataToReturn.filter((ansObj, index) => {
- if (ansObj.question.depends_on && ansObj.question.depends_on.split("|")[0] == temp["question"].id) {
+ if (
+ ansObj.question.depends_on &&
+ ansObj.question.depends_on.split("|")[0] == temp["question"].id
+ ) {
ansObj.obj_index = index;
return ansObj;
}
});
- if (dependedOnQuestions && temp["answer"] !== dataToReturn[answerExists].answer) {
+ if (
+ dependedOnQuestions &&
+ temp["answer"] !== dataToReturn[answerExists].answer
+ ) {
dependedOnQuestions.forEach((dq) => {
dataToReturn.splice(dq.obj_index, 1);
});
@@ -1431,12 +1679,18 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
dataToReturn.push(temp);
} else {
const dependedOnQuestions = dataToReturn.filter((ansObj, index) => {
- if (ansObj.question.depends_on && ansObj.question.depends_on.split("|")[0] == temp["question"].id) {
+ if (
+ ansObj.question.depends_on &&
+ ansObj.question.depends_on.split("|")[0] == temp["question"].id
+ ) {
ansObj.obj_index = index;
return ansObj;
}
});
- if (dependedOnQuestions && temp["answer"] !== dataToReturn[answerExists].answer) {
+ if (
+ dependedOnQuestions &&
+ temp["answer"] !== dataToReturn[answerExists].answer
+ ) {
dependedOnQuestions.forEach((dq) => {
dataToReturn.splice(dq.obj_index, 1);
});
@@ -1454,12 +1708,18 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
dataToReturn.push(temp);
} else {
const dependedOnQuestions = dataToReturn.filter((ansObj, index) => {
- if (ansObj.question.depends_on && ansObj.question.depends_on.split("|")[0] == temp["question"].id) {
+ if (
+ ansObj.question.depends_on &&
+ ansObj.question.depends_on.split("|")[0] == temp["question"].id
+ ) {
ansObj.obj_index = index;
return ansObj;
}
});
- if (dependedOnQuestions && temp["answer"] !== dataToReturn[answerExists].answer) {
+ if (
+ dependedOnQuestions &&
+ temp["answer"] !== dataToReturn[answerExists].answer
+ ) {
dependedOnQuestions.forEach((dq) => {
dataToReturn.splice(dq.obj_index, 1);
});
@@ -1475,7 +1735,11 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
return false;
}
if (ans && !city_id) {
- await fetch(url_preset + "/api/v1/places/autocomplete?input=" + ans.replace(/ /g, ""))
+ await fetch(
+ url_preset +
+ "/api/v1/places/autocomplete?input=" +
+ ans.replace(/ /g, "")
+ )
.then((res) => res.json())
.then(function (data) {
city_id = data[0].id;
@@ -1483,11 +1747,15 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
}
try {
if (!$(".lds-ring").hasClass("active")) $(".lds-ring").addClass("active");
- const payload = await fetch(url_preset + `/api/v1/weather-profile?city_id=${city_id}`).then((response) => response.json());
+ const payload = await fetch(
+ url_preset + `/api/v1/weather-profile?city_id=${city_id}`
+ ).then((response) => response.json());
if (payload.success && payload.data) {
temp["weights"] = payload.data.weights;
$("#humidity .info-value").html(payload.data.humidity);
- $("#temp .info-value").html(`${payload.data.temperature}${payload.data.unit}`);
+ $("#temp .info-value").html(
+ `${payload.data.temperature}${payload.data.unit}`
+ );
$("#sun .info-value").html(payload.data.sun);
$("#pollution .info-value").html(payload.data.pollution);
} else {
@@ -1509,12 +1777,18 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
dataToReturn.push(temp);
} else {
const dependedOnQuestions = dataToReturn.filter((ansObj, index) => {
- if (ansObj.question.depends_on && ansObj.question.depends_on.split("|")[0] == temp["question"].id) {
+ if (
+ ansObj.question.depends_on &&
+ ansObj.question.depends_on.split("|")[0] == temp["question"].id
+ ) {
ansObj.obj_index = index;
return ansObj;
}
});
- if (dependedOnQuestions && temp["answer"] !== dataToReturn[answerExists].answer) {
+ if (
+ dependedOnQuestions &&
+ temp["answer"] !== dataToReturn[answerExists].answer
+ ) {
dependedOnQuestions.forEach((dq) => {
dataToReturn.splice(dq.obj_index, 1);
});
@@ -1524,6 +1798,20 @@ async function storeAnswer(currentQuestion, currentActiveAnswerType) {
}
}
localStorage.setItem("answers", JSON.stringify(dataToReturn));
+ if (
+ typeof customerEmail !== "undefined" &&
+ customerEmail &&
+ customerEmail.innerText
+ ) {
+ localStorage.setItem(
+ "answers_" + customerEmail.innerText,
+ JSON.stringify(dataToReturn)
+ );
+ }
+ let userKey = getUserProgressKey();
+ localStorage.setItem(userKey, JSON.stringify(dataToReturn));
+ checkResumeButtonVisibility();
+ renderQuestionNavBar();
}
let currentSuggestIndex;
@@ -1532,7 +1820,10 @@ let itemSelected = false;
let enterOnce = false;
$(document).on("click focus", async function (event) {
- if (!event.target.closest("#result") && !event.target.closest("#typeGeo input")) {
+ if (
+ !event.target.closest("#result") &&
+ !event.target.closest("#typeGeo input")
+ ) {
$("#result").css({
display: "none",
});
@@ -1573,7 +1864,9 @@ $("#typeGeo input").on("keyup", function (evt) {
return nextQuestion();
}
$("#typeGeo input").val($("#suggestion-list li.active.selected").text());
- $("#typeGeo #city_id").val($("#suggestion-list li.active.selected").attr("data-place-id"));
+ $("#typeGeo #city_id").val(
+ $("#suggestion-list li.active.selected").attr("data-place-id")
+ );
$("#result").css({
display: "none",
});
@@ -1593,13 +1886,19 @@ $("#typeGeo input").on("keyup", function (evt) {
currentSuggestIndex = 1;
}
} else if (evt.key == "ArrowUp") {
- currentSuggestIndex = currentSuggestIndex ? currentSuggestIndex - 1 : listLength;
+ currentSuggestIndex = currentSuggestIndex
+ ? currentSuggestIndex - 1
+ : listLength;
if (currentSuggestIndex < 1) {
currentSuggestIndex = listLength;
}
}
- $(`#suggestion-list li:nth-child(${currentSuggestIndex})`).addClass("active");
- $(`#suggestion-list li:nth-child(${currentSuggestIndex})`).addClass("selected");
+ $(`#suggestion-list li:nth-child(${currentSuggestIndex})`).addClass(
+ "active"
+ );
+ $(`#suggestion-list li:nth-child(${currentSuggestIndex})`).addClass(
+ "selected"
+ );
return false;
}
@@ -1616,11 +1915,18 @@ $("#typeGeo input").on("keyup", function (evt) {
return;
}
let list = "";
- fetch(url_preset + "/api/v1/places/autocomplete?input=" + val.replace(/ /g, ""))
+ fetch(
+ url_preset + "/api/v1/places/autocomplete?input=" + val.replace(/ /g, "")
+ )
.then((res) => res.json())
.then(function (data) {
for (i = 0; i < data.length; i++) {
- list += `
` + data[i].name + "";
+ list +=
+ `
` +
+ data[i].name +
+ "";
}
res.html(`
`);
return true;
@@ -1656,7 +1962,9 @@ $(document).on("input", "#myRange", async function (event, isCustom) {
sliderBLActives = currRange.black_list_actives;
if (currRange.image) {
if ($("#typeSlide .answerInner .imgDiv img").length == 0) {
- $("#typeSlide .answerInner .imgDiv").append(`
`);
+ $("#typeSlide .answerInner .imgDiv").append(
+ `
`
+ );
} else {
$("#typeSlide .answerInner .imgDiv img").attr("id", currRange.image.id);
$("#typeSlide .answerInner .imgDiv img").attr("src", currRange.image.url);
@@ -1742,7 +2050,9 @@ async function addToCart() {
if (response.ok && data) {
const products = data.products;
existingProducts = products.filter((product) => {
- let inFinalList = finalActives.find((active) => active[0] == product.title);
+ let inFinalList = finalActives.find(
+ (active) => active[0] == product.title
+ );
if (inFinalList) {
product.score = inFinalList[1];
return product;
@@ -1754,7 +2064,9 @@ async function addToCart() {
lineItems.push({
id: prod.variants[0].id,
quantity: 1,
- properties: { score: prod.score ? parseFloat(prod.score).toFixed(2) : -1 },
+ properties: {
+ score: prod.score ? parseFloat(prod.score).toFixed(2) : -1,
+ },
});
// }
});
@@ -1802,3 +2114,509 @@ function handleNoneOfTheAbove() {
function handleImageMissing(self) {
$(self).addClass("image-missing");
}
+
+// 1. Add checkAllergie function near the top (after variable declarations)
+function checkAllergie(btn) {
+ clearTimeout(timeout);
+ var val = $(btn).attr("data-val");
+ // Quiz 4: Terminate if Banana, Olive, or Sunflowers is selected
+ if (["Banana", "Olive", "Sunflowers"].includes(val)) {
+ showTerminationScreen();
+ return;
+ }
+ if ($(btn).hasClass("active")) {
+ tempSelectionAns.splice(tempSelectionAns.indexOf(val), 1);
+ $(btn).removeClass("active");
+ $(btn).removeClass("highlight");
+ } else {
+ tempSelectionAns.push(val);
+ if (!$(btn).hasClass("active")) $(btn).addClass("active");
+ if (!$(btn).hasClass("highlight")) $(btn).addClass("highlight");
+ }
+ timeout = setTimeout(function () {
+ nextQuestion();
+ }, selectionQuestionTimeoutCounter);
+}
+
+// Quiz 4: Show termination overlay and handle countdown/redirect
+function showTerminationScreen() {
+ // Get message and counter from mainConfigurations (from /configurations API)
+ var message =
+ mainConfigurations && mainConfigurations.termination_message
+ ? mainConfigurations.termination_message
+ : "You have selected an allergen. The quiz will now end.";
+ var counter =
+ mainConfigurations && mainConfigurations.termination_counter
+ ? parseInt(mainConfigurations.termination_counter)
+ : 5;
+ $("#terminationMessage").text(message);
+ $("#terminationCountdown").text(counter);
+ $("#terminationOverlay").css({ display: "flex" });
+ var countdown = counter;
+ var interval = setInterval(function () {
+ countdown--;
+ if (countdown > 0) {
+ $("#terminationCountdown").text(countdown);
+ } else {
+ clearInterval(interval);
+ window.location.href = "/";
+ }
+ }, 1000);
+}
+
+// Quiz 5: Show Resume Quiz button if progress exists, and handle resume logic
+$(document).ready(function () {
+ // Use email as key if available, otherwise fallback to local
+ let userKey = null;
+ if (
+ typeof customerEmail !== "undefined" &&
+ customerEmail &&
+ customerEmail.innerText
+ ) {
+ userKey = "answers_" + customerEmail.innerText;
+ }
+ let savedAnswers = userKey
+ ? localStorage.getItem(userKey)
+ : localStorage.getItem("answers");
+ if (savedAnswers && JSON.parse(savedAnswers).length > 0) {
+ $("#resumeButton").show();
+ }
+
+ $("#resumeButton").on("click", async function () {
+ // Load saved progress
+ let answers = userKey
+ ? localStorage.getItem(userKey)
+ : localStorage.getItem("answers");
+ if (answers) {
+ dataToReturn = JSON.parse(answers);
+ // Find last answered question
+ let lastQ = dataToReturn[dataToReturn.length - 1];
+ // Set quiz and question index
+ let found = false;
+ for (let i = 0; i < allItems.length; i++) {
+ let idx = allItems[i].questions.findIndex(
+ (q) => q.id === lastQ.question.id
+ );
+ if (idx !== -1) {
+ currentQuizIndex = i;
+ currentQuestionCounter = idx + 1;
+ found = true;
+ break;
+ }
+ }
+ if (!found) {
+ currentQuizIndex = 0;
+ currentQuestionCounter = 0;
+ }
+ $("#page1").css("display", "none");
+ $("#page2").css("display", "none");
+ $("#page3").css("display", "none");
+ $("#page4").css("display", "none");
+ $("#page5").css("display", "none");
+ $("#page6").css("display", "none");
+ $("#page7").css("display", "none");
+ await getQuizzesApi();
+ showQuizTitle();
+ // Resume from next unanswered question
+ return askQuestion(
+ allItems[currentQuizIndex].questions,
+ currentQuestionCounter
+ );
+ }
+ });
+});
+
+// Utility for user-specific progress key
+function getUserProgressKey() {
+ if (
+ typeof customerEmail !== "undefined" &&
+ customerEmail &&
+ customerEmail.innerText
+ ) {
+ return "answers_" + customerEmail.innerText;
+ }
+ return "answers";
+}
+function clearAllProgress() {
+ localStorage.removeItem("answers");
+ if (
+ typeof customerEmail !== "undefined" &&
+ customerEmail &&
+ customerEmail.innerText
+ ) {
+ localStorage.removeItem("answers_" + customerEmail.innerText);
+ }
+}
+
+// Overwrite reset logic
+$(document).on("click", "#resetQuizButton", function () {
+ if (
+ confirm(
+ "Are you sure you want to reset the quiz? All progress will be lost."
+ )
+ ) {
+ clearAllProgress();
+ // Reload the page for a true fresh start (clears all in-memory state/UI)
+ window.location.reload();
+ }
+});
+
+// Overwrite resume logic
+$(document).ready(function () {
+ let userKey = getUserProgressKey();
+ let savedAnswers = localStorage.getItem(userKey);
+ if (savedAnswers && JSON.parse(savedAnswers).length > 0) {
+ $("#resumeButton").show();
+ }
+ $("#resumeButton")
+ .off("click")
+ .on("click", async function () {
+ let userKey = getUserProgressKey();
+ let answers = localStorage.getItem(userKey);
+ let navState = localStorage.getItem("quiz_nav_state");
+ await getQuizzesApi(); // Always load quizzes first
+ let startFromBeginning = false;
+ let found = false;
+ if (answers) {
+ try {
+ dataToReturn = JSON.parse(answers);
+ } catch (e) {
+ dataToReturn = [];
+ }
+ if (Array.isArray(dataToReturn) && dataToReturn.length > 0) {
+ let lastQ = dataToReturn[dataToReturn.length - 1];
+ if (
+ lastQ &&
+ lastQ.question &&
+ typeof lastQ.question.id !== "undefined"
+ ) {
+ for (let i = 0; i < allItems.length; i++) {
+ let idx = allItems[i].questions.findIndex(
+ (q) => q.id === lastQ.question.id
+ );
+ if (idx !== -1) {
+ currentQuizIndex = i;
+ currentQuestionCounter = idx + 1;
+ found = true;
+ break;
+ }
+ }
+ }
+ }
+ }
+ // If not found by answers, try nav state
+ if (!found && navState) {
+ try {
+ const { quizIndex, questionCounter } = JSON.parse(navState);
+ if (
+ typeof quizIndex === "number" &&
+ typeof questionCounter === "number"
+ ) {
+ currentQuizIndex = quizIndex;
+ currentQuestionCounter = questionCounter;
+ found = true;
+ }
+ } catch (e) {}
+ }
+ // If still not found, start from beginning
+ if (!found) {
+ currentQuizIndex = 0;
+ currentQuestionCounter = 0;
+ }
+ $("#page1").css("display", "none");
+ $("#page2").css("display", "none");
+ $("#page3").css("display", "none");
+ $("#page4").css("display", "none");
+ $("#page5").css("display", "none");
+ $("#page6").css("display", "none");
+ $("#page7").css("display", "none");
+ showQuizTitle();
+ askQuestion(allItems[currentQuizIndex].questions, currentQuestionCounter);
+ });
+});
+
+// In storeAnswer, always save to the correct user key
+async function storeAnswer(currentQuestion, currentActiveAnswerType) {
+ // ... existing code ...
+ let userKey = getUserProgressKey();
+ localStorage.setItem(userKey, JSON.stringify(dataToReturn));
+ checkResumeButtonVisibility();
+ renderQuestionNavBar();
+}
+
+function renderQuestionNavBar() {
+ if (!allItems || allItems.length === 0 || !$("#page3").is(":visible")) {
+ $("#questionNavBar").hide();
+ return;
+ }
+ let questions = [];
+ allItems.forEach((quiz) => {
+ quiz.questions.forEach((q) => {
+ questions.push({ id: q.id, text: q.question });
+ });
+ });
+ let answeredIds = (dataToReturn || [])
+ .map((a) => a.question && a.question.id)
+ .filter(Boolean);
+ // Determine the current question id
+ let currentId = null;
+ if (
+ allItems[currentQuizIndex] &&
+ allItems[currentQuizIndex].questions[currentQuestionCounter] // currentQuestionCounter points to the next question, so use currentQuestionCounter-1 if >0
+ ) {
+ currentId =
+ allItems[currentQuizIndex].questions[currentQuestionCounter]?.id;
+ // If currentId is undefined (e.g., at end), fallback to previous
+ if (!currentId && currentQuestionCounter > 0) {
+ currentId =
+ allItems[currentQuizIndex].questions[currentQuestionCounter - 1]?.id;
+ }
+ } else if (
+ allItems[currentQuizIndex] &&
+ allItems[currentQuizIndex].questions[currentQuestionCounter - 1]
+ ) {
+ currentId =
+ allItems[currentQuizIndex].questions[currentQuestionCounter - 1].id;
+ }
+ let html = "";
+ questions.forEach((q, idx) => {
+ let btnClass = "nav-btn";
+ const isAnswered = answeredIds.includes(q.id);
+ const isCurrent = q.id === currentId;
+ if (isAnswered) btnClass += " answered";
+ if (isCurrent) btnClass += " current";
+ if (!isAnswered) btnClass += " unanswered";
+ html += `
`;
+ });
+ $("#questionNavBar").html(html).show();
+}
+
+// Handle nav bar button click
+$(document).on("click", "#questionNavBar .nav-btn", function () {
+ let qid = parseInt($(this).attr("data-qid"));
+ let found = false;
+ for (let i = 0; i < allItems.length; i++) {
+ let idx = allItems[i].questions.findIndex((q) => q.id === qid);
+ if (idx !== -1) {
+ currentQuizIndex = i;
+ currentQuestionCounter = idx;
+ found = true;
+ break;
+ }
+ }
+ if (found) {
+ askQuestion(allItems[currentQuizIndex].questions, currentQuestionCounter);
+ }
+});
+
+// Update nav bar on question change
+let origAskQuestion = askQuestion;
+askQuestion = async function (...args) {
+ let result = await origAskQuestion.apply(this, args);
+ renderQuestionNavBar();
+ return result;
+};
+
+// Show/hide nav bar on page changes
+function updateNavBarVisibility() {
+ if (
+ typeof renderQuestionNavBar === "function" &&
+ $("#page3").is(":visible")
+ ) {
+ renderQuestionNavBar();
+ $("#questionNavBar").show();
+ } else {
+ $("#questionNavBar").hide();
+ }
+}
+// Ensure nav bar is shown after every askQuestion
+if (!window._quizNavWrapped) {
+ window._quizNavWrapped = true;
+ const origAskQuestion = askQuestion;
+ askQuestion = async function (...args) {
+ let result = await origAskQuestion.apply(this, args);
+ updateNavBarVisibility();
+ saveNavState();
+ return result;
+ };
+}
+// On page load or resume, restore nav state and show nav bar if on question page
+$(document).ready(function () {
+ loadNavState();
+ updateNavBarVisibility();
+});
+
+// Add minimal CSS for nav bar button states
+$(
+ ""
+).appendTo("head");
+
+// Utility for nav state persistence
+function saveNavState() {
+ localStorage.setItem(
+ "quiz_nav_state",
+ JSON.stringify({
+ quizIndex: currentQuizIndex,
+ questionCounter: currentQuestionCounter,
+ })
+ );
+}
+function loadNavState() {
+ const state = localStorage.getItem("quiz_nav_state");
+ if (state) {
+ try {
+ const { quizIndex, questionCounter } = JSON.parse(state);
+ if (
+ typeof quizIndex === "number" &&
+ typeof questionCounter === "number"
+ ) {
+ currentQuizIndex = quizIndex;
+ currentQuestionCounter = questionCounter;
+ }
+ } catch (e) {}
+ }
+}
+
+// On reset, clear nav state
+function clearAllProgress() {
+ localStorage.removeItem("answers");
+ localStorage.removeItem("quiz_nav_state");
+ if (
+ typeof customerEmail !== "undefined" &&
+ customerEmail &&
+ customerEmail.innerText
+ ) {
+ localStorage.removeItem("answers_" + customerEmail.innerText);
+ }
+ $("#resumeButton").hide();
+}
+
+// BEGIN button: always start fresh and clear progress
+$(document).on("click", "#beginButton", async function () {
+ clearAllProgress();
+ $("#resumeButton").hide();
+ $("#page1").css("display", "none");
+ $("#page2").css("display", "none");
+ $("#page3").css("display", "none");
+ $("#page4").css("display", "none");
+ $("#page5").css("display", "none");
+ $("#page6").css("display", "none");
+ $("#page7").css("display", "none");
+ dataToReturn = [];
+ uniqueQuestionsShowed = [];
+ lastQuizResponseShown = null;
+ lastShowedQuestionId = null;
+ currentQuizIndex = 0;
+ currentQuestionCounter = 0;
+ isExecuted = false;
+ await getQuizzesApi();
+ showQuizTitle();
+ askQuestion(allItems[currentQuizIndex].questions, 0);
+});
+
+// Resume button logic: only show if there is progress
+function checkResumeButtonVisibility() {
+ let userKey = getUserProgressKey();
+ let savedAnswers = localStorage.getItem(userKey);
+ let navState = localStorage.getItem("quiz_nav_state");
+ if ((savedAnswers && JSON.parse(savedAnswers).length > 0) || navState) {
+ $("#resumeButton").show();
+ } else {
+ $("#resumeButton").hide();
+ }
+}
+
+$(document).ready(function () {
+ loadNavState();
+ updateNavBarVisibility();
+ checkResumeButtonVisibility();
+ $("#resumeButton")
+ .off("click")
+ .on("click", async function () {
+ let userKey = getUserProgressKey();
+ let answers = localStorage.getItem(userKey);
+ let navState = localStorage.getItem("quiz_nav_state");
+ await getQuizzesApi(); // Always load quizzes first
+ let startFromBeginning = false;
+ let found = false;
+ if (answers) {
+ try {
+ dataToReturn = JSON.parse(answers);
+ } catch (e) {
+ dataToReturn = [];
+ }
+ if (Array.isArray(dataToReturn) && dataToReturn.length > 0) {
+ let lastQ = dataToReturn[dataToReturn.length - 1];
+ if (
+ lastQ &&
+ lastQ.question &&
+ typeof lastQ.question.id !== "undefined"
+ ) {
+ for (let i = 0; i < allItems.length; i++) {
+ let idx = allItems[i].questions.findIndex(
+ (q) => q.id === lastQ.question.id
+ );
+ if (idx !== -1) {
+ currentQuizIndex = i;
+ currentQuestionCounter = idx + 1;
+ found = true;
+ break;
+ }
+ }
+ }
+ }
+ }
+ // If not found by answers, try nav state
+ if (!found && navState) {
+ try {
+ const { quizIndex, questionCounter } = JSON.parse(navState);
+ if (
+ typeof quizIndex === "number" &&
+ typeof questionCounter === "number"
+ ) {
+ currentQuizIndex = quizIndex;
+ currentQuestionCounter = questionCounter;
+ found = true;
+ }
+ } catch (e) {}
+ }
+ // If still not found, start from beginning
+ if (!found) {
+ currentQuizIndex = 0;
+ currentQuestionCounter = 0;
+ }
+ $("#page1").css("display", "none");
+ $("#page2").css("display", "none");
+ $("#page3").css("display", "none");
+ $("#page4").css("display", "none");
+ $("#page5").css("display", "none");
+ $("#page6").css("display", "none");
+ $("#page7").css("display", "none");
+ showQuizTitle();
+ askQuestion(allItems[currentQuizIndex].questions, currentQuestionCounter);
+ });
+});
+
+// After reset, hide resume button until new progress is made
+function clearAllProgress() {
+ localStorage.removeItem("answers");
+ localStorage.removeItem("quiz_nav_state");
+ if (
+ typeof customerEmail !== "undefined" &&
+ customerEmail &&
+ customerEmail.innerText
+ ) {
+ localStorage.removeItem("answers_" + customerEmail.innerText);
+ }
+ $("#resumeButton").hide();
+}
diff --git a/public/quiz-test.html b/public/quiz-test.html
index b09189a..996e8ba 100644
--- a/public/quiz-test.html
+++ b/public/quiz-test.html
@@ -23,10 +23,15 @@
Let’s start our journey
just for you.
-
- We are experts on skin and skincare actives..
-
+
We are experts on skin and skincare actives..
+