chore: add comments

Author: tuankhainguy

src/components/mid-panel/ProgressBar.js

@@ -31,6 +31,8 @@ class ProgressBar extends React.Component {
   handleMouseMove(e) {
     e.preventDefault();
     let chunkNum;
+
+    // how far around mouse on X to look for viewable chunk
     let searchRadius = 10;
     let rect = this.inner.getBoundingClientRect();
     let width = rect.right - rect.left;
@@ -43,6 +45,7 @@ class ProgressBar extends React.Component {
       chunkNum = this.max - 1;
 
     } else {
+      // translate to viewable chunk array index
       x = Math.round((x / width) * this.max);
       if (x === this.current) {
         return;
@@ -70,6 +73,7 @@ class ProgressBar extends React.Component {
       }
     }
 
+    // move to chunk
     if (this.viewable[chunkNum]) {
       if (chunkNum > this.current) {
         this.next({stopAt: chunkNum, playing: false});
@@ -124,6 +128,7 @@ class ProgressBar extends React.Component {
       }
     }
 
+    // set the progress bar body
     const setProgress = (ref, val) => {
       setTransform(ref, `scaleX(${val})`);
     }
@@ -132,6 +137,7 @@ class ProgressBar extends React.Component {
       setTransform(ref, `scaleX(${val})`);
     }
 
+    // set the slider thumb position
     const setThumb = (thumb, value) => {
       if (thumb !== null) {
         const { style } = thumb;

src/context/actions.js

@@ -211,7 +211,12 @@ function addLineExplanation(procedurePseudocode) {
   }
 }
 
-// get the list showing which chunks can be viewed
+/**
+ * Get the array of viewable state of chunks
+ * @param {object} chunker: current chunker instance
+ * @param {object} pseudocode: pseudocode of current algorithm
+ * @param {object} collapse: collapse state of pseudocode
+ */
 function viewableChunks(chunker, pseudocode, collapse) {
   let currChunkNum = 0;
   let viewable = Array(chunker.chunks.length).fill(false);