temp Owen's 3D 2.1.2 - tidy

mySketch
xxxxxxxxxx
 
const colourPalette = [
  "#5c323e",
  "#a82743",
  "#e15e32",
  "#c0d23e",
  "#e5f04c",
  "#ff4e50",
  "#fc913a",
  "#f9d423",
  "#ede574",
  "#e1f5c4"
]
​
let shapes = [];
​
function setup() {
  createCanvas(windowWidth, windowHeight, WEBGL);
  setupCamera();
  createRandomBoxes(random(75, 150))
  setupInstructions();
}
​
function draw() {
  background("#5cacc4");
​
  orbitControl(5, 5, 0.1);
  directionalLight(color(150, 100, 0), createVector(-0.8, -0.5, -0.2));
  ambientLight(150, 100, 100);
​
​
  shapes.forEach((x) => drawBox(x))
  shapes.forEach((x) => updateBox(x))
  myCamera.setPosition
}
​
​
function setupInstructions() {
  let instructions = createDiv(`Instructions: <br>
    Z = Add more objects; <br>
    X = Reset Sketch; <br>
    C = Send all objects to origin; <br>
    V = Change target destination of all objects; <br>
    N = Make all objects small cubes; <br>
    M = Change target size of all objects; <br>
    `);
  instructions.position(10, 10)
}
​
function setupCamera() {
  myCamera = createCamera();
  myCamera.setPosition(50, -100, 2000);
  myCamera.lookAt(0, 0, 0);
}
​
//function creates box objects and pushes them to the array
const createRandomBoxes = (numberOfShapes) => {
  for (i = 0; i < numberOfShapes; i++) {
    const boxSpecs = {
      color: random(colourPalette),
      pos: randomWorldPosition(),
      posTarget: randomWorldPosition(),
      box: randomDimensions(),
      boxTarget: randomDimensions(),
      rotation: p5.Vector.random3D(),
      rotationTarget: p5.Vector.random3D(),
      rotationRate: random(0.01, 0.1)
    }
    shapes.push(boxSpecs)
  }
}
​
//function for drawing boxes from objects
const drawBox = (shape) => {
  push()
  noStroke();
  ambientMaterial(color(shape.color))
  translate(shape.pos) //translate can take a vector
  rotateX(shape.rotation.x);
  rotateY(shape.rotation.y);
  rotateZ(shape.rotation.z);
  box(shape.box.x, shape.box.y, shape.box.z)
  pop()
}
​
//function to update box movement
const updateBox = (shape) => {
  shape.pos.lerp(shape.posTarget, 0.005)
  shape.box.lerp(shape.boxTarget, 0.005)
  shape.rotation.lerp(shape.rotationTarget, shape.rotationRate)
}
​
//function to pull objects to origin
const setPosTargetToOrigin = (shape) => {
  shape.posTarget = createVector(0, 0, 0)
}
​
//function to redirect objects
const setPosTargetToRandomInWorld = (shape) => {
  shape.posTarget = randomWorldPosition()
}
​
//function to send objects to form a sphere
const setPosTargetToRandomOnShell = (shape) => {
  shape.posTarget = p5.Vector.random3D().mult(600)
}
​
//function to make each object a small cube
const setBoxTargetToCube = (shape) => {
  shape.boxTarget = createVector(50, 50, 50)
}
​
//function to alter object size mutation
const setBoxTargetToRandom = (shape) => {
  shape.boxTarget = randomDimensions()
}
const setRotationTargetToRandom = (shape) => {
  shape.rotationTarget = createVector(
    random([0, 1, 2, 3]) * PI / 2,
    random([0, 1, 2, 3]) * PI / 2,
    random([0, 1, 2, 3]) * PI / 2);
}
​
function randomDimensions() {
  return createVector(random(50, 250), random(50, 250), random(50, 250))
}
​
function randomWorldPosition() {
  return p5.Vector.random3D().mult(random(300, 2000));
}
​
//key controls
function keyTyped() {
  switch (key) {
    case "z":
      createRandomBoxes(random(10, 50));
      break;
    case "x":
      shapes = []
      createRandomBoxes(random(75, 150))
      break;
    case "c":
      shapes.forEach((s) => setPosTargetToOrigin(s))
      break;
    case "v":
      shapes.forEach((s) => setPosTargetToRandomInWorld(s))
      break;
    case "b":
      shapes.forEach((s) => setPosTargetToRandomOnShell(s))
      break;
    case "n":
      shapes.forEach((s) => setBoxTargetToCube(s))
      break;
    case "m":
      shapes.forEach((s) => setBoxTargetToRandom(s))
      break;
    case ",":
      shapes.forEach((s) => setRotationTargetToRandom(s))
      break;
    default:
      break;
      // do nothing - unrecognised key
​
  }
}