added previous button, binding, and function

Author: spacerockzero

public/dist/js/bundle.min.js

@@ -15,7 +15,7 @@ <h1 class="site-heading">Practice JavaScript!</h1>
         <div class="problem-group">
           <div id="problem" class="problem">&zwnj;</div>
           <div class="controls">
-            <!--<img id="prev-problem" class="prev-problem" src="./dist/img/previous.svg" alt="Previous problem" height="80">-->
+            <img id="prev-problem" class="prev-problem" src="./dist/img/previous.svg" alt="Previous problem" height="80">
             <img id="shuffle-problems" class="shuffle-problems" src="./dist/img/shuffle.svg" alt="Shuffle problems" title="Shuffle problems" height="80">
             <img id="next-problem" class="next-problem" src="./dist/img/next.svg" alt="Next problem" title="Next problem"height="80">
           </div>

public/dist/js/bundle.min.js.map

@@ -69,6 +69,7 @@
   const evalConsoleEl = document.getElementById('eval-output');
   const assertConsoleEl = document.getElementById('assert-output');
   const shuffleProblemsButtonEl = document.getElementById('shuffle-problems');
+  const previousProblemButtonEl = document.getElementById('prev-problem');
   const nextProblemButtonEl = document.getElementById('next-problem');
 
   // get indexes
@@ -79,6 +80,18 @@
     return ind;
   }
 
+  function getPreviousIndex(problemsArr) {
+    let probInd;
+    const currentIndex = config.currentIndex;
+    // if at beginning, go to end
+    if (currentIndex === 0) {
+      probInd = problemsArr.length - 1;
+    } else {
+      probInd = currentIndex - 1;
+    }
+    return probInd;
+  }
+
   function getNextIndex(problemsArr) {
     let probInd;
     const currentIndex = config.currentIndex;
@@ -96,15 +109,22 @@
     return problemsArr[config.currentIndex];
   }
 
+  function previousProblem(e) {
+    console.log('previousProblem!');
+    config.currentIndex = config.shuffle
+      ? getRandomIndex(problems)
+      : getPreviousIndex(problems);
+    updateLocalstore(config).then(_ => {
+      window.location.reload();
+    });
+  }
+
   function nextProblem(e) {
     console.log('nextProblem!');
     config.currentIndex = config.shuffle
       ? getRandomIndex(problems)
       : getNextIndex(problems);
-    console.log('config.currentIndex:', config.currentIndex);
     updateLocalstore(config).then(_ => {
-      console.log('then reload!');
-      // loadProblem(currentProblem, true);
       window.location.reload();
     });
   }
@@ -282,6 +302,7 @@
       }
     });
     shuffleProblemsButtonEl.addEventListener('click', toggleShuffle);
+    previousProblemButtonEl.addEventListener('click', previousProblem);
     nextProblemButtonEl.addEventListener('click', nextProblem);
 
     // start it up!