var millisRolloverTime;

var theCanvas;

var eased = new p5.Ease();

var numRecipes = 56;

var refreshRate = 30;

var xml = [];

var t;

var rand;

var font, fontItal;

​

function preload() {

  //loads all the xml files to randomly select from

  //cannot loadXml() outside of this function correctly

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

    t = `xml/${nf(i + 1, 3)}.txt`;

    xml[i] = loadXML(t);

  }

​

  font = loadFont('font/EBGaramond-Regular.ttf');

  fontItal = loadFont('font/EBGaramond-ExtraBoldItalic.ttf');

}

​

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

function setup() {

​

  // centers the output in the window

  theCanvas = createCanvas(800, 600);

  var x = (windowWidth - width) / 2;

  var y = (windowHeight - height) / 2;

  theCanvas.position(x, y);

​

  millisRolloverTime = 0;

​

  // initializes the random value used to select xml files

  rand = int(random(0, numRecipes));

}

​

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

function draw() {

  background('cornsilk');

  smooth();

​

  // Fetch the current time

  var H = hour();

  var M = minute();

  var S = second();

​

  // Reckon the current millisecond, 

  // particularly if the second has rolled over.

  // Note that this is more correct than using millis()%1000;

  if (prevSec != S) {

    millisRolloverTime = millis();

  }

  prevSec = S;

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

​

  noStroke();

  fill('black');

​

  if (S % refreshRate == 0 && mils == 0) {

    rand = int(random(0, numRecipes));

  }

​

  var recipe = xml[rand].getChild('recipe');

  var recipeTitle = recipe.getChild('head').getChild('title').getContent();

  var directions = recipe.getChild('directions').getChild('step').getContent();

  var yd = recipe.getChild('head').getChild('yield').getContent();

​

  var mins = 0;

  var minSplit = split(directions, "minutes");

  if (minSplit.length > 1) {

    for (var i = 0; i < minSplit.length - 1; i++) {

      mins += int(trim(minSplit[i].substring(minSplit[i].length - 3, minSplit[i].length - 1)));

    }

  }

  var hourSplit = split(directions, "hour");

  if (hourSplit.length > 1) {

    for (i = 0; i < hourSplit.length - 1; i++) {

      mins += 60 * int(trim(hourSplit[i].substring(hourSplit[i].length - 3, hourSplit[i].length - 1)));

    }

  }

​

  var nextMealVal;

  var nextMeal;

  var timeUntilNextMeal = mins;

​

  if (H < 6 || H >= 18) {

    nextMealVal = 0;

    timeUntilNextMeal = (60 * abs(6 - H)) - M;

  } else if (H < 12 && H >= 6) {

    nextMealVal = 1;

    timeUntilNextMeal = (60 * (12 - H)) - M;

  } else {

    nextMealVal = 2;

    timeUntilNextMeal = (60 * (18 - H)) - M;

  }

​

  if (timeUntilNextMeal <= mins) {

    nextMealVal++;

    if (nextMealVal == 3) {

      nextMealVal = 0;

      timeUntilNextMeal = (60 * abs(6 - H)) - M;

    }

  }

​

  if (nextMealVal == 0) {

    nextMeal = "breakfast";

    timeUntilNextMeal = (60 * abs(6 - H)) - M;

  } else if (nextMealVal == 1) {

    nextMeal = "lunch";

    timeUntilNextMeal = (60 * (12 - H)) - M;

  } else {

    nextMeal = "dinner";

    timeUntilNextMeal = (60 * (18 - H)) - M;

  }

​

  var timesToCook = floor(timeUntilNextMeal / mins);

  var totalYd = timesToCook * yd;

​

  textAlign(CENTER);

  textStyle(NORMAL);

  textSize(30);

  textFont(font);

  text("You have enough time to make ", width / 2, 120);

  text("for " + totalYd + " of your friends by " + nextMeal + " time!", width / 2, 195);

​

  textSize(40);

  textFont(fontItal);

  text(recipeTitle, width / 2, 160);

​

  textAlign(LEFT);

  textFont(font);

  textSize(20);

  textLeading(25);

​

  var ingredients = recipe.getChild('ingredients').getChildren('ing');

  var ingredientContents1 = "";

  var ingredientContents2 = "";

  var qty, unit, item;

​

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

    qty = ingredients[i].getChild('amt').getChild('qty').getContent();

    unit = ingredients[i].getChild('amt').getChild('unit').getContent();

    item = ingredients[i].getChild('item').getContent();

​

    //common formats in the recipe xml files that cannot be multiplied

    if (qty == "1/2") {

      qty = 0.5;

    }

    if (qty == "1/4") {

      qty = 0.25;

    }

    if (qty == "3/4") {

      qty = 0.75;

    }

    if (qty == "1/3") {

      qty = 0.33;

    }

    if (qty == "2/3") {

      qty = 0.66;

    }

    if (qty == "1/8") {

      qty = 0.125;

    }

​

    qty = ceil(qty * timesToCook);

​

    if (qty == null || qty == 0) {

      qty = "";

    }

    if (unit == null) {

      unit = "";

    }

    if (item == null) {

      item = "";

    }

​

​

    if (i < ingredients.length / 2) {

      ingredientContents1 = ingredientContents1 + '\n' + qty + " " + unit + " " + item;

    } else {

      ingredientContents2 = ingredientContents2 + '\n' + qty + " " + unit + " " + item;

    }

​

  }

