Skip to content

Commit b2bf4f5

Browse files
Tom-DynamsoftTom-Dynamsoft
committed
settings sample almost ok, all settings sample has some bugs
1 parent 59899a7 commit b2bf4f5

8 files changed

+1203
-912
lines changed

‎3.settings/1.barcodeFormats-expectedBarcodes.html‎

Lines changed: 37 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -10,17 +10,19 @@
1010
<link rel="stylesheet" href="../balloon.min.css"> <!-- Used for tooltip styling -->
1111
</head>
1212

13-
<!-- This sample demonstrates the minimum necessary JavaScript code to get the BarcodeScanner (video) up and running. The BarcodeScanner object is initialized with its default UI once the user clicks the 'Read Barcode via Camera' button. Any unique barcode results that are found are then displayed in an alert box to the user.
14-
Please note that the organizationID '200001' corresponds to Dynamsoft's public license which is reserved for public samples. When hosting the sample in your own environment, please obtain a private trial by contacting the Dynamsoft Support Team via support@dynamsoft.com -->
15-
1613
<body>
17-
<button id='readBarcode'>Open Camera and Read Barcode</button>
18-
<p></p>
14+
<h2>Formats and Count Per Frame</h2>
1915
<button id='openSimpleSettingsMenu'>Open Runtime Settings Menu</button>
2016

21-
<!-- Manually defining the div that will contain the video so that the UI doesn't take up the full screen, hiding the -->
17+
<input type="text" id="result" title="Double click to clear!" readonly="true" class="latest-result"
18+
placeholder="The Last Read Barcode">
19+
<!-- Manually defining the div that will contain the video so that the UI doesn't take up the full screen-->
2220
<div id="div-video-container">
21+
<span id='lib-load' style='font-size:x-large' hidden>Loading Library...</span>
2322
<video class="dbrScanner-video" playsinline="true"></video>
23+
<canvas class="dbrScanner-cvs-drawarea"
24+
style="width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; object-fit: contain;"
25+
width="1280" height="720"></canvas>
2426
</div>
2527

2628
<!-- Settings Menu displayed in a modal -->
@@ -30,86 +32,80 @@
3032
<div class="tooltip"
3133
aria-label="If you know that your application will only be dealing with a certain type of
3234
barcode format, you can save processing time by specifying which barcode formats the SDK should be looking for."
33-
data-balloon-pos="down" data-balloon-length="medium">Choose Which Barcode Formats to Detect
35+
data-balloon-pos="down" data-balloon-length="fit">Choose the Formats to Detect
3436
</div>
3537
<form id="chooseBarcodeFormats">
3638
<input type="checkbox" id="OneD" name="barcodeFormat" value="BF_ONED">
37-
<label for="OneD"> 1D </label><br>
39+
<label for="OneD"> 1D </label><br />
3840
<input type="checkbox" id="QR" name="barcodeFormat" value="BF_QR_CODE">
39-
<label for="QR"> QR Code </label><br>
41+
<label for="QR"> QR Code </label><br />
4042
<input type="checkbox" id="PDF417" name="barcodeFormat" value="BF_PDF417">
41-
<label for="PDF417"> PDF 417 </label><br>
43+
<label for="PDF417"> PDF 417 </label><br />
4244
<input type="checkbox" id="Datamatrix" name="barcodeFormat" value="BF_DATAMATRIX">
43-
<label for="Datamatrix"> DataMatrix </label> <br>
44-
<input type="checkbox" id="Aztec" name="barcodeFormat" value="BF_AZTEC">
45-
<label for="Aztec"> Aztec </label> <br>
46-
</form><br>
47-
<form id="chooseExpectedNumber">
48-
<div class="tooltip"
49-
aria-label="This parameter helps save time and resources when the expected number of barcodes per scan is less than the actual number of barcodes. Should the number of found results be less than this value, the SDK will exhaust more resources and try more algorithms to reach the expected number."
50-
data-balloon-pos="down" data-balloon-length="large"> Please input the expected number of barcodes
51-
per scan
52-
</div>
53-
<input type="text" id="expectedNumberBarcodes" name="expectedNumber">
45+
<label for="Datamatrix"> DataMatrix </label> <br />
5446
</form>
47+
<div class="tooltip"
48+
aria-label="This parameter helps save time and resources when the expected number of barcodes per scan is less than the actual number of barcodes. Should the number of found results be less than this value, the SDK will exhaust more resources and try more algorithms to reach the expected number."
49+
data-balloon-pos="down" data-balloon-length="fit"> Expected barcode count per frame
50+
</div><br />
51+
<input type="range" min="1" max="20" step="1" id="expectedNumberBarcodes" value="1">
52+
<span id="expectedNumberBarcodesLable">1</span>
5553
</div>
5654
</div>
5755

