var clmFaceTracker;

let count;

var percent = 0;

var sea_percent = 0;

var text_percent = 0;

var ntext = 0;

var ease = new p5.Ease();

let sound1;

let canvas;

​

function preload() {

  //https://www.youtube.com/watch?v=v_R69TSVOcs

  //sound credit: Kristaps Ozolins

  sound1 = loadSound("Sound of calm sea.wav");

  sound1.loop();

}

​

//---------------------------------------------

function setup() {

  fullscreen(true); 

  frameRate(20)

  canvas = createCanvas(windowWidth*pixelDensity(), 580); 

  canvas.position(0,windowHeight/2-290);

  count = 0;

  sound1.play();

​

  // setup camera capture

  myVideoInput = createCapture(VIDEO);

  myVideoInput.size(640, height);

  myVideoInput.hide();

​

  // setup tracker

  clmFaceTracker = new clm.tracker();

  clmFaceTracker.init(pModel);

  clmFaceTracker.start(myVideoInput.elt);

}

​

//---------------------------------------------

function draw() {

  // background(255);

  // tint(255, 60);

  //image(myVideoInput, 0, 0, 640, height);

  sea_percent += 0.01;

  background(0);

  // retrieve the array of face markers

  var facePoints = clmFaceTracker.getCurrentPosition();

  if (facePoints[0])

    {  

    let ear = eye_aspect_ratio(facePoints);

    if (ear < 0.3)

    {

      fill(0,255,0);

      count++;

    }

    else

    {

      fill(255,0,255);

      count = 0;

    }

    //circle(100,100,100)

  }

  else

    count = 0;

  if (count > 3)

  {

    away();

  }

  else

  {

    here();

  }

  colorMode(HSB);

  //background

  let col = color(245,100,20);

  for (let i = 0; i <= height; i++)

  {

    col = color(hue(col)+0.2,100,brightness(col)+0.3);

    stroke(col);

    line(0,i,width,i);

  }

  colorMode(RGB)

  let gradHeight = 40

  strokeWeight(2)

  for (let i = 0; i < gradHeight; i++)

  {

    stroke(0,0,0,255*ease.quadraticIn((gradHeight-i)/gradHeight))

    line(0,i,width,i)

  }

  colorMode(HSB)

  //sun ----------------------------------------------

  col = color(47,100,100,0.2);

  for (let i = 0; i <= height/10; i++)

  {

    col = color(hue(col),saturation(col)+10,brightness(col)-0.01,alpha(col)/1.1);

    fill(col);

    noStroke();

    ellipse(width/2,height/2,100+i*10,100+i*10);

  }

  col = color(0,100,100,0.5);

  for (let i = 0; i <= height/10; i++)

  {

    col = color(hue(col),saturation(col)+10,brightness(col)-0.01,alpha(col)/1.2);

    fill(col);

    noStroke();

    ellipse(width/2,height/2,100+i*2,100+i*2);

  }

  colorMode(RGB);

  fill(255);

  noStroke();

  circle(width/2,height/2,100);

  //-----------------------------------------

  //sea

  colorMode(HSB);

  rectMode(CORNERS);

  col = color(250,100,80);

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

  {

    col = color(250+gud_map(noise(i+sea_percent),0,1,-60,60),100,brightness(col)/1.05,alpha(col));

    fill(col);

    noStroke();

    let p = gud_map(noise(i+sea_percent),0,1,10,15);

    rect(0, height/2 + i*p, width, height);

    if(noise(i+sea_percent) > 0.2)

    {

      fill(0,100,100,0.2);

      arc(width/2, height/2 + i*p,gud_map(noise(i+sea_percent),0,1,1000,1200)*(10-i)/10,20*(gud_map(noise(i+1+sea_percent),0,1,10,15)-p),0,PI);

      fill(0,0,100);

      arc(width/2, height/2 + i*p,gud_map(noise(i+sea_percent),0,1,70,100)*(40-i)/40,20*(gud_map(noise(i+1+sea_percent),0,1,10,15)-p),0,PI);

    }

  }

  //rock

  fill(240,20,30);

  noStroke();

  ellipse(width*0.7+25,540,200,400);

  //end rock

  col = color(250,100,50);

  for (let i = 0; i < 10; i++)

  {

    col = color(250+gud_map(noise(i+sea_percent),0,1,-60,60),100,brightness(col)/1.05,alpha(col));

    fill(col);

    noStroke();

    rect(0, 400 + i*gud_map(noise(i+sea_percent),0,1,10,15), width, height);

  }

  colorMode(RGB);

  // -------------------------------------

  //back bird

  push();

  scale(-0.5,0.5);

  bird(-width*0.7*2,600,ease.cubicInOut(ease.elasticInOut(percent)));

  pop();

  //front bird

  push();

  scale(1.3);

  bird(width*0.2,480/1.3,ease.cubicInOut(ease.elasticInOut(percent)));

  pop();

  textAlign(CENTER);

  let text_vis = (sin(frameCount/10) + 1)/2

  let wobble = 100+sin(frameCount/5)*2;

  col = color(100,0,255,text_vis*255);

  fill(col);

  textSize(80);

  let threshold = 0.02;

  if (ntext == 0)

  {

  text("RELAX",width/2,wobble);

  if (text_vis < threshold) ntext++;

  }

  else if (ntext == 1)

  {

  text("SIT UP STRAIGHT",width/2,wobble);

  if (text_vis < threshold) ntext++;

  }

  else if (ntext == 2)

  {

  text("CLOSE YOUR EYES",width/2,wobble);

  if (text_vis < threshold) ntext++;

  }

  else if (ntext == 3)

  {

  text("RELEASE YOUR TENSION",width/2,wobble);

  if (text_vis < threshold) ntext = 0;

  }

  // bottom gradient -----------------------

  gradHeight = 200

  strokeWeight(2)

  for (let i = 0; i < gradHeight; i++)

  {

    stroke(0,0,0,255*ease.quadraticIn((gradHeight-i)/gradHeight))

    line(0,height-i,width,height-i)

  }

}

​

function here()

{

  if (percent > 0)

    percent -= 0.1;

}

​

function away()

{

  if (percent < 1)

    percent += 0.05;

}

​

function gud_map(x,a1,a2,b1,b2)

{

  return b1 + (x - a1)*(b2-b1)/(a2-a1);

}

​

//method for detection based on:

//https://www.pyimagesearch.com/2017/04/24/eye-blink-detection-opencv-python-dlib/

//credit:Adrian Rosebrock

function eye_aspect_ratio(face)

{

    let A = dist(face[24][0],face[24][1],face[26][0],face[26][1]);

    let B = dist(face[23][0],face[23][1],face[25][0],face[25][1]);

    let ear1 = A/B

    A = dist(face[29][0],face[29][1],face[31][0],face[31][1]);

    B = dist(face[30][0],face[30][1],face[28][0],face[28][1]);

    let ear2 = A/B

    return (ear1 + ear2)/2.0

}

​

function windowResized() {

  resizeCanvas(windowWidth, 580);

}

​