[HIMA-16] - camera error handling

src/app/modules/barcode-search/barcode-search.module.ts

@@ -1,21 +1,25 @@
+import { SharedModule } from 'src/app/shared/shared.module';
 import { ScanditSdkModule } from 'scandit-sdk-angular';
 
 import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
+import { NgModule, ErrorHandler } from '@angular/core';
 import { ZXingScannerModule } from '@zxing/ngx-scanner';
 
 import { BarcodeSearchComponent } from './barcode-search.component';
 import { BarcodeScannerScanditComponent } from './components/barcode-scanner-scandit/barcode-scanner-scandit.component';
 import { BarcodeScannerComponent } from './components/barcode-scanner/barcode-scanner.component';
+import { CameraErrorHandler } from './camera-error.handler';
 
 const licenseKey =
   'AejsFV7HQtsqNMrEAkQOTw02rYwJABlExVErc8Um/r+YWl/psUmXqQl5jJnrb21ZUxLaSzhxHIL8ev2+fXCre2dWtbCuKMyjvUUeeyw0UsBFbV4flF81uBZvmKTcVocCSUQAN6cgp1AbD0t5ZPe4LqiqKOs4rax8RPMStG+e+wIMlV82PlVfVGREjaYNm7qjNhXYL4zTaBUm4VHkY4Nqk+faGN6Q2Q9Ear9LVY/LQeEGd0udZdWyvpA3eCKnFz5dBPgFrhOiLOUWIgmyJECJJy8DlkdaAjk63jLekef9O7338XCNoZtwyBPVSSGjLXPtY3ppmUGUz7LI4CJg36rK/Gu3lE4NoWjkoSOb2Npn7mJCF6DZQKM9wr49FpPZ5f1A1LmKw0bvRjF52Ks0i4u3we9YUgFH0D38ljO/DEhXUZ0nFSyRBlJBkLhE9+DFNpxcqBol3AMkiuQsnfwer4PrM4+DjE86urQE86D/ZWtLIA4WwHMJEBSWgmeSi+0y/y7p6fM+ghbuyzslgII1xRF7EoMSZYDCf0yLvIY5LboD6GUZNiw6VXphJBE9hF7PjKmb0wg3riXHkG0G0UZS+NVLxMUA7O6vKhQQJq+BGrISdjJPcH6YkPXC4xURzBaeuJYICcgkEaP6c5+GOyWPUvfAQAl0o3wqCioN+mGLFug2+yiq0NU/VAeH7DspkWNK54T4ssZenDT8OdBRMw5P9KuKFd1WVWs7JrPwP9sHZoFAcu7MbMgBNQduh0mxzOr0KaCoiQRUt1EPYNL/sMjOEtIyk8KIi1HDk82G3ysvD+djMz8qugR8ZBJPQFgBXQ==';
 const engineLocation = 'assets/vendor/scandit/';
+
 @NgModule({
   imports: [
     ZXingScannerModule,
     CommonModule,
-    ScanditSdkModule.forRoot(licenseKey, engineLocation)
+    ScanditSdkModule.forRoot(licenseKey, engineLocation),
+    SharedModule
   ],
   exports: [BarcodeSearchComponent],
   declarations: [
@@ -23,6 +27,9 @@ const engineLocation = 'assets/vendor/scandit/';
     BarcodeScannerComponent,
     BarcodeScannerScanditComponent
   ],
-  providers: []
+  providers: [
+    CameraErrorHandler,
+    { provide: ErrorHandler, useExisting: CameraErrorHandler }
+  ]
 })
 export class BarcodeSearchModule {}

src/app/modules/barcode-search/camera-error.handler.ts

@@ -0,0 +1,22 @@
+import { BehaviorSubject } from 'rxjs';
+import { ErrorHandler, Injectable } from '@angular/core';
+
+@Injectable()
+export class CameraErrorHandler extends ErrorHandler {
+  public notAllowed = new BehaviorSubject<boolean>(false);
+  constructor() {
+    super();
+  }
+  handleError(error: any) {
+    try {
+      if (
+        error.message != null &&
+        error.message.indexOf('NotAllowedError') !== -1
+      ) {
+        this.notAllowed.next(true);
+      } else {
+        super.handleError(error);
+      }
+    } catch (e) {}
+  }
+}

