Graduate

Opencv.js face detection

...@@ -16,6 +16,8 @@ ...@@ -16,6 +16,8 @@
16 height: 480px; 16 height: 480px;
17 background-color: #666; 17 background-color: #666;
18 } 18 }
19 +
20 +
19 </style> 21 </style>
20 </head> 22 </head>
21 23
...@@ -24,7 +26,7 @@ ...@@ -24,7 +26,7 @@
24 <video autoplay="true" id="videoElement"> <!-- style="visibility: hidden"--> 26 <video autoplay="true" id="videoElement"> <!-- style="visibility: hidden"-->
25 27
26 </video> 28 </video>
27 - <canvas id='canvasOutput'> 29 + <canvas id='canvasOutput' width='640' height='480'>
28 30
29 </canvas> 31 </canvas>
30 </div> 32 </div>
...@@ -41,12 +43,19 @@ if (navigator.mediaDevices.getUserMedia){ ...@@ -41,12 +43,19 @@ if (navigator.mediaDevices.getUserMedia){
41 } 43 }
42 </script> 44 </script>
43 <script> 45 <script>
46 +cv['onRuntimeInitialized']=()=>{
44 let video = document.getElementById('videoElement'); 47 let video = document.getElementById('videoElement');
45 let src = new cv.Mat(video.height, video.width, cv.CV_8UC4); 48 let src = new cv.Mat(video.height, video.width, cv.CV_8UC4);
46 let dst = new cv.Mat(video.height, video.width, cv.CV_8UC4); 49 let dst = new cv.Mat(video.height, video.width, cv.CV_8UC4);
47 let gray = new cv.Mat(); 50 let gray = new cv.Mat();
48 - let cap = new cv.RectVector(); 51 + let cap = new cv.VideoCapture(video);
52 + let faces = new cv.RectVector();
49 let classifier = new cv.CascadeClassifier(); 53 let classifier = new cv.CascadeClassifier();
54 + var streaming = true;
55 + if (typeof streaming === 'undefined')
56 + {
57 + streaming = false;
58 + }
50 classifier.load("{{url_for('static', filename='js/haarcascade_frontalface_default.xml')}}") 59 classifier.load("{{url_for('static', filename='js/haarcascade_frontalface_default.xml')}}")
51 const FPS = 30; 60 const FPS = 30;
52 function processVideo() { 61 function processVideo() {
...@@ -79,13 +88,12 @@ if (navigator.mediaDevices.getUserMedia){ ...@@ -79,13 +88,12 @@ if (navigator.mediaDevices.getUserMedia){
79 let delay = 1000/FPS - (Date.now() - begin); 88 let delay = 1000/FPS - (Date.now() - begin);
80 setTimeout(processVideo, delay); 89 setTimeout(processVideo, delay);
81 } catch (err) { 90 } catch (err) {
82 - utils.printError(err); 91 + console.log(err);
83 } 92 }
84 } 93 }
85 // schedule the first one. 94 // schedule the first one.
86 - cv['onRuntimeInitialized']=()=>{ 95 + setTimeout(processVideo, 0);
87 - setTimeout(processVideo, 0); 96 +}
88 - }
89 </script> 97 </script>
90 </body> 98 </body>
91 </html> 99 </html>
......