Issue with Sorting Visualization

TheApexTheater

I'm trying to create a visualization of a sorting algorithm (starting with bubble sort), but I'm coming across an issue. The way the algorithm (supposed to) work is as follow:

1) Create an array of a certain size, and fill it with random values from 0 to 999 (window height). Draw rectangles representing the data

2) Begin the Bubble Sort

2a) If element a is larger then element a+1 in the array created in (1), swap the two elements

2b) Draw two rectangles (one representing each member of the swap), and draw them again, once the array elements have been swapped

2c) Continue until no more swaps are possible (the array is sorted)

For some reason, whenever I try to implement this, my screen either gets cluttered with the largest rectangle or only shows the result of one swap (the array is sorted by the end, however). Also, not sure how relevant this is, but when I attempt to use the delay function, the program starts acting weirdly... Thanks in advance for any advice

int numOfEntries = 20;
int rectWidth;
void setup()
{
  size(1000, 1000);
  background(255);
  int randomUnsortedArray[] = new int[numOfEntries];
  int rectWidth = width/numOfEntries;

  rectMode(CORNERS);
  fill(125);
  for (int i = 0; i < numOfEntries; i++)
  { //Gives each element in the array a random value
    randomUnsortedArray[i] = int(random(height));
    rect(i*rectWidth, height, rectWidth*(i+1), height-randomUnsortedArray[i]); //Draws the rectangles
  }

  randomUnsortedArray = bubbleSort(randomUnsortedArray);
  delay(2000);
  background(0);
  fill(255);

  for (int i = 0; i < numOfEntries; i++)
  { //Draws rectangles once they've been sorted
    rect(i*rectWidth, height, rectWidth*(i+1), height-randomUnsortedArray[i]);
  }
}

int [] bubbleSort(int unsortedArray[])
{
  float rectWidth = width/unsortedArray.length;
  boolean swap;

  int numOfComparisons =0;
  do { 
    swap=false;
    for (int i = 0; i < unsortedArray.length - 1; i++)
    {
      if (unsortedArray[i] > unsortedArray[i+1])
      {
        //delay(50);
        fill(130, 200, 50); //Before swap
        rect(rectWidth*i, height, rectWidth*(i+1), height-unsortedArray[i]);
        fill(200, 200, 60);
        rect(rectWidth*(i+1), height, rectWidth*(i+2), height-unsortedArray[i+1]);

        //begin swap
        int temp = unsortedArray[i];
        unsortedArray[i] = unsortedArray[i+1];
        unsortedArray[i+1]= temp;
        swap = true;
        //end swap

        fill(130, 200, 50); //After swap
        rect(rectWidth*i, height, rectWidth*(i+1), height-unsortedArray[i]);
        fill(150, 160, 220);
        rect(rectWidth*(i+1), height, rectWidth*(i+2), height-unsortedArray[i+1]);

        numOfComparisons++;
        print("Number of Comparisons: " +numOfComparisons + "\n");
      }
    }
  } while (swap);

  return unsortedArray;
}

koogs

setup runs once, draw redraws the screen at about 60fps but changes are only visible at the end.

your code is missing the latter.

read this: https://forum.processing.org/two/discussion/8087/what-are-setup-and-draw

and don't use delay(). the reference warns you against it.

TheApexTheater

Thanks for the response, koogs! Just so you know, I changed the swapping function to do only one swap per run, and made it so that it returned a slightly different array to draw()

I'm sure there are better ways to do this, but for now, I'm content... Again, thank you for the help!

Revised code:

void draw()
{
  frameRate(120);
  randomUnsortedArray = bubbleSort(randomUnsortedArray);

  for (int i = 0; i < numOfEntries; i++)
  {
    fill(255);
    rect(i*rectWidth, height, rectWidth*(i+1), height-randomUnsortedArray[i]);
  }
}

int numOfComparisons =0;
int [] bubbleSort(int unsortedArray[])
{
  background(0);
  float rectWidth = width/unsortedArray.length;
  boolean swap;
  for (int h = 0; h < numOfEntries; h++)
  {
    fill(255);
    rect(h*rectWidth, height, rectWidth*(h+1), height-randomUnsortedArray[h]);
  }
  swap=false;
  for (int i = 0; i < unsortedArray.length - 1; i++)
  {
    if (unsortedArray[i] > unsortedArray[i+1])
    {
      fill(90, 132, 78);
      rect(rectWidth*(i+1), height, rectWidth*(i+2), height-unsortedArray[i+1]);

      //begin swap
      int temp = unsortedArray[i];
      unsortedArray[i] = unsortedArray[i+1];
      unsortedArray[i+1]= temp;
      swap = true;
      //end swap

      numOfComparisons++;
      print("Number of Comparisons: " +numOfComparisons + "\n");
      break;
    }
  }
  return unsortedArray;
}

TheApexTheater

By the way, Koogs, could you comment again? I accidentally clicked "no" on whether you answered my question and I want to give you appropriate credit.