var BoundY = 450;

var BoundZ = 450;

var innerStroke = 1;

var gridStep = 30;

​

var moonSize = 150;

​

var easycam;

​

let rainYList = [];

var RainYSpeed = 2000;

var rainLengthMaxY = 100;

let rainColorBW = true;

​

//whiteNoise

let mrNoise;

let mrsNoise;

let chooseNoise, setVolume;

​

//PoseNet

let video;

let poseNet;

let poses = [];

let nose;

let rightEye;

let leftEye;

let rightWrist;

let distance;

let distanceLimit = 40;

let showMoon = false;

let noseXList = [];

let noseYList = [];

let raining = false;

let someBody = false;

let zoomInOut = false;

let zoomCounter = 0;

/* ===

Available parts are:

0   nose

1   leftEye

2   rightEye

3   leftEar

4   rightEar

5   leftShoulder

6   rightShoulder

7   leftElbow

8   rightElbow

9   leftWrist

10  rightWrist

11  leftHip

12  rightHip

13  leftKnee

14  rightKnee

15  leftAnkle

16  rightAnkle

=== */ 

​

function setup() {

  createCanvas(windowWidth, windowHeight, WEBGL);

  easycam = createEasyCam();

  easycam = new Dw.EasyCam(this._renderer, {distance:620, center:[0,0,0]});  

  //smooth(8);

  //whiteNoise

  mrNoise = new p5.Noise();

  mrNoise.amp(0.0001);

  mrNoise.start();  

  mrNoise.setType("pink");  

  //Pose

  video = createCapture(VIDEO);

  video.size(windowWidth, windowHeight);

  // Create a new poseNet method with a single detection

  poseNet = ml5.poseNet(video, modelReady);

  // This sets up an event that fills the global variable "poses"

  // with an array every time new poses are detected

  poseNet.on('pose', function(results) {

    poses = results;

  });

  // Hide the video element, and just show the canvas

  video.hide();  

​

}

​

function modelReady() {

  //select('#status').html('Model Loaded');

}

​

function draw() {

  if (someBody) {

  background(0);}else{

  background(180);  

  }

  noFill();

  strokeWeight(2);

  stroke(255);

  push();

  box(BoundX, BoundY, BoundZ);

  pop();

  //up

  push();

  translate(0,-BoundY/2,0);

  rotateX(PI/2);

  rectMode(CENTER);

  strokeWeight(innerStroke);

  stroke(255);

  for(var i = -BoundX/2; i < BoundX/2; i+=gridStep){

    //rect(0,0, BoundX/BoundZ*i, i);

    line(i, -BoundZ/2, i, BoundZ/2);

  }

  pop();

  //dn

  push();

  translate(0,BoundY/2,0);

  rotateX(PI/2);

  rectMode(CENTER);

  strokeWeight(innerStroke);

  stroke(255);

  for(var i = -BoundX/2; i < BoundX/2; i+=gridStep){

    //rect(0,0, BoundX/BoundZ*i, i);

    line(i, -BoundZ/2, i, BoundZ/2);

  }

  pop();

  //left

  push();

  translate(-BoundX/2,0, 0);

  rotateY(PI/2);

  rectMode(CENTER);

  strokeWeight(0.5);

  stroke(255);

  for(var i = 0; i < BoundY; i+=gridStep){

    rect(0,0, BoundZ/BoundY*i, i);

  }

  pop();

  //right

  push();

  translate(BoundX/2,0, 0);

  rotateY(PI/2);

  rectMode(CENTER);

  strokeWeight(innerStroke);

  stroke(255);

  for(var i = 0; i < BoundY; i+=gridStep){

    rect(0,0, BoundZ/BoundY*i, i);

  }

  pop();  

​

  let dirX1 = sin(frameCount*0.01);

  let dirY1 = sin(frameCount*0.01);

  let v1 = createVector(dirX1, -dirY1, -1);

  v1.normalize();

  colorMode(HSB, 500);

  directionalLight(map((sin(frameCount*0.01)),-1,1,0,500), map((sin(frameCount*0.01)),-1,1,0,500), map((sin(frameCount*0.01)),-1,1,0,500), v1);

​

  let dirX2 = sin(frameCount*0.02);

  let dirY2 = sin(frameCount*0.02);

  let v2 = createVector(-dirX2, dirY2, -1);

  v2.normalize();

  colorMode(HSB, 500);

  //directionalLight(map((cos(frameCount*0.01)),-1,1,0,500), map((cos(frameCount*0.01)),-1,1,0,500), map((cos(frameCount*0.01)),-1,1,0,500), v2);

  colorMode(RGB, 255, 255, 255, 1); 

  directionalLight(255,255,255, v2); 

  colorMode(RGB, 255, 255, 255, 1);

  var RainVol;

  //RainY

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

    let nR = rainYList[i];

    nR.update();

    nR.border();         

    nR.display();

    if (nR.vel.mag() <=0.05) {

      rainYList.splice(0,1);

    }

    RainVol = map(nR.vel.mag()*10,0,100,0,0.1);

  }  

