Function createVideoFrame

frontend/src/components/camera-view.tsx:31–67

()

    if (!ctx) return;

    const createVideoFrame = () => {
      ctx.fillStyle = '#000000';
      ctx.fillRect(0, 0, canvas.width, canvas.height);

      const time = Date.now() / 1000;

      ctx.fillStyle = '#8A2BE2';
      ctx.beginPath();
      ctx.arc(
        canvas.width / 2 + Math.cos(time) * 50,
        canvas.height / 2 + Math.sin(time) * 50,
        20,
        0,
        Math.PI * 2
      );
      ctx.fill();

      ctx.strokeStyle = '#B388FF';
      ctx.lineWidth = 2;
      for (let i = 0; i < 3; i++) {
        const x = Math.sin(time * (i + 1)) * 100 + canvas.width / 2;
        const y = Math.cos(time * (i + 1)) * 100 + canvas.height / 2;
        ctx.strokeRect(x - 15, y - 15, 30, 30);
      }

      ctx.fillStyle = '#ffffff';
      ctx.font = '12px monospace';
      ctx.fillText(label, 10, 20);
      ctx.fillText(new Date().toLocaleTimeString(), 10, canvas.height - 10);

      ctx.fillStyle = '#ff0000';
      ctx.beginPath();
      ctx.arc(canvas.width - 20, 20, 5, 0, Math.PI * 2);
      ctx.fill();

      requestRef.current = requestAnimationFrame(createVideoFrame);
    };

    createVideoFrame();