let pencilImg;

let eraserImg;

let paintbrushImg;

let squarbrushImg;

let paintbucketImg;

let rainbowbrushImg;

let bombImg;

let saveImg;

​

let ColorPicker;

​

let whichButton = "pencil";

​

let buttonSave = false;

let isDrawing = false;

​

let comicsansfont;

​

let R;

let G;

let B;

​

function preload() {

  comicsansfont = loadFont("ComicNeueSansID.ttf");

  guyImg = loadImage("guy.png");

  pencilImg = loadImage("pencil.png");

  eraserImg = loadImage("eraser.png");

  paintbrushImg = loadImage("paintbrush.png");

  squarebrushImg = loadImage("squarebrush.png");

  paintbucketImg = loadImage("paintbucket.png");

  rainbowbrushImg = loadImage("rainbowbrush.png");

​

  bombImg = loadImage("bomb.png");

  saveImg = loadImage("save.png");

}

function setup() {

  createCanvas(550, 550);

  background(255);

  image(guyImg, 30, 75, 450, 450);

​

  textFont(comicsansfont);

  textSize(30);

​

  ColorPicker = createColorPicker("deepred");

  ColorPicker.position(480, 40);

​

  R = random(255);

  B = random(255);

  G = random(255);

}

​

function draw() {

  let c = ColorPicker.value();

​

  if (isDrawing) 

  if (whichButton == "pencil") {

    drawpencil();

  } else if (whichButton == "eraser") {

    draweraser();

  } else if (whichButton == "paintbrush") {

    drawpaintbrush();

  } else if (whichButton == "squarebrush") {

    drawsquarebrush();

  } else if (whichButton == "rainbowbrush") {

    drawrainbowbrush();

  } else if (whichButton == "bigboom") {

    drawexplosion();

  }

  drawButtons();

}

​

function drawButtons() {

  fill(238, 227, 10);

  rect(0, 0, 100, height);

  rect(450, 0, 100, height);

  rect(0, 520, width, 35);

  rect(0, 0, width, 35);

​

  fill(255);

  rect(125, 5, 300, 30);

​

  fill(0);

  text("Marvin's Makeover!", 145, 30);

​

  text("made by jac :>", 0, 545);

​

  strokeWeight(2.5);

​

  //this is a pencil! simple tool that will just draw a line.

  fill(255);

  rect(0, 100, 50, 50);

  image(pencilImg, 5, 105, 40, 40);

​

  //this is a eraser! will erase whatever the player doesnt appreciate on their canvas.

  rect(50, 100, 50, 50);

  image(eraserImg, 55, 105, 40, 40);

​

  //this is a paintbrush! like the pencil but instead uses circles.

  rect(0, 150, 50, 50);

  image(paintbrushImg, 5, 155, 40, 40);

​

  //this is a squarebrush! like the paintbrush but instead of circle it uses squares!

  rect(50, 150, 50, 50);

  image(squarebrushImg, 55, 155, 40, 40);

​

  //this will be the rainbowbrush! like the normal paintbrush but is a rainbow instead!

  rect(0, 200, 50, 50);

  image(rainbowbrushImg, 4, 205, 40, 40);

​

  //this will be the paintbucket! will make it easier to fill in what the player draws with a solid color!

  rect(50, 200, 50, 50);

  image(paintbucketImg, 55, 205, 40, 40);

​

  // will be the save button! this will be for when the player really likes the outfit/makeover that they gave Marvin!

  rect(450, 418, 100, 100);

  image(saveImg, 455, 420, 90, 95);

​

  //the BIG BOOM!@! make sure not to press this unless you are ABSOLUTELY CERTAIN you dont like marvins makeover you gave him... IT WILL EXPLODE HIS ENTIRE OUTFIT!!@!!?!

  rect(0, 418, 100, 100);

  image(bombImg, 2, 420, 95, 95);

}

​

function mousePressed() {

  isDrawing = true

  if (mouseX > 0 && mouseX < 50 && mouseY > 100 && mouseY < 150) {

    whichButton = "pencil";

  }

  if (mouseX > 50 && mouseX < 100 && mouseY > 100 && mouseY < 150) {

    whichButton = "eraser";

  }

  if (mouseX > 0 && mouseX < 50 && mouseY > 150 && mouseY < 200) {

    whichButton = "paintbrush";

  }

  if (mouseX > 50 && mouseX < 100 && mouseY > 150 && mouseY < 200) {

    whichButton = "squarebrush";

  }

  if (mouseX > 0 && mouseX < 50 && mouseY > 200 && mouseY < 250) {

    whichButton = "rainbowbrush";

  }

  if (mouseX > 0 && mouseX < 100 && mouseY > 417 && mouseY < 518) {

    whichButton = "bigboom";

  }

  if (mouseX > 450 && mouseX < 550 && mouseY > 417 && mouseY < 518) {

    saveCanvas("drawing", "jpg");

  }

}

​

function drawpencil() {

  fill(0);

  ellipse(mouseX, mouseY, 1, 1, 1);

}

function drawpaintbrush() {

  fill(0);

  circle(mouseX, mouseY, 5);

}

function drawsquarebrush() {

  fill(0);

  rect(mouseX, mouseY, 13, 13, 13, 13);

}

​

function drawrainbowbrush() {

  fill(R, G, B);

  circle(mouseX, mouseY, 7);

}

​

function draweraser() {}

​

function drawexplosion() {

  background(255);

  image(guyImg, 30, 75, 450, 450);

}

​

function mouseReleased(){

  isDrawing = false

}

​