​

  mrNoise.amp(RainVol, 0.01);  

  //interaction

  if(showMoon){

  noStroke();

  fill(255);

  sphere(moonSize, 24, 24);

  }

​

  if(raining && frameCount%10==1){

   rainY();

  }

​

​

  //image(video, 0, 0, width, height);

  // We can call both functions to draw all keypoints and the skeletons

  push();

  scale(-1, 1);

  translate(-windowWidth/2, -windowHeight/2);

  if (poses.length > 0) {

​

    let pose = poses[0].pose;

​

    nose = pose['nose'];

    rightEye = pose['rightEye'];

    leftEye = pose['leftEye'];

    rightWrist = pose['rightWrist'];

    let newNoseX = map(nose.x, 0, video.width, 0, width);        

    let newNoseY = map(nose.y, 0, video.height, 0, height);

    let newRightWristX = map(rightWrist.x, 0, video.width, 0, width);        

    let newRightWristY = map(rightWrist.y, 0, video.height, 0, height);   

    distance = dist (rightEye.x, rightEye.y, leftEye.x, leftEye.y);

​

    noFill();

    stroke(255,0,0);

    strokeWeight(10);

    //ellipse(newNoseX, newNoseY, distance);

    if(distance < distanceLimit || noise == null){

     showMoon = false;

    }else{

     showMoon = true;

    }

​

      someBody = true;

​

    if(newRightWristY < newNoseY){

       raining = true;

    }else{

       raining = false;

    }

    noseXList.push(newNoseX);

    noseYList.push(newNoseY);    

​

    //easycam.rotateY(newNoseX-width/2);

​

  }

  else{

    someBody = false;

  }

  pop();

   //panNotSOGood

   /*

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

      preNoseX = noseXList[i-1]; 

      curNoseX = noseXList[i];

      preNoseY = noseYList[i-1]; 

      curNoseY = noseYList[i];      

      let spinX = curNoseX - preNoseX

      let spinY = curNoseY - preNoseY      

      //console.log(spin);

      easycam.panX(spinX/100);

      //easycam.panY(-spinY/100);       

    } 

    */

   if((frameCount%1200)>=0 && (frameCount%1200)<=630){

​

    easycam.setDistance(620+200*sin(zoomCounter*0.01), 1)

    zoomCounter = zoomCounter + 1

    //easycam.zoom(cos(frameCount*0.01))

   }else{

    easycam.setDistance(620, 1);

    zoomCounter = 0;

   }

    if((frameCount%3000)>=0 && (frameCount%3000)<=1000){

      showMoon = true;

   }

​

}

​

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

  easycam.setViewport([0,0,windowWidth, windowHeight]);

}

​

function keyPressed() {

  if(key == 'a'){

    let fs = fullscreen();

    fullscreen(!fs);

  }

   if (key == 'y') {

     rainY();

  } 

   if (key == ' ') {

     setup();

     rainYList = [];

  }   

}

​

function rainY(){

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

    //let loc = createVector(random(-BoundX/2, BoundX/2), -BoundY/2, random(-BoundZ/2, BoundZ/2));//Y

    let loc = createVector(random(-BoundX/2, BoundX/2), random(-BoundY/2, BoundY/2), -BoundZ/2);//Z

    let vel = createVector(0, 0, 0);

    let acc = createVector(0,0, random(15,25)); 

    var len = random(20,rainLengthMaxY);

    if(rainColorBW){

    var RR = 255;

    var RG = 255;

    var RB = 255;

    let oR = new RainY(loc, vel, acc, len, RR, RG, RB);

    rainYList.push(oR);

    }

    else{

    var RR = random(255);

    var RG = random(255);

    var RB = random(255);

    let oR = new RainY(loc, vel, acc, len, RR, RG, RB);

    rainYList.push(oR);    

    }    

    }

}

