import Canvas, { registerFont } from "canvas";
import fs from "fs";

const ApiResponse = async (req, res) => {
  //const { color } = req.query;
  const imageRef = req.query;
  const canvas = Canvas.createCanvas(940, 788);
  const ctx = canvas.getContext("2d");

  const rndInt = Math.floor(Math.random() * 367) + 1;

  console.log(rndInt);

  const background = await Canvas.loadImage(
    "public/images/backgrounds/background-" + rndInt + ".jpg"
  );

  registerFont("public/fonts/Dancing_Script/static/DancingScript-Bold.ttf", {
    family: "Dancing",
  });

  registerFont("public/fonts/Amatic_SC/AmaticSC-Bold.ttf", {
    family: "AmaticSC",
  });

  ctx.drawImage(background, 0, 0, canvas.width, canvas.height);

  let x = canvas.width / 2 + 80;
  let y = canvas.height - canvas.height / 2.5;
  let imageStr = imageRef.weekstoday;

  console.log(imageStr, x, y);
  ctx.lineWidth = 25;

  ctx.strokeStyle = "#cc3333";
  ctx.fillStyle = "white";

  // ctx.lineJoin = "round";
  ctx.font = "245px Dancing";

  ctx.strokeText(imageStr, 40, 375);

  ctx.fillText(imageStr, 40, 375);

  ctx.lineWidth = 10;
  ctx.strokeStyle = "white";
  ctx.fillStyle = "#cc3333";
  //ctx.textAlign = "left";
  ctx.font = "80px Dancing Script";
  ctx.strokeText("weeks today is", 40, 500);
  ctx.fillText("weeks today is", 40, 500);

  ctx.strokeStyle = "white";
  ctx.fillStyle = "#cc3333";
  //ctx.textAlign = "left";
  ctx.font = "80px Dancing Script";
  ctx.strokeText("Christmas Day", 40, 610);
  ctx.fillText("Christmas Day", 40, 610);

  ctx.strokeStyle = "white";
  ctx.fillStyle = "white";
  ctx.textAlign = "left";
  ctx.font = "50px AmaticSC";
  //ctx.strokeText("WWW.GETAHEADCHRISTMAS.CO.UK", x, y);
  var copyrightSymbol = 169; // 0xA9
  var $now = new Date();
  var $yearCount = $now.getFullYear();
  ctx.fillText(
    String.fromCharCode(copyrightSymbol) +
      " " +
      "WWW.GETAHEADCHRISTMAS.CO.UK " +
      " " +
      $yearCount,
    40,
    740
  );

  console.log(ctx);

  const png = canvas.toBuffer("image/png");

  res.setHeader(
    "content-disposition",
    "attachment; filename=" + imageRef.weekstoday + "-weeks.png"
  );
  res.status(200).send(png);
};

export default ApiResponse;