From f0e8fe4f441756eb56535c20803d5fd2a944472b Mon Sep 17 00:00:00 2001
From: ben-burlingham <ben.burlingham@boostctr.com>
Date: Sun, 1 Nov 2015 10:50:07 -0800
Subject: [PATCH] Bubble sort visualization finished.

---
 index.html          |  2 +-
 js/bubblesort.js    | 80 ++++++++++++++++++++++++++++++++++++++++++---
 js/insertionsort.js |  2 +-
 js/mergesort.js     |  2 +-
 js/quicksort.js     |  2 +-
 js/selectionsort.js |  7 ++--
 js/shellsort.js     |  2 +-
 js/sorter.js        |  9 -----
 8 files changed, 84 insertions(+), 22 deletions(-)

diff --git a/index.html b/index.html
index 203a17d..f6b40d6 100644
--- a/index.html
+++ b/index.html
@@ -78,7 +78,7 @@
 
     <h1>bubble sort discussion</h1>
     how is this different from insertion and selection sorts. <br>
-    swap. highlight. fade.
+    talk about turtles and rabbits, because search loops from beginning each time. Every number out of place means a new pass must be done.
     <div class="sorter"
     data-algorithm='bubble'
     data-stable='Maybe'
diff --git a/js/bubblesort.js b/js/bubblesort.js
index ac934b1..eac19cf 100644
--- a/js/bubblesort.js
+++ b/js/bubblesort.js
@@ -9,6 +9,65 @@ var BubbleSort = function() {
     this.comparisons = 0;
 
     //===== Action management.
+    //
+    this.preSort = function(arr) {
+        this
+            .instruct(Itemgroup.background, 1, 0, 0, arr.length, Visualizer.bg0)
+
+            .instruct(Itemgroup.message, 0, 0, 1, `Comparisons: ${this.comparisons}`)
+            .instruct(Itemgroup.message, 0, 0, 2, `Swaps: ${this.swaps}`)
+            .instruct(Itemgroup.message, 0, 0, 3, ``)
+            .instruct(Itemgroup.message, 0, 0, 4, ``)
+            .instruct(Itemgroup.message, 0, 100, 5, `Starting sort.`)
+    };
+
+    //
+    this.midSort = function(arr, i) {
+        this
+            .instruct(Itemgroup.background, 1, 0, 0, arr.length, Visualizer.bg0)
+            .instruct(Itemgroup.background, 1, 0, i, i, Visualizer.bg1)
+            .instruct(Itemgroup.background, 1, 0, (i - 1), (i - 1), Visualizer.bg1)
+
+            .instruct(Itemgroup.message, 0, 0, 1, `Comparisons: ${this.comparisons}`)
+            .instruct(Itemgroup.message, 0, 0, 3, `Comparing ${arr[i - 1]} and ${arr[i]}.`)
+            .instruct(Itemgroup.message, 0, 0, 4, ``)
+            .instruct(Itemgroup.message, 0, 100, 5, ``)
+    };
+
+    //
+    this.swap = function(arr, i) {
+        this
+            .instruct(Itemgroup.background, 1, 0, 0, arr.length, Visualizer.bg0)
+            .instruct(Itemgroup.background, 1, 0, i, i, Visualizer.bg1)
+            .instruct(Itemgroup.background, 1, 0, (i - 1), (i - 1), Visualizer.bg1)
+
+            .instruct(Itemgroup.message, 0, 0, 2, `Swaps: ${this.swaps}`)
+            .instruct(Itemgroup.message, 0, 0, 4, `${arr[i]} > ${arr[i - 1]}`)
+            .instruct(Itemgroup.message, 0, 0, 5, `Swap current and previous.`)
+            .instruct(Itemgroup.swap, 1, 300, i, i - 1)
+    };
+
+    //
+    this.foundSwapped = function(arr) {
+        this
+            .instruct(Itemgroup.background, 1, 0, 0, arr.length, Visualizer.bg0)
+
+            .instruct(Itemgroup.message, 0, 0, 3, ``)
+            .instruct(Itemgroup.message, 0, 0, 4, `Swapped elements found.`)
+            .instruct(Itemgroup.message, 0, 100, 5, `Recursing.`)
+    };
+
+    //
+    this.postSort = function(arr) {
+        this
+            .instruct(Itemgroup.background, 1, 0, 0, arr.length, Visualizer.bg0)
+
+            .instruct(Itemgroup.message, 0, 0, 1, `Comparisons: ${this.comparisons}`)
+            .instruct(Itemgroup.message, 0, 0, 2, `Swaps: ${this.swaps}`)
+            .instruct(Itemgroup.message, 0, 0, 3, ``)
+            .instruct(Itemgroup.message, 0, 0, 4, ``)
+            .instruct(Itemgroup.message, 0, 100, 5, `Sorting complete.`)
+    };
 };
 
 BubbleSort.prototype = Object.create(Sorter.prototype);
