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 2 weeks 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 cameraStateListeners: Set<CameraStateListener> = new Set();
private currentState: CameraState = "off"; private currentState: CameraState = "off";
private currentStateMessage?: string; private currentStateMessage?: string;
private options: QRScannerOptions;
constructor(private options?: QRScannerOptions) { constructor(options?: QRScannerOptions) {
// Generate a short random ID for this scanner instance // Generate a short random ID for this scanner instance
this.id = Math.random().toString(36).substring(2, 8).toUpperCase(); this.id = Math.random().toString(36).substring(2, 8).toUpperCase();
this.options = options ?? {};
logger.error( logger.error(
`[WebInlineQRScanner:${this.id}] Initializing scanner with options:`, `[WebInlineQRScanner:${this.id}] Initializing scanner with options:`,
{ {
...options, ...this.options,
buildId: BUILD_ID, buildId: BUILD_ID,
targetFps: this.TARGET_FPS, 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) { if (this.isScanning) {
logger.error(`[WebInlineQRScanner:${this.id}] Scanner already running`); logger.error(`[WebInlineQRScanner:${this.id}] Scanner already running`);
return; return;
} }
// Update options if provided
if (options) {
this.options = { ...this.options, ...options };
}
try { try {
this.isScanning = true; this.isScanning = true;
this.scanAttempts = 0; this.scanAttempts = 0;
this.lastScanTime = Date.now(); this.lastScanTime = Date.now();
this.updateCameraState("initializing", "Starting camera..."); 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( logger.error(
`[WebInlineQRScanner:${this.id}] Requesting camera stream...`, `[WebInlineQRScanner:${this.id}] Requesting camera stream...`,
); );
this.stream = await navigator.mediaDevices.getUserMedia({ this.stream = await navigator.mediaDevices.getUserMedia({
video: { video: {
facingMode: "environment", facingMode: this.options.camera === "front" ? "user" : "environment",
width: { ideal: 1280 }, width: { ideal: 1280 },
height: { ideal: 720 }, height: { ideal: 720 },
}, },
@ -527,11 +534,18 @@ export class WebInlineQRScanner implements QRScannerService {
label: t.label, label: t.label,
readyState: t.readyState, readyState: t.readyState,
})), })),
options: this.options,
}); });
// Set up video element // Set up video element
if (this.video) { if (this.video) {
this.video.srcObject = this.stream; 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(); await this.video.play();
logger.error( logger.error(
`[WebInlineQRScanner:${this.id}] Video element started playing`, `[WebInlineQRScanner:${this.id}] Video element started playing`,

Loading…
Cancel
Save