Graduate

Opencv.js face detection

...@@ -22,17 +22,18 @@ ...@@ -22,17 +22,18 @@
22 background-color: #666; 22 background-color: #666;
23 } 23 }
24 </style> 24 </style>
25 +<script type='text/javascript' src="{{url_for('static', filename='js/opencv.js')}}"></script>
25 <script type='text/javascript' src="{{url_for('static', filename='js/utils.js')}}"></script> 26 <script type='text/javascript' src="{{url_for('static', filename='js/utils.js')}}"></script>
26 <script type='text/javascript'> 27 <script type='text/javascript'>
27 - 28 +function load_cascade()
28 -let utils = new Utils('errorMessage'); 29 +{
29 - 30 + let faceCascadeFile = 'haarcascade_frontalface_default.xml'
30 -utils.loadOpenCv(() => { 31 + let faceCascadeURL = 'static/js/haarcascade_frontalface_default.xml'
31 - let faceCascadeFile = '/static/js/haarcascade_frontalface_default.xml'; 32 + let utils = new Utils('errorMessage');
32 - utils.createFileFromUrl(faceCascadeFile, faceCascadeFile, () => { 33 + utils.createFileFromUrl(faceCascadeFile, faceCascadeURL, () => {
33 - alert(faceCascadeFile); 34 + main()
34 }); 35 });
35 -}); 36 +}
36 37
37 function main() 38 function main()
38 { 39 {
...@@ -56,7 +57,7 @@ let faces = new cv.RectVector(); ...@@ -56,7 +57,7 @@ let faces = new cv.RectVector();
56 let classifier = new cv.CascadeClassifier(); 57 let classifier = new cv.CascadeClassifier();
57 var streaming = true; 58 var streaming = true;
58 59
59 -classifier.load('static/js/haarcascade_frontalface_default.xml'); 60 +classifier.load('haarcascade_frontalface_default.xml');
60 61
61 const FPS = 30; 62 const FPS = 30;
62 function processVideo() { 63 function processVideo() {
...@@ -99,7 +100,7 @@ setTimeout(processVideo, 0); ...@@ -99,7 +100,7 @@ setTimeout(processVideo, 0);
99 } 100 }
100 </script> 101 </script>
101 </head> 102 </head>
102 -<body onload="cv['onRuntimeInitialized']=()=>{ main() }"> 103 +<body onload="cv['onRuntimeInitialized']=()=>{ load_cascade() }">
103 <div id="container"> 104 <div id="container">
104 <video autoplay="true" id="videoInput" width=640 height=480> <!-- style="visibility: hidden"--> 105 <video autoplay="true" id="videoInput" width=640 height=480> <!-- style="visibility: hidden"-->
105 106
......