blopa

const useStyles = makeStyles((theme) => ({
  modal: {
    position: 'fixed',
    top: 0,
    left: 0,
    width: '100%',
    height: '100%',
    backgroundColor: 'rgba(0, 0, 0, 0.5)',
    backdropFilter: 'blur(5px)',
    display: 'flex',

blopa

const useStyles = makeStyles((theme) => ({
  circleImage: ({ unseen }) => ({
    width: 80,
    height: 80,
    borderRadius: '50%',
    cursor: 'pointer',
    objectFit: 'cover',
    marginLeft: '5px',
    position: 'relative',
    ...(unseen

blopa

const useStyles = makeStyles((theme) => ({
  circleImage: {
    width: 80,
    height: 80,
    borderRadius: '50%',
    cursor: 'pointer',
    objectFit: 'cover',
    marginLeft: '5px',
    position: 'relative',
  },

blopa

generateThumbnail('How to create thumbnails for your videos with Node.js', './thumbnail.png');

blopa

const generateThumbnail = async (title, outputPath) => {
  const backgroundImagePath = './background.png';
  const foregroundImagePath = './foreground.png';

  await generateImageForPost(
    backgroundImagePath,
    foregroundImagePath,
    title,
    outputPath
  );

blopa

const breakTextToFitCanvas = (ctx, text, maxWidth) => {
  const words = text.split(' ');
  const lines = [];
  let currentLine = words[0];

  for (let i = 1; i < words.length; i++) {
    const word = words[i];
    const { width } = ctx.measureText(`${currentLine} ${word}`);

    if (width < maxWidth) {

blopa

const addCenteredTextWithBackground = (
  ctx,
  text,
  canvasWidth,
  canvasHeight
) => {
  const fontSize = 150;
  ctx.font = `${fontSize}px Impact`;
  const lines = text.split(' ');

blopa

const generateImageForPost = async (
  backgroundImagePath,
  foregroundImagePath,
  title,
  outputPath
) => {
  const backgroundImage = await loadImage(backgroundImagePath);
  const foregroundImage = await loadImage(foregroundImagePath);

  const canvas = createCanvas(backgroundImage.width, backgroundImage.height);

blopa

const { createCanvas, loadImage } = require('canvas');
const { writeFileSync } = require('fs');

const canvas = createCanvas(200, 200);
const ctx = canvas.getContext('2d');
ctx.font = '30px Impact';
ctx.fillStyle = '#000';
ctx.fillText('Hello World!', 0, 0);
canvas.toBuffer('image/png', (err, buffer) => {
  writeFileSync('./hello-world.png', buffer);

blopa

const generateTutorialViaOpenAi = require('./generate-tutorial-via-openai');
const generateImageForPost = require('./generate-image-for-post');
const generateVideoForPost = require('./generate-video-for-post');
const postVideoToInstagramReels = require('./post-video-to-instagram-reels');
const prompt = require('./prompt');

const generateTutorial = async () => {
  const reelsCommands = await generateTutorialViaOpenAi(prompt);
  const { description, commands, files } = reelsCommands.data.choices[0].value;