webgl_example

function setup() {
    createCanvas(window.innerWidth, window.innerHeight, WEBGL);
    perspective();
}

function preload() {
  img = loadImage('https://i.imgur.com/vJgD8sl.jpg');
}

const midX = window.innerWidth/2;
const midY = window.innerHeight/2;
const size = 1000;

function draw() {
    background(255);
    directionalLight(250, 250, 250, 0, 0, -1);
    directionalLight(250, 250, 250, 1, 0, 0);
    directionalLight(250, 250, 250, -1, 0, -0);
    directionalLight(250, 250, 250, 0, 1, 0);
    directionalLight(250, 250, 250, 0, -1, -0);
    
    ambientMaterial("#E9AE6C");
    texture(img);
    textureMode(NORMAL);

    rotateY(-HALF_PI*((-mouseX + midX) / (midX)));
    rotateX(HALF_PI*((-mouseY + midY) / (midY)));
    translate(-mouseX+midX, -mouseY+midY, 0);

    // wall
    plane(size, size, 100);

    // corner
    rotateY(-HALF_PI);
    translate(size/2, 0, -size/2);
    plane(size, size);

    // other corner
    translate(0, 0, size);
    plane(size, size)

    // ceil
    rotateX(HALF_PI);
    translate(0, -size/2, size/2);
    plane(size, size);

    translate(0, 0, -size);
    plane(size, size, 100);
}