Merge branch '_dev' of https://github.com/Dynamsoft/barcode-reader-javascript-samples into _dev

Author: Shen-wb

README.md

@@ -46,7 +46,7 @@ If you have any questions, feel free to [contact Dynamsoft support](https://www.
 Get the basic features working with plain/native JavaScript or within a framework like [Angular](https://angular.io/), [React](https://reactjs.org/) or [Vue](https://vuejs.org/), with RTU-BarcodeScanner APIs.
 
 * [**Scan Single Barcode**](https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main/barcode-scanner-api-samples/scan-single-barcode/hello-world.html) - [run↗](https://demo.dynamsoft.com/samples/dbr/js/barcode-scanner-api-samples/scan-single-barcode/hello-world.html?utm_source=sampleReadme): Scan single barcode from video stream with minimum code in JavaScript.
-* [**Scan Single Barcode**](https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main/barcode-scanner-api-samples/scan-single-barcode/scan-and-search.html) - [run↗](https://demo.dynamsoft.com/samples/dbr/js/barcode-scanner-api-samples/scan-single-barcode/scan-and-search.html?utm_source=sampleReadme): Scan a barcode to retrieve the relevant product information from the database in JavaScript.
+* [**Scan And Search**](https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main/barcode-scanner-api-samples/scan-single-barcode/scan-and-search.html) - [run↗](https://demo.dynamsoft.com/samples/dbr/js/barcode-scanner-api-samples/scan-single-barcode/scan-and-search.html?utm_source=sampleReadme): Scan a barcode to retrieve the relevant product information from the database in JavaScript.
 * [**Hello World in Angular**](https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main/barcode-scanner-api-samples/scan-single-barcode/angular): Read single barcode from camera in an Angular application.
 * [**Hello World in React**](https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main/barcode-scanner-api-samples/scan-single-barcode/react): Read single barcode from camera in a React application.
 * [**Hello World in Vue**](https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main/barcode-scanner-api-samples/scan-single-barcode/vue): Read single barcode from camera in a Vue application.

barcode-scanner-api-samples/scan-multiple-barcodes/cart-builder.html

@@ -6,7 +6,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>List-Builder - Scan to Cart Simulation</title>
 
-  <!-- Dynamsoft Barcode Reader Bundle -->
+  <!-- Include Dynamsoft Barcode Reader Bundle via CDN -->
   <script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.0.3000/dist/dbr.bundle.js"></script>
   <!-- If the network is unstable or you prefer to self-host the SDK, uncomment the line below to load it locally -->
   <!-- <script src="../../../distributables/dbr.bundle.js"></script> -->

barcode-scanner-api-samples/scan-multiple-barcodes/hello-world.html

@@ -7,7 +7,7 @@
   <title>
     Dynamsoft Barcode Scanner Sample - Hello World (Decode via Camera)
   </title>
-  <!-- Include Dynamsoft Barcode Reader Bundle from CDN -->
+  <!-- Include Dynamsoft Barcode Reader Bundle via CDN -->
   <script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.0.3000/dist/dbr.bundle.js"></script>
   <!-- If the network is unstable or you prefer to self-host the SDK, uncomment the line below to load it locally -->
   <!-- <script src="../../../distributables/dbr.bundle.js"></script> -->
@@ -64,8 +64,7 @@ <h1 class="barcode-scanner-title">
       // Set scan mode to detect multiple unique barcodes per scan session
       scanMode: Dynamsoft.EnumScanMode.SM_MULTI_UNIQUE,
 
-      // Display a result view for barcodes detected
-      showResultView: true,
+      // showResultView: true,
 
       // Enable an "Upload Image" button for scanning barcodes from existing images
       showUploadImageButton: true,
@@ -74,7 +73,7 @@ <h1 class="barcode-scanner-title">
 
       // Additional configuration for the scanner UI
       scannerViewConfig: {
-        showCloseButton: true, // Display a close button on the scanner interface,
+        // showCloseButton: false, // Uncomment to show a close button in the scanner UI
         showFlashButton: true,
         cameraSwitchControl: "toggleFrontBack"
       },

barcode-scanner-api-samples/scan-single-barcode/scan-and-search.html

@@ -5,10 +5,16 @@
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>Scan & Search with BarcodeScanner</title>
+
+  <!-- Include Dynamsoft Barcode Reader Bundle via CDN -->
   <script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.0.3000/dist/dbr.bundle.js"></script>
+  <!-- If the network is unstable or you prefer to self-host the SDK, uncomment the line below to load it locally -->
+  <!-- <script src="../../../distributables/dbr.bundle.js"></script> -->
 </head>
 
 <body>
+  <h1>📦 Instant Product Information Lookup</h1>
+  <h2>Enter a UPC, EAN, or ISBN number to retrieve accurate product data from a specific database</h2>
   <h3></h3>
   <div id="container">
     <button id="scan-btn" aria-label="Scan barcode">
@@ -19,7 +25,7 @@ <h3></h3>
         <div class="corner br"></div>
       </div>
     </button>
-    <input type="text" id="text-input" placeholder="Enter any UPC, EAN, or ISBN number" />
+    <input type="text" id="text-input" placeholder="e.g. 049000042511" />
     <button id="search-btn" aria-label="Search">
       <div class="search-icon"></div>
     </button>
@@ -37,12 +43,10 @@ <h3></h3>
 
     async function startScanner() {
       const barcodeScanner = new Dynamsoft.BarcodeScanner({
-        license: "", // Replace with valid license key
+        license: "DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9", // Replace with valid license key
         scanMode: Dynamsoft.EnumScanMode.SM_SINGLE,
-        showUploadImageButton: true,
         scannerViewConfig: {
           container: scannerContainer,
-          showCloseButton: true,
         },
       });
 

index.html

@@ -119,6 +119,10 @@ <h3>BarcodeScanner API Samples</h3>
                     JavaScript code to scan a barcode from camera."><a class="button title" href="barcode-scanner-api-samples/scan-single-barcode/hello-world.html">Hello World</a><span id="icon001" class="tooltipIcon"></span>
                     <a class="github" href="https://github.com/Dynamsoft/barcode-reader-javascript-samples/blob/main/barcode-scanner-api-samples/scan-single-barcode/hello-world.html" title="Check code on GitHub"></a></span>
                 </div>
+                <div class="file"><span data-balloon-length="large" data-balloon-pos="down" aria-label="Scan a product barcode
+                    and simulate a search from a product database."><a class="button title" href="barcode-scanner-api-samples/scan-single-barcode/scan-and-search.html">Scan and Search</a><span id="icon001" class="tooltipIcon"></span>
+                    <a class="github" href="https://github.com/Dynamsoft/barcode-reader-javascript-samples/blob/main/barcode-scanner-api-samples/scan-single-barcode/scan-and-search.html" title="Check code on GitHub"></a></span>
+                </div>
                 <div class="file"><span data-balloon-length="large" data-balloon-pos="down" aria-label="Read barcodes from camera and images in an Angular
                     Application."><a class="button title" href="https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main/barcode-scanner-api-samples/scan-single-barcode/angular">Hello World in
                         Angular (<img alt="Angular logo"