original way with random type getter

kaleabAlemayehu · Oct 28, 2022 · 50bbf25 · 50bbf25
1 parent 077af91
commit 50bbf25
Showing 1 changed file with 24 additions and 5 deletions.
diff --git a/src/main.js b/src/main.js
@@ -1,25 +1,44 @@
 import Search from './models/Search';
 import { dom } from './domStrings';
+// change HTML Collection into array to make it iterable
+const types = Array.from(dom.type);
+const state = {
+  type: '',
+  number: '',
+};
 
 const getType = () => {
-  // change HTML Collection into array to make it iterable
-  const types = Array.from(dom.type);
   // iterate over the the list to find selected class
   for (let i = 0; i < types.length; i++) {
     const classTokens = Array.from(types[i].classList);
     if (classTokens.includes('selected')) {
       // geting data-* attribute from the list
-      return types[i].dataset.id;
+      state.type = types[i].dataset.id;
     }
   }
 };
 
+// Random Controller
 const randomHandler = async (e) => {
-  const type = getType();
-  const randomSearch = new Search('random', type);
+  const randomSearch = new Search('random', state.type);
   console.log(await randomSearch.getFact());
 };
 
 ['click', 'touchstart'].forEach((e) => {
   dom.random.addEventListener(e, randomHandler);
 });
+
+// type conntroller
+
+const typeHandler = (e) => {
+  for (let i = 0; i < types.length; i++) {
+    types[i].classList.remove('selected');
+  }
+  e.target.classList.toggle('selected');
+  state.type = e.target.dataset.id;
+};
+types.forEach((type) => {
+  ['click', 'touchstart'].forEach((e) => {
+    type.addEventListener(e, typeHandler);
+  });
+});