project done before

2021-06-23 17:47:08 +08:00
commit 248f8247d3
30 changed files with 14834 additions and 0 deletions
--- a/www/camera_example.html
+++ b/www/camera_example.html
@ -0,0 +1,83 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8" />
+        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+
+        <title>Camera</title>
+        <script type="text/javascript">
+            navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
+            window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL;
+
+            function getUserMedia(constraints, success, failure) {
+                navigator.getUserMedia(constraints, function(stream) {
+                    var videoSrc = (window.URL && window.URL.createObjectURL(stream)) || stream;
+                    success.apply(null, [videoSrc]);
+                }, failure);
+            }
+
+
+            function initCamera(constraints, video, callback) {
+                getUserMedia(constraints, function (src) {
+                    video.src = src;
+                    video.addEventListener('loadeddata', function() {
+                        var attempts = 10;
+
+                        function checkVideo() {
+                            if (attempts > 0) {
+                                if (video.videoWidth > 0 && video.videoHeight > 0) {
+                                    console.log(video.videoWidth + "px x " + video.videoHeight + "px");
+                                    video.play();
+                                    callback();
+                                } else {
+                                    window.setTimeout(checkVideo, 100);
+                                }
+                            } else {
+                                callback('Unable to play video stream.');
+                            }
+                            attempts--;
+                        }
+
+                        checkVideo();
+                    }, false);
+                }, function(e) {
+                    console.log(e);
+                });
+            }
+
+            function copyToCanvas(video, ctx) {
+                ( function frame() {
+                    ctx.drawImage(video, 0, 0);
+                    window.requestAnimationFrame(frame);
+                }());
+            }
+
+            window.addEventListener('load', function() {
+                var constraints = {
+                            video: {
+                                mandatory: {
+                                    minWidth: 1280,
+                                    minHeight: 720
+                                }
+                            }
+                        },
+                        video = document.createElement('video'),
+                        canvas = document.createElement('canvas');
+
+                document.body.appendChild(video);
+                document.body.appendChild(canvas);
+
+                initCamera(constraints, video, function() {
+                    canvas.setAttribute('width', video.videoWidth);
+                    canvas.setAttribute('height', video.videoHeight);
+                    copyToCanvas(video, canvas.getContext('2d'));
+                });
+            }, false);
+
+
+        </script>
+    </head>
+    <body>
+
+    </body>
+</html>