update

Cube-J · Cube-J · commit e0182658e4d4 · 2022-03-23T11:27:18.000+08:00
diff --git a/1.hello-world/10.read-video-pwa/helloworld-pwa.html b/1.hello-world/10.read-video-pwa/helloworld-pwa.html
@@ -13,7 +13,7 @@
 <body>
     <h1 style="font-size: 1.5em;">Hello World for PWA</h1>
     <button id='readBarcode'>Read Barcode via Camera</button>
-    <script src="https://cdn.jsdelivr.net/npm/dynamsoft-javascript-barcode@8.8.7/dist/dbr.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/dbr.js"></script>
     <script>
         /** LICENSE ALERT - README 
          * To use the library, you need to first specify a license key using the API "license" as shown below.
diff --git a/1.hello-world/12.read-video-webpack/package.json b/1.hello-world/12.read-video-webpack/package.json
@@ -12,6 +12,7 @@
         "webpack-cli": "^4.9.2"
     },
     "dependencies": {
-        "dynamsoft-javascript-barcode": "8.8.7"
+        "dynamsoft-javascript-barcode": "8.8.7",
+        "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0"
     }
 }
diff --git a/1.hello-world/12.read-video-webpack/src/index.js b/1.hello-world/12.read-video-webpack/src/index.js
@@ -1,4 +1,4 @@
-import { BarcodeReader } from "dynamsoft-javascript-barcode";
+import { BarcodeReader, BarcodeScanner } from "keillion-dynamsoft-javascript-barcode";
 
 /** LICENSE ALERT - README 
  * To use the library, you need to first specify a license key using the API "license" as shown below.
@@ -13,7 +13,7 @@ BarcodeReader.license = 'DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9';
  * LICENSE ALERT - THE END 
  */
 
-BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/dynamsoft-javascript-barcode@8.8.7/dist/";
+BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/";
 
 let pScanner = null;
 if (document.getElementById('readBarcode')) {
diff --git a/1.hello-world/13.minimum-code-es6.html b/1.hello-world/13.minimum-code-es6.html
@@ -13,7 +13,7 @@
     <h1 style="font-size: 1.5em;">Read Barcodes from a Camera</h1>
     <button id="btn-show-scanner">Show Barcode Scanner</button>
     <script type="module">
-        import { BarcodeReader, BarcodeScanner } from 'https://cdn.jsdelivr.net/npm/dynamsoft-javascript-barcode@8.8.7/dist/dbr.mjs';
+        import { BarcodeReader, BarcodeScanner } from 'https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/dbr.mjs';
         /** LICENSE ALERT - README 
          * To use the library, you need to first specify a license key using the API "license" as shown below.
          */
@@ -29,7 +29,7 @@ <h1 style="font-size: 1.5em;">Read Barcodes from a Camera</h1>
 
         // DBR.productKeys = "PRODUCT-KEYS";
 
-        BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/dynamsoft-javascript-barcode@8.8.7/dist/";
+        BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/";
 
         let pScanner = null;
         document.getElementById('btn-show-scanner').addEventListener('click', async () => {
diff --git a/1.hello-world/3.read-video-angular/package.json b/1.hello-world/3.read-video-angular/package.json
@@ -20,7 +20,7 @@
         "@angular/platform-browser-dynamic": "~11.2.5",
         "@angular/router": "~11.2.5",
         "dynamsoft-javascript-barcode": "8.8.7",
-        "keillion-dynamsoft-javascript-barcode": "0.20220321180719.0",
+        "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0",
         "rxjs": "~6.6.0",
         "tslib": "^2.0.0",
         "zone.js": "~0.11.3"
diff --git a/1.hello-world/3.read-video-angular/src/app/barcode-scanner/barcode-scanner.component.ts b/1.hello-world/3.read-video-angular/src/app/barcode-scanner/barcode-scanner.component.ts
@@ -11,7 +11,7 @@ export class VideoDecodeComponent implements OnInit {
   async ngOnInit(): Promise<void> {
     try {
       const scanner = await (this.pScanner = BarcodeScanner.createInstance());
-      scanner.setUIElement((document.querySelector('.component-barcode-scanner') as any));
+      await scanner.setUIElement((document.querySelector('.component-barcode-scanner') as any));
       scanner.onFrameRead = (results: any) => {
         for (const result of results) {
           console.log(result.barcodeText);
diff --git a/1.hello-world/3.read-video-angular/src/app/dbr.ts b/1.hello-world/3.read-video-angular/src/app/dbr.ts
@@ -13,4 +13,4 @@ BarcodeReader.license = 'DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9';
  * LICENSE ALERT - THE END 
  */
 
-BarcodeReader.engineResourcePath = 'https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220318155126.0/dist/';
+BarcodeReader.engineResourcePath = 'https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/';
diff --git a/1.hello-world/3.read-video-angular/src/app/img-decode/img-decode.component.ts b/1.hello-world/3.read-video-angular/src/app/img-decode/img-decode.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import {BarcodeReader} from 'dynamsoft-javascript-barcode'
+import {BarcodeReader} from 'keillion-dynamsoft-javascript-barcode'
 
 @Component({
   selector: 'app-img-decode',
diff --git a/1.hello-world/4.read-video-react/package.json b/1.hello-world/4.read-video-react/package.json
@@ -8,7 +8,7 @@
         "@testing-library/react": "^11.1.0",
         "@testing-library/user-event": "^12.1.10",
         "dynamsoft-javascript-barcode": "8.8.7",
-        "keillion-dynamsoft-javascript-barcode": "0.20220318155126.0",
+        "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0",
         "react": "^17.0.1",
         "react-dom": "^17.0.1",
         "react-scripts": "4.0.3",
diff --git a/1.hello-world/4.read-video-react/src/components/VideoDecode/VideoDecode.js b/1.hello-world/4.read-video-react/src/components/VideoDecode/VideoDecode.js
diff --git a/1.hello-world/4.read-video-react/src/dbr.js b/1.hello-world/4.read-video-react/src/dbr.js
@@ -13,4 +13,4 @@ BarcodeReader.license = 'DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9';
  * LICENSE ALERT - THE END 
  */
 
-BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220318155126.0/dist/";
+BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/";
diff --git a/1.hello-world/5.read-video-vue/package.json b/1.hello-world/5.read-video-vue/package.json
@@ -10,7 +10,7 @@
     "dependencies": {
         "core-js": "^3.6.5",
         "dynamsoft-javascript-barcode": "8.8.7",
-        "keillion-dynamsoft-javascript-barcode": "0.20220318174621.0",
+        "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0",
         "vue": "^2.6.11"
     },
     "devDependencies": {
diff --git a/1.hello-world/5.read-video-vue/src/dbr.js b/1.hello-world/5.read-video-vue/src/dbr.js
@@ -13,4 +13,4 @@ BarcodeReader.license = 'DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9';
  * LICENSE ALERT - THE END 
  */
 
-BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220318174621.0/dist/";
+BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/";
diff --git a/1.hello-world/6.read-video-vue3/package.json b/1.hello-world/6.read-video-vue3/package.json
@@ -10,7 +10,7 @@
     "dependencies": {
         "core-js": "^3.6.5",
         "dynamsoft-javascript-barcode": "8.8.7",
-        "keillion-dynamsoft-javascript-barcode": "0.20220318174621.0",
+        "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0",
         "vue": "^3.0.0"
     },
     "devDependencies": {
diff --git a/1.hello-world/6.read-video-vue3/src/components/VideoDecode.vue b/1.hello-world/6.read-video-vue3/src/components/VideoDecode.vue
@@ -92,8 +92,9 @@ export default {
     onMounted(async () => {
       try {
         const internalInstance = getCurrentInstance();
+        elRefs.value = internalInstance.refs.elRefs;
         const scanner = await (pScanner.value = BarcodeScanner.createInstance());
-        scanner.setUIElement(internalInstance.ctx.elRefs);
+        await scanner.setUIElement(elRefs.value);
         scanner.onFrameRead = (results) => {
           for (let result of results) {
             console.log(result.barcodeText);
diff --git a/1.hello-world/6.read-video-vue3/src/dbr.js b/1.hello-world/6.read-video-vue3/src/dbr.js
@@ -13,4 +13,4 @@ BarcodeReader.license = 'DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9';
  * LICENSE ALERT - THE END 
  */
 
-BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220318174621.0/dist/";
+BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/";
diff --git a/1.hello-world/7.read-video-nextjs/components/VideoDecode.js b/1.hello-world/7.read-video-nextjs/components/VideoDecode.js
diff --git a/1.hello-world/7.read-video-nextjs/dbr.js b/1.hello-world/7.read-video-nextjs/dbr.js
@@ -13,4 +13,4 @@ BarcodeReader.license = 'DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9';
  * LICENSE ALERT - THE END 
  */
 
-BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220318174621.0/dist/";
+BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/";
diff --git a/1.hello-world/7.read-video-nextjs/package.json b/1.hello-world/7.read-video-nextjs/package.json
@@ -10,7 +10,7 @@
     },
     "dependencies": {
         "dynamsoft-javascript-barcode": "8.8.7",
-        "keillion-dynamsoft-javascript-barcode": "0.20220318174621.0",
+        "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0",
         "next": "11.1.2",
         "react": "17.0.2",
         "react-dom": "17.0.2"
diff --git a/1.hello-world/8.read-video-nuxtjs/dbr.js b/1.hello-world/8.read-video-nuxtjs/dbr.js
@@ -13,4 +13,4 @@ BarcodeReader.license = 'DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9';
  * LICENSE ALERT - THE END 
  */
 
-BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220318174621.0/dist/";
+BarcodeReader.engineResourcePath = "https://cdn.jsdelivr.net/npm/keillion-dynamsoft-javascript-barcode@0.20220323095526.0/dist/";
diff --git a/1.hello-world/8.read-video-nuxtjs/package.json b/1.hello-world/8.read-video-nuxtjs/package.json
@@ -11,7 +11,7 @@
     "dependencies": {
         "core-js": "^3.15.1",
         "dynamsoft-javascript-barcode": "8.8.7",
-        "keillion-dynamsoft-javascript-barcode": "0.20220318174621.0",
+        "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0",
         "nuxt": "^2.15.7"
     },
     "devDependencies": {}
diff --git a/1.hello-world/9.read-video-electron/package.json b/1.hello-world/9.read-video-electron/package.json
@@ -11,6 +11,6 @@
     "dependencies": {
         "dynamsoft-javascript-barcode": "8.8.7",
         "electron": "14.0.1",
-        "keillion-dynamsoft-javascript-barcode": "0.20220318174621.0"
+        "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0"
     }
 }
diff --git a/4.use-case/1.fill-a-form-with-barcode-reading.html b/4.use-case/1.fill-a-form-with-barcode-reading.html
@@ -54,17 +54,15 @@ <h3>Click each input box to fill in!</h3>
                             scanner.hide();
                             document.getElementById('UIElement').hidden = true;
                         };
-                        scanner.getRuntimeSettings()
-                            .then(settings => {
-                                settings.region = {
-                                    regionLeft: 5,
-                                    regionTop: 5,
-                                    regionRight: 95,
-                                    regionBottom: 95,
-                                    regionMeasuredByPercentage: 1
-                                };
-                                scanner.updateRuntimeSettings(settings);
-                            });
+                        await settings = scanner.getRuntimeSettings();
+                        settings.region = {
+                            regionLeft: 5,
+                            regionTop: 5,
+                            regionRight: 95,
+                            regionBottom: 95,
+                            regionMeasuredByPercentage: 1
+                        };
+                        await scanner.updateRuntimeSettings(settings);
                         await scanner.updateVideoSettings({
                             video: {
                                 width: {
@@ -79,7 +77,7 @@ <h3>Click each input box to fill in!</h3>
                             }
                         });
                         document.getElementById('UIElement').hidden = false;
-                        scanner.setUIElement(document.getElementById('UIElement'));
+                        await scanner.setUIElement(document.getElementById('UIElement'));
                         await scanner.show();
                     } catch (ex) {
                         alert(ex.message);
diff --git a/4.use-case/2.read-a-drivers-license.html b/4.use-case/2.read-a-drivers-license.html
@@ -74,7 +74,7 @@ <h1 id='header'>Read A Driver's License <a href="#" id='readAgain' hidden onclic
         // decode video from camera
         showScannerBtn.addEventListener('click', async () => {
             showScannerBtn.hidden = true;
-            startScanning(false);
+            await startScanning(false);
         });
         function backToHome() {
             showScannerBtn.hidden = false;
@@ -92,7 +92,7 @@ <h1 id='header'>Read A Driver's License <a href="#" id='readAgain' hidden onclic
             try {
                 let scanner = await (pScanner = pScanner || Dynamsoft.DBR.BarcodeScanner.createInstance());
                 if (scanner.singleFrameMode !== bSingleFrameMode) {
-                    await scanner.hide();
+                    scanner.hide();
                     scanner.singleFrameMode = bSingleFrameMode;
                 }
                 await scanner.setUIElement(document.getElementById('div-ui-container'));
@@ -101,7 +101,7 @@ <h1 id='header'>Read A Driver's License <a href="#" id='readAgain' hidden onclic
                     settings.barcodeFormatIds = Dynamsoft.DBR.EnumBarcodeFormat.BF_PDF417;
                     settings.localizationModes = [16, 8, 2, 0, 0, 0, 0, 0];
                     settings.deblurLevel = 7;
-                    scanner.updateRuntimeSettings(settings);
+                    await scanner.updateRuntimeSettings(settings);
                     document.getElementById('header').hidden = true;
                     UIElement.classList.add("show");
                 }
@@ -126,7 +126,7 @@ <h1 id='header'>Read A Driver's License <a href="#" id='readAgain' hidden onclic
         document.getElementById("confirm_btn").addEventListener("click", () => {
             backToHome();
             showScannerBtn.hidden = false;
-            startScanning(true);
+            await startScanning(true);
             document.getElementById("dialog").hidden = true;
         });
         document.getElementById("cancel_btn").addEventListener("click", () => {
@@ -153,7 +153,7 @@ <h1 id='header'>Read A Driver's License <a href="#" id='readAgain' hidden onclic
         }
         async function extractInformation(text) {
             let resultShowNode = document.createElement("p");
-            await (await pScanner).hide();
+            (await pScanner).hide();
             document.getElementById('hintMSG').hidden = true;
             document.getElementById('header').hidden = false;
             document.getElementById('readAgain').hidden = false;

Original file line number	Diff line number	Diff line change
`@@ -12,6 +12,7 @@`
`12`	`12`	`"webpack-cli": "^4.9.2"`
`13`	`13`	`},`
`14`	`14`	`"dependencies": {`
`15`		`- "dynamsoft-javascript-barcode": "8.8.7"`
	`15`	`+ "dynamsoft-javascript-barcode": "8.8.7",`
	`16`	`+ "keillion-dynamsoft-javascript-barcode": "0.20220323095526.0"`
`16`	`17`	`}`
`17`	`18`	`}`