Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- let counter = 0;
- let correct = 0;
- let db_matrix = {
- question_1: "Is Donald Trump the president of the United States?",
- queston_1_correct: "Donald Trump is currently the president.",
- question_1_wrong: "Donald Trump is currently not the president.",
- question_2: "Is the creator of this program called Edin?",
- queston_2_correct: "Yes, the creator of this program is Edin.",
- question_2_wrong: "No, the creator of this program is John.",
- question_3: "Are complex passwords an important security measure?",
- queston_3_correct: "Complex passwords are not important anymore.",
- question_3_wrong: "Complex passwords are an important security measure."
- };
- // appending HTML code to the DOM
- html_inject = (in_1,in_2,in_4) => {
- in_1 = document.getElementById(in_2);
- in_1.insertAdjacentHTML('afterend', in_4);
- };
- let qstn_str_1 = document.getElementById('strt_1');
- qstn_str_1.addEventListener("click", function() {
- // remove intial quiz instructions
- let prt_qz = document.getElementById("quiz");
- let chld_qz = document.getElementById("question");
- prt_qz.removeChild(chld_qz);
- // remove "start quiz" button
- let chld_qz_btn = document.getElementById("strt_1");
- prt_qz.removeChild(chld_qz_btn);
- // raw HTML data for the question, answers and buttons.
- let qstn_strg_qst = '<h2 id="question" class="headline-secondary--grouped">' + db_matrix.question_1 + '</h2>';
- let qstn_strg0 = '<p id="choice0">' + db_matrix.queston_1_correct + '</p>';
- let qstn_strg1 = '<button id="guess0" class="btn--default">Select Answer</button>';
- let qstn_strg2 = '<p id="choice1">' + db_matrix.question_1_wrong +'</p>';
- let qstn_strg3 = '<button id="guess1" class="btn--default">Select Answer</button>';
- // Question 1, Answer 1, Answer 1 button, Answer 2, Answer 2 button ==> html injection
- html_inject(document.getElementById("quiz_title"), "quiz_title", qstn_strg_qst);
- html_inject(document.getElementById("question"), "question", qstn_strg0);
- html_inject(document.getElementById("choice0"), "choice0", qstn_strg1);
- html_inject(document.getElementById("guess0"), "guess0", qstn_strg2);
- html_inject(document.getElementById("choice1"), "choice1", qstn_strg3);
- // change question counter
- let prgs = document.getElementById('progress')
- counter ++;
- prgs.innerHTML = "Question " + counter + " of 3";
- // *** QUESTION ONE CODE BLOCK ***
- // ** BUTTON ONE **
- let qstn_str_2 = document.getElementById('guess0')
- qstn_str_2.addEventListener("click", function() {
- console.log("clicked!");
- console.log(this);
- });
- // ** BUTTON TWO **
- let qstn_str_3 = document.getElementById('guess1')
- qstn_str_3.addEventListener("click", function() {
- page_builder(this.id);
- });
- page_builder = (bttn) => {
- // grab all IDs for (1) question and all answers
- let qst_1 = document.getElementById('question');
- let prnt = document.getElementById('quiz')
- // two answers to be removed
- let answers_1 = document.getElementById('choice0');
- let answers_2 = document.getElementById('choice1');
- prnt.removeChild(answers_1);
- prnt.removeChild(answers_2);
- prnt.removeChild(qst_1);
- // Updating counter
- let prgs = document.getElementById('progress')
- counter ++;
- prgs.innerHTML = "Question " + counter + " of 3";
- let answr_0 = bttn;
- console.log(bttn);
- };
- });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement