JSFiddle - React, Tailwind, and code Playground

by morphcast

HTML

<head>
  <title>MorphCast AI HTML5 SDK - Multi media steam demo</title>
</head>

<body>
  <script src="https://ai-sdk.morphcast.com/v1.15/ai-sdk.js"></script>
  <video id="video1" muted playsinline></video>
  <video id="video2" muted playsinline></video>
  <div>
    <button id="toggle">Pause</button>
  </div><br />
  Testing multiple requests of camera stream
</body>

JavaScript

const cameraSource1 = CY.createSource.fromCamera({
  constraints: {
    audio: false,
    video: {
      width: 1280,
      height: 720
    }
  },
  video: document.getElementById("video1")
});
cameraSource1.start();
console.log(cameraSource1);

setTimeout(()=>{
	const cameraSource2 = CY.createSource.fromCamera({
  constraints: {
    audio: true,
    video: {
      width: {
        min: 160,
        max: 400
      }
    }
  },
  video: document.getElementById("video2")
});

cameraSource2.start();
console.log(cameraSource2);
}, 7000);