sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-28 22:42:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

Zxing ask for camera permission

Browse Source
This commit is contained in:
Lorenz Hilpert
2022-05-31 15:55:04 +02:00
parent acb76c1384
commit a27a0c8b9c
1 changed files with 54 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
apps/adapter/scan/src/lib/zxing-modal/zxing-modal.component.ts
View File

@@ -1,5 +1,5 @@
import { Component, ChangeDetectionStrategy, ViewChild, ElementRef, AfterViewInit, NgZone, Inject, OnDestroy, OnInit } from '@angular/core'; import { Component, ChangeDetectionStrategy, ViewChild, ElementRef, AfterViewInit, NgZone, Inject, OnDestroy, OnInit } from '@angular/core';
import { UiModalRef, UiModalService } from '@ui/modal'; import { UiMessageModalComponent, UiModalRef, UiModalService } from '@ui/modal';
import { BarcodeFormat, DecodeHintType, BrowserMultiFormatReader } from '@zxing/library'; import { BarcodeFormat, DecodeHintType, BrowserMultiFormatReader } from '@zxing/library';
import { BehaviorSubject, from, ReplaySubject, Subject } from 'rxjs'; import { BehaviorSubject, from, ReplaySubject, Subject } from 'rxjs';
import { filter, takeUntil, tap } from 'rxjs/operators'; import { filter, takeUntil, tap } from 'rxjs/operators';
@@ -27,45 +27,65 @@ export class ZxingModalComponent implements OnInit, OnDestroy {
constructor(private _modalRef: UiModalRef, private readonly _zone: NgZone, private readonly _modal: UiModalService) {} constructor(private _modalRef: UiModalRef, private readonly _zone: NgZone, private readonly _modal: UiModalService) {}
ngOnInit(): void { async ngOnInit() {
const hints = new Map<DecodeHintType, any>(); try {
const mediaStream: MediaStream = await navigator.mediaDevices.getUserMedia({ video: true, audio: false });
mediaStream.getVideoTracks().forEach((track) => track.stop());
const formats = [ const hints = new Map<DecodeHintType, any>();
BarcodeFormat.EAN_8,
BarcodeFormat.EAN_13,
BarcodeFormat.UPC_A,
BarcodeFormat.UPC_E,
BarcodeFormat.CODE_128,
BarcodeFormat.CODE_39,
BarcodeFormat.CODE_93,
BarcodeFormat.ITF,
BarcodeFormat.QR_CODE,
];
hints.set(DecodeHintType.POSSIBLE_FORMATS, formats); const formats = [
BarcodeFormat.EAN_8,
BarcodeFormat.EAN_13,
BarcodeFormat.UPC_A,
BarcodeFormat.UPC_E,
BarcodeFormat.CODE_128,
BarcodeFormat.CODE_39,
BarcodeFormat.CODE_93,
BarcodeFormat.ITF,
BarcodeFormat.QR_CODE,
];
this._reader = new BrowserMultiFormatReader(hints, 1000); hints.set(DecodeHintType.POSSIBLE_FORMATS, formats);
from(this._reader.listVideoInputDevices()).subscribe((devices) => { this._reader = new BrowserMultiFormatReader(hints, 1000);
this.devices$.next(devices);
this.selectedDevice$.next(devices[0].deviceId);
});
this.selectedDevice$ from(this._reader.listVideoInputDevices()).subscribe((devices) => {
.pipe( this.devices$.next(devices);
takeUntil(this._onDestroy$), this.selectedDevice$.next(devices[0].deviceId);
filter((v) => !!v),
tap(() => {
this._reader?.reset();
})
)
.subscribe((device) => {
this._reader.decodeFromVideoDevice(device, this.scanContainer.nativeElement, (result) => {
if (result) {
this._modalRef.close(result.getText());
}
});
}); });
this.selectedDevice$
.pipe(
takeUntil(this._onDestroy$),
filter((v) => !!v),
tap(() => {
this._reader?.reset();
})
)
.subscribe((device) => {
this._reader.decodeFromVideoDevice(device, this.scanContainer.nativeElement, (result) => {
if (result) {
this._modalRef.close(result.getText());
}
});
});
} catch (error) {
this.cancel();
this._modal
.open({
content: UiMessageModalComponent,
data: {
message: `
Scanner kann nicht aktiviert werden.
Bitte stellen Sie sicher, dass der zugriff auf die Kamera erlaubt ist.
`,
},
})
.afterClosed$.subscribe(() => {
this.cancel();
});
}
} }
cancel() { cancel() {