ford-prefect/ingest.html

## ingest.html
<html>
  <head>
    <title>media ingest</title>
    <script src="https://unpkg.com/@daily-co/daily-js"></script>
  </head>

  <body onload="main()">
    <div id="local-controls">
      <button id="join" onclick="joinAsOwner()">join room</button>
      <button id="leave" onclick="leaveRoom()">leave room</button>
      <hr />
      <input id="url"
          value="file:///home/arun/Videos/Danny Macaskill - The Ridge-xQ_IQS3VKjA.mp4"
          size="64" />
      <hr />
      <button onclick="startIngest()">start ingest</button>
      <button onclick="stopIngest()">stop ingest</button>
      <hr />
    </div>

    <div>
      <video controls autoplay></video>
    </div>

    <script>

      const API_KEY = '...';
      const ROOM_URL = '...';
      const API_ENDPOINT = 'https://api.staging.daily.co/v1';

      async function main() {
        window.call = DailyIframe.createCallObject({

          // WHILE ALONE IN A ROOM, IF audioSource and videoSource ARE false
          // trying to start the live stream will fail

          audioSource: false,
          videoSource: false,
        });

        call.on('joined-meeting', () => console.log('[JOINED MEETING]'));
        call.on('track-started', (ev) => addTrack(ev));
        call.on('track-ended', (ev) => removeTrack(ev));
        call.on('error', (e) => console.error(e));
      }

      async function joinAsOwner() {
        let t = await createMeetingToken({
          is_owner: true,
        });
        await call.join({ url: ROOM_URL, token: t });
        console.log('me -->', call.participants().local);
      }

      async function leaveRoom() {
        await call.leave();
      }

      async function startIngest() {
        const url = document.querySelector("#url").value;
        let res = await window.betaStartMediaIngest({ url });
        console.warn('RET FROM START_MEDIA_INGEST', res);
        window.ingestId = res;
      }

      async function stopIngest() {
        await window.betaStopMediaIngest({ingestId: window.ingestId});
      }

      function addTrack(ev) {
        console.warn('HI TRACK', ev);
        videoEl = document.querySelector("video");

        if (ev.track.readyState !== "live") return;

        if (videoEl.srcObject) {
          videoEl.srcObject.addTrack(ev.track);
        } else {
          videoEl.srcObject = new MediaStream([ev.track]);
        }
      }

      function removeTrack(ev) {
        console.warn('BYE TRACK', ev);
        videoEl = document.querySelector("video");

        if (videoEl.srcObject) {
          videoEl.srcObject.removeTrack(ev.track);
        }
      }

      // ----

      async function createMeetingToken(properties) {
        let response = await fetch(API_ENDPOINT + '/meeting-tokens', {
          method: 'post',
          headers: { Authorization: `Bearer ${API_KEY}` },
          body: JSON.stringify({ properties }),
        });
        return (await response.json()).token;
      }
    </script>
  </body>
</html>
	<html>
	<head>
	<title>media ingest</title>
	<script src="https://unpkg.com/@daily-co/daily-js"></script>
	</head>

	<body onload="main()">
	<div id="local-controls">
	<button id="join" onclick="joinAsOwner()">join room</button>
	<button id="leave" onclick="leaveRoom()">leave room</button>
	<hr />
	<input id="url"
	value="file:///home/arun/Videos/Danny Macaskill - The Ridge-xQ_IQS3VKjA.mp4"
	size="64" />
	<hr />
	<button onclick="startIngest()">start ingest</button>
	<button onclick="stopIngest()">stop ingest</button>
	<hr />
	</div>

	<div>
	<video controls autoplay></video>
	</div>

	<script>

	const API_KEY = '...';
	const ROOM_URL = '...';
	const API_ENDPOINT = 'https://api.staging.daily.co/v1';

	async function main() {
	window.call = DailyIframe.createCallObject({

	// WHILE ALONE IN A ROOM, IF audioSource and videoSource ARE false
	// trying to start the live stream will fail

	audioSource: false,
	videoSource: false,
	});

	call.on('joined-meeting', () => console.log('[JOINED MEETING]'));
	call.on('track-started', (ev) => addTrack(ev));
	call.on('track-ended', (ev) => removeTrack(ev));
	call.on('error', (e) => console.error(e));
	}

	async function joinAsOwner() {
	let t = await createMeetingToken({
	is_owner: true,
	});
	await call.join({ url: ROOM_URL, token: t });
	console.log('me -->', call.participants().local);
	}

	async function leaveRoom() {
	await call.leave();
	}

	async function startIngest() {
	const url = document.querySelector("#url").value;
	let res = await window.betaStartMediaIngest({ url });
	console.warn('RET FROM START_MEDIA_INGEST', res);
	window.ingestId = res;
	}

	async function stopIngest() {
	await window.betaStopMediaIngest({ingestId: window.ingestId});
	}

	function addTrack(ev) {
	console.warn('HI TRACK', ev);
	videoEl = document.querySelector("video");

	if (ev.track.readyState !== "live") return;

	if (videoEl.srcObject) {
	videoEl.srcObject.addTrack(ev.track);
	} else {
	videoEl.srcObject = new MediaStream([ev.track]);
	}
	}

	function removeTrack(ev) {
	console.warn('BYE TRACK', ev);
	videoEl = document.querySelector("video");

	if (videoEl.srcObject) {
	videoEl.srcObject.removeTrack(ev.track);
	}
	}

	// ----

	async function createMeetingToken(properties) {
	let response = await fetch(API_ENDPOINT + '/meeting-tokens', {
	method: 'post',
	headers: { Authorization: `Bearer ${API_KEY}` },
	body: JSON.stringify({ properties }),
	});
	return (await response.json()).token;
	}
	</script>
	</body>
	</html>