]> _ Git - 1000pourcent.git/commitdiff
wip #3207 @5
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Tue, 10 Dec 2019 18:55:41 +0000 (19:55 +0100)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Tue, 10 Dec 2019 18:55:41 +0000 (19:55 +0100)
.htaccess
index.html
js/1000pct.js
js/ocr.js
js/perspective.js

index bd3550bf53af80de14fd18cd95c0a47846529102..f67aba11411ab5f60a9d01b7d4a44888122f9e05 100644 (file)
--- a/.htaccess
+++ b/.htaccess
@@ -6,4 +6,11 @@ AuthUserFile /home/cubedesigners/demo1/1000pct/.htpasswd
     Require ip 88.190.245.49
     Require ip 82.251.249.101
           Require valid-user
-</RequireAny>
\ No newline at end of file
+</RequireAny>
+
+RewriteEngine on
+RewriteBase /1000pct/
+RewriteCond %{HTTPS} off
+RewriteRule ^(.*)$ https://demo1.cubedesigners.com/1000pct/$1 [R=301,L]
+
+
index bcd0c87873e2eda3388ba4e69db68472c84ba02a..347909ca67eefb5344cbfca29e85fc976ce1810d 100644 (file)
@@ -6,6 +6,8 @@
     <link href="style.css" rel="stylesheet" type="text/css">
 </head>
 <body>
+<video id="video" autoplay></video>
+<canvas id="input"></canvas>
 <pre id="res"></pre>
 <script async src="js/opencv.js" type="text/javascript"></script>
 <script async src='https://unpkg.com/tesseract.js@v2.0.0-beta.1/dist/tesseract.min.js'
index 58e657af8561dddd4afff4724528d4e063bb37b3..261e6f12ddd09037686f42f13ae73f66ab55ea53 100644 (file)
@@ -2,16 +2,44 @@ var opencvReferences = [];
 
 
 function appReady() {
-    drawImage('assets/inputsmall.jpg', 'input', function (width, height) {
+
+    if (navigator.mediaDevices) {
+        navigator.mediaDevices.getUserMedia({
+            video: {
+                width: {min: 1280},
+                height: {min: 720},
+                //facingMode: {exact: "environment"}
+            }, audio: false
+        }).then(function (stream) {
+            video.srcObject = stream;
+            video.play();
+
+            video.addEventListener('loadedmetadata', function () {
+                recognizeAttempt();
+            });
+        });
+    }
+}
+
+function recognizeAttempt() {
+    var input = document.querySelector('#input');
+    input.width = video.videoWidth;
+    input.height = video.videoHeight;
+    console.log('attempt');
+    console.log('-------');
+    input.getContext('2d').drawImage(video, 0, 0, input.width, input.height);
+    var start = Date.now();
+    var contour = detectBoard('input', input.width, input.height, true);
+    if (contour !== false) {
+        console.log(Date.now() - start);
+        correctPerspective(contour);
+        console.log(Date.now() - start);
+        recognizeChars('perspective');
+    } else {
         setTimeout(function () {
-            var start = Date.now();
-            var contour = detectBoard('input', width, height, true);
-            console.log(Date.now() - start);
-            correctPerspective(contour);
-            console.log(Date.now() - start);
-            recognizeChars('perspective');
-        }, 500)
-    });
+            recognizeAttempt();
+        }, 250);
+    }
 }
 
 
@@ -97,9 +125,7 @@ function detectBoard(id, width, height, draw) {
 
     // We know that the board is delimited by two 5 sides contours. We find these two contours and select the smallest
     let boardContour;
-    if (filterByVertices.length === 1) {
-        boardContour = filterByVertices[0];
-    } else if (filterByVertices.length === 2) {
+    if (filterByVertices.length === 2) {
         // If we just have two contours, no need to go further
         boardContour = filterByVertices[1];
     } else {
@@ -112,6 +138,9 @@ function detectBoard(id, width, height, draw) {
         }
     }
 
+    if (boardContour === undefined) {
+        return false;
+    }
     if (draw) {
         drawContours('contour', [boardContour], 'approx', width, height);
     }
@@ -145,19 +174,25 @@ function sortArea(a, b) {
 }
 
 function drawContours(canvas, contours, type, width, height) {
-    let tmp = new cv.MatVector();
-    for (let i = 0; i < contours.length; i++) {
-        tmp.push_back(contours[i][type]);
-    }
+    try {
+
+
+        let tmp = new cv.MatVector();
+        for (let i = 0; i < contours.length; i++) {
+            tmp.push_back(contours[i][type]);
+        }
 
-    var dst = cv.Mat.zeros(height, width, cv.CV_8UC3);
-    for (let i = 0; i < tmp.size(); ++i) {
-        let color = new cv.Scalar(Math.round(Math.random() * 255), Math.round(Math.random() * 255),
-            Math.round(Math.random() * 255));
+        var dst = cv.Mat.zeros(height, width, cv.CV_8UC3);
+        for (let i = 0; i < tmp.size(); ++i) {
+            let color = new cv.Scalar(Math.round(Math.random() * 255), Math.round(Math.random() * 255),
+                Math.round(Math.random() * 255));
+
+            cv.drawContours(dst, tmp, i, color, 1, cv.LINE_8);
+        }
+        drawCV(canvas, width, height, dst);
+    } catch (e) {
 
-        cv.drawContours(dst, tmp, i, color, 1, cv.LINE_8);
     }
-    drawCV(canvas, width, height, dst);
 }
 
 function drawCV(canvas, width, height, src) {
@@ -177,4 +212,13 @@ function getCanvas(canvas) {
         c = document.getElementById(canvas);
     }
     return c;
+}
+
+function wait(ms) {
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            console.log("Done waiting");
+            resolve(ms)
+        }, ms)
+    })
 }
\ No newline at end of file
index 231b030a15e495c9a1e983d37e183f2291d47c45..cfe1264c4aeb160a54b2d82d167273f326bb5565 100644 (file)
--- a/js/ocr.js
+++ b/js/ocr.js
@@ -61,9 +61,9 @@ function recognizeChars(canvas) {
 
 
 function extractRegion(src, region, color, area) {
-    let drawId = 'color_' + color + '_area';
+    let drawId = 'color_' + color + '_' + area;
 
-    var coef = 400 / 500;
+    var coef = 500 / 500;
     region[0] *= coef;
     region[1] *= coef;
     region[2] *= coef;
index 52b144bd7523bb03b3e2cde3de41acf727f51915..0f739aa8de2f43e63aa55eb9b733c081610610e1 100644 (file)
@@ -60,7 +60,7 @@ function correctPerspective(contours) {
     cv.warpPerspective(src, finalDest, M, dsize, cv.INTER_LINEAR, cv.BORDER_CONSTANT, new cv.Scalar());
 
     // Resize the board to be a square
-    var finalSize = 400;
+    var finalSize = 500;
     let boardSized = cv.Mat.zeros(finalSize, finalSize, cv.CV_8UC3);
     let boardSize = new cv.Size(finalSize, finalSize)
     cv.resize(finalDest, boardSized, boardSize, 0, cv.INTER_LINEAR);