var questions = [
  Q1 = {
		question: "What does HTML means?",
		answer: "HyperText Markup Language"
  },
  Q2 = {
		question: "What does CSS means?",
		answer: "Cascading Style Sheet"
  },
  Q3 = {
		question: "Why the \"C\" in CSS, is called Cascading?",
		answer: "When CSS rules are duplicated, the rule to be use is chosen by <em>cascading</em> down from more general rules to the specific rule required"
  }
];

var question = document.getElementById('question');

var questionNum = 0,
	answeredQA = [],
	errorTimes = 0;

// Generate random number to display random QA set
function createNum() {
	// Recursively create random questionNum so that last QA set will not be repeated
	while (answeredQA.indexOf(questionNum) !== -1) {
		if (errorTimes > 10) {
			revealBtn.value = "RESTART";
			return false;
		}
		questionNum = Math.floor(Math.random() * 3);
		errorTimes++;
	}
	question.style.opacity = 0;
	setTimeout(function () {
		question.innerHTML = questions[questionNum].question;
		question.style.opacity = 1;
	}, 500);
	answeredQA.push(questionNum);
}

var revealBtn = document.getElementById('reveal-answer');

function revealAns() {
	if (this.value == "RESTART") {
		location.reload();
	} else if (this.value == "NEXT") {
		revealBtn.value = "REVEAL";
		createNum();
	} else {
		question.innerHTML = questions[questionNum].answer;
		revealBtn.value = "NEXT";
	}
}

revealBtn.onclick = revealAns;

window.onload = createNum;
@@ -729,16 +729,75 @@
 = -1) %7B%0A
+%09%09// If all QAs set is finished, let user restart the quiz%0A
 %09%09if (er
@@ -866,16 +866,41 @@
 se;%0A%09%09%7D%0A
+%09%09// Generate random num%0A
 %09%09questi
@@ -957,16 +957,32 @@
 s++;%0A%09%7D%0A
+%09// Fade effect%0A
 %09questio
@@ -1002,16 +1002,64 @@
 ty = 0;%0A
+%09// Wait for 500ms before changing the question%0A
 %09setTime
@@ -1172,16 +1172,82 @@
 , 500);%0A
+%09// Let this program know that the user already seen the question%0A
 %09answere
@@ -1386,16 +1386,37 @@
 ART%22) %7B%0A
+%09%09// Reload the page%0A
 %09%09locati
@@ -1500,30 +1500,104 @@
 ;%0A%09%09
-createNum();%0A%09%7D else %7B
+// Display next set of QA%0A%09%09createNum();%0A%09%7D else %7B%0A%09%09// If value is %22REVEAL%22, display the answer
 %0A%09%09q

Add comments