From ee53b1e30ef20e27ccf41a203659919e8f8bf0f2 Mon Sep 17 00:00:00 2001 From: Eugene Yu Date: Thu, 5 Sep 2024 16:03:50 -0700 Subject: [PATCH] fixed merge conflicts --- VINScanner/VIN_Template.json | 764 +++++++++++++++---------------- VINScanner/css/index.css | 43 +- VINScanner/index.html | 3 +- VINScanner/js/const.js | 14 +- VINScanner/js/index.js | 90 +--- VINScanner/js/init.js | 61 +-- VINScanner/js/util.js | 2 +- VINScanner/minimum-elements.html | 2 +- 8 files changed, 412 insertions(+), 567 deletions(-) diff --git a/VINScanner/VIN_Template.json b/VINScanner/VIN_Template.json index 8d067ea..673ca98 100644 --- a/VINScanner/VIN_Template.json +++ b/VINScanner/VIN_Template.json @@ -1,396 +1,396 @@ { - "BarcodeFormatSpecificationOptions": [ - { - "BarcodeBytesLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeFormatIds": [ - "BF_CODE_39_EXTENDED" - ], - "BarcodeTextLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeTextRegExPattern": "(I{0,1})([0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5})", - "MirrorMode": "MM_NORMAL", - "ModuleSizeRangeArray": null, - "Name": "FP_1_BF_CODE_39_EXTENDED" - }, - { - "BarcodeBytesLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeFormatIds": [ - "BF_DATAMATRIX" - ], - "BarcodeTextLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeTextRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", - "Name": "FP_1_BF_DATAMATRIX" - }, - { - "BarcodeBytesLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeFormatIds": [ - "BF_QR_CODE" - ], - "BarcodeHeightRangeArray": null, - "BarcodeTextLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeTextRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", - "Name": "FP_1_BF_QR_CODE" - }, - { - "BarcodeBytesLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeFormatIds": [ - "BF_CODE_128" - ], - "BarcodeHeightRangeArray": null, - "BarcodeTextLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeTextRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", - "Name": "FP_1_BF_CODE_128" - }, - { - "BarcodeBytesLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeFormatIds": [ - "BF_PDF417" - ], - "BarcodeHeightRangeArray": null, - "BarcodeTextLengthRangeArray": [ - { - "MaxValue": 2147483647, - "MinValue": 0 - } - ], - "BarcodeTextRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", - "Name": "FP_1_BF_PDF417" - } - ], - "BarcodeReaderTaskSettingOptions": [ - { - "Name": "vin_barcode_task", - "DeblurModes": null, - "BarcodeColourModes": [ - { - "LightReflection": 1, - "Mode": "BICM_DARK_ON_LIGHT" - } - ], - "BarcodeFormatIds": [ - "BF_CODE_39_EXTENDED", - "BF_QR_CODE", - "BF_DATAMATRIX" - ], - "BarcodeFormatSpecificationNameArray": [ - "FP_1_BF_CODE_39_EXTENDED", - "FP_1_BF_QR_CODE", - "FP_1_BF_DATAMATRIX", - "FP_1_BF_CODE_128", - "FP_1_BF_PDF417" - ], - "DeformationResistingModes": [ - { - "BinarizationMode": { - "BinarizationThreshold": -1, - "BlockSizeX": 0, - "BlockSizeY": 0, - "EnableFillBinaryVacancy": 0, - "GrayscaleEnhancementModesIndex": -1, - "Mode": "BM_LOCAL_BLOCK", - "MorphOperation": "Close", - "MorphOperationKernelSizeX": -1, - "MorphOperationKernelSizeY": -1, - "MorphShape": "Rectangle", - "ThresholdCompensation": 10 - }, - "GrayscaleEnhancementMode": { - "Mode": "GEM_GENERAL", - "Sensitivity": -1, - "SharpenBlockSizeX": -1, - "SharpenBlockSizeY": -1, - "SmoothBlockSizeX": -1, - "SmoothBlockSizeY": -1 - }, - "Level": 5, - "Mode": "DRM_SKIP" - } - ], - "ExpectedBarcodesCount": 1, - "LocalizationModes": [ - { - "Mode": "LM_CONNECTED_BLOCKS" - }, - { - "Mode": "LM_SCAN_DIRECTLY" - } - ], - "SectionImageParameterArray": [ - { - "ContinueWhenPartialResultsGenerated": 1, - "ImageParameterName": "ip_localize_barcode", - "Section": "ST_REGION_PREDETECTION" - }, - { - "ContinueWhenPartialResultsGenerated": 1, - "ImageParameterName": "ip_localize_barcode", - "Section": "ST_BARCODE_LOCALIZATION" - }, - { - "ContinueWhenPartialResultsGenerated": 1, - "ImageParameterName": "ip_decode_barcode", - "Section": "ST_BARCODE_DECODING" - } - ] - } - ], - "LabelRecognizerTaskSettingOptions": [ - { - "Name": "vin_text_task", - "TextLineSpecificationNameArray": [ - "tls_vin_text" - ], - "SectionImageParameterArray": [ - { - "Section": "ST_REGION_PREDETECTION", - "ImageParameterName": "ip_recognize_text" + "BarcodeFormatSpecificationOptions": [ + { + "BarcodeBytesLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeFormatIds": [ + "BF_CODE_39_EXTENDED" + ], + "BarcodeTextLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeTextRegExPattern": "(I{0,1})([0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5})", + "MirrorMode": "MM_NORMAL", + "ModuleSizeRangeArray": null, + "Name": "FP_1_BF_CODE_39_EXTENDED" + }, + { + "BarcodeBytesLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeFormatIds": [ + "BF_DATAMATRIX" + ], + "BarcodeTextLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeTextRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", + "Name": "FP_1_BF_DATAMATRIX" + }, + { + "BarcodeBytesLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeFormatIds": [ + "BF_QR_CODE" + ], + "BarcodeHeightRangeArray": null, + "BarcodeTextLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeTextRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", + "Name": "FP_1_BF_QR_CODE" + }, + { + "BarcodeBytesLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeFormatIds": [ + "BF_CODE_128" + ], + "BarcodeHeightRangeArray": null, + "BarcodeTextLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeTextRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", + "Name": "FP_1_BF_CODE_128" + }, + { + "BarcodeBytesLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeFormatIds": [ + "BF_PDF417" + ], + "BarcodeHeightRangeArray": null, + "BarcodeTextLengthRangeArray": [ + { + "MaxValue": 2147483647, + "MinValue": 0 + } + ], + "BarcodeTextRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", + "Name": "FP_1_BF_PDF417" + } + ], + "BarcodeReaderTaskSettingOptions": [ + { + "Name": "vin_barcode_task", + "DeblurModes": null, + "BarcodeColourModes": [ + { + "LightReflection": 1, + "Mode": "BICM_DARK_ON_LIGHT" + } + ], + "BarcodeFormatIds": [ + "BF_CODE_39_EXTENDED", + "BF_QR_CODE", + "BF_DATAMATRIX" + ], + "BarcodeFormatSpecificationNameArray": [ + "FP_1_BF_CODE_39_EXTENDED", + "FP_1_BF_QR_CODE", + "FP_1_BF_DATAMATRIX", + "FP_1_BF_CODE_128", + "FP_1_BF_PDF417" + ], + "DeformationResistingModes": [ + { + "BinarizationMode": { + "BinarizationThreshold": -1, + "BlockSizeX": 0, + "BlockSizeY": 0, + "EnableFillBinaryVacancy": 0, + "GrayscaleEnhancementModesIndex": -1, + "Mode": "BM_LOCAL_BLOCK", + "MorphOperation": "Close", + "MorphOperationKernelSizeX": -1, + "MorphOperationKernelSizeY": -1, + "MorphShape": "Rectangle", + "ThresholdCompensation": 10 }, - { - "Section": "ST_TEXT_LINE_LOCALIZATION", - "ImageParameterName": "ip_recognize_text" + "GrayscaleEnhancementMode": { + "Mode": "GEM_GENERAL", + "Sensitivity": -1, + "SharpenBlockSizeX": -1, + "SharpenBlockSizeY": -1, + "SmoothBlockSizeX": -1, + "SmoothBlockSizeY": -1 }, - { - "Section": "ST_TEXT_LINE_RECOGNITION", - "ImageParameterName": "ip_recognize_text" - } - ] - } - ], - "TextLineSpecificationOptions": [ - { - "Name": "tls_vin_text", - "CharacterModelName": "VIN", - "StringRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", + "Level": 5, + "Mode": "DRM_SKIP" + } + ], + "ExpectedBarcodesCount": 1, + "LocalizationModes": [ + { + "Mode": "LM_CONNECTED_BLOCKS" + }, + { + "Mode": "LM_SCAN_DIRECTLY" + } + ], + "SectionImageParameterArray": [ + { + "ContinueWhenPartialResultsGenerated": 1, + "ImageParameterName": "ip_localize_barcode", + "Section": "ST_REGION_PREDETECTION" + }, + { + "ContinueWhenPartialResultsGenerated": 1, + "ImageParameterName": "ip_localize_barcode", + "Section": "ST_BARCODE_LOCALIZATION" + }, + { + "ContinueWhenPartialResultsGenerated": 1, + "ImageParameterName": "ip_decode_barcode", + "Section": "ST_BARCODE_DECODING" + } + ] + } + ], + "LabelRecognizerTaskSettingOptions": [ + { + "Name": "vin_text_task", + "TextLineSpecificationNameArray": [ + "tls_vin_text" + ], + "SectionImageParameterArray": [ + { + "Section": "ST_REGION_PREDETECTION", + "ImageParameterName": "ip_recognize_text" + }, + { + "Section": "ST_TEXT_LINE_LOCALIZATION", + "ImageParameterName": "ip_recognize_text" + }, + { + "Section": "ST_TEXT_LINE_RECOGNITION", + "ImageParameterName": "ip_recognize_text" + } + ] + } + ], + "TextLineSpecificationOptions": [ + { + "Name": "tls_vin_text", + "CharacterModelName": "VIN", + "StringRegExPattern": "[0-9A-HJ-NPR-Z]{9}[1-9A-HJ-NPR-TV-Y][0-9A-HJ-NPR-Z]{2}[0-9]{5}", + "CharHeightRange": [ + 5, + 1000, + 1 + ], + "StringLengthRange": [ + 17, + 17 + ], + "BinarizationModes": [ + { + "Mode": "BM_AUTO", + "EnableFillBinaryVacancy": 0 + } + ] + } + ], + "CaptureVisionTemplates": [ + { + "Name": "ReadVIN", + "ImageROIProcessingNameArray": [ + "roi_vin_barcode", + "roi_vin_text" + ], + "ImageSource": "", + "MaxParallelTasks": 4, + "MinImageCaptureInterval": 0, + "OutputOriginalImage": 1, + "SemanticProcessingNameArray": [ + "sp_vin_barcode", + "sp_vin_text" + ], + "Timeout": 10000 + }, + { + "Name": "ReadVINBarcode", + "ImageROIProcessingNameArray": [ + "roi_vin_barcode" + ], + "ImageSource": "", + "MaxParallelTasks": 4, + "MinImageCaptureInterval": 0, + "OutputOriginalImage": 1, + "SemanticProcessingNameArray": [ + "sp_vin_barcode" + ], + "Timeout": 10000 + }, + { + "Name": "ReadVINText", + "ImageROIProcessingNameArray": [ + "roi_vin_text" + ], + "ImageSource": "", + "MaxParallelTasks": 4, + "MinImageCaptureInterval": 0, + "OutputOriginalImage": 1, + "SemanticProcessingNameArray": [ + "sp_vin_text" + ], + "Timeout": 10000 + } + ], + "GlobalParameter": { + "MaxTotalImageDimension": 0 + }, + "ImageParameterOptions": [ + { + "Name": "ip_localize_barcode", + "BinarizationModes": [ + { + "Mode": "BM_LOCAL_BLOCK", + "MorphOperation": "Erode" + } + ], + "GrayscaleEnhancementModes": [ + { + "Mode": "GEM_GENERAL", + "Sensitivity": 5, + "SharpenBlockSizeX": 3, + "SharpenBlockSizeY": 3, + "SmoothBlockSizeX": 3, + "SmoothBlockSizeY": 3 + } + ], + "GrayscaleTransformationModes": [ + { + "Mode": "GTM_ORIGINAL" + }, + { + "Mode": "GTM_INVERTED" + } + ] + }, + { + "Name": "ip_decode_barcode", + "GrayscaleTransformationModes": [ + { + "Mode": "GTM_ORIGINAL" + } + ], + "ScaleDownThreshold": 99999 + }, + { + "Name": "ip_recognize_text", + "TextDetectionMode": { + "Mode": "TTDM_LINE", + "Direction": "HORIZONTAL", "CharHeightRange": [ 5, 1000, 1 ], - "StringLengthRange": [ - 17, - 17 - ], - "BinarizationModes": [ - { - "Mode": "BM_AUTO", - "EnableFillBinaryVacancy": 0 - } - ] - } - ], - "CaptureVisionTemplates": [ - { - "Name": "ReadVIN", - "ImageROIProcessingNameArray": [ - "roi_vin_barcode", - "roi_vin_text" - ], - "ImageSource": "", - "MaxParallelTasks": 4, - "MinImageCaptureInterval": 0, - "OutputOriginalImage": 1, - "SemanticProcessingNameArray": [ - "sp_vin_barcode", - "sp_vin_text" - ], - "Timeout": 10000 - }, - { - "Name": "ReadVINBarcode", - "ImageROIProcessingNameArray": [ - "roi_vin_barcode" - ], - "ImageSource": "", - "MaxParallelTasks": 4, - "MinImageCaptureInterval": 0, - "OutputOriginalImage": 1, - "SemanticProcessingNameArray": [ - "sp_vin_barcode" - ], - "Timeout": 10000 - }, - { - "Name": "ReadVINText", - "ImageROIProcessingNameArray": [ - "roi_vin_text" - ], - "ImageSource": "", - "MaxParallelTasks": 4, - "MinImageCaptureInterval": 0, - "OutputOriginalImage": 1, - "SemanticProcessingNameArray": [ - "sp_vin_text" - ], - "Timeout": 10000 - } - ], - "GlobalParameter": { - "MaxTotalImageDimension": 0 - }, - "ImageParameterOptions": [ - { - "Name": "ip_localize_barcode", - "BinarizationModes": [ - { - "Mode": "BM_LOCAL_BLOCK", - "MorphOperation": "Erode" - } - ], - "GrayscaleEnhancementModes": [ - { - "Mode": "GEM_GENERAL", - "Sensitivity": 5, - "SharpenBlockSizeX": 3, - "SharpenBlockSizeY": 3, - "SmoothBlockSizeX": 3, - "SmoothBlockSizeY": 3 - } - ], - "GrayscaleTransformationModes": [ - { - "Mode": "GTM_ORIGINAL" - }, - { - "Mode": "GTM_INVERTED" - } - ] - }, - { - "Name": "ip_decode_barcode", - "GrayscaleTransformationModes": [ - { - "Mode": "GTM_ORIGINAL" - } - ], - "ScaleDownThreshold": 99999 + "Sensitivity": 7 }, - { - "Name": "ip_recognize_text", - "TextDetectionMode": { - "Mode": "TTDM_LINE", - "Direction": "HORIZONTAL", - "CharHeightRange": [ - 5, - 1000, - 1 - ], - "Sensitivity": 7 + "GrayscaleTransformationModes": [ + { + "Mode": "GTM_ORIGINAL" }, - "GrayscaleTransformationModes": [ - { - "Mode": "GTM_ORIGINAL" - }, - { - "Mode": "GTM_INVERTED" - } - ], - "BinarizationModes": [ - { - "EnableFillBinaryVacancy": 0, - "Mode": "BM_AUTO" - } - ] - } - ], - "TargetROIDefOptions": [ - { - "Name": "roi_vin_barcode", - "TaskSettingNameArray": [ - "vin_barcode_task" - ] - }, - { - "Name": "roi_vin_text", - "TaskSettingNameArray": [ - "vin_text_task" - ] - } - ], - "CharacterModelOptions": [ - { - "Name": "VIN" - } - ], - "SemanticProcessingOptions": [ - { - "Name": "sp_vin_barcode", - "ReferenceObjectFilter": { - "ReferenceTargetROIDefNameArray": [ - "roi_vin_barcode" - ] - }, - "TaskSettingNameArray": [ - "dcp_vin_barcode" + { + "Mode": "GTM_INVERTED" + } + ], + "BinarizationModes": [ + { + "EnableFillBinaryVacancy": 0, + "Mode": "BM_AUTO" + } + ] + } + ], + "TargetROIDefOptions": [ + { + "Name": "roi_vin_barcode", + "TaskSettingNameArray": [ + "vin_barcode_task" + ] + }, + { + "Name": "roi_vin_text", + "TaskSettingNameArray": [ + "vin_text_task" + ] + } + ], + "CharacterModelOptions": [ + { + "Name": "VIN" + } + ], + "SemanticProcessingOptions": [ + { + "Name": "sp_vin_barcode", + "ReferenceObjectFilter": { + "ReferenceTargetROIDefNameArray": [ + "roi_vin_barcode" ] }, - { - "Name": "sp_vin_text", - "ReferenceObjectFilter": { - "ReferenceTargetROIDefNameArray": [ - "roi_vin_text" - ] - }, - "TaskSettingNameArray": [ - "dcp_vin_text" - ] - } - ], - "CodeParserTaskSettingOptions": [ - { - "Name": "dcp_vin_barcode", - "CodeSpecifications": [ - "VIN" + "TaskSettingNameArray": [ + "dcp_vin_barcode" + ] + }, + { + "Name": "sp_vin_text", + "ReferenceObjectFilter": { + "ReferenceTargetROIDefNameArray": [ + "roi_vin_text" ] }, - { - "Name": "dcp_vin_text", - "CodeSpecifications": [ - "VIN" - ] - } - ] - } \ No newline at end of file + "TaskSettingNameArray": [ + "dcp_vin_text" + ] + } + ], + "CodeParserTaskSettingOptions": [ + { + "Name": "dcp_vin_barcode", + "CodeSpecifications": [ + "VIN" + ] + }, + { + "Name": "dcp_vin_text", + "CodeSpecifications": [ + "VIN" + ] + } + ] +} \ No newline at end of file diff --git a/VINScanner/css/index.css b/VINScanner/css/index.css index 8964caa..9dc968e 100644 --- a/VINScanner/css/index.css +++ b/VINScanner/css/index.css @@ -148,6 +148,7 @@ img { } .scanner-container .header .camera-list { + width: 165px; position: absolute; top: 46px; left: 0; @@ -273,10 +274,6 @@ img { cursor: pointer; } -.result-container #result-image-container { - display: flex; - justify-content: center; -} .result-container #result-image-container { display: flex; justify-content: center; @@ -326,7 +323,6 @@ img { font-family: "Oswald-Regular"; } -.scan-mode-container { .scan-mode-container { display: none; justify-content: center; @@ -336,20 +332,12 @@ img { left: 5%; right: 5%; z-index: 2; - position: fixed; - bottom: 15%; - left: 5%; - right: 5%; - z-index: 2; } -.scan-mode-container .scan-mode-content { - position: relative; .scan-mode-container .scan-mode-content { position: relative; display: flex; justify-content: center; - justify-content: center; align-items: center; background-color: rgb(34, 34, 34); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); @@ -359,38 +347,20 @@ img { opacity: 0.8; } -.scan-option-btn { - background-color: transparent; - box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); - border-radius: 8px; - padding: 0.5rem; - width: max-content; - opacity: 0.8; -} - .scan-option-btn { background-color: transparent; padding: 0.5rem; font-family: OpenSans-Regular; color: white; - width: 5rem; } .selected { background-color: #fe8e14; color: white; border-radius: 8px; - color: white; - border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); } -.scan-orientation-btn { - position: absolute; - top: -90%; - right: 0; - padding: 0.5rem; - display: none; .scan-orientation-btn { position: absolute; top: -90%; @@ -404,15 +374,6 @@ img { background-color: rgb(34, 34, 34); } -.scan-orientation-btn .scan-orientation-icon { - width: 24px; - height: 24px; - filter: invert(0.4); - border-radius: 8px; - opacity: 0.8; - background-color: rgb(34, 34, 34); -} - .scan-orientation-btn .scan-orientation-icon { width: 24px; height: 24px; @@ -509,4 +470,4 @@ img { .result-container .parsed-result-area .parsed-filed { font-size: 14px; } -} +} \ No newline at end of file diff --git a/VINScanner/index.html b/VINScanner/index.html index 9c51da0..e5382fd 100644 --- a/VINScanner/index.html +++ b/VINScanner/index.html @@ -118,7 +118,6 @@ min-width: 100px; min-height: 100px; background: #6f6f6f; - overflow-y: hidden; " > - + \ No newline at end of file diff --git a/VINScanner/js/const.js b/VINScanner/js/const.js index e7cb6df..6e576f8 100644 --- a/VINScanner/js/const.js +++ b/VINScanner/js/const.js @@ -13,13 +13,15 @@ const SCAN_TEMPLATES = { text: "ReadVINText", both: "ReadVIN", }; - +const SCAN_MODE_TITLES = { + barcode: "Scan by Barcode", + text: "Scan by Text", + both: "Scan Text or Barcode", +}; let currentMode = SCAN_MODES[2]; // Set scan mode as "Scan Both" by default let scanOrientation = "landscape"; -let scanOrientation = "landscape"; - // Get the UI element const homePage = document.querySelector(".home-page"); @@ -33,7 +35,6 @@ const cameraSelector = document.querySelector(".camera-selector"); const scannerContainer = document.querySelector(".scanner-container"); const startScanningBtn = document.querySelector(".start-btn"); -const scanHelpMsg = document.querySelector(".scan-help-msg"); const scanHelpMsg = document.querySelector(".scan-help-msg"); const scanModeContainer = document.querySelector(".scan-mode-container"); @@ -55,7 +56,4 @@ const up = document.querySelector(".up"); const notification = document.querySelector("#notification"); const scanOrientationBtn = document.querySelector(".scan-orientation-btn"); -const scanOrientationIcon = document.querySelector(".scan-orientation-icon"); - -const scanOrientationBtn = document.querySelector(".scan-orientation-btn"); -const scanOrientationIcon = document.querySelector(".scan-orientation-icon"); +const scanOrientationIcon = document.querySelector(".scan-orientation-icon"); \ No newline at end of file diff --git a/VINScanner/js/index.js b/VINScanner/js/index.js index 51c56e4..66070e1 100644 --- a/VINScanner/js/index.js +++ b/VINScanner/js/index.js @@ -8,15 +8,6 @@ import { showNotification, toggleScanOrientation, } from "./util.js"; -import { - checkOrientation, - getVisibleRegionOfVideo, - resetScanOrientation, - shouldShowScanModeContainer, - shouldShowScanOrientation, - showNotification, - toggleScanOrientation, -} from "./util.js"; // Create event listener for each scan modes SCAN_MODES.forEach((mode) => @@ -36,26 +27,20 @@ SCAN_MODES.forEach((mode) => await cameraEnhancer.open(); } - // Highlight the selected camera in the camera list container // Highlight the selected camera in the camera list container const currentCamera = cameraEnhancer.getSelectedCamera(); - cameraListContainer.childNodes.forEach((child) => { cameraListContainer.childNodes.forEach((child) => { if (currentCamera.deviceId === child.deviceId) { child.className = "camera-item camera-selected"; } }); - }); - // Start capturing based on the selected scan mode template // Start capturing based on the selected scan mode template await cvRouter.startCapturing(SCAN_TEMPLATES[mode]); // By default, cameraEnhancer captures grayscale images to optimize performance. // To capture RGB Images, we set the Pixel Format to EnumImagePixelFormat.IPF_ABGR_8888 cameraEnhancer.setPixelFormat(Dynamsoft.Core.EnumImagePixelFormat.IPF_ABGR_8888); - // Update button styles to show selected scan mode - document.querySelectorAll(".scan-option-btn").forEach((button) => { // Update button styles to show selected scan mode document.querySelectorAll(".scan-option-btn").forEach((button) => { button.classList.remove("selected"); @@ -63,11 +48,9 @@ SCAN_MODES.forEach((mode) => document.querySelector(`#scan-${mode}-btn`).classList.add("selected"); showNotification(`Scan mode switched successfully`, "banner-success"); - // Update the current mode to the newly selected mode and set scan orientation based on current mode // Update the current mode to the newly selected mode and set scan orientation based on current mode currentMode = mode; configureScanOrientation(); - configureScanOrientation(); })(); } catch (ex) { let errMsg = ex.message || ex; @@ -129,22 +112,6 @@ const regionTop = () => { }; const region = () => { - let region = - scanOrientation === "landscape" - ? { - left: regionLeft(), - right: 100 - regionLeft(), - top: regionTop(), - bottom: 100 - regionTop(), - isMeasuredInPercentage: true, - } - : { - left: regionTop() - 10, - right: 100 - regionTop() + 10, - top: Math.max(5, regionLeft()), - bottom: 75 - regionLeft(), - isMeasuredInPercentage: true, - }; let region = scanOrientation === "landscape" ? { @@ -176,7 +143,6 @@ window.addEventListener("resize", () => { timer && clearTimeout(timer); timer = setTimeout(() => { configureScanOrientation(); - configureScanOrientation(); }, 500); }); @@ -186,12 +152,6 @@ startScanningBtn.addEventListener("click", () => { scanBothBtn.click(); }); -// On click restart video button -const restartVideo = async () => { - resultContainer.style.display = "none"; - document.querySelector(`#scan-${currentMode}-btn`).click(); -}; - // On click restart video button const restartVideo = async () => { resultContainer.style.display = "none"; @@ -199,7 +159,6 @@ const restartVideo = async () => { }; restartVideoBtn.addEventListener("click", restartVideo); -// On click camera selector // On click camera selector cameraSelector.addEventListener("click", (e) => { e.stopPropagation(); @@ -209,7 +168,6 @@ cameraSelector.addEventListener("click", (e) => { down.style.display = isShow ? "inline-block" : "none"; }); -// On click sound button // On click sound button playSoundBtn.addEventListener("click", () => { playSoundBtn.style.display = "none"; @@ -224,7 +182,6 @@ closeSoundBtn.addEventListener("click", () => { isSoundOn = true; }); -// On click copy button // On click copy button copyResultBtn.addEventListener("click", () => { const resultText = parsedResultMain.innerText; @@ -242,7 +199,6 @@ copyResultBtn.addEventListener("click", () => { }); }); -// On click save image button // On click save image button saveImageBtn.addEventListener("click", () => { const imageCanvas = resultImageContainer.querySelector("canvas"); @@ -300,48 +256,4 @@ scanOrientationBtn.addEventListener("click", () => { // Update camera region cameraEnhancer.setScanRegion(region()); updateScanOrientationStyles(); -}); -/** - * Sets up the scan orientation button visibility and resets the camera region - * based on the current scan mode and device orientation - */ -function configureScanOrientation() { - shouldShowScanModeContainer(); - if (shouldShowScanOrientation()) { - scanOrientationBtn.style.display = "flex"; - } else { - scanOrientationBtn.style.display = "none"; - resetScanOrientation(); // Reset scan orientation to landscape - } - cameraEnhancer.setScanRegion(region()); // Update cameraEnhancer scan region - updateScanOrientationStyles(); // update scan orientation button styles -} - -/** - * Applies the UI styles for the scan orientation button and scan help message - * based on the current scan orientation. - */ -function updateScanOrientationStyles() { - if (scanOrientation === "portrait") { - scanOrientationBtn.style.backgroundColor = "#fe8e14"; - scanOrientationIcon.style.filter = "invert(0)"; - scanHelpMsg.style.display = "none"; // Hide the scan help message in portrait orientation - } else { - scanOrientationBtn.style.backgroundColor = "rgb(34,34,34)"; - scanOrientationIcon.style.filter = "invert(0.4)"; - scanHelpMsg.style.display = "block"; // Show the scan help message in landscape orientation - } -} - -// On click scan orientation button -scanOrientationBtn.addEventListener("click", () => { - // Only allow switch on portrait devices and scan mode is barcode - if (shouldShowScanOrientation()) { - toggleScanOrientation(); - } else { - resetScanOrientation(); - } - // Update camera region - cameraEnhancer.setScanRegion(region()); - updateScanOrientationStyles(); -}); +}); \ No newline at end of file diff --git a/VINScanner/js/init.js b/VINScanner/js/init.js index 6e2c4af..176fc6b 100644 --- a/VINScanner/js/init.js +++ b/VINScanner/js/init.js @@ -1,4 +1,4 @@ -import { extractVinDetails, judgeCurResolution, resultToHTMLElement, showNotification } from "./util.js"; +import { extractVinDetails, resultToHTMLElement, showNotification } from "./util.js"; /** LICENSE ALERT - README * To use the library, you need to first specify a license key using the API "initLicense" as shown below. @@ -30,48 +30,23 @@ async function initDCE() { // Get the camera information of the device and render the camera list cameraList = await cameraEnhancer.getAllCameras(); for (let camera of cameraList) { - for (let res of Object.keys(resolutions)) { - const cameraItem = document.createElement("div"); - cameraItem.className = "camera-item"; - cameraItem.innerText = `${camera.label} (${res})`; - cameraItem.deviceId = camera.deviceId; - cameraItem.resolution = res; - - cameraItem.addEventListener("click", async (e) => { - e.stopPropagation(); - for (let child of cameraListContainer.childNodes) { - child.className = "camera-item"; - } - cameraItem.className = "camera-item camera-selected"; - await cameraEnhancer.selectCamera(camera); - await cameraEnhancer.setResolution({ - width: resolutions[res][0], - height: resolutions[res][1], - }); - - const currentCamera = await cameraEnhancer.getSelectedCamera(); - const currentResolution = judgeCurResolution(await cameraEnhancer.getResolution()); - if (currentCamera.deviceId === camera.deviceId && currentResolution === res) { - showNotification("Camera and resolution switched successfully!", "banner-success"); - } else if (judgeCurResolution(currentResolution) !== res) { - showNotification(`Resolution switch failed! ${res} is not supported.`, "banner-default"); - - // Update resolution to the current resolution that is supported - for (let child of cameraListContainer.childNodes) { - child.className = "camera-item"; - if (currentCamera.deviceId === child.deviceId && currentResolution === child.resolution) { - child.className = "camera-item camera-selected"; - } - } - } else { - showNotification(`Camera switch failed!`, "banner-error"); - } + const cameraItem = document.createElement("div"); + cameraItem.className = "camera-item"; + cameraItem.innerText = camera.label; + cameraItem.deviceId = camera.deviceId; + + cameraItem.addEventListener("click", (e) => { + e.stopPropagation(); + for (let child of cameraListContainer.childNodes) { + child.className = "camera-item"; + } + cameraItem.className = "camera-item camera-selected"; + cameraEnhancer.selectCamera(camera); - // Hide options after user clicks an option - cameraSelector.click(); - }); - cameraListContainer.appendChild(cameraItem); - } + showNotification("Camera switched successfully!", "banner-success"); + cameraSelector.click(); + }); + cameraListContainer.appendChild(cameraItem); } cameraView.setVideoFit("cover"); await cameraEnhancer.setResolution({ width: 1920, height: 1080 }); @@ -169,4 +144,4 @@ let init = (async function initCVR() { await cvRouter.addResultReceiver(resultReceiver); })(); -export { init }; +export { init }; \ No newline at end of file diff --git a/VINScanner/js/util.js b/VINScanner/js/util.js index cf5dd5c..496e844 100644 --- a/VINScanner/js/util.js +++ b/VINScanner/js/util.js @@ -151,4 +151,4 @@ export function shouldShowScanModeContainer() { const isHomepageClosed = homePage.style.display === "none"; const isResultClosed = resultContainer.style.display === "none" || resultContainer.style.display === ""; scanModeContainer.style.display = isHomepageClosed && isResultClosed ? "flex" : "none"; -} +} \ No newline at end of file diff --git a/VINScanner/minimum-elements.html b/VINScanner/minimum-elements.html index 208e0c4..99eebdd 100644 --- a/VINScanner/minimum-elements.html +++ b/VINScanner/minimum-elements.html @@ -204,4 +204,4 @@

}); - + \ No newline at end of file