From 90c20c08e1a9a07f869de7b01c2673beaf182666 Mon Sep 17 00:00:00 2001
From: LSvekis <lassvekis@gmail.com>
Date: Thu, 1 Jul 2021 20:25:07 -0400
Subject: [PATCH] Create Math Quiz

---
 Chapter 12/Math Quiz | 47 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 Chapter 12/Math Quiz
diff --git a/Chapter 12/Math Quiz b/Chapter 12/Math Quiz
new file mode 100644
index 0000000..e360352
--- /dev/null
+++ b/Chapter 12/Math Quiz	
@@ -0,0 +1,47 @@
+<!doctype html>
+<html>
+
+<head>
+        <title>Complete JavaScript Course</title>
+</head>
+
+<body>
+       <span class="val1"></span> <span>+</span> <span class="val2"></span> = <span>
+        <input type="text" name="answer"></span><button>Check</button>
+        <div class="output"></div>
+    <script>
+        const app = function () {
+            const game = {};
+            const val1 = document.querySelector(".val1");
+            const val2 = document.querySelector(".val2");
+            const output = document.querySelector(".output");
+            const answer = document.querySelector("input");
+            function init() {
+                document.querySelector("button").addEventListener("click", checker);
+                loadQuestion();
+            }
+            function ranValue(min, max) {
+                return Math.floor(Math.random() * (max - min + 1) + min);
+            }
+            function loadQuestion() {
+                game.val1 = ranValue(1, 100);
+                game.val2 = ranValue(1, 100);
+                game.answer = game.val1+game.val2;
+                val1.textContent = game.val1;
+                val2.textContent = game.val2;
+            }
+            function checker() {
+                let bg = answer.value == game.answer ? "green" : "red";
+                output.innerHTML += `<div style="color:${bg}">${game.val1} + ${game.val2} = ${game.answer} (${answer.value})</div>`;
+                answer.value = "";
+                loadQuestion();
+            }
+            return {
+                init: init
+            };
+        }();
+        document.addEventListener('DOMContentLoaded', app.init);
+    </script>
+</body>
+
+</html>
