Character Changes

// 1. Overlaying Shapes 

// 2. Random() and Arrays

// 3. Costume Changes

        // Color Change 

        // Changing the Shape 

        // Adding or Removing Shapes

// 4. Character Movements 

        // mouseX, mouseY 

        // KeyPressed (UP,DOWN,LEFT RIGHT)

​

// GLOBAL VARIABLE SPACE -----------------

​

let bodyColor; 

let feetColor; 

​

let bodyArray = [];

let feetArray = [];

​

let bodyX; 

let bodyY; 

​

let feetX;

let feetY; 

​

let antennaX;

let antennaY; 

​

​

// PRELOAD FUNCTION ----------------------

function preload(){

}

​

// MAIN FUCTIONS -------------------------

function setup() {

  createCanvas(400, 400);

  // MODE

  rectMode(CENTER);

  // VARIABLES 

  bodyArray = [color(255,255,0), color(0,255,255), color(255,0,255)]; 

  bodyColor = random(bodyArray);

  feetArray = [color(255,255,0), color(0,255,255), color(255,0,255)]; 

  feetColor= color(0,0,255);

  bodyX = 200; 

  bodyY = 200;

  feetX = 200;  

  feetY = 250;

  antennaX = 200; 

  antennaY = 130; 

}

​

function draw() {

  background(0);

  // SHAPES FOR MY CHARACTER

  fill(feetColor);

  rect(feetX,feetY,50,50);

  fill(bodyColor);

  circle(bodyX,bodyY,100);

  fill(feetColor); 

  circle(bodyX,bodyY,50);

  // SHAPE CHANGES 

  if(mouseIsPressed){

    fill(255,255,0);

    rect(antennaX,antennaY,10,50);

  } else{

    fill(0,255,0);

    rect(antennaX,antennaY,50,10);

  }

​

  // QUAD

  // ARC

  // TRIANGLE 

  // LINE 

  // BEGIN SHAPE 

}

​

// INTERACTIVE FUCTIONS ------------------

function mousePressed(){

  feetColor = color(255,45,80);

  bodyColor = random(bodyArray);

}

​

function keyPressed(){

  if(keyCode == RIGHT_ARROW){

    bodyX+=5;

    feetX+=5; 

    antennaX+=5; 

  }

  if(keyCode == LEFT_ARROW){

    bodyX-=5; 

    feetX-=5; 

    antennaX-=5; 

  }

  if(keyCode == UP_ARROW){

    bodyY-=5; 

    feetY-=5; 

    antennaY-=5; 

  }

  if(keyCode == DOWN_ARROW){

    bodyY+=5; 

    feetY+=5; 

    antennaY+=5; 

  }

}