Conversation
| const onLoad = () => { | ||
| // initialise local storage | ||
|
|
||
| const readFromLocalStorage = (key, defaultValue) => { |
There was a problem hiding this comment.
Move this function to the global scope as it is within the onLoad function and only scoped to the onLoad function. Your local storage feature is not working because this function is not accessible where it is being called.
| } | ||
| }; | ||
|
|
||
| const writeToLocalStorage = (key, value) => { |
There was a problem hiding this comment.
Move this function to the global scope as it is within the onLoad function and only scoped to the onLoad function. Your local storage feature is not working because this function is not accessible where it is being called.
| let quizComplete = false; | ||
| let timerId; | ||
|
|
||
| const onLoad = () => { |
There was a problem hiding this comment.
After you move the 2 local storage functions to global you can delete the onLoad function as it is not required as it isn't being called anywhere.
| getScore: getScore, | ||
| }; | ||
|
|
||
| const finalScores = readFromLocalStorage(finalScores, []); |
There was a problem hiding this comment.
You are using the readFromLocalStorage function to read the data from local storage and not passing in the key of "finalScores" as a string. Please use suggested code.
| const finalScores = readFromLocalStorage(finalScores, []); | |
| const finalScores = readFromLocalStorage("finalScores", []); |
|
|
||
| writeToLocalStorage("finalScores", finalScore); | ||
|
|
||
| formComplete.addEventListener("submit", handleFormSubmit); |
There was a problem hiding this comment.
Add this to the end of the file along with the other event listener. You cannot add an event listener to a function that is called by the event listener
| }; | ||
|
|
||
| const handleFormSubmit = (event) => { | ||
| const formComplete = document.getElementById("form-complete"); |
There was a problem hiding this comment.
Add this to the start of the file with all the other elements you are targeting
|
|
||
| const handleFormSubmit = (event) => { | ||
| const formComplete = document.getElementById("form-complete"); | ||
| const fullNameInput = document.getElementById("full-name-input"); |
There was a problem hiding this comment.
Using incorrect id, please check in your HTML, use suggested code
| const fullNameInput = document.getElementById("full-name-input"); | |
| const fullNameInput = document.getElementById("full-name"); |
| const handleFormSubmit = (event) => { | ||
| const formComplete = document.getElementById("form-complete"); | ||
| const fullNameInput = document.getElementById("full-name-input"); | ||
| const getScore = document.getElementById("form-hs"); |
There was a problem hiding this comment.
This is bringing back the entire element as your score, but your score is the current timerValue. Please use the suggested code
| const getScore = document.getElementById("form-hs"); | |
| const getScore = timerValue; |
| const finalScores = readFromLocalStorage(finalScores, []); | ||
| finalScores.push(finalScore); | ||
|
|
||
| writeToLocalStorage("finalScores", finalScore); |
There was a problem hiding this comment.
You need to push the array which contains the score and not the score object only. Please use suggested code.
| writeToLocalStorage("finalScores", finalScore); | |
| writeToLocalStorage("finalScores", finalScores); |
|
|
||
| const renderQuizCompleteSection = () => { | ||
| // use HTML as guide and build in JS | ||
| const quizFinished = document.getElementById("quiz-complete"); |
There was a problem hiding this comment.
This element is not anywhere on the page and I can see that is commented out in code. Maybe add a display: none css property to that element like the others and when quiz is complete you can remove that class to show the element.
| @@ -0,0 +1,3 @@ | |||
| { | |||
There was a problem hiding this comment.
Delete this file as it is specific to your vs code. To avoid this you can add a .gitignore file with the content:
.vscode
| <button id="start-quiz-btn" class="start-btn">Start Quiz</button> | ||
| </section> | ||
|
|
||
| <!-- <section id="question-list"> |
There was a problem hiding this comment.
Remove unused code which is commented out.
| </form> | ||
| </section> | ||
|
|
||
| <!-- <section id="game-over-section" class="game-over"> |
There was a problem hiding this comment.
Remove unused code which is commented out.
No description provided.