let img;

​

function preload() {

  // 画像を読み込む

  img = loadImage('4925.jpg');

}

​

function setup() {

  createCanvas(500, 800);

  // Aと書かれたボタンを作成

  button = createButton('Tracking Light');

  button.position(150, 200);  // ボタンの位置を指定

  button.size(200, 100);  // ボタンのサイズを指定

  button.style('font-size', '32px');  // ボタンのテキストサイズを指定

  button2 = createButton('Spot Light');

  button2.position(150, 300);  // ボタンの位置を指定

  button2.size(200, 100);  // ボタンのサイズを指定

  button2.style('font-size', '32px');  // ボタンのテキストサイズを指定

  button3 = createButton('Clap_Star');

  button3.position(150, 400);  // ボタンの位置を指定

  button3.size(200, 100);  // ボタンのサイズを指定

  button3.style('font-size', '32px');  // ボタンのテキストサイズを指定

  // ボタンを押したときの動作を定義

  button.mousePressed(openNewWindow);

  button2.mousePressed(openNewWindow2);

  button3.mousePressed(openNewWindow3);

}

​

// ボタンを押したときに実行される関数

function openNewWindow() {

  // 指定したURLを別ウィンドウで開く

  window.open('https://editor.p5js.org/g22946wf/full/nVbpJjIXr');

}

​

function openNewWindow2() {

  // 指定したURLを別ウィンドウで開く

  window.open('https://editor.p5js.org/g22930om/full/_WSbu0EEH', '_blank');

}

​

function openNewWindow3() {

  // 指定したURLを別ウィンドウで開く

  window.open('https://editor.p5js.org/g22946wf/full/6K_CsJPsR', '_blank');

}

​

function draw() {

  // 背景に画像を表示

  background(img);

​

  // テキストを中央に配置

  textAlign(CENTER, CENTER);

  textSize(70);

  fill(255);

  text("あつあつフロア", width / 2, height / 8);

}

​

​