Function clock

Node-1st-gen/image-maker/functions/clock.js:41–131

(ctx, colorOpts)

};

const clock = (ctx, colorOpts) => {
  const colors = _.merge({}, getDefaultOpts(), colorOpts);
  let x, y, i;
  const now = new Date();

  ctx.clearRect(0, 0, 320, 320);
  ctx.save();

  // Clock background
  ctx.translate(160, 160);
  ctx.beginPath();
  ctx.lineWidth = 14;
  ctx.strokeStyle = colors.strokes.clock;
  ctx.fillStyle = colors.fills.clock;
  ctx.arc(0, 0, 142, 0, Math.PI * 2, true);
  ctx.stroke();
  ctx.fill();

  // Hour marks
  ctx.lineWidth = 8;
  ctx.strokeStyle = colors.strokes.hour;
  for (i = 0; i < 12; i++) {
    x = getX(Math.PI / 6 * i);
    y = getY(Math.PI / 6 * i);
    ctx.beginPath();
    ctx.moveTo(x * 100, y * 100);
    ctx.lineTo(x * 125, y * 125);
    ctx.stroke();
  }

  // Minute marks
  ctx.lineWidth = 5;
  ctx.strokeStyle = colors.strokes.minute;
  for (i = 0; i < 60; i++) {
    if (i % 5 !== 0) {
      x = getX(Math.PI / 30 * i);
      y = getY(Math.PI / 30 * i);
      ctx.beginPath();
      ctx.moveTo(x * 117, y * 117);
      ctx.lineTo(x * 125, y * 125);
      ctx.stroke();
    }
  }

  const sec = now.getSeconds();
  const min = now.getMinutes();
  const hr = now.getHours() % 12;

  ctx.fillStyle = 'black';

  // Write hours
  x = getX(hr * (Math.PI / 6) + (Math.PI / 360) * min + (Math.PI / 21600) * sec);
  y = getY(hr * (Math.PI / 6) + (Math.PI / 360) * min + (Math.PI / 21600) * sec);
  ctx.lineWidth = 14;
  ctx.beginPath();
  ctx.moveTo(x * -20, y * -20);
  ctx.lineTo(x * 80, y * 80);
  ctx.stroke();