This commit is contained in:
Mark Nadal
2022-05-29 19:43:24 -07:00
parent 55682b6f4b
commit 2beb258b4c
5 changed files with 57 additions and 36 deletions

View File

@@ -1,10 +1,11 @@
<!DOCTYPE html>
<center>
<img id="img" width="100%"><br>
<img id="img" width="100%"><br/>
Stream <select id="select"><option id="from">from</option></select>
add <input id="pass" placeholder="password" type="password">
resolution <input id="res" value="240" type="number" step="16">
resolution <input id="res" value="240" step="32" max="1080" type="number" style="width:3em;">
or <input id="upload" type="file">
</center>
<video id="video" width="100%" controls autoplay style="display: none;"></video>
<canvas id="canvas" width="0" style="display: none;"></canvas>
@@ -27,14 +28,15 @@ stream = canvas.getContext('2d'), stream.from = navigator.mediaDevices;
});
$('select').on('change', async eve => { $(from).text('Off'); // update label
if('Off' == select.value){ return video.srcObject = null }
if('Off' == select.value){ return video.srcObject.getTracks()[0].stop() }
video.srcObject = await stream.from.getUserMedia({ audio: false,
video: (select.value && {deviceId: {exact: select.value}}) || {facingMode: "environment"}
});
});
$('#upload').on('change', async eve => { console.log("Check ./upload.html") })
setInterval(async tmp => {
if(!video.srcObject){ return }
if(!(video.srcObject||'').active){ return }
var size = parseInt(res.value);
stream.drawImage(video, 0,0,
canvas.width = size || video.videoWidth * 0.1,
@@ -47,7 +49,7 @@ setInterval(async tmp => {
gun.get('test').get('video').on(async data => {
if(pass.value){ data = await SEA.decrypt(data, pass.value) }
img.src = data;
img.src = data; // Beware: Some browsers memory leak fast src updates.
});
}());</script>