Sorting

Bubble, Insertion and Selection Sort.

by Abid Shaik

HTML

<div Id="InputArray">
</div>

<div Id="OutputResult">
</div>


<input id="BtnGenNumbers" type="button" value="Generate New Numbers" />

<input id="BtnBubbleSort" type="button" value="Bubble Sort" />
<input id="BtnSelectionSort" type="button" value="Selection Sort" />

CSS

input{
  margin: 5px;
}
input[type="button"]{
  display: block;
  margin: 10px;
}

JavaScript

var sortingDemoObject = {
  ElementSize: 10,
  InputArray: [],
  OutPutArray: [],
  Initialize: function() {
    this.InputArray = [];
    sortingDemoObject.BuildInputArray();
  },
  DisplayResult: function(cntrl, text) {
    $(cntrl).append(text); //Clear previous Text. 
    $.each(sortingDemoObject.InputArray, function(key, value) {
      $(cntrl).append(value).append(", ");
    });
  },
  BuildInputArray: function() {
    for (var i = 0; i < this.ElementSize; i++) {
      var ranNum = Math.floor(Math.random() * this.ElementSize * 10);
      this.InputArray.push(ranNum);
    }
  },
  BubbleSort: function() {
    var temp;
    for (var o = this.ElementSize - 1; o >= 0; o--) {
      for (var i = 0; i <= o - 1; i++) {
        // $("#OutputResult").append("inner = " + i).append("; Outer = " + o).append("<br>");

        if (this.InputArray[i] > this.InputArray[i + 1]) {
          temp = this.InputArray[i];
          this.InputArray[i] = this.InputArray[i + 1];
          this.InputArray[i + 1] = temp;
          this.OutPutArray.push(this.InputArray[i]);
          // Array Situation in this Loop 
          $.each(sortingDemoObject.InputArray, function(key, value) {
            //  $("#OutputResult").append(value).append(", ").append("<br>");
          });
        }

      }
    }
  },
  SelectionSort: function() {
    var temp;
    for (var o = 0; o <= this.ElementSize - 1; o++) {
      for (var i = o + 1; i < this.ElementSize - 1; i++) {
				console.log(o); console.log(i);  
      }
    }
  },
  InsertionSort: function() {}
};
sortingDemoObject.Initialize();

$("#BtnGenNumbers").on("click", function() {
  $("#InputArray").html("");
  sortingDemoObject.Initialize();
  sortingDemoObject.DisplayResult("#InputArray", "Input Array: ");
});

$("#BtnBubbleSort").on("click", function() {
  sortingDemoObject.BubbleSort();
  sortingDemoObject.DisplayResult("#OutputResult", "Sorted Array: ");
});

$("#BtnSelectionSort").on("click", function() {
 ...