​

  text(ingredientContents1, 120, 250, 250, 250);

  text(ingredientContents2, 420, 250, 250, 250);

​

  stroke('red');

  strokeWeight(5);

​

  curveTightness(-0.5);

  noFill();

​

  var j = 7;

  var i = 8;

​

  var shift = map(mils, 0, 1000, 1, 5);

  beginShape(); //top

  for (var k = shift; k < 100; k += 4) {

    curveVertex((k + 1) * i, 6 * j);

    curveVertex(k * i, 4 * j);

    curveVertex((k - 1) * i, 6 * j);

    curveVertex((k + 2) * i, 9 * j);

  }

  endShape();

  beginShape(); //right

  for (k = shift; k < 70; k += 4) {

    curveVertex(width - 6 * j, (k + 1) * i);

    curveVertex(width - 4 * j, k * i);

    curveVertex(width - 6 * j, (k - 1) * i);

    curveVertex(width - 9 * j, (k + 2) * i);

  }

  endShape();

​

  shift = map(mils, 0, 1000, 5, 1); //reverses direction

  beginShape(); //bottom

  for (k = shift; k < 100; k += 4) {

    curveVertex((k + 1) * i, height - 6 * j);

    curveVertex(k * i, height - 4 * j);

    curveVertex((k - 1) * i, height - 6 * j);

    curveVertex((k + 2) * i, height - 9 * j);

  }

  endShape();

  beginShape(); //left

  for (k = shift; k < 70; k += 4) {

    curveVertex(6 * j, (k + 1) * i);

    curveVertex(4 * j, k * i);

    curveVertex(6 * j, (k - 1) * i);

    curveVertex(9 * j, (k + 2) * i);

  }

  endShape();

​

  fill('cornsilk');

  noStroke();

  square(width - 100, -100, 200, 60);

  square(width - 100, height - 100, 200, 60);

  square(-100, -100, 200, 60);

  square(-100, height - 100, 200, 60);

​

  fill("red");

  i = 0;

  j = 0;

​

  if (mils < 500) {

    shift = map(eased.circularInOut((mils * 2) / 1000), 0, 1, 5, 7);

  } else {

    shift = map(eased.circularInOut(((mils - 500) * 2) / 1000), 0, 1, 7, 5);

  }

​

  push();

  translate(width - 10, height - 50);

  rotate(3 * PI / 4);

  drawHeart(shift);

  pop();

​

  push();

  translate(10, 50);

  rotate(7 * PI / 4);

  drawHeart(shift);

  pop();

​

  if (mils < 500) {

    shift = map(eased.circularInOut((mils * 2) / 1000), 0, 1, 7, 5);

  } else {

    shift = map(eased.circularInOut(((mils - 500) * 2) / 1000), 0, 1, 5, 7);

  }

​

  push();

  translate(50, height - 10);

  rotate(5 * PI / 4);

  drawHeart(shift);

  pop();

​

  push();

  translate(width - 50, 10);

  rotate(9 * PI / 4);

  drawHeart(shift);

  pop();

​

}

​

function drawHeart(s) {

  beginShape();

  vertex(4 * s, 3 * s);

  bezierVertex(2 * s, 0, -1 * s, 4 * s, 4 * s, 7 * s);

  vertex(4 * s, 3 * s);

  bezierVertex(6 * s, 0, 9 * s, 4 * s, 4 * s, 7 * s);

  endShape();

}