let fish;

let turtle;

​

let x = 0;

let y = 0;

let nx = 0;

let ny = 0;

let z = 0;

let nz = 0;

let bg = 20;

​

​

let buffer;

let dots;

​

let font1;

​

​

function preload() {

​

  font1 = loadFont("Quicksand-Bold.ttf");

​

}

​

​

function setup() {

  createCanvas(windowWidth, windowHeight, WEBGL);

​

  wordsSetup();

  let y1=95;

  let x1=236;

    ui = {}

        slider2 = createSliderAt(width-x1,height-y1-45, -2000,800, -400);

        slider1 = createSliderAt(width-x1,height-y1, 0.1, 5, 2);

​

  ui.button1 = createButtonAt(width-142, height-70, "Save Visual",

    buttonTriggered, color(0));

​

​

  colourpalatte = [];

  colourpalatte.push(color(255, 151, 70));

  colourpalatte.push(color(249, 212, 35));

  colourpalatte.push(color(134, 226, 179));

  colourpalatte.push(color(56, 214, 232));

  colourpalatte.push(color(255, 71, 61));

  colourpalatte.push(color(116, 0, 184));

  colourpalatte.push(color(6, 214, 160));

    colourpalatte.push(color(255));

​

​

  // randomSeed(2);

​

  for (let i = 0; i < 100; i++) {

    //spacing the cubes out

    let x = random(width + 2000);

    let y = random(height + 2000);

    let r = random(5, 60);

    let palette = (colourpalatte[i % colourpalatte.length]);

    cube[i] = new Cube(x, y, r, palette);

  }

​

​

  // for (let i = 0; i < 100; i++) {

  //   //spacing the spheres out

  //   let x = random(width);

  //   let y = random(height);

  //   let r = random(5, 100);

  //   let palette = 255;

  //   // let palette = (colourpalatte[i % colourpalatte.length]);

  //   sphere[i] = new Sphere(x, y, r, palette);

  // }

​

​

    textFont(font1);

​

​

}

​

​

​

​

​

function draw() {

  background(bg);

​

​

  //zoom in and out

nz =  slider2.value();

​

  x += (nx - x) * 0.1;

  y += (ny - y) * 0.1;

  z += (nz - z) * 0.1;

​

  let locX = mouseX - height / 2;

  let locY = mouseY - width / 2;

​

  ambientLight(150);

  directionalLight(255, 0, 0, 0.25, 0.25, 0);

  pointLight(0, 0, 255, locX, locY, 250);

​

  //Words

  push();

  translate(x, y, z );

  push();

  words();

  pop();

​

  //Cube

  translate((-width - 2000) / 2, (-height - 2000) / 2);

​

  for (let i = 0; i < cube.length; i++) {

    // cube[i].move();

    cube[i].show();

  }

​

​

​

​

​

  pop();

​

​

​

​

​

​

​

​

  //TEXT

​

          push();

  fill(255);

    textSize(13);

    textAlign(LEFT,BOTTOM);

  text("Ocean Matters By Yi Qing",-windowWidth / 2 + 30, -windowHeight / 2,windowWidth-30, windowHeight-30);

  //     textAlign(RIGHT,BOTTOM);

  //   text("Fish Model by printable_models (Free 3D).",-windowWidth / 2, -windowHeight / 2,windowWidth-30, windowHeight-30);

  // pop();

  // INSTRUCTIONS

  push();

​

   let w1 = 240;

  let h1 = 220;

  let spacing = 50;

  translate(windowWidth/2-w1 - 20, 

            height/2 - h1-20);

  // fill(255, 40);

fill(255,40);

  noStroke();

  fill(255,40);  

rect(0,0,w1,h1);

//   fill(colourpalatte[1]);

  fill(255);

  textAlign(LEFT,TOP);

  push();

  translate(25,25);

   text("Drag mouse to move visual.\nDouble click to reset position.",0, 0);

  text("Zoom In/Out",0, spacing*1);

    text("Plastic Size",0, spacing+40);

pop();

pop();

​

}

​

​