首次提交

2026-06-16 11:24:50 +08:00
commit 710bf3f9c2
807 changed files with 1046836 additions and 0 deletions
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+  <head>
+    <meta charset="utf-8">
+    <title></title>
+  </head>
+  <body>
+    <p>
+      This will use the userMedia audio and or video to get a stream. <br>
+      It will then use mediaRecorder to "pipe" the data to StreamSaver (aka hard drive)
+    </p>
+    <p>
+      Note: This is only allowed in
+      <a href="https://developer.mozilla.org/en-US/docs/Web/API/Window/isSecureContext">secure web context</a>
+    </p>
+
+    <label><input id="$vid" type="checkbox"> Use Webcam</label>
+    <label><input id="$aud" type="checkbox"> Use Microphone</label>
+    <button id="$start">Start</button>
+
+    <script src="https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/web-streams-polyfill@2.0.2/dist/ponyfill.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/gh/jimmywarting/browser-su@master/build/permissions.js"></script>
+    <script src="../StreamSaver.js"></script>
+    <script>
+        $vid.disabled = $aud.disabled = $start.disabled = !window.isSecureContext
+        $start.onclick = () => {
+          permission = { name: 'userMedia', video: $vid.checked, audio: $aud.checked }
+
+          su.request(permission).then(stream => {
+            let fr = new FileReader()
+            let mediaRecorder = new MediaRecorder(stream)
+            let chunks = Promise.resolve()
+
+            mediaRecorder.start()
+            $close.onclick = event => {
+              stopStream(stream)
+              mediaRecorder.stop()
+              setTimeout(()=>{
+                chunks.then(evt => {
+                  fileStream.close()
+                })
+              }, 1000)
+            }
+            mediaRecorder.ondataavailable = evt => {
+              let blob = evt.data
+
+              chunks = chunks.then(() => new Promise(resolve => {
+                fr.onload = () => {
+                  // Should we let the serviceWorker be able to accept
+                  // anything other then uint8array? ReadableStream don't seems
+                  // so happy with anything else... but could load of some work
+                  // of the main thread +1
+                  let uint8array = new Uint8Array(fr.result)
+                  myFile.write(uint8array)
+                  resolve()
+                }
+                fr.readAsArrayBuffer(blob)
+              }))
+            }
+          })
+        }
+
+
+      function stopStream (stream) {
+        let tracks = [
+          ...stream.getAudioTracks(),
+          ...stream.getVideoTracks()
+        ]
+
+        for(let track of tracks)
+        track.stop()
+      }
+    </script>
+  </body>
+</html>