////////////////////////////////////////////////////
//
// 
// Celebrate Easter by creating an egg art piece with
// dots! Show off your art skills.
//
//
////////////////////////////////////////////////////


var i = 0;
var done = false;

var backgroundCol, topCol, bottomCol, spotCol;

var eggW, eggH, eggX, eggY;

var layerNum = 0;


function setup() {
  noStroke();
  createCanvas(500, 500);
  background(0,75,141);

  colorMode(RGB);

  // green
  topCol = color(99, 255, 173);
  // purple
  bottomCol = color(191, 120, 255);
  // yellow
  spotCol = color(253,253,150);
    
  //egg properties
  eggW = 300;
  eggH = 400;
  eggX = 250;
  eggY = 250;

}

function draw() {
  for (let j = 0; j < 200 && !done; j++) {

    var x = random(width);
    var y = random(height);
    var insideEgg = implicitEllipse(eggX, eggY, eggW, eggH, x, y);

    if (layerNum == 0) {
      if(insideEgg){
          fill(getRGBVariation(color(240,240,240), random(-5,5),random(-5,5),random(-5,5)));
          circle(random(x-2,x+2), random(y-2,y+2), random(28, 15));
        
          
          
          //egg color
          if(implicitLine(0,0,500,500,x,y)){
              fill(getRGBVariation(bottomCol, random(-30,30),random(-15,15),random(-5,5)));
              circle(random(x-2,x+2), random(y-2,y+2), random(28, 15));
          }
          else{
              fill(getRGBVariation(topCol, random(-20,20),random(-20,20),random(-15,15)));
              circle(random(x-2,x+2), random(y-2,y+2), random(28, 15));
          }
            
          
      }
        i++;
        if (i > 5000) {
        // first layer...
        layerNum++;
        i=0;
      }
    }
      
    //polkadot
    else if(layerNum == 1){
        if(insideEgg){
          
          
          if(implicitEllipse(250, 70, 75, 75, x, y)
            ||implicitEllipse(150, 150, 75, 75, x, y)
            ||implicitEllipse(350, 190, 75, 75, x, y)
            ||implicitEllipse(210, 250, 75, 75, x, y)
            ||implicitEllipse(280, 350, 75, 75, x, y)
            ||implicitEllipse(130, 370, 75, 75, x, y)){
              fill(getRGBVariation(spotCol, random(-20,20),random(-10,10),random(-20,20)));
              circle(random(x-2,x+2), random(y-2,y+2), random(20, 15));
          }
        i++;
        
        if (i > 5000) {
            // last shape...
            done = true;   
        }
      }
    }
  }

}

////////////////////////////////////////////////////////////
//
// implicitEllipse(cx, cy, w, h, x, y)
// 
// Given an ellipse with center at (cx,cy), height h, width 
// w,  and an arbitrary point (x,y). Returns true if (x,y) 
// is inside the ellipse.
//
////////////////////////////////////////////////////////////
function implicitEllipse(cx, cy, w, h, x, y) {
  let a = w / 2;
  let b = h / 2;
  return ((x - cx) * b) ** 2 + ((y - cy) * a) ** 2 - (a * b) ** 2 < 0;
}

////////////////////////////////////////////////////////////
//
// implicitLine(x1, y1, x2, y2, x, y)
// 
// Given 3 points: 2 points that represents a line from 
// (x1,y1) to (x2,y2) and an arbitrary point (x,y), 
// returns true if the point is below the line and false 
// otherwise.
//
// Note: 
// - The description is true for the line from (x1,y1) to 
// (x2,y2) given left to right. If given right to left, the // opposite is true. 
// - If the the line from (x1,y1) to (x2,y2) is horizontal 
// from top to bottom, returns true if (x,y) is on the 
// left, false otherwise. Returns vice versa, if the line 
// from (x1,y1) to (x2,y2) is given from bottom to top.
//
////////////////////////////////////////////////////////////
function implicitLine(x1, y1, x2, y2, x, y) {
  return -(x1 - x2) * y + (y1 - y2) * (x - x1) + y1 * (x1 - x2) > 0;
}

////////////////////////////////////////////////////////////
//
// getRGBVariation(col, dR, dG, dB)
// 
// Given a color object and a value for red, green and blue,
// this function will return the color with the specified 
// variation.
//
// @param col - The color object. Ex: color(0,0,0) is black.
// @param dR - The amount you want change the red value.
// @param dG - The amount you want change to the green 
//               value.
// @param dB - The amount you want change to the blue 
//               value.
//
////////////////////////////////////////////////////////////
function getRGBVariation(col, dR, dG, dB) {
  colorMode(RGB);
  let tempCol =
    color(
      red(col) + dR,
      green(col) + dG,
      blue(col) + dB
    );

  return tempCol;
}