Sisiva.Com

Apps Home | Create an App
ClassicWizard01
Author: slutpuppys
Description Source Code Launch App Current Users
// Function to load the webcam into a video element
async function loadWebcam() {
  try {
    const stream = await navigator.mediaDevices.getUserMedia({ video: true });
    const videoElement = document.createElement('video');
    videoElement.autoplay = true;
    videoElement.srcObject = stream;
    document.body.appendChild(videoElement);
    return videoElement;
  } catch (error) {
    console.error('Error accessing the webcam:', error);
  }
}

// Function to draw the watermark on the video
function drawWatermark(videoElement, canvas, ctx) {
  // Continuously draw the watermark on the canvas
  function render() {
    ctx.drawImage(videoElement, 0, 0, canvas.width, canvas.height);
    ctx.font = '30px Arial';
    ctx.fillStyle = 'rgba(255, 255, 255, 0.5)'; // Semi-transparent color
    ctx.fillText('Your watermark here', 20, canvas.height - 20); // Adjust position and text of the watermark

    // Request the next animation frame
    requestAnimationFrame(render);
  }
  render();
}

// Main function
async function main() {
  const videoElement = await loadWebcam(); // Load the webcam
  if (videoElement) {
    const canvas = document.createElement('canvas');
    canvas.width = videoElement.videoWidth;
    canvas.height = videoElement.videoHeight;
    canvas.style.position = 'absolute';
    canvas.style.top = '0';
    canvas.style.left = '0';
    document.body.appendChild(canvas);
    const ctx = canvas.getContext('2d');

    videoElement.addEventListener('play', () => {
      drawWatermark(videoElement, canvas, ctx); // Draw the watermark on the video
    });
  }
}

main(); // Execute the main function