Exercise 01 - Creating a State Machine - switch

01/index.js

@@ -2,24 +2,38 @@ const elBox = document.querySelector('#box');
 
 // Pure function that returns the next state,
 // given the current state and sent event
-function transition(state, event) {
-  switch (
-    state
-    // Add your state/event transitions here
-    // to determine and return the next state
-  ) {
+const transition = (state, event) => {
+  switch (state) {
+    case "inactive":
+      switch (event) {
+        case "click":
+          return "active";
+        default:
+          return state;  
+      } 
+    case "active":
+      switch (event) {
+        case "click":
+          return "inactive";
+        default:
+          return state;  
+      } 
+    default:
+      return state;  
   }
 }
 
 // Keep track of your current state
-let currentState = undefined;
+// start with inactive initial state
+let currentState = "inactive";
 
-function send(event) {
+const send = event => {
   // Determine the next value of `currentState`
-
+  currentState = transition(currentState, event)
   elBox.dataset.state = currentState;
 }
 
 elBox.addEventListener('click', () => {
   // send a click event
+  send("click")
 });