src/app/modules/barcode-search/components/barcode-scanner-scandit/barcode-scanner-scandit.component.html

@@ -1,3 +1,6 @@
+<div class="w-100 loading" *ngIf="!ready">
+  <app-loading loading="true" text="Scanvorgang wird ausgeführt"></app-loading>
+</div>
 <div class="w-100" *ngIf="enabled">
   <scandit-sdk-barcode-picker
     #scanner
@@ -27,6 +30,12 @@
   </div>
 </div>
 
-<div class="w-100" *ngIf="error">
-  camera not detected
+<div class="scanner-controls errors" *ngIf="errorOther || errorAccess">
+  <div class="error" *ngIf="errorOther">
+    Scanvorgang leider nicht möglich, da keine Kamera vorhanden
+  </div>
+
+  <div class="error" *ngIf="errorAccess">
+    Kamerazugriff blockiert, daher leider kein Scanvorgang möglich
+  </div>
 </div>

src/app/modules/barcode-search/components/barcode-scanner-scandit/barcode-scanner-scandit.component.scss

@@ -5,11 +5,14 @@
   display: flex;
   position: relative;
 }
-
+.loading {
+  margin-top: 120px;
+}
 .scanner-controls {
   width: 100%;
   height: 100%;
   position: absolute;
+  background: white;
   top: 0;
   left: 0;
 }
@@ -50,3 +53,16 @@
   display: block;
   padding: $buttonSize;
 }
+
+.errors {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+.error {
+  width: 70%;
+  color: #f70300;
+  font-weight: 600;
+  text-align: center;
+}

src/app/modules/barcode-search/components/barcode-scanner-scandit/barcode-scanner-scandit.component.ts

@@ -8,8 +8,12 @@ import {
 } from '@angular/core';
 import { BarcodeFormat, Result } from '@zxing/library';
 import { ZXingScannerComponent } from '@zxing/ngx-scanner';
-import { ScanSettings, Barcode } from 'scandit-sdk';
-import { ScanditSdkBarcodePickerComponent } from 'scandit-sdk-angular';
+import { ScanSettings, Barcode, BarcodePicker } from 'scandit-sdk';
+import {
+  ScanditSdkBarcodePickerComponent,
+  ScanditSdkService
+} from 'scandit-sdk-angular';
+import { CameraErrorHandler } from '../../camera-error.handler';
 
 @Component({
   selector: 'app-barcode-scanner-scandit',
@@ -18,7 +22,8 @@ import { ScanditSdkBarcodePickerComponent } from 'scandit-sdk-angular';
 })
 export class BarcodeScannerScanditComponent implements AfterViewInit {
   public enabled = true;
-  public error = false;
+  public errorAccess = false;
+  public errorOther = false;
   public code = '';
   public ready = false;
   @Output() scan = new EventEmitter();
@@ -29,10 +34,10 @@ export class BarcodeScannerScanditComponent implements AfterViewInit {
 
   @ViewChild('scanner') scanner: ScanditSdkBarcodePickerComponent;
   log = 'tst';
-  constructor() {}
+  constructor(private cameraError: CameraErrorHandler) {}
 
   ngAfterViewInit() {
-    debugger;
+    this.cameraError.notAllowed.subscribe(v => (this.errorAccess = v));
     this.scanner.error.subscribe(
       success => {
         this.scanErrorHandler(success);
@@ -63,6 +68,14 @@ export class BarcodeScannerScanditComponent implements AfterViewInit {
 
   isReady(scanner) {
     this.ready = true;
+    const picker = (this.scanner['scanditSdkService'] as ScanditSdkService)
+      .picker as any;
+    this.errorOther = !picker.scanner.isReadyToWork;
+    picker.cameraManager.cameraSwitcherEnabled = false;
+    picker.cameraManager.triggerFatalError = e => {
+      console.error(e);
+      this.errorOther = true;
+    };
 
     // Remove Scandit logo
     const element = scanner.pickerContainer.nativeElement as Element;
@@ -73,6 +86,6 @@ export class BarcodeScannerScanditComponent implements AfterViewInit {
 
   scanErrorHandler($event) {
     console.error($event);
-    this.error = true;
+    this.errorAccess = true;
   }
 }