From fbd9fdc7d36573ae47f21bb87f8ce08cb3b7b04f Mon Sep 17 00:00:00 2001
From: liteng <930372551@qq.com>
Date: Tue, 13 Aug 2019 12:20:24 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BD=95=E5=88=B6=E5=B1=8F=E5=B9=95=E6=B5=8B?=
 =?UTF-8?q?=E8=AF=95=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ShadowEditor.Web/test/RecordTest.html | 76 +++++++++++++++++++++++++++
 1 file changed, 76 insertions(+)
 create mode 100644 ShadowEditor.Web/test/RecordTest.html
diff --git a/ShadowEditor.Web/test/RecordTest.html b/ShadowEditor.Web/test/RecordTest.html
new file mode 100644
index 00000000..2c83a39b
--- /dev/null
+++ b/ShadowEditor.Web/test/RecordTest.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+
+<html lang="zh-cn">
+
+<head>
+    <meta charset="utf-8">
+    <title>RecordTest</title>
+    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+</head>
+
+<body>
+    <button id="btnStart">开始录制</button>
+    <button id="btnStop">停止录制</button>
+    <br />
+    <script>
+        if (!navigator.mediaDevices) {
+            console.warn(`不支持录制屏幕`);
+        }
+
+        var chunks = [];
+
+        var running = true;
+
+        function startAddData() {
+            var div = document.createElement('div');
+            div.innerHTML = Math.random().toString();
+            document.body.appendChild(div);
+
+            if (running) {
+                setTimeout(startAddData, 1000);
+            }
+        }
+
+        navigator.mediaDevices.getDisplayMedia()
+            .then(stream => {
+                var mediaRecorder = new MediaRecorder(stream);
+
+                document.getElementById('btnStart').onclick = function () {
+                    mediaRecorder.start();
+                    console.log(mediaRecorder.state);
+                    console.log("recorder started");
+                    startAddData();
+                }
+
+                document.getElementById('btnStop').onclick = function () {
+                    mediaRecorder.stop();
+                    console.log(mediaRecorder.state);
+                    console.log("recorder stopped");
+                }
+
+                mediaRecorder.onstop = function (e) {
+                    console.log("data available after MediaRecorder.stop() called.");
+
+                    var blob = new Blob(chunks, { 'type': 'video/mp4' });
+                    chunks = [];
+
+                    running = false;
+
+                    var videoURL = URL.createObjectURL(blob);
+
+                    window.open(videoURL);
+
+                    console.log("recorder stopped");
+                }
+
+                mediaRecorder.ondataavailable = function (e) {
+                    chunks.push(e.data);
+                }
+            })
+            .catch(function (err) {
+                console.log(err);
+            })
+    </script>
+</body>
+
+</html>
\ No newline at end of file
