Unable to get if-statement(s) working

Bruce1984

So first of all, I am still 'new' to Processing - currently enrolled in a course where we learn some 'basic' programming for school called SPD, or Structured Program Development.

Every week, we get a set of 'easy' assignments, along with a somewhat more complicated one, using the 'flipped classroom' system. Basically, we study and practise at home and show our code the following lesson. We either learn Processing through the Reference or for example some YouTube videos (made by one of our 'professors'). We are required to work with Processing 2.2.1.

Our current assignment is to create three 'lightbulbs' (simple rect and ellipse shapes stacked), each with different colors and by default, they are 'off' (darker color). Next, we need to be able to click a big button (another rect shape) that turns the lights on (brighter colors), but not just on, but blinking. Another click on the button will turn the lights off again.

Now, the YouTube demo we had, basically provided us with the lightbulbs in one single color and had them blinking. I managed to get them all different colors and blinking, plus in a different sketch, I managed to get a set of three bulbs to turn on and off by clicking the button. However, I seem to fail to combine the two codes.

Basically, what I'm trying (for the assignment) is the following: draw the three bulbs in an 'off' position, along with a button & text to switch them on. Once clicked, they not only need to be turned on, but blinking. They should keep blinking until the button is clicked again and the lights turn off.

I will include the code I currently have, please remember, I am still learning and it is far from being neat, organized, simplified, etc. But any help would be greatly appreciated, thanks in advance!

int wWidth = 400;
int wHeight = 300;
int blinkDelay = 100;

int margin = 10;

int rWidth = wWidth - 2 * margin;
int rHeight = wHeight / 4;

int colorOff1 = #760707;
int colorOff2 = #1B863F;
int colorOff3 = #144167;

int colorOn1 = #F7072C;
int colorOn2 = #08FC5B;
int colorOn3 = #3282C6;

boolean isOff = true;

