kerjos-clock2

var prevSec;

var millisRolloverTime;

var prevHalf;

var currHalf;

var specialRollover;

var prevSeason;

var currSeason;

var seasonChange = "";

​

function setup() { 

  createCanvas(400, 400);

  cx = width/2;

  cy = height/2;

  //Form Init Values

  numAnchors = 8;

  radius = 200;

  numRings = 30;

  //Color Init Values

  darkColor = color(112,77,104);

  //lightColor = color(237,190,104);

  lightColor = color(255);

  //Time Init Values

  counter = floor(second()/(60/numRings));

  newMinute = true;

  newHour = true;

  millisRolloverTime = 0; //Golan Levin

  specialRollover = 0;

  //Starting Function Calls

  rings = [];

  getFirstRing();

  getOtherRings();

}

​

function mousePressed() {

  rings = [];

  getFirstRing();

  getOtherRings();

  counter = floor(second()/(60/numRings));

  newMinute = true;

  millisRolloverTime = 0;

  specialRollover = 0;

}

​

function Coord(ax,ay,cL1,cL2) {

  var a = ax - cx;

  var b = cy - ay;

  var c = sqrt(sq(a)+sq(b));

  var B = atan(b/a);

  if (a < 0) {B += PI}

  var D = -1 * (B - PI/2);

  var cx1 = ax + (cL1 * cos(D))

  var cy1 = ay + (cL1 * sin(D))

  var cx2 = ax - (cL2 * cos(D))

  var cy2 = ay - (cL2 * sin(D))

  var coord = {

    ax: ax,

    ay: ay,

    c: c,

    theta: B,

    cL1: cL1,

    cL2: cL2,

    cx1: cx1,

    cy1: cy1,

    cx2: cx2,

    cy2: cy2,

  }

  return coord;

}

​

function BarkCoord(x,y,cx,cy) {

  var coord = {

    ax: x,

    ay: y,

    cx1: cx,

    cy1: cy,

    cx2: x,

    cy2: y,

  }

  return coord;

}

​

function Ring(coords,fillColor) {

  var ring = {

    coords: coords,

    fillColor: fillColor,

  }

  return ring;

}

​

function getFirstRing() {

  var anchors = numAnchors;

  var r = radius;

  var theta = -PI/2;

  var coords = [];

  for (var i=0; i<anchors; i++) {

    var rand = random(-r/5,r/5);

    var ax = cx + rand + (r * cos(theta));

    if (ax<0) {ax=0}

    if (ax>width) {ax=width}

    var ay = cy + rand + (r * sin(theta));

    if(ay<0) {ay=0}

    if(ay>height) {ay=height}

    var cL1 = random(r/10,4*r/10);

    var cL2 = random(r/10,4*r/10);

    var coord = Coord(ax,ay,cL1,cL2);

    coords.push(coord);

    theta += (2*PI)/anchors;

  }

  var fillColor = lightColor;

  var ring = Ring(coords,fillColor);

  rings.push(ring);

}

​

function getOtherRings() {

  var anchors = numAnchors;

  var r = radius;

  var firstRing = rings[0];

  for (var i=1; i<numRings; i++) {

    var coords = [];

    var lastRing = rings[i-1];

    for (var j=0; j<firstRing.coords.length; j++) {

      var c = lastRing.coords[j].c;

      var theta = lastRing.coords[j].theta;

      var thickness = firstRing.coords[j].c/numRings;

      var wetness = random(0.9,1.1);

      var d = c - (thickness*wetness);

      //var rand = random(-thickness/8,thickness/8);

      var newAX = cx + (d * cos(theta));

      var newAY = cy - (d * sin(theta));

      var cL1 = lastRing.coords[j].cL1;

      var cL2 = lastRing.coords[j].cL2;

      var newCL1 = cL1 - (firstRing.coords[j].cL1/numRings);

      var newCL2 = cL2 - (firstRing.coords[j].cL2/numRings);

      var coord = Coord(newAX,newAY,newCL1,newCL2);

      coords.push(coord);

    }

    var ring = Ring(coords,lightColor);

    rings.push(ring);

  }

}

​

