sketch.js

let mode = 1; //描くモード

function setup() {
  createCanvas(600, 600); //ウィンドウサイズの指定
  colorMode(HSB); //
  background(0, 0, 100); //背景色を指定して1回だけ塗る。
  line(150, 230, 200, 550);
  line(450, 230, 400, 550);
  line(200, 550, 400, 550); // コップ

  line(180, 120, 300, 530);
  line(200, 114, 320, 525);
  line(300, 530, 320, 525);
  line(180, 120, 200, 114); //ストロー

  //説明
  fill(0, 100, 0);
  noStroke();
  text("１から７のドリンクをお選びください。８を押すと泡を足すことができます。", 20, 580);
}

function draw() {

  if(mouseIsPressed == true) {
    //モード1オレンジ
    if (mode == 1){
      fill(15, 40, 100);
      noStroke();
      circle(mouseX, mouseY, random(30,60));
    }
    //モード2ブルー
    if (mode == 2){
      fill(220, 65, 100);
      noStroke();
      circle(mouseX, mouseY, random(30,60));
    }
    //モード3イエロー
    if (mode == 3){
      fill(55, 40, 100);
      noStroke();
      circle(mouseX, mouseY, random(30,60));
    }
    //モード4みずいろ
    if (mode == 4){
      fill(190, 40, 100);
      noStroke();
      circle(mouseX, mouseY, random(30,60));
    }
    //モード5抹茶
    if (mode == 5){
      fill(110, 50, 70);
      noStroke();
      circle(mouseX, mouseY, random(30,60));
    }
    //モード6ミルク
    if (mode == 6){
      fill(57, 12, 100);
      noStroke();
      circle(mouseX, mouseY, random(30,60));
    }
    //モード7コーヒー
    if (mode == 7){
      fill(15, 35, 60);
      noStroke();
      circle(mouseX, mouseY, random(30,60));
    }
    //モード8しゅわしゅわ
    if (mode == 8){
      fill(0, 0, 100);
      noStroke();
      circle(mouseX, mouseY, random(3,20));
    }
    
  }

}

function mousePressed() {
  //マウスのボタンが押し下げられた時の処理
}

function mouseReleased() {
  //マウスのボタンが離された時の処理
}

function keyPressed() {
  //キーが押されたらモードを変える
  if(key == "1") {
    mode = 1;
  }
  if(key == "2"){
    mode = 2;
  }
  if(key == "3"){
    mode = 3;
  }
  if(key == "4"){
    mode = 4;
  }
  if(key == "5"){
    mode = 5;
  }
  if(key == "6"){
    mode = 6;
  }
  if(key == "7"){
    mode = 7;
  }
  if(key == "8"){
    mode = 8;
  }
  if (key == "s") {
    saveCanvas();
  }
}