void setup()  {
  size(wWidth, wHeight);
  background(#000000);
  ellipseMode(CORNER);
  textAlign(CENTER, CENTER);
  textSize(20);
  drawThreeLightsOff(colorOff1, colorOff2, colorOff3);
  fill(#EDEAB1);
  rect(margin, wHeight - rHeight - margin, rWidth, rHeight);
  fill(#000000);
  text("Turn on", wWidth / 2, wHeight - margin - (rHeight / 2));
}

void draw()  {
}

void mouseClicked()  {
  if (mouseX > margin && mouseX < (wWidth - margin) && mouseY > (wHeight - rHeight - margin) && mouseY < (wHeight - margin) && (isOff))  {
    blinkingLights();
    /*    if (isOff)  {
      drawThreeBulbsOn(colorOn1, colorOn2, colorOn3);
    }
    else  {
      drawThreeBulbsOff(colorOff1, colorOff2, colorOff3);
    }
    fill(#EDEAB1);
    rect(margin, wHeight - rHeight - margin, rWidth, rHeight);
    fill(#000000);
    text("Turn off", wWidth / 2, wHeight - margin - (rHeight / 2));
    isOff = !isOff;
    delay(blinkDelay);
    */
  }
  else if (mouseX > margin && mouseX < (wWidth - margin) && mouseY > (wHeight - rHeight - margin) && mouseY < (wHeight - margin) && !(isOff)) {
    drawThreeBulbsOff(colorOff1, colorOff2, colorOff3);
    fill(#EDEAB1);
    rect(margin, wHeight - rHeight - margin, rWidth, rHeight);
    fill(#000000);
    text("Turn on", wWidth / 2, wHeight - margin - (rHeight / 2));
    isOff = !isOff;
  }
}  



void drawBulb(int xPos, int yPos, int color)  {
    fill(#666666);
    rect(xPos + 20, yPos + 70, 50, 50);
    fill(color);
    ellipse(xPos, yPos, 90, 90);
}

void drawThreeBulbsOff(int colorOff1, int colorOff2, int colorOff3)  {
    drawBulb(55, 50, colorOff1);
    drawBulb(155, 50, colorOff2);
    drawBulb(255, 50, colorOff3);
}

void drawThreeBulbsOn(int colorOn1, int colorOn2, int colorOn3)  {
    drawBulb(55, 50, colorOn1);
    drawBulb(155, 50, colorOn2);
    drawBulb(255, 50, colorOn3);
}

void blinkingLights()  {
    if (isOff)  {
      drawThreeBulbsOn(colorOn1, colorOn2, colorOn3);
    }
    else  {
      drawThreeBulbsOff(colorOff1, colorOff2, colorOff3);
    }
    fill(#EDEAB1);
    rect(margin, wHeight - rHeight - margin, rWidth, rHeight);
    fill(#000000);
    text("Turn off", wWidth / 2, wHeight - margin - (rHeight / 2));
    isOff = !isOff;
    delay(blinkDelay);
}

GoToLoop

Just by a quick look, I see that you use lotsa variables that should be grouped as 1 array instead.

You're gonna have an easier time by reading this article below:
http://forum.Processing.org/two/discussion/8082/from-several-variables-to-arrays

And once understood, you can go even further by creating a LightBulb class:
http://forum.processing.org/two/discussion/8081/from-several-arrays-to-classes

Chrisir

For asking a question it is easier for us when you write what work and what doesn't and where you are stuck.

How far are you?

I suggest to store for each lightbulb if it's currently blinking yes/no. This value is set by mousePressed. You can toggle it. You need one boolean var per bulb.

This value is read by draw() --- not by mousePressed. You got this wrong iirc

When it's blinking you also need another boolean var to tell if bulb is on or off.

Check millis() and google timer to switch the var every 400 millis

;-)

Bruce1984

Thanks for the replies!

@GoToLoop: I don't think the study material we're currently covering contains arrays yet, so supposedly we should be able to 'fix' it without arrays?

@Chrisir: I think I did mention what I got working and what not :). With the code that's provided, they all light up when the button is clicked, they also switch off when the button is clicked again. But instead of just lighting up, they need to start blinking. Which is working in a different sketch, but they all have the same color in that one.

So, if I'm reading your reply correctly - I need to add booleans for every bulb for the blinking status? And then another set for whether it's on or off?

Shouldn't it just work where when the boolean for 'isOff' is false, that they all should start blinking? Because it's just one different status - on or off. At least, that's what my current thoughts are telling me haha.

Also, as soon as I start messing with draw(), it usually messes up the entire sketch, because draw keeps drawing every 1/60th of a second and the sketch does not check that often whether or not a bulb should be blinking. Doesn't that just complicate things more?

I know you both are trying to help, but with my limited knowledge, it's not really helping haha!

Current situation: When clicking the button when (isOff), the bulbs turn on (which sets isOff = !isOff). When clicking the button again (so when (!isOff)), it turns them off (which swaps isOff = !isOff again).

What I'm hoping to achieve is instead of 'the bulbs turn on' = the bulbs start blinking. It feels like adding at least 5 booleans only complicates that? Maybe instead of adding booleans for each bulb, add a few booleans for all bulbs? I.e. isOff, isBlinkOn, isBlinkOff or something similar? I think the entire scope is a bit much for me at the moment.

Please keep in mind, I'm a novice :) - I do appreciate all comments though

Bruce1984

After clearing my thoughts, I decided to start from scratch, with the code I had from the YouTube demo from our teacher and split that up. I basically have it working now, with one added boolean - for the blinking. I also figured that you were completely right about draw() and I could simply use if statements inside the draw() to check for the boolean statuses of both the main status on/off, as well as blinking. I will also definitely read up on arrays and possibly classes, to clean the code up.

int wWidth = 400;
int wHeight = 300;
int margin = 10;

int rWidth = wWidth - 2 * margin;
int rHeight = wHeight / 4;

int colorOff1 = #760707;
int colorOff2 = #1B863F;
int colorOff3 = #144167;

int colorOn1 = #F7072C;
int colorOn2 = #08FC5B;
int colorOn3 = #3282C6;

boolean isOff = true;
boolean blink = true;
int delay = 50;

void setup()  {
  size(wWidth, wHeight);
  ellipseMode(CORNER);
  textAlign(CENTER, CENTER);
  textSize(20);
}

void draw()  {
  background(#000000);
  drawThreeBulbs(colorOff1, colorOff2, colorOff3);
  fill(#EDEAB1);
  rect(margin, wHeight - rHeight - margin, rWidth, rHeight);

  if (isOff)  {
    drawThreeBulbs(colorOff1, colorOff2, colorOff3);
    fill(#000000);
    text("Turn On", wWidth / 2, wHeight - margin - (rHeight / 2));
  }
  else if (blink)  {
    drawThreeBulbs(colorOff1, colorOff2, colorOff3);
    fill(#EDEAB1);
    rect(margin, wHeight - rHeight - margin, rWidth, rHeight);
    fill(#000000);
    text("Turn Off", wWidth / 2, wHeight - margin - (rHeight / 2));
    blink = !blink;
    delay(delay);
  }
  else  {
    drawThreeBulbs(colorOn1, colorOn2, colorOn3);
    fill(#EDEAB1);
    rect(margin, wHeight - rHeight - margin, rWidth, rHeight);
    fill(#000000);
    text("Turn Off", wWidth / 2, wHeight - margin - (rHeight / 2));
    blink = !blink;
    delay(delay);
  }
}

void mouseClicked()  {
  if (mouseX > margin && mouseX < (wWidth - margin) && mouseY > (wHeight - rHeight - margin) && mouseY < (wHeight - margin))  {
    isOff = !isOff;
   }
}

void drawBulb(int xPos, int yPos, int color)  {
    fill(#666666);
    rect(xPos + 20, yPos + 70, 50, 50);
    fill(color);
    ellipse(xPos, yPos, 90, 90);
}

void drawThreeBulbs(int colorOff1, int colorOff2, int colorOff3)  {
    drawBulb(55, 50, colorOff1);
    drawBulb(155, 50, colorOff2);
    drawBulb(255, 50, colorOff3);
}

Thanks again for the help :)

Chrisir

well done

sorry, I was on a journey and couldn't do more