function getInterpolatedRing(mils) { //takes specialMils

  var anchors = numAnchors;

  var milsMax = (1000*(30/numRings)-1);

  var currentRing = numRings - counter - 1;

  //console.log(currentRing);

  if (currentRing <= 0) {return}

  var nextRing = numRings - counter - 2;

  var coords = [];

  for (i=0;i<anchors;i++) {

    var currAX = rings[currentRing].coords[i].ax;

    var nextAX = rings[nextRing].coords[i].ax;

    var newAX = map(mils, 0,milsMax, currAX,nextAX);

    var currAY = rings[currentRing].coords[i].ay;

    var nextAY = rings[nextRing].coords[i].ay;

    var newAY = map(mils, 0,milsMax, currAY,nextAY);

    var currCL1 = rings[currentRing].coords[i].cL1;

    var nextCL1 = rings[nextRing].coords[i].cL1;

    var newCL1 = map(mils, 0,milsMax, currCL1,nextCL1);

    var currCL2 = rings[currentRing].coords[i].cL2;

    var nextCL2 = rings[nextRing].coords[i].cL2;

    var newCL2 = map(mils, 0,milsMax, currCL2,nextCL2);

    var coord = Coord(newAX,newAY,newCL1,newCL2);

    coords.push(coord);

  }

  var fillColor = lightColor;

  return Ring(coords,fillColor);

}

​

function getBark(ring) {

  var anchors = ring.coords.length;

  var barkCoords = [];

  for (var i=0; i<anchors; i++) {

    var x1 = ring.coords[i].ax;

    var y1 = ring.coords[i].ay;

    var cx1 = ring.coords[i].cx1;

    var cy1 = ring.coords[i].cy1;

    var j = i+1;

    if (i == anchors-1) {j = 0;}

    var cx2 = ring.coords[j].cx2;

    var cy2 = ring.coords[j].cy2;

    var x2 = ring.coords[j].ax;

    var y2 = ring.coords[j].ay;

    for (var k=0; k<1; k+=0.2) { //For every sharp point of bark:

      //var t = 0.25;

      var P = calcPointOnBezier(x1,y1,cx1,cy1,cx2,cy2,x2,y2,k);

      var x = P[0];

      var y = P[1];

      //fill(255,0,0);

      //ellipse(x,y,5,5);

      var a = x - cx;

      var b = cy - y;

      var c = sqrt(sq(a)+sq(b));

      var B = atan(b/a);

      if (a < 0) {B += PI}

      var d = c + 10*(counter/60) + 2;

      var newX = cx + (d * cos(B));

      var newY = cy - (d * sin(B));

      //fill(0,255,0);

      //ellipse(newX,newY,5,5);

      var D = -1 * (B - PI/2);

      var E = D - PI/4;

      var cL = 4;

      var newCX = x + (cL * cos(E));

      var newCY = y + (cL * sin(E));

      //fill(0,0,255);

      //ellipse(newCX,newCY,5,5);

      //var newCX2 = x - (cL2 * cos(E));

      //var newCY2 = y - (cL2 * sin(E));

      var barkCoord = BarkCoord(newX,newY,newCX,newCY);

      barkCoords.push(barkCoord);

    }

  }

  var fillColor = color(255,0,0);

  return Ring(barkCoords,fillColor);

}

​

function calcPointOnBezier(x1,y1,x2,y2,x3,y3,x4,y4,t) {

  var storeAX = x4 - 3.0*x3 + 3.0*x2 - x1;

  var storeAY = y4 - 3.0*y3 + 3.0*y2 - y1;

  var storeBX = 3.0*x3 - 6.0*x2 + 3.0*x1;

  var storeBY = 3.0*y3 - 6.0*y2 + 3.0*y1;

  var storeCX = 3.0*x2 - 3.0*x1;

  var storeCY = 3.0*y2 - 3.0*y1;

  var storeDX = x1;

  var storeDY = y1;

  var x = ((storeAX*t+storeBX)*t+storeCX)*t+storeDX;

  var y = ((storeAY*t+storeBY)*t+storeCY)*t+storeDY;

  return [x,y]

}

​

function fetchCurrentRing() {

  var currRing = numRings - counter - 1;

  if (currRing == -1) {currRing = 0}

  if (currRing < -1) {

    return

  } else {

    return currRing

  }

}

​

