// global variables:

// they're being declared and initialized

// outside of functions

// though they could be initialized in a function

// but will always have to be declared outside

////////////////////////////////////////////////

​

let trianglePosX = 100;

let trianglePosY = 200;

let circlePosX = 0;

let speed = 5;

​

function setup() {

  createCanvas(600, 400);

​

  ////////////////////////////////////////////////

  // print will print info to the console

  print(trianglePosX);

  ////////////////////////////////////////////////

}

​

function draw() {

  background(255);

  ////////////////////////////////////////////////

  // UNCOMMENT BELOW FOR THE VARIOUS EXAMPLES

  ////////////////////////////////////////////////

​

  ////////////////////////////////////////////////

  // simple drawing

  ////////////////////////////////////////////////

  noStroke();

  fill(0, 255, 0);

  rect(200, 200, 150, 150);

  ////////////////////////////////////////////////

  // ellipse and circle

  ////////////////////////////////////////////////

  //   fill(255, 120, 0, 200);

  //   ellipse(width / 2, height / 2, width / 4, height / 4);

​

  //   fill(255, 0, 0, 100);

  //   circle(width / 2, height / 2, height / 2);

  ////////////////////////////////////////////////

  // line only has stroke

  ////////////////////////////////////////////////

​

  //   stroke(255, 120, 0);

  //   line(0, height / 2, width, height / 2);

​

  ////////////////////////////////////////////////

  // variables are helpful to move a shape around

  ////////////////////////////////////////////////

  //   noStroke();

  //   fill(255);

  //   trianglePosX = mouseX;

  //   trianglePosY = mouseY;

  //   triangle(

  //     trianglePosX,

  //     trianglePosY,

  //     trianglePosX,

  //     trianglePosY + 100,

  //     trianglePosX + 100,

  //     trianglePosY + 100

  //   );

  ////////////////////////////////////////////////

  // an arc draws part of a circle

  ////////////////////////////////////////////////

​

  // arc(width/2, height/2, 100, 100, PI, 5, PIE);

​

  // noStroke();

  // fill(255, 120, 0, 200);

  // circle(circlePosX, height / 2, width / 4);

  ////////////////////////////////////////////////

  // add a number to the circle's x position to

  // make it move across the screen

  ////////////////////////////////////////////////

​

  // circlePosX = circlePosX + speed;

​

  // if (circlePosX > width) {

  //   circlePosX = 0;

  // }

}

​