diff --git a/src/index.js b/src/index.js
index 9258781..0862c9c 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,249 +1,240 @@
-var responseCount, currentQuestion, options,
-questions, responses, quizData, question, j,
-$question, $resetButton, isQuestionAnswered
-
-responseCount = 0
-currentQuestion = 0
-options = {
- url: 'data/quiz.json?' + Date.now()
-}
-
-$.ajax({
- url: options.url
-}).done(function(data) {
- questions = data.questions
-
- // Load data from past reponses
- try {
- quizData = JSON.parse(localStorage.getItem('quiz'))
- responses = quizData.responses || []
- currentQuestion = quizData.currentQuestion || -1
- responseCount = quizData.responseCount || -1
- } catch (e) {}
-
- if (quizData == null) {
- quizData = {
- responses: []
- }
- responses = quizData.responses
- }
-
-
- // Append the progress bar to DOM
- $('body')
- .append('')
-
- // Append title and form to quiz
- $('#quiz')
- .append('')
- .append('')
-
- // For each question of the json,
- for (var i = 0; i < data.questions.length; i++) {
- question = data.questions[i]
-
- if (question.input === undefined) {
- question.input = {
- type: 'input'
- }
- }
-
- // Construct the input depending on question type
- switch (question.input.type) {
-
- // Multiple options
- case 'checkbox':
- case 'radio':
- var input = ''
- for (j = 0; j < question.input.options.length; j++) {
- var option = question.input.options[j]
- var type = question.input.type
-
- if (!!responses[i] && responses[i].indexOf(option.label) !== -1) {
- var checked = 'checked'
- } else {
- var checked = ''
- }
-
- input += '
' +
- '
' +
- '' +
- '' +
- '
' +
- '
'
- }
- input += '
' +
- '' +
- '
'
- }
-
- $question = $('' +
- '
' +
- '' +
- '
' +
- '
' +
- input +
- '
' +
- '
Thank you for your responses.
')
- $('#quiz').append('')
- }
-
- // Add a reset button that will redirect to quiz start
- $resetButton = $('')
- $resetButton.on('click', function() {
- localStorage.removeItem('quiz')
- location.reload();
- })
- $('#quiz').append($resetButton)
-
- // Actions on every response submission
- $('#submit-response').on('click', function() {
- var $inputs = $('[name^=question_' + currentQuestion + ']')
- var question = questions[currentQuestion]
-
- // Behavior for each question type to add response to array of responses
- switch (question.input.type) {
- case 'checkbox':
- case 'radio':
- responses[currentQuestion] = []
- $('[name=' + $inputs.attr('name') + ']:checked').each(function(i, input) {
- responses[currentQuestion].push(input.value)
- })
- if (responses[currentQuestion].length === 0) {
- responses[currentQuestion] = null
- }
- break
- case 'inputs':
- responses[currentQuestion] = []
- $inputs.each(function(i, input) {
- responses[currentQuestion].push(input.value)
- })
- break
- default:
- responses[currentQuestion] = $inputs.val()
- }
-
- // Set the current responses counter
- var responseCount = 0
- for (i = 0; i < responses.length; i++) {
- question = questions[i]
- switch (question.input.type) {
- case 'checkbox':
- case 'radio':
- case 'inputs':
- if (!!responses[i] && !!responses[i].join('')) {
- responseCount++
- }
- break
- default:
- if (!!responses[i]) {
- responseCount++
- }
- }
- }
-
- // Update progress bar
- $('#progress')
- .css('width', (responseCount / questions.length * 100) + '%')
-
- // Check if question had a valid answer
- isQuestionAnswered = true
- if (!responses[currentQuestion]) {
- isQuestionAnswered = false
- }
- if (!!responses[currentQuestion] && !!responses[currentQuestion].length) {
- for (j = 0; j < responses[currentQuestion].length; j++) {
- if (!responses[currentQuestion][j]) {
- isQuestionAnswered = false
- }
- }
- }
-
- if (!isQuestionAnswered) {
- // Alert user of missing response
- alert('You must give a response')
- } else {
-
- // Display next question
- $('#quiz-form')
- .find('#question-' + currentQuestion).css('display', 'none')
- currentQuestion = currentQuestion + 1
-
- $('#quiz-form')
- .find('#question-' + currentQuestion).css('display', 'block')
-
- // If it was the las question, display final message
- if (responseCount === questions.length) {
- $('#submit-response').css('display', 'none')
- $('#quiz').append('Thank you for your responses.
')
- $('#quiz').append('')
- }
- }
-
- // Save current state of the quiz
- quizData.responses = responses
- quizData.responseCount = responseCount
- quizData.currentQuestion = currentQuestion
- localStorage.setItem('quiz', JSON.stringify(quizData))
- })
-})
+let options = {
+ url: `data/quiz.json?${Date.now()}`
+}
+
+$.ajax({
+ url: options.url
+}).done(function(data) {
+ const {questions, title} = data
+ let quizData
+ //let responses, responseCount, currentQuestion
+ //responseCount = currentQuestion = 0
+
+ try {
+ quizData = JSON.parse(localStorage.getItem('quiz'))
+
+ //responses = quizData.responses || []
+ //currentQuestion = quizData.currentQuestion || -1
+ //responseCount = quizData.responseCount || -1
+ } catch (e) {}
+
+ if (quizData == null) {
+ quizData = {
+ responses: []
+ }
+ responses = quizData.responses
+ }
+
+ // Load data from past reponses
+ let {responses = [], currentQuestion = 0, responseCount = 0} = quizData
+
+
+ // Append the progress bar to DOM
+ $('body')
+ .append(``)
+
+ // Append title and form to quiz
+ $('#quiz')
+ .append(``)
+ .append(``)
+
+ // For each question of the json,
+ for (let i = 0; i < data.questions.length; i++) {
+ let question = data.questions[i]
+
+ if (question.input === undefined) {
+ question.input = {
+ type: 'input'
+ }
+ }
+
+ // Construct the input depending on question type
+ let input
+ switch (question.input.type) {
+
+ // Multiple options
+ case 'checkbox':
+ case 'radio':
+ input = ''
+ for (let j = 0; j < question.input.options.length; j++) {
+ let option = question.input.options[j]
+ let type = question.input.type
+
+ let checked = (!!responses[i] && responses[i].indexOf(option.label) !== -1) ? 'checked' : ''
+
+ input += `
+
+
+
+
+
`
+
+ }
+ input += '
+
+
`
+ }
+
+ let $question = $(``
+ ).css('display', 'none')
+
+ $('#quiz-form')
+ .append($question)
+
+ // Show current question
+ $('#quiz-form')
+ .find(`#question-${currentQuestion}`)
+ .css('display', 'block')
+
+ // Update progress bar
+ $('#progress')
+ .css('width', (responseCount / questions.length * 100) + '%')
+ }
+
+ // Add button to submit response
+ $('#quiz')
+ .append('')
+
+ // Is case all questions have been responded
+ if (responseCount === questions.length) {
+ $('#submit-response').css('display', 'none')
+ $('#quiz').append('Thank you for your responses.
')
+ $('#quiz').append('')
+ }
+
+ // Add a reset button that will redirect to quiz start
+ let $resetButton = $('')
+ $resetButton.on('click', function() {
+ localStorage.removeItem('quiz')
+ location.reload();
+ })
+ $('#quiz').append($resetButton)
+
+ // Actions on every response submission
+ $('#submit-response').on('click', function() {
+ let $inputs = $(`[name^=question_${currentQuestion}]`)
+ let question = questions[currentQuestion]
+
+ // Behavior for each question type to add response to array of responses
+ switch (question.input.type) {
+ case 'checkbox':
+ case 'radio':
+ responses[currentQuestion] = []
+
+ $(`[name=${$inputs.attr('name')}]:checked`).each(function(i, input) {
+ responses[currentQuestion].push(input.value)
+ })
+ if (responses[currentQuestion].length === 0) {
+ responses[currentQuestion] = null
+ }
+ break
+ case 'inputs':
+ responses[currentQuestion] = []
+ $inputs.each(function(i, input) {
+ responses[currentQuestion].push(input.value)
+ })
+ break
+ default:
+ responses[currentQuestion] = $inputs.val()
+ }
+
+ // Set the current responses counter
+ let responseCount = 0
+ for (let i = 0; i < responses.length; i++) {
+ question = questions[i]
+ switch (question.input.type) {
+ case 'checkbox':
+ case 'radio':
+ case 'inputs':
+ if (!!responses[i] && !!responses[i].join('')) {
+ responseCount++
+ }
+ break
+ default:
+ if (!!responses[i]) {
+ responseCount++
+ }
+ }
+ }
+
+ // Update progress bar
+ $('#progress')
+ .css('width', (responseCount / questions.length * 100) + '%')
+
+ // Check if question had a valid answer
+ let isQuestionAnswered = true
+ if (!responses[currentQuestion]) {
+ isQuestionAnswered = false
+ }
+ if (!!responses[currentQuestion] && !!responses[currentQuestion].length) {
+ for (let j = 0; j < responses[currentQuestion].length; j++) {
+ if (!responses[currentQuestion][j]) {
+ isQuestionAnswered = false
+ }
+ }
+ }
+
+ if (!isQuestionAnswered) {
+ // Alert user of missing response
+ alert('You must give a response')
+ } else {
+
+ // Display next question
+ $('#quiz-form')
+ .find(`#question-${currentQuestion}`).css('display', 'none')
+ currentQuestion = currentQuestion + 1
+
+ $('#quiz-form')
+ .find(`#question-${currentQuestion}`).css('display', 'block')
+
+ // If it was the las question, display final message
+ if (responseCount === questions.length) {
+ $('#submit-response').css('display', 'none')
+ $('#quiz').append('Thank you for your responses.
')
+ $('#quiz').append('')
+ }
+ }
+
+ // Save current state of the quiz
+ quizData.responses = responses
+ quizData.responseCount = responseCount
+ quizData.currentQuestion = currentQuestion
+ localStorage.setItem('quiz', JSON.stringify(quizData))
+ })
+})