Update index.html

index.html

@@ -54,18 +54,28 @@
         .catch(err => {
             console.error("Error accessing the camera: ", err);
         });
+
         captureButton.addEventListener('click', () => {
             // Draw the video frame to the canvas
             canvas.width = video.videoWidth;
             canvas.height = video.videoHeight;
             const context = canvas.getContext('2d');
             context.drawImage(video, 0, 0, canvas.width, canvas.height);
-            // Convert canvas to image data
+            
+            // Preprocess the image
+            const imageData = context.getImageData(0, 0, canvas.width, canvas.height);
+            preprocess(imageData);
+
+            // Draw the preprocessed image on the canvas
+            context.putImageData(imageData, 0, 0);
+
+            // Convert the canvas to data URL
             const dataURL = canvas.toDataURL('image/png');
-            // Process the image with Tesseract
+
+            // Recognize text using Tesseract
             Tesseract.recognize(
                 dataURL,
-                'kor+eng', // Use both Korean and English
+                'kor+eng', // Recognize both Korean and English
                 {
                     logger: m => console.log(m)
                 }
@@ -76,13 +86,39 @@
                 console.error("Tesseract error: ", err);
             });
         });
+
+        function preprocess(imageData) {
+            // Binarization
+            binarization(imageData);
+            // Noise reduction
+            noiseReduction(imageData);
+            // Border enhancement
+            borderEnhancement(imageData);
+            // Resize
+            resize(imageData);
+        }
+
+        function binarization(imageData) {
+            // Binarization code
+        }
+
+        function noiseReduction(imageData) {
+            // Noise reduction code
+        }
+
+        function borderEnhancement(imageData) {
+            // Border enhancement code
+        }
+
+        function resize(imageData) {
+            // Resize code
+        }
+
         function analyzeNutrition(text) {
             // Extract sugar content from the recognized text
-           // const sugarMatch = text.match(/(\d+(\.\d+)?)(\s*(g|grams|그램))/i);
-           // const sugarMatch = text.match(/당[^\d]*(\d+(\.\d+)?)\s*(g|grams|그램)/i);
             const sugarMatch = text.match(/(당[^\d]*)(\d+(\.\d+)?)(\s*(g|grams|그램))/i);
             if (sugarMatch) {
-                const sugarContent = parseFloat(sugarMatch[1]);
+                const sugarContent = parseFloat(sugarMatch[2]);
                 let message = `Sugar content: ${sugarContent}g - `;
                 if (sugarContent <= 20) {
                     message += 'Good';