function draw() { 

  background(255);

​

  // Fetch the current time

  var H = hour();

  var M = minute();

  var S = second();

  // Reckon the current millisecond, 

  // particularly if the second has rolled over.

  if (prevSec != S) {

    millisRolloverTime = millis();

  }

  prevSec = S;

  var mils = floor(millis() - millisRolloverTime);

  //milliseconds in growth period and season control

  seasonChange = "";

  if ((S%(60/numRings)) < ((60/numRings)/2)) {

    currHalf = 0; //Winter and Spring

  } else {

    currHalf = 1; //Summer and Fall

  }

  if (prevHalf != currHalf) {

    specialRollover = millis();

  }

  prevHalf = currHalf

  var specialMils;

  if (currHalf >= 1) {

    specialMils = floor(millis() - specialRollover);

    if (specialMils < (1000*( (60/numRings)/2 )*5/6)) {

      //Summers are 5/6 of the half; Falls are 1/6.

      currSeason = "Summer";

    } else {

      currSeason = "Fall";

    }

  } else {

    currSeason = "notSummerOrFall";

    specialMils = 0;

  }

  if (prevSeason != currSeason) {

    //Season change!

    if ((prevSeason=="Summer") && (currSeason=="Fall")) {

      seasonChange = "S2F";

    }

  }

  prevSeason = currSeason;

  fill(0);

  //text(specialMils, 15, 30);

  var m = M;

  if (M < 10) {m = "0"+m}

  var s = S;

  if (S < 10) {s = "0"+s}

  //text(H + " " + m + " " + s + " " + mils,15,15);

  if ((S%(60/numRings)==0) && (newMinute)) {

    //Ring is complete.

    newMinute = false;

    if (S == 0) {

      counter = 0

    } else {

      counter += 1

    }

  }

  if (S%(60/numRings)!=0) {

    newMinute = true;

  }

  if ((S==0) && (newHour)) {

    //Tree is complete.

    newHour = false;

    rings = [];

    getFirstRing();

    getOtherRings();

  }

  if (S!=0) {

    newHour = true;

  }

​

  var clr = color(darkColor);

  var currRing = fetchCurrentRing();

  var currRingObject;

  if (currRing != null) {

    currRingObject = rings[currRing];

  }

  var barkRing;

  var interpolatedRing = getInterpolatedRing(specialMils);

  if (interpolatedRing != null) {

      //Draw Bark

      barkRing = getBark(interpolatedRing);

      if (barkRing != null) {

          drawBeziers(barkRing,clr);

      }

      //Draw Interpolated Ring

      drawBeziers(interpolatedRing,clr);

  } else {

      barkRing = getBark(currRingObject);

      if (barkRing != null) {

          drawBeziers(barkRing,clr);

      }

  }

  for (var i=0; i<rings.length; i++) {

    if (i >= numRings-counter-1) {

      //clr = 0;

      drawBeziers(rings[i],clr);

    } else {

      //clr = 210;

      //drawBeziers(rings[i],clr);

    }

  }

}

​

function drawBeziers(ring,clr) {

  stroke(clr);

  var fillColor = ring.fillColor;

  fill(fillColor);

  noFill(); //Just so I don't have fill for now.

  var sides = ring.coords.length;

  if (sides>numAnchors) {strokeWeight(3)} else {strokeWeight(1)}

  var vertices = [];

  for (var i=0; i<sides; i++) {

    var x1 = ring.coords[i].ax;

    var y1 = ring.coords[i].ay;

    var x2 = ring.coords[i].cx1;

    var y2 = ring.coords[i].cy1;

    var j = i+1;

    if (i == sides-1) {j = 0;}

    var x3 = ring.coords[j].cx2;

    var y3 = ring.coords[j].cy2;

    var x4 = ring.coords[j].ax;

    var y4 = ring.coords[j].ay;

    /*stroke(255,0,0);

    fill(255,0,0);

    ellipse(x2,y2,3,3);

    line(x1,y1,x2,y2);

    stroke(0,255,0);

    fill(0,255,0);

    ellipse(x3,y3,3,3);

    line(x4,y4,x3,y3);

    stroke(0);

    noFill();

    line(cx,cy,x1,y1);*/

    vertices.push([x1,y1]);

    bezier(x1,y1,x2,y2,x3,y3,x4,y4);

  }

  fillBeziers(vertices,fillColor);

}

​

function fillBeziers(vertices,fillColor) {

  noStroke();

  fill(fillColor);

  noFill(); //Just so I don't have fill for now.

  beginShape();

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

    var x = vertices[i][0];

    var y = vertices[i][1];

    vertex(x,y);

  }

  endShape();

}