@@ -40,22 +99,35 @@ BubbleSort.prototype.init = function() {
  *
  */
 BubbleSort.prototype.sort = function(arr) {
-    var i;
+    var i, tmp;
     var swapped = false;
     var len = arr.length;
 
-    // NOTE this starts at the beginning of the array each time
+    this.preSort(arr);
+
     for (i = 1; i < len; i++) {
+        this.comparisons++;
+        this.midSort(arr, i);
+
         if (arr[i - 1] > arr[i]) {
-            this.swap(arr, i, i - 1);
+            this.swaps++;
+
+            tmp = arr[i];
+            arr[i] = arr[i - 1];
+            arr[i - 1] = tmp;
+
             swapped = true;
-            // console.log(dump(arr));
+
+            this.swap(arr, i, i - 1);
         }
     }
 
     if (swapped === true) {
+        this.foundSwapped(arr);
         this.sort(arr);
     }
 
+    this.postSort(arr);
+
     return arr;
 };
diff --git a/js/insertionsort.js b/js/insertionsort.js
index e288ccb..7806707 100644
--- a/js/insertionsort.js
+++ b/js/insertionsort.js
@@ -18,7 +18,7 @@ var InsertionSort = function() {
             .instruct(Itemgroup.message, 0, 0, 2, `Swaps: ${this.swaps}`)
             .instruct(Itemgroup.message, 0, 0, 3, ``)
             .instruct(Itemgroup.message, 0, 0, 4, ``)
-            .instruct(Itemgroup.message, 0, 100, 5, ``)
+            .instruct(Itemgroup.message, 0, 100, 5, `Starting sort.`)
     };
 
     //
diff --git a/js/mergesort.js b/js/mergesort.js
index 620fef5..4f429dd 100644
--- a/js/mergesort.js
+++ b/js/mergesort.js
@@ -18,7 +18,7 @@ var MergeSort = function() {
             .instruct(Itemgroup.message, 0, 0, 2, '')
             .instruct(Itemgroup.message, 0, 0, 3, '')
             .instruct(Itemgroup.message, 0, 0, 4, '')
-            .instruct(Itemgroup.message, 0, 0, 5, '');
+            .instruct(Itemgroup.message, 0, 0, 5, 'Starting sort.');
     };
 
 
diff --git a/js/quicksort.js b/js/quicksort.js
index 3d20a51..ee499e7 100644
--- a/js/quicksort.js
+++ b/js/quicksort.js
@@ -22,7 +22,7 @@ var QuickSort = function() {
 
             .instruct(Itemgroup.message, 0, 0, 3, 'Sorting from [' + left + '] to [' + right + ']')
             .instruct(Itemgroup.message, 0, 0, 4, '')
-            .instruct(Itemgroup.message, 0, 100, 5, '');
+            .instruct(Itemgroup.message, 0, 100, 5, 'Starting sort.');
     };
 
     //
diff --git a/js/selectionsort.js b/js/selectionsort.js
index d9db13b..f5f294d 100644
--- a/js/selectionsort.js
+++ b/js/selectionsort.js
@@ -18,14 +18,13 @@ var SelectionSort = function() {
             .instruct(Itemgroup.message, 0, 0, 2, `Swaps: ${this.swaps}`)
             .instruct(Itemgroup.message, 0, 0, 3, ``)
             .instruct(Itemgroup.message, 0, 0, 4, ``)
-            .instruct(Itemgroup.message, 0, 100, 5, ``)
+            .instruct(Itemgroup.message, 0, 100, 5, `Starting sort.`)
     };
 
     //
-    this.findmin = function(arr, i, j, min) {
+    this.midSort = function(arr, i, j, min) {
         this
             .instruct(Itemgroup.background, 1, 0, 0, arr.length, Visualizer.bg0)
-            // .instruct(Itemgroup.background, 1, 0, i, i, '#0C1E42')
             .instruct(Itemgroup.background, 1, 0, j, j, Visualizer.bg1)
             .instruct(Itemgroup.background, 1, 0, i, i, '#435C11')
 
@@ -109,7 +108,7 @@ SelectionSort.prototype.sort = function(arr) {
         min = i;
         for (j = i + 1; j < len; j++) {
             this.comparisons++;
-            this.findmin(arr, i, j, min);
+            this.midSort(arr, i, j, min);
 
             if (arr[j] < arr[min]) {
                 min = j;
diff --git a/js/shellsort.js b/js/shellsort.js
index 3cd1fe0..c3a98e1 100644
--- a/js/shellsort.js
+++ b/js/shellsort.js
@@ -19,7 +19,7 @@ var ShellSort = function() {
             .instruct(Itemgroup.message, 0, 0, 2, `Swaps: ${this.swaps}`)
             .instruct(Itemgroup.message, 0, 0, 3, `Gap: ${gap}`)
             .instruct(Itemgroup.message, 0, 0, 4, ``)
-            .instruct(Itemgroup.message, 0, 100, 5, ``)
+            .instruct(Itemgroup.message, 0, 100, 5, `Starting sort.`)
     };
 
     //
diff --git a/js/sorter.js b/js/sorter.js
index 5138b2c..4190631 100644
--- a/js/sorter.js
+++ b/js/sorter.js
@@ -26,15 +26,6 @@ Sorter.prototype.shuffle = function(arr) {
     return result;
 };
 
-/**
- *
- */
-Sorter.prototype.swap = function(arr, i, j) {
-    var tmp = arr[i];
-    arr[i] = arr[j];
-    arr[j] = tmp;
-};
-
 /**
  *
  */