# Loop & bg problem

**URL:** <https://discourse.processing.org/t/loop-bg-problem/739>\
**Category:** Coding Questions\
**Created:** [June 5, 2018, 8:41pm UTC](https://discourse.processing.org/t/loop-bg-problem/739 "2018-06-05T20:41:14Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![rioma7](https://avatars.discourse-cdn.com/v4/letter/r/3ec8ea/32.png) [@rioma7](https://discourse.processing.org/u/rioma7)\
**Post date:** [June 5, 2018, 8:41pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/1 "2018-06-05T20:41:14Z")

</div>

Hello!!!  
I have this code:

```auto
import ddf.minim.*; 
import ddf.minim.analysis.*;  
Minim minim;   
FFT fft;  
AudioInput in;   
float amp = 20; // used to make signal stronger/weaker 
float ampWave = 20*amp; 
float avgAudio; // store avg volume globally 

float bass; 
float high; 

void setup() {
  background(255);
  size(500, 500);
  noStroke();
  smooth();

  colorMode(HSB, 360, 100, 100);

  minim = new Minim(this); // initalize in setup 
  in = minim.getLineIn(Minim.STEREO, 512); // audio in + bufferSize 512 or 1024 
  fft = new FFT(in.bufferSize(), in.sampleRate());  
  fft.logAverages(22, 3); // 3 = 30, 4 = 40, slices of frequency
}

void draw() {

  if (keyPressed) {
    fft.forward(in.mix); // IMPORTANT! -update for FFT anaylsis
    bass = fft.calcAvg(20, 300)*amp; // fft.calcAvg(minFreq, maxFreq)  
    high = fft.calcAvg(300, 20000)*amp;
  }

  if (bass > high) {
    background(255);
    noStroke();
    fill(random(180,360), 100, 100);

    int n_vertex = int(random(7, 20));

    beginShape();
    for (int i = 0; i < n_vertex; i++) {
    vertex(random(width), random(height));
    }
    
    endShape(CLOSE);
  

} else if (high > bass) {
    background(255);
    noStroke();
    fill(random(1,180), 100, 100);

    int n_vertex = int(random(3, 7));

    beginShape();
    for (int i = 0; i < n_vertex; i++) {
    vertex(random(width), random(height));
    }
    
    endShape(CLOSE);
  }

  println(bass+" / "+high);
}

```

and the problem basically is that after I stop to press the keyboard it continues to draw shapes and I cannot “freeze” it…also the background is not still (255) but it become grey.  
Any idea of this two problems?

thanks

---

<div class="post-metadata">

**Author:** ![josephh](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/josephh/32/210_2.png) [@josephh](https://discourse.processing.org/u/josephh)\
**Post date:** [June 5, 2018, 8:49pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/2 "2018-06-05T20:49:31Z")

</div>

Could you please post the entire code (setup function and import) and format it with `</>` in the message editor like this :

```auto
println("Hello World!");

```

Thanks

---

<div class="post-metadata">

**Author:** ![Trilobyte](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/trilobyte/32/361_2.png) [@Trilobyte](https://discourse.processing.org/u/Trilobyte)\
**Post date:** [June 5, 2018, 8:50pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/3 "2018-06-05T20:50:59Z")

</div>

Hello there!  
Is there any way you can post your full code? It’s difficult to figure out the initial setup without knowing the rest of the program. If for some reason you don’t want to post your full code (it is highly recommended that you do), I would say look at the standalone methods keyPressed(){} and keyReleased{}. Also, if you want the background to be white regardless, try putting the background(255) just after the “void draw(){” and not in any parenthetical statements. This will set the background to 255 every time the draw loop iterates, as the first thing in the loop.

EDIT: You posted the full code! Sorry.

---

<div class="post-metadata">

**Author:** ![rioma7](https://avatars.discourse-cdn.com/v4/letter/r/3ec8ea/32.png) [@rioma7](https://discourse.processing.org/u/rioma7)\
**Post date:** [June 5, 2018, 8:51pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/4 "2018-06-05T20:51:28Z")

</div>

done! sorry I didn’t notice that.

---

<div class="post-metadata">

**Author:** ![rioma7](https://avatars.discourse-cdn.com/v4/letter/r/3ec8ea/32.png) [@rioma7](https://discourse.processing.org/u/rioma7)\
**Post date:** [June 5, 2018, 8:58pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/5 "2018-06-05T20:58:30Z")

</div>

I tried but it doesn’t work anyway

---

<div class="post-metadata">

**Author:** ![Trilobyte](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/trilobyte/32/361_2.png) [@Trilobyte](https://discourse.processing.org/u/Trilobyte)\
**Post date:** [June 5, 2018, 8:59pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/6 "2018-06-05T20:59:16Z")

</div>

Rioma,  
The background turning gray has to do with the fact that you are in Color Mode HSB, not RGB. HSB stands for Hue, Saturation, and Brightness, and so the way to get white would be background(0, 0, 100). RGB stands for Red, Green Blue, so you get colors by combining those. Try background(0, 0, 100) if you want to stay in HSB.

---

<div class="post-metadata">

**Author:** ![rioma7](https://avatars.discourse-cdn.com/v4/letter/r/3ec8ea/32.png) [@rioma7](https://discourse.processing.org/u/rioma7)\
**Post date:** [June 5, 2018, 9:00pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/7 "2018-06-05T21:00:52Z")

</div>

> [@Trilobyte](#):
>
> background(0, 0, 100)

that’s true…so stupid -.-"

---

<div class="post-metadata">

**Author:** ![rioma7](https://avatars.discourse-cdn.com/v4/letter/r/3ec8ea/32.png) [@rioma7](https://discourse.processing.org/u/rioma7)\
**Post date:** [June 5, 2018, 9:02pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/8 "2018-06-05T21:02:35Z")

</div>

and for the problem that it continues to draw random polygons? any idea? thanks in advance

---

<div class="post-metadata">

**Author:** ![Trilobyte](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/trilobyte/32/361_2.png) [@Trilobyte](https://discourse.processing.org/u/Trilobyte)\
**Post date:** [June 5, 2018, 9:06pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/9 "2018-06-05T21:06:32Z")

</div>

About that. What exactly is it that you want the program to do? Do you want to draw shapes while a key is being pressed, and then when the user stops pressing that key, do you want the screen to go blank, or do you want to display the last shape that was displayed before the keys stopped being pressed?

If you want the screen to just go blank, I recommend putting the polygon drawing sections in the same loop as the keyPressed statement.

---

<div class="post-metadata">

**Author:** ![rioma7](https://avatars.discourse-cdn.com/v4/letter/r/3ec8ea/32.png) [@rioma7](https://discourse.processing.org/u/rioma7)\
**Post date:** [June 5, 2018, 9:08pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/10 "2018-06-05T21:08:04Z")

</div>

I would like to display last drawn shape

---

<div class="post-metadata">

**Author:** ![Trilobyte](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/trilobyte/32/361_2.png) [@Trilobyte](https://discourse.processing.org/u/Trilobyte)\
**Post date:** [June 5, 2018, 9:26pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/11 "2018-06-05T21:26:21Z")

</div>

Alright, why don’t you try using an array of PVectors instead of vertices? Both vertex() and PVector() hold two values, one for x, one for y. Try creating a PVector[] vertices = new PVector[0]; (before the setup(){} )then use

```auto
 int n_vertex = int(random(7, 20));
vertices = new PVector[n_vertex];
    beginShape();
    for (int i = 0; i < n_vertex; i++) {
    vertices[i] = new PVector(random(width), random(height));
    }

```

instead of

```auto
int n_vertex = int(random(7, 20));

    beginShape();
    for (int i = 0; i < n_vertex; i++) {
    vertex(random(width), random(height));
    }
    
    endShape(CLOSE);

```

and for the other condition (high\> bass) as well.  
Then, right before the end of the draw loop, use

```auto
if(vertices.length > 0){
  beginShape();
  for(int i = 0; i< vertices.length; i++){
   vertex(vertices[i].x, vertices[i].y); 
  }
  endShape(CLOSE);
}

```

This should work, because every time a new shape is created, its vertices are stored in an array, in the form of PVectors. This way, you can draw it anytime. Hope this helps.

---

<div class="post-metadata">

**Author:** ![Trilobyte](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/trilobyte/32/361_2.png) [@Trilobyte](https://discourse.processing.org/u/Trilobyte)\
**Post date:** [June 5, 2018, 9:27pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/12 "2018-06-05T21:27:13Z")

</div>

```auto
import ddf.minim.*; 
import ddf.minim.analysis.*;  
Minim minim;   
FFT fft;  
AudioInput in;   
float amp = 20; // used to make signal stronger/weaker 
float ampWave = 20*amp; 
float avgAudio; // store avg volume globally 

float bass = 1; 
float high = 2; 
PVector[] vertices = new PVector[0]; 

void setup() {
  background(255);
  size(500, 500);
  noStroke();
  smooth();

  colorMode(HSB, 360, 100, 100);

  // minim = new Minim(this); // initalize in setup 
  // in = minim.getLineIn(Minim.STEREO, 512); // audio in + bufferSize 512 or 1024 
  // fft = new FFT(in.bufferSize(), in.sampleRate());  
  // fft.logAverages(22, 3); // 3 = 30, 4 = 40, slices of frequency
}

void draw() {
  //colorMode(RGB);
  background(0, 0, 100);
  //if (keyPressed) {
  // fft.forward(in.mix); // IMPORTANT! -update for FFT anaylsis
  // bass = fft.calcAvg(20, 300)*amp; // fft.calcAvg(minFreq, maxFreq)  
  // high = fft.calcAvg(300, 20000)*amp;
  //}
  if (keyPressed) {
    if (bass > high) {
      // background(255);

      noStroke();
      fill(random(180, 360), 100, 100);

      int n_vertex = int(random(7, 20));
      vertices = new PVector[n_vertex];
      beginShape();
      for (int i = 0; i < n_vertex; i++) {
        vertices[i] = new PVector(random(width), random(height));
      }

      endShape(CLOSE);
    } else if (high > bass) {

      // background(255);
      noStroke();
      fill(random(1, 180), 100, 100);

      int n_vertex = int(random(3, 7));
      vertices = new PVector[n_vertex];

      for (int i = 0; i < n_vertex; i++) {
        vertices[i] = new PVector(random(width), random(height));
      }
    }

    println(bass+" / "+high);
  }

  if (vertices.length > 0) {
    beginShape();
    for (int i = 0; i< vertices.length; i++) {
      vertex(vertices[i].x, vertices[i].y);
    }
    endShape(CLOSE);
  }
}

```

---

<div class="post-metadata">

**Author:** ![rioma7](https://avatars.discourse-cdn.com/v4/letter/r/3ec8ea/32.png) [@rioma7](https://discourse.processing.org/u/rioma7)\
**Post date:** [June 5, 2018, 9:37pm UTC](https://discourse.processing.org/t/loop-bg-problem/739/13 "2018-06-05T21:37:54Z")

</div>

is not exactly what I need…is perfect that it “freeze” the shape but I cannot recognise anymore the shapes