5856
<!-- JS Code -->
5957
<script src="initScanner.js"></script> <!-- To initialize the barcode scanner -->
6058

6159
<script>
62-
63-
/* Beginning of barcode formats assignment */
64-
65-
/* Should the user select one of the barcode format options, update the runtime settings accordingly and in the correct selection order */
66-
settingsForm.onchange = async function () {
60+
/** Beginning of barcode formats assignment
61+
* Should the user select one of the barcode format options,
62+
* update the runtime settings accordingly and in the correct selection order
63+
*/
64+
chooseBarcodeFormats.onchange = async function () {
6765
try {
68-
console.log("shiet");
6966
const checkboxes = document.querySelectorAll('input[name="barcodeFormat"]:checked');
7067
let settings = await scanner.getRuntimeSettings();
71-
settings.barcodeFormatIds = Dynamsoft.EnumBarcodeFormat.BF_NULL; // Set it to NULL first since the default is BF_ALL
68+
settings.barcodeFormatIds = Dynamsoft.DBR.EnumBarcodeFormat.BF_NULL; // Set it to NULL first since the default is BF_ALL
7269
checkboxes.forEach((checkbox) => {
73-
// go through each of the checked options and perform a compound bitwise OR to include each of the selected formats
70+
// go through each of the checked options and perform a compound bitwise OR
71+
// to include each of the selected formats
7472
switch (checkbox.value) {
7573
case "BF_ONED":
76-
settings.barcodeFormatIds |= Dynamsoft.EnumBarcodeFormat.BF_ONED;
74+
settings.barcodeFormatIds |= Dynamsoft.DBR.EnumBarcodeFormat.BF_ONED;
7775
break;
7876
case "BF_QR_CODE":
79-
settings.barcodeFormatIds |= Dynamsoft.EnumBarcodeFormat.BF_QR_CODE;
77+
settings.barcodeFormatIds |= Dynamsoft.DBR.EnumBarcodeFormat.BF_QR_CODE;
8078
break;
8179
case "BF_PDF417":
82-
settings.barcodeFormatIds |= Dynamsoft.EnumBarcodeFormat.BF_PDF417;
80+
settings.barcodeFormatIds |= Dynamsoft.DBR.EnumBarcodeFormat.BF_PDF417;
8381
break;
8482
case "BF_DATAMATRIX":
85-
settings.barcodeFormatIds |= Dynamsoft.EnumBarcodeFormat.BF_DATAMATRIX;
86-
break;
87-
case "BF_AZTEC":
88-
settings.barcodeFormatIds |= Dynamsoft.EnumBarcodeFormat.BF_AZTEC;
83+
settings.barcodeFormatIds |= Dynamsoft.DBR.EnumBarcodeFormat.BF_DATAMATRIX;
8984
break;
9085
}
9186
});
9287
await scanner.updateRuntimeSettings(settings);
9388
}
9489
catch (ex) {
95-
console.log(ex.message);
96-
throw ex;
90+
alert(ex.message);
9791
}
9892
}
9993

10094
/* End of barcode formats assignment */
10195

10296
/* Now for the expected barcodes */
103-
// Should the user enter the expected number of barcodes to be found per scan, the runtime settings are updated as follows
104-
expectedNumbersForm.onchange = async function () {
97+
// Should the user enter the expected number of barcodes to be found per scan,
98+
// the runtime settings are updated as follows
99+
expectedNumberBarcodes.onchange = async function () {
105100
try {
106101
let expectedVal = document.getElementById('expectedNumberBarcodes').value;
102+
document.getElementById('expectedNumberBarcodesLable').innerText = expectedVal;
107103
let settings = await scanner.getRuntimeSettings();
108104
settings.expectedBarcodesCount = expectedVal;
109105
await scanner.updateRuntimeSettings(settings);
110106
}
111107
catch (ex) {
112-
console.log(ex.message);
108+
alert(ex.message);
113109
}
114110
}
115111
</script>

0 commit comments

Comments
 (0)