diff --git a/plugin/README.md b/plugin/README.md index d5cd51c..c641438 100644 --- a/plugin/README.md +++ b/plugin/README.md @@ -19,13 +19,13 @@ ext { } ``` -Note: Android with `ZXING` scanning library supports all formats, while `MLKIT` supports all but `MAXICODE`, `RSS_14`, `RSS_EXPANDED` and `UPC_EAN_EXTENSION` - using one of these in `hint` will default to scanning any format. +Note: Android with `ZXING` scanning library supports all formats, while `MLKIT` supports all except `MAXICODE`, `RSS_14`, `RSS_EXPANDED` and `UPC_EAN_EXTENSION` - using one of these in `hint` will default to scanning any format. #### iOS The barcode scanner uses the camera on the device. Ensure you configure the Privacy - Camera Usage Description in your Info.plist file so that your application can access the device's camera. -Note: iOS supports all formats but `MAXICODE` and `UPC_EAN_EXTENSION` - using them in `hint` will default to scanning any format. Also, Apple Vision does not distinguish between `UPC_A` and `EAN_13`, so specifying one of these in `hint` will allow to scan both. +Note: iOS supports all formats except `MAXICODE` and `UPC_EAN_EXTENSION` - using them in `hint` will default to scanning any format. Also, Apple Vision does not distinguish between `UPC_A` and `EAN_13`, so specifying one of these in `hint` will allow to scan both. --- diff --git a/plugin/package.json b/plugin/package.json index 3c89085..0da3fea 100644 --- a/plugin/package.json +++ b/plugin/package.json @@ -80,4 +80,4 @@ "src": "android" } } -} +} \ No newline at end of file diff --git a/plugin/src/web.ts b/plugin/src/web.ts index c2bca5f..636af65 100644 --- a/plugin/src/web.ts +++ b/plugin/src/web.ts @@ -7,12 +7,19 @@ import type { CapacitorBarcodeScannerOptions, CapacitorBarcodeScannerScanResult, } from './definitions'; -import { CapacitorBarcodeScannerScanOrientation, CapacitorBarcodeScannerTypeHint } from './definitions'; +import { + CapacitorBarcodeScannerCameraDirection, + CapacitorBarcodeScannerScanOrientation, + CapacitorBarcodeScannerTypeHint, +} from './definitions'; /** * Implements OSBarcodePlugin to provide web functionality for barcode scanning. */ export class CapacitorBarcodeScannerWeb extends WebPlugin implements CapacitorBarcodeScannerPlugin { + private static _FORWARD = { facingMode: 'user' }; + private static _BACK = { facingMode: 'environment' }; + private _facingMode: MediaTrackConstraints = CapacitorBarcodeScannerWeb._BACK; /** * Stops the barcode scanner and hides its UI. * @private @@ -81,9 +88,18 @@ export class CapacitorBarcodeScannerWeb extends WebPlugin implements CapacitorBa this.buildScannerElement(); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion document.getElementById('cap-os-barcode-scanner-container-dialog')!.style.display = 'block'; + + // Set the facing mode based on camera direction option + if (options.cameraDirection !== undefined) { + this._facingMode = + options.cameraDirection === CapacitorBarcodeScannerCameraDirection.BACK + ? CapacitorBarcodeScannerWeb._BACK + : CapacitorBarcodeScannerWeb._FORWARD; + } + return new Promise((resolve, reject) => { const param = { - facingMode: options.cameraDirection === 1 ? 'environment' : 'user', + facingMode: this._facingMode.facingMode, hasScannerButton: false, scanButton: options.scanButton === undefined ? false : options.scanButton, showScanLine: false, @@ -114,7 +130,7 @@ export class CapacitorBarcodeScannerWeb extends WebPlugin implements CapacitorBa focusMode: 'continuous', height: { min: 576, ideal: 1920 }, deviceId: undefined, - facingMode: param.facingMode, + facingMode: this._facingMode.facingMode, }, }; @@ -142,7 +158,7 @@ export class CapacitorBarcodeScannerWeb extends WebPlugin implements CapacitorBa }; (window as any).OSBarcodeWebScanner.start( - { facingMode: param.facingMode }, + this._facingMode, Html5QrcodeConfig, OSBarcodeWebScannerSuccessCallback, OSBarcodeWebScannerErrorCallback