Glass Ball

let renderer;

let projector;

let projectionShader;

let mMatrix = new p5.Matrix();

​

let pg;

let pgShader;

​

function setup() {

  renderer = createCanvas(1112, 834, WEBGL);

  pixelDensity(1);

  projector = new p5.Camera(renderer);

  projector.camera(0, 0, (height/4.0) / tan(PI*30.0 / 180.0), 0, 0, 0, 0, 1, 0);

  projector.perspective(PI*2/3, 1.0, 0.1, 100);

  projectionShader = createShader(projectionVert, projectionFrag);

  shader(projectionShader);

  projectionShader.setUniform('uTexPMatrix', projector.projMatrix.mat4);

  projectionShader.setUniform('uTexVMatrix', projector.cameraMatrix.mat4);

  pg = createGraphics(width, height, WEBGL);

  pgShader = pg.createShader(pgVert, pgFrag);

  pg.shader(pgShader);

  pgShader.setUniform('uColor1', [51/255,  99/255, 118/255]);

  pgShader.setUniform('uColor2', [52/255, 177/255, 166/255]);

  pgShader.setUniform('uColor3', [55/255, 220/255, 204/255]);

  pgShader.setUniform('uStroke', [ 42/255,  42/255,  42/255]);

  pgShader.setUniform('uSeed', random(10000, 100000));

}

​

function draw() {

  background(255);

  pgShader.setUniform('uTime', millis()/10.0);

  pg.rect(-width/2, -height/2, width, height);

  projectionShader.setUniform('uTexture', pg);

  stroke(0);

  mMatrix = p5.Matrix.identity();

  mMatrix.rotateX(millis()/1000.0);

  mMatrix.rotateY(millis()/1000.0);

  mMatrix.scale(200, 200, 200);

  projectionShader.setUniform('uModelMatrix', mMatrix.mat4);

  push();

  rotateX(millis()/1000.0);

  rotateY(millis()/500.0);

  noStroke();

  sphere(250);

  ambientMaterial(0,2);

  sphere(251);

  pop();

  noStroke();

  mMatrix = p5.Matrix.identity();

  mMatrix.translate([0, 0, -400]);

  mMatrix.scale(width*2, height*2, 1);

  projectionShader.setUniform('uModelMatrix', mMatrix.mat4);

  push();

  translate(0, 0, -400);

  plane(width*2, height*2, 1);

  pop();

}

​

let lapse = 0;    // mouse timer

function mousePressed(){

  // prevents mouse press from registering twice

  if (millis() - lapse > 400){

    save('pix.jpg');

    lapse = millis();

  }

}