# Fill in a nested loop
**URL:** https://discourse.processing.org/t/fill-in-a-nested-loop/5394
**Category:** Coding Questions
**Created:** [November 9, 2018, 8:42pm UTC](https://discourse.processing.org/t/fill-in-a-nested-loop/5394 "2018-11-09T20:42:51Z")
**Posts on this page:** 5
**Page:** 1
### Author:  [@Fei](https://discourse.processing.org/u/Fei)
#### Post date: [November 9, 2018, 8:42pm UTC](https://discourse.processing.org/t/fill-in-a-nested-loop/5394/1 "2018-11-09T20:42:51Z")
Hello,
So I’m a little confused on how to manage what I’m trying to fill, and how, inside nested loops.
I’m trying to have 3 rows of 20 circles each (to represent 60 seconds), where 1 circle is filled black every second. But I can only get as far as filling all 3 rows during the first 20 seconds and can’t figure out how to tell the program to fill 1 row, then continue filling on the next line.
P.S. I’m sorry for the messy code. I’m a coding fetus and I’ve just been trying a lot of random things trying to get it to work so there’s probably some stuff that doesn’t make much logical sense or dead code or something sorry…
```auto
int spacing = 20;
void setup() {
size(500, 500);
}
void draw() {
background(255); // white
int s = second();
int m = minute();
int h = hour();
// text
fill(0); // black
textSize(14);
text("Current Hour:", 20, 20);
text(h, 120, 20);
text("Current Minute:", 20, 130);
text(m, 140, 130);
text("Current Second:", 20, 300);
text(s, 140, 300);
// hour loop
for (int i = 0; i < 24; i++) {
ellipse((i*spacing) + 20, 50, 20, 20);
if (i + 1 < h) {
fill(0); //black
} else {
fill(255); // white
}
}
// minute loop
fill(0); // black
int x = 0;
int y = 0;
for (int i = 0; i < 3; i++) {
for (int j = 0; j < 20; j++) {
ellipse(x + 20, y + 160, 24, 24);
x = x + 24;
if (i + 1 == m) {
fill(255); // white
}
}
y = y + 24;
x = 0;
if ( i < m);
fill(0);
}
// second loop
int z = 0;
int w = 0;
for (int i = 0; i < 20; i++) {
for (int j = 0; j < 3; j++) {
ellipse(z + 20, w + 330, 24, 24);
w = w + 24;
if (i + 1 == s && j < 1) {
fill(255); // white
}
}
z = z + 24;
w = 0;
}
}
```
So basically my minutes and seconds counters are jacked up and i was wondering if anyone could help me out.
---
### Author:  [@Lexyth](https://discourse.processing.org/u/Lexyth)
#### Post date: [November 9, 2018, 8:47pm UTC](https://discourse.processing.org/t/fill-in-a-nested-loop/5394/2 "2018-11-09T20:47:10Z")
You should first of all set fill before drawing the corresponsione ellipse.
And use j_20+i = s. Meaning since you have 3rows a 20 and you have the Second row it’s 1 \* 20+1. and the 1 Circle in the Second row is the 21 Second. Also, Loops Start at 0, so the first row is 0_20+1, so 1 Second.
Also, you can just use i \*20+20, j \*20+20 to set the Position (and an Offset of 20).
And i Would suggest you to invert the loops, so that \<3 is first and then \<20. That way it goes 20 to the right and then goes to the Next row underneath.
---
### Author:  [@Fei](https://discourse.processing.org/u/Fei)
#### Post date: [November 9, 2018, 9:34pm UTC](https://discourse.processing.org/t/fill-in-a-nested-loop/5394/3 "2018-11-09T21:34:48Z")
Thank you for the reply!
But I’m just a bit confused on the j20+i = s part. I understand the theory of it now, but now my mind is running circles around how it fits into the syntax. Specifically how I would call j20.
I’ve tried it like this but nothing happens.
```auto
int s = second();
void setup() {
size(500, 500);
}
void draw() {
for (int i = 0; i < 3; i++) {
for (int j = 0; j < 20; j++) {
fill(255);
ellipse(j*24 + 20, i*24 + 330, 24, 24);
if ((j * 20 ) + i == s) {
fill(0); // black
}
}
}
}
```
---
### Author:  [@TfGuy44](https://discourse.processing.org/u/TfGuy44)
#### Post date: [November 9, 2018, 10:19pm UTC](https://discourse.processing.org/t/fill-in-a-nested-loop/5394/4 "2018-11-09T22:19:41Z")
A painter dos not paint a picture and then decide which colors to use afterwards.
Make sure you are setting the fill color BEFORE you are drawing your ellipse. Always before!
---
### Author:  [@Lexyth](https://discourse.processing.org/u/Lexyth)
#### Post date: [November 9, 2018, 11:29pm UTC](https://discourse.processing.org/t/fill-in-a-nested-loop/5394/5 "2018-11-09T23:29:58Z")
J20 means j \* 20, But the Post somehow turned it into j\*20 if written without space.