# Assignment / Extra credit program

**URL:** <https://discourse.processing.org/t/assignment-extra-credit-program/10680>\
**Category:** Coding Questions\
**Tags:** homework\
**Created:** [April 27, 2019, 10:42am UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680 "2019-04-27T10:42:24Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![S.L.C.S](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@S.L.C.S](https://discourse.processing.org/u/S.L.C.S)\
**Post date:** [April 27, 2019, 10:42am UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/1 "2019-04-27T10:42:24Z")

</div>

I was given a task to create a digital landscape! with the following criteria  
Criteria:  
● At least 3 different shapes used  
● At least 3 different colors used  
● 1 custom shape  
● Minimum of 6 elements (ie tree, house, bird etc)  
● At least 2 elements must move on their own  
● User can interact with your scene via mouse and  
keyboard  
● Comments on EVERY line that draws something on the  
screen. Loops and if statements must also be  
commented.

i already have all my codes but how do I put each of them separately on the canvas.

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [April 27, 2019, 11:02am UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/2 "2019-04-27T11:02:42Z")

</div>

> [@S.L.C.S](#):
>
> how do I put each of them separately on the canvas

-a- actually that is not part of the above shown specification

-b- many ways

- make something like stages
- 
  - int stage = 0;

- 
  - on key press " " go next : stage++;

- or use a timer

-c- what does that title mean?

> Extra credit program

i not see any connection to your criteria or question

---

<div class="post-metadata">

**Author:** ![S.L.C.S](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@S.L.C.S](https://discourse.processing.org/u/S.L.C.S)\
**Post date:** [April 27, 2019, 11:06am UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/3 "2019-04-27T11:06:04Z")

</div>

oh sorry, the title is Extra credit program because if i manage to complete it i get extra credits at school.

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [April 27, 2019, 11:21am UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/4 "2019-04-27T11:21:00Z")

</div>

It sounds like you have several sketches, each of which is drawing one thing, and you want to put them all together into one sketch.

I would suggest you write a class for each of your things. The format would be this:

```auto
class Thing {
  // Variables for this thing.
  Thing(){
    // Setup the thing here.
  }
  void draw(){
    // Draw the thing here.
  }
}

Thing a_thing = new Thing();

```

Do the above for each Thing you want to draw. Name the Thing differently, of course! You’ll want the last lines to look like:

```auto
House a_house = new House();
Cat a_cat = new Cat();
Tree a_tree = new Tree();
// etc

```

And then you can just draw them all:

```auto
void draw(){
  background(0);
  a_tree.draw();
  a_house.draw();
  a_cat.draw();
  // etc
}

```

---

<div class="post-metadata">

**Author:** ![S.L.C.S](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@S.L.C.S](https://discourse.processing.org/u/S.L.C.S)\
**Post date:** [April 27, 2019, 12:10pm UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/5 "2019-04-27T12:10:32Z")

</div>

```auto
int stage = 0;

void setup(){
  size(500,500);
}
void draw(){
  if(stage == 1){
    fill(0);
    rect(200,200,100,100);
    fill(0,255,0);
    ellipse(100,100,100,100);
    fill(255,0,0);
    triangle(400,50,350,90,450,90);
  }
  else if( stage == 2){
    noStroke();
    beginShape();
   beginShape();
vertex(100,50);
vertex(200,20);
vertex(200,100);
vertex(50,75);
vertex(25,50);
endShape();

  
}
}
  void keyPressed(){
    
    if (key == '1'){
      stage = 1;
    }else if (key == '2'){
      stage = 2;
    }else if (key == '3'){
      stage = 3;

  }
  }

```

this is what i have written so far and i wanted to ask if there is a way to make the previous shapes disappear when i press for the next stage?

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [April 27, 2019, 12:26pm UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/6 "2019-04-27T12:26:01Z")

</div>

yes, good start

```auto
int stage = 0;

void setup() {
  size(500, 500);
}

void draw() {
  background(200,200,0);
  if ( stage == 0) text("press 1,2,3",width/2,height/2);
  else if ( stage == 1) draw1();
  else if ( stage == 2) draw2(); 
  else if ( stage == 3) draw3(); 
}

void draw1() {
  fill(0);
  rect(200, 200, 100, 100);
  fill(0, 255, 0);
  ellipse(100, 100, 100, 100);
  fill(255, 0, 0);
  triangle(400, 50, 350, 90, 450, 90);
}

void draw2() {
    noStroke();
    beginShape();
    beginShape();
    vertex(100, 50);
    vertex(200, 20);
    vertex(200, 100);
    vertex(50, 75);
    vertex(25, 50);
    endShape();  
}

void draw3() {
  text("future",width/2,height/2);
}

void keyPressed() {
  if (key == '1') stage = 1;
  else if (key == '2') stage = 2;
  else if (key == '3') stage = 3;
}

```

---

<div class="post-metadata">

**Author:** ![S.L.C.S](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@S.L.C.S](https://discourse.processing.org/u/S.L.C.S)\
**Post date:** [April 27, 2019, 12:28pm UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/7 "2019-04-27T12:28:18Z")

</div>

the third draw…did you write future meaning a future code i put there?

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [April 27, 2019, 12:29pm UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/8 "2019-04-27T12:29:46Z")

</div>

? not ask me ?  
you make the key 1,2,3 code,  
so what you want do if user press ‘3’

but i have a idea what help to get extra credits

> **click here**
>
> ```auto
> 
> int stage = 0;
> 
> void setup() {
> size(500, 500);
> }
> 
> void draw() {
> background(200, 200, 0);
> if ( stage == 0) text("press 1,2,3", width/2, height/2);
> else if ( stage == 1) draw1();
> else if ( stage == 2) draw2(); 
> else if ( stage == 3) draw3();
> }
> 
> void draw1() {
> fill(0);
> rect(200, 200, 100, 100);
> fill(0, 255, 0);
> ellipse(mouseX, mouseY, 100, 100);
> fill(255, 0, 0);
> triangle(400, 50, 350, 90, 450, 90);
> }
> 
> void draw2() {
> noStroke();
> beginShape();
> beginShape();
> vertex(100, 50);
> vertex(200, 20);
> vertex(200, 100);
> vertex(mouseX, mouseY);
> vertex(25, 50);
> endShape();
> }
> 
> void draw3() {
> stroke(200, 0, 200);
> fill(0, 200, 0);
> rectMode(CENTER);
> for (int i = 0; i < many; i++) draw_rect(i);
> }
> 
> int x = 100, y = x, w = 20, h = 10; // rectangle spec
> int grid = 6, many = grid*grid; // grid spec
> int offset = 0; // add offset between objects mouseY
> float ang = 0; // angle rotation mouseX
> 
> void draw_rect(int i) {
> offset = int(map(mouseY, 0, height, 0, 100));
> ang = map(mouseX, 0, width, 0, PI);
> int posx = x+(i%grid)*(w+offset);
> int posy = y+(floor(i/grid))*(h+offset);
> push();
> translate(posx, posy);
> rotate(ang); //+0.05*i);
> rect(0, 0, w, h);
> pop();
> }
> 
> void keyPressed() {
> if (key == '1') stage = 1;
> else if (key == '2') stage = 2;
> else if (key == '3') stage = 3;
> }
> 
> ```

---

<div class="post-metadata">

**Author:** ![S.L.C.S](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@S.L.C.S](https://discourse.processing.org/u/S.L.C.S)\
**Post date:** [April 27, 2019, 1:24pm UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/9 "2019-04-27T13:24:50Z")

</div>

can you explain to me what the criteria 6 different elements is? Are they pictures/ images?

---

<div class="post-metadata">

**Author:** ![S.L.C.S](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@S.L.C.S](https://discourse.processing.org/u/S.L.C.S)\
**Post date:** [April 27, 2019, 3:20pm UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/10 "2019-04-27T15:20:04Z")

</div>

hey,could you explain to me what elements are?

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [April 27, 2019, 4:53pm UTC](https://discourse.processing.org/t/assignment-extra-credit-program/10680/11 "2019-04-27T16:53:01Z")

</div>

that is not a processing question,  
who am i to interpret the wording of your basic assignment,  
if i tell you and i did understand that also wrong: YOU FAIL.

in your stage 1 canvas you used 3 shapes ( rect / ellipse / triangle )  
at a random position without any meaning.  
but your job might be to draw a LANDSCAPE picture

- ground
- mountains
- sky
- sun

with something called ‘elements’ where he give examples

- tree
- house
- +++
- minimum 6 of this elements…

so one rect, ellipse, triangle is far from that idea?

but as i say, why should i know about your assignment,  
ask your teacher.