Browse Source

feat(QRScanner): implement QRScannerOptions in WebInlineQRScanner

- Add proper handling of QRScannerOptions in startScan method
- Implement camera selection (front/back) via options.camera
- Add video preview toggle via options.showPreview
- Store options as class property for persistence
- Improve logging with options context
- Fix TypeScript error for unused options parameter

This change makes the QR scanner more configurable and properly
implements the QRScannerService interface contract.
pull/137/head
Matthew Raymer 1 week ago
parent
commit
082f8c0126
  1. 26
      src/services/QRScanner/WebInlineQRScanner.ts

26
src/services/QRScanner/WebInlineQRScanner.ts

@ -30,14 +30,16 @@ export class WebInlineQRScanner implements QRScannerService {
private cameraStateListeners: Set<CameraStateListener> = new Set();
private currentState: CameraState = "off";
private currentStateMessage?: string;
private options: QRScannerOptions;
constructor(private options?: QRScannerOptions) {
constructor(options?: QRScannerOptions) {
// Generate a short random ID for this scanner instance
this.id = Math.random().toString(36).substring(2, 8).toUpperCase();
this.options = options ?? {};
logger.error(
`[WebInlineQRScanner:${this.id}] Initializing scanner with options:`,
{
...options,
...this.options,
buildId: BUILD_ID,
targetFps: this.TARGET_FPS,
},
@ -494,26 +496,31 @@ export class WebInlineQRScanner implements QRScannerService {
}
}
async startScan(): Promise<void> {
async startScan(options?: QRScannerOptions): Promise<void> {
if (this.isScanning) {
logger.error(`[WebInlineQRScanner:${this.id}] Scanner already running`);
return;
}
// Update options if provided
if (options) {
this.options = { ...this.options, ...options };
}
try {
this.isScanning = true;
this.scanAttempts = 0;
this.lastScanTime = Date.now();
this.updateCameraState("initializing", "Starting camera...");
logger.error(`[WebInlineQRScanner:${this.id}] Starting scan`);
logger.error(`[WebInlineQRScanner:${this.id}] Starting scan with options:`, this.options);
// Get camera stream
// Get camera stream with options
logger.error(
`[WebInlineQRScanner:${this.id}] Requesting camera stream...`,
);
this.stream = await navigator.mediaDevices.getUserMedia({
video: {
facingMode: "environment",
facingMode: this.options.camera === "front" ? "user" : "environment",
width: { ideal: 1280 },
height: { ideal: 720 },
},
@ -527,11 +534,18 @@ export class WebInlineQRScanner implements QRScannerService {
label: t.label,
readyState: t.readyState,
})),
options: this.options,
});
// Set up video element
if (this.video) {
this.video.srcObject = this.stream;
// Only show preview if showPreview is true
if (this.options.showPreview) {
this.video.style.display = "block";
} else {
this.video.style.display = "none";
}
await this.video.play();
logger.error(
`[WebInlineQRScanner:${this.id}] Video element started playing`,

Loading…
Cancel
Save