From 8fd5ca2187eff8f12c76f319dd978a219f5630db Mon Sep 17 00:00:00 2001 From: Andre Pires Date: Thu, 18 Sep 2025 20:22:56 +0100 Subject: [PATCH 1/4] Day 1 is done --- src/question.js | 73 +++++++++++++++++++++++++++++++++++++++++++++++-- src/quiz.js | 53 +++++++++++++++++++++++++++++++++-- 2 files changed, 122 insertions(+), 4 deletions(-) diff --git a/src/question.js b/src/question.js index 68f6631a..1d003292 100644 --- a/src/question.js +++ b/src/question.js @@ -2,6 +2,75 @@ class Question { // YOUR CODE HERE: // // 1. constructor (text, choices, answer, difficulty) - + constructor(text, choices, answer, difficulty){ + this.text=text; + this.choices=choices; + this.answer=answer; + this.difficulty=difficulty; + } // 2. shuffleChoices() -} \ No newline at end of file + shuffleChoices(){ + const oldArray = [...this.choices]; + const newArray=[]; + while (oldArray.length>0){ + const randomArrayIndex = Math.floor(Math.random()*(oldArray.length)); + if(oldArray[randomArrayIndex]!==undefined){ + newArray.push(oldArray[randomArrayIndex]); + oldArray.splice(randomArrayIndex, 1); + } + } + this.choices = newArray; + return this.choices; + + // shuffleChoices(){ + // let i = 10; + // while (i>0){ + // const randomArrayIndex = Math.floor(Math.random()*(this.choices.length)); + // const pichOneAnswer = this.choices[randomArrayIndex]; + // this.choices.splice(randomArrayIndex, 1); + // this.choices.push(pichOneAnswer); + // i --; + // } + // } + + } +} + + + +// ------------------First Try------------------------------- + + +// ------------------Testing------------------------------- +// const testArray=["a","b","c","d"]; +// const newArray=[]; +// // const randomArrayIndex = Math.floor(Math.random()*(testArray.length)); +// // console.log(Math.floor(Math.random()*(testArray.length))); +// // console.log(testArray[randomArrayIndex]); + + +// ------------------First Try------------------------------- +// while (testArray.length>0){ +// const randomArrayIndex = Math.floor(Math.random()*(testArray.length)); +// if(testArray[randomArrayIndex]!==undefined){ +// newArray.push(testArray[randomArrayIndex]); +// testArray.splice(randomArrayIndex, 1); +// } +// } + +// console.log(testArray); +// console.log(newArray); + + +// ------------------Second Try------------------------------- +// const testArray2=["a","b","c","d"]; +// let i = 10; +// while (i>0){ +// const randomArrayIndex = Math.floor(Math.random()*(testArray2.length)); +// const string = testArray2[randomArrayIndex]; +// testArray2.splice(randomArrayIndex, 1); +// testArray2.push(string); +// i --; +// } + +// console.log(testArray2); diff --git a/src/quiz.js b/src/quiz.js index d94cfd14..fbd3fa44 100644 --- a/src/quiz.js +++ b/src/quiz.js @@ -2,14 +2,63 @@ class Quiz { // YOUR CODE HERE: // // 1. constructor (questions, timeLimit, timeRemaining) + constructor(questions, timeLimit, timeRemaining){ + this.questions=questions; + this.timeLimit=timeLimit; + this.timeRemaining=timeRemaining; + this.correctAnswers=0; + this.currentQuestionIndex=0; + } + // 2. getQuestion() - + getQuestion(){ + return this.questions[this.currentQuestionIndex]; + } +/* + Questions = [ + {text:, choices:[], answer:[], difficulty:}; + {text:, choices:[], answer:[], difficulty:}; + {text:, choices:[], answer:[], difficulty:}; + {text:, choices:[], answer:[], difficulty:} + ] +*/ + + + // 3. moveToNextQuestion() + moveToNextQuestion(){ + this.currentQuestionIndex +=1; + } + - // 4. shuffleQuestions() + // 4. shuffleQuestions() + shuffleQuestions(){ + let i = 10; + while (i>0){ + const randomArrayIndex = Math.floor(Math.random()*(this.questions.length)); + const pichOneAnswer = this.questions[randomArrayIndex]; + this.questions.splice(randomArrayIndex, 1); + this.questions.push(pichOneAnswer); + i --; + } + } // 5. checkAnswer(answer) + checkAnswer(answer){ + const currentQuestion = this.getQuestion(); + if(answer === currentQuestion.answer){ + this.correctAnswers += 1; + } + } + // 6. hasEnded() + hasEnded(){ + if(this.currentQuestionIndex===this.questions.length){ + return true; + } else { + return false; + } + } } \ No newline at end of file From 3acc95dd2dd53e9e63230711850cd609d50a00dc Mon Sep 17 00:00:00 2001 From: Andre Pires Date: Sat, 20 Sep 2025 17:05:43 +0100 Subject: [PATCH 2/4] Day2 done --- src/quiz.js | 25 ++++++++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/src/quiz.js b/src/quiz.js index fbd3fa44..7ba79e47 100644 --- a/src/quiz.js +++ b/src/quiz.js @@ -61,4 +61,27 @@ class Quiz { return false; } } -} \ No newline at end of file + + // 7. filterQuestionsByDifficulty() + filterQuestionsByDifficulty(difficulty){ + if (difficulty>=1 && difficulty<=3){ + const newVar7 = this.questions.filter( each_question =>{ + return each_question.difficulty === difficulty; + }) + this.questions=newVar7; + } + } + + + // 8. averageDifficulty() + averageDifficulty(){ + const sumDifficulty = this.questions.reduce((accummulative, each_question)=>{ + const valueDifficulty = each_question.difficulty; + return accummulative + valueDifficulty; + },0) + const howManyQuesitons = this.questions.length; + return sumDifficulty/howManyQuesitons; + } + + +} From 7793a39346776f6f20ac7585bb0b872ea7c750d8 Mon Sep 17 00:00:00 2001 From: Andre Pires Date: Tue, 30 Sep 2025 22:17:29 +0100 Subject: [PATCH 3/4] day3 solved --- index.html | 2 +- src/index.js | 68 ++++++++++++++++++++++++++++++++++++++++------------ 2 files changed, 54 insertions(+), 16 deletions(-) diff --git a/index.html b/index.html index 534cd886..a5fee0b6 100644 --- a/index.html +++ b/index.html @@ -39,7 +39,7 @@

JavaScript Quiz

- + diff --git a/src/index.js b/src/index.js index 03737ba3..315370bc 100644 --- a/src/index.js +++ b/src/index.js @@ -75,7 +75,6 @@ document.addEventListener("DOMContentLoaded", () => { // showResults() - Displays the end view and the quiz results - function showQuestion() { // If the quiz has ended, show the results if (quiz.hasEnded()) { @@ -91,26 +90,26 @@ document.addEventListener("DOMContentLoaded", () => { const question = quiz.getQuestion(); // Shuffle the choices of the current question by calling the method 'shuffleChoices()' on the question object question.shuffleChoices(); - - + // YOUR CODE HERE: // // 1. Show the question // Update the inner text of the question container element and show the question text - + questionContainer.innerText = question.text; // 2. Update the green progress bar // Update the green progress bar (div#progressBar) width so that it shows the percentage of questions answered - - progressBar.style.width = `65%`; // This value is hardcoded as a placeholder - + // progressBar.style.width = `65%`; // This value is hardcoded as a placeholder + const currentIndex = quiz.currentQuestionIndex+1; + const percentageProgression = currentIndex/(quiz.questions.length)*100 + progressBar.style.width = `${percentageProgression}%`; // 3. Update the question count text // Update the question count (div#questionCount) show the current question out of total questions - - questionCount.innerText = `Question 1 of 10`; // This value is hardcoded as a placeholder + const questionNumber = 10 + questionCount.innerText = `Question ${currentIndex} of ${quiz.questions.length}`; // This value is hardcoded as a placeholder @@ -128,10 +127,32 @@ document.addEventListener("DOMContentLoaded", () => { // Hint 3: You can use the `element.appendChild()` method to append an element to the choices container. // Hint 4: You can use the `element.innerText` property to set the inner text of an element. + // console.log(question.choices); + question.choices.forEach(each_choice => { + // Create input element (radio button) + const input = document.createElement('input'); + input.type = "radio"; + input.name = "choice"; // group all radios together + input.value = each_choice; + + // Create label element + const label = document.createElement('label'); + label.innerText = each_choice; + + // Add a line break + const br = document.createElement('br'); + + // Append elements to parent + let parent = document.querySelector('#choices'); + parent.appendChild(input); + parent.appendChild(label); + parent.appendChild(br); + }); } - + + function nextButtonHandler () { let selectedAnswer; // A variable to store the selected answer value @@ -140,23 +161,29 @@ document.addEventListener("DOMContentLoaded", () => { // YOUR CODE HERE: // // 1. Get all the choice elements. You can use the `document.querySelectorAll()` method. - + const collectAnswers = document.querySelectorAll('input[name="choice"]'); // 2. Loop through all the choice elements and check which one is selected // Hint: Radio input elements have a property `.checked` (e.g., `element.checked`). // When a radio input gets selected the `.checked` property will be set to true. // You can use check which choice was selected by checking if the `.checked` property is true. - + collectAnswers.forEach((each_colleted_choice) => { + if(each_colleted_choice.checked === true){ + selectedAnswer=each_colleted_choice.value; + }; + }) // 3. If an answer is selected (`selectedAnswer`), check if it is correct and move to the next question // Check if selected answer is correct by calling the quiz method `checkAnswer()` with the selected answer. // Move to the next question by calling the quiz method `moveToNextQuestion()`. // Show the next question by calling the function `showQuestion()`. + quiz.checkAnswer(selectedAnswer); + quiz.moveToNextQuestion(); + showQuestion(); } - function showResults() { // YOUR CODE HERE: @@ -168,7 +195,18 @@ document.addEventListener("DOMContentLoaded", () => { endView.style.display = "flex"; // 3. Update the result container (div#result) inner text to show the number of correct answers out of total questions - resultContainer.innerText = `You scored 1 out of 1 correct answers!`; // This value is hardcoded as a placeholder + resultContainer.innerText = `You scored ${quiz.correctAnswers} out of ${quiz.questions.length} correct answers!`; // This value is hardcoded as a placeholder } - + + + document.querySelector('#restartButton').addEventListener('click', ()=>{ + endView.style.display = "none"; + quizView.style.display = "flex"; + quiz.currentQuestionIndex = 0; + quiz.correctAnswers = 0; + quiz.shuffleQuestions(); + showQuestion(); + + }) + }); \ No newline at end of file From 7bd034d1df07d4999e1d23db098fe479f7904ade Mon Sep 17 00:00:00 2001 From: Andre Pires Date: Wed, 1 Oct 2025 21:35:13 +0100 Subject: [PATCH 4/4] Day4 solved --- src/index.js | 22 ++++++++++++++++++++-- 1 file changed, 20 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index 315370bc..a97df72a 100644 --- a/src/index.js +++ b/src/index.js @@ -45,6 +45,7 @@ document.addEventListener("DOMContentLoaded", () => { /************ SHOW INITIAL CONTENT ************/ + function timeInitialContent(){ // Convert the time remaining in seconds to minutes and seconds, and pad the numbers with zeros if needed const minutes = Math.floor(quiz.timeRemaining / 60).toString().padStart(2, "0"); const seconds = (quiz.timeRemaining % 60).toString().padStart(2, "0"); @@ -52,7 +53,9 @@ document.addEventListener("DOMContentLoaded", () => { // Display the time remaining in the time remaining container const timeRemainingContainer = document.getElementById("timeRemaining"); timeRemainingContainer.innerText = `${minutes}:${seconds}`; + }; + timeInitialContent(); // Show first question showQuestion(); @@ -61,6 +64,19 @@ document.addEventListener("DOMContentLoaded", () => { let timer; + function timeStarts(){ + timer = setInterval(function(){ + quiz.timeRemaining -= 1; + timeInitialContent(); + // Display the time remaining in the time remaining container + if (quiz.timeRemaining <= 0) { + clearInterval(timer); + showResults(); + } + },1000); + } + + timeStarts() /************ EVENT LISTENERS ************/ @@ -196,6 +212,8 @@ document.addEventListener("DOMContentLoaded", () => { // 3. Update the result container (div#result) inner text to show the number of correct answers out of total questions resultContainer.innerText = `You scored ${quiz.correctAnswers} out of ${quiz.questions.length} correct answers!`; // This value is hardcoded as a placeholder + + clearInterval(timer); } @@ -206,7 +224,7 @@ document.addEventListener("DOMContentLoaded", () => { quiz.correctAnswers = 0; quiz.shuffleQuestions(); showQuestion(); - + quiz.timeRemaining = quizDuration; + timeStarts(); }) - }); \ No newline at end of file