​

// A function to draw ellipses over the detected keypoints

function drawKeypoints()  {

  // Loop through all the poses detected

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

    // For each pose detected, loop through all the keypoints

    let pose = poses[i].pose;

    for (let j = 0; j < pose.keypoints.length; j++) {

      // A keypoint is an object describing a body part (like rightArm or leftShoulder)

      let keypoint = pose.keypoints[j];

      // Only draw an ellipse is the pose probability is bigger than 0.2

      if (keypoint.score > 0.2) {

        fill(255, 0, 0);

        noStroke();

        ellipse(keypoint.position.x, keypoint.position.y, 10, 10);

      }

    }

  }

}

​

// A function to draw the skeletons

function drawSkeleton() {

  // Loop through all the skeletons detected

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

    let skeleton = poses[i].skeleton;

    // For every skeleton, loop through all body connections

    for (let j = 0; j < skeleton.length; j++) {

      let partA = skeleton[j][0];

      let partB = skeleton[j][1];

      stroke(255, 0, 0);

      line(partA.position.x, partA.position.y, partB.position.x, partB.position.y);

    }

  }

}

​

​

class RainY{

      constructor(loc, vel, acc, len, RR, RG, RB){

       this.loc = loc;

       this.vel = vel;

       this.acc = acc;

       this.gravity = createVector(0,0,0);

       this.len = len;

       this.RR = RR;

       this.RG = RG;

       this.RB = RB;

       let maxspeedRY = 100;

     }

     /*

     run(){

        update();

        border();         

        display();

     }*/

​

     display(){

       push();

       translate(this.loc.x, this.loc.y, this.loc.z);

       rectMode(CENTER);

       rotateZ(PI/2);

       //stroke(255,0,0,255*velocity.mag());

       stroke('rgba(this.RR,this.RG,this.RB,map(this.vel.mag(),0,100,0,0.8))');    

       stroke(this.RR,this.RG,this.RB); 

       strokeWeight(10);

       //point(0,0,0);

       noFill();

       //rect(0,0,DIMY,DIMX);

       pop(); 

       stroke(4);

       //strokeWeight(map(this.vel.mag(),0,30,0.5, 4));

       //stroke(255,255*velocity.mag());       

       stroke('rgba(this.RR,this.RG,this.RB,map(this.vel.mag(),0,100,0,0.8))');

       stroke(this.RR,this.RG,this.RB);  

       //line(this.loc.x, this.loc.y, this.loc.z,this.loc.x, this.loc.y+this.len, this.loc.z);//Y

       line(this.loc.x, this.loc.y, this.loc.z,this.loc.x, this.loc.y, this.loc.z+this.len);//Z       

     }

    update(){

         this.vel.add(this.acc);

         this.vel.add(this.gravity);         

         this.vel.limit(this.maxspeedRY);

          //if(DecreasingMountain){

             this.vel.mult(0.98);

              if (this.vel.mag() <= 0.05) {

                 this.vel.mult(0);

             }          

           //}

         this.loc.add(this.vel);

         this.gravity.mult(0);

         this.acc.mult(0);

         //location.z = location.z+10; 

       }

       border(){

        //if(bouncing){

        //if (location.x<-BoundX/2) velocity.x = -velocity.x;

        //if (location.x>BoundX/2) velocity.x = -velocity.x;       

        //if (location.y<-BoundY/2) velocity.y = -velocity.y;

        //if (location.y>BoundY/2) velocity.y = -velocity.y;        

        //if (location.z<-BoundZ/2) velocity.z = -velocity.z;

        //if (location.z>BoundZ/2) velocity.z = -velocity.z;

        //}

        //else{

        if (this.loc.x<-BoundX/2) this.loc.x=BoundX/2;

        if (this.loc.x>BoundX/2)  this.loc.x=-BoundX/2;       

        if (this.loc.y<-BoundY/2) this.loc.y=BoundY/2;

        if (this.loc.y>BoundY/2) this.loc.y=-BoundY/2;        

        if (this.loc.z<-BoundZ/2) this.loc.z=BoundZ/2;

        if (this.loc.z>BoundZ/2)  this.loc.z=-BoundZ/2;        

        //} 

      } 

}

​