jsnbuchanan/crowd-funder-for-time-pwa
1
0
Fork 1
forked from trent_larson/crowd-funder-for-time-pwa
Code Issues Pull Requests Projects Releases Wiki Activity

update with lint-fix

Browse Source
This commit is contained in:
Trent Larson
2025-05-13 20:11:34 -06:00
parent c4a331d0e2
commit 3600e894d4
4 changed files with 66 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
src/services/QRScanner/WebInlineQRScanner.ts
View File

@@ -159,7 +159,9 @@ export class WebInlineQRScanner implements QRScannerService {
async isSupported(): Promise<boolean> {
try {
logger.error(`[WebInlineQRScanner:${this.id}] Checking browser support...`);
logger.error(
`[WebInlineQRScanner:${this.id}] Checking browser support...`,
);
// Check for secure context first
if (!window.isSecureContext) {
logger.error(
@@ -279,51 +281,63 @@ export class WebInlineQRScanner implements QRScannerService {
// Scan for QR code
const code = jsQR(imageData.data, imageData.width, imageData.height, {
inversionAttempts: "attemptBoth", // Try both normal and inverted
inversionAttempts: "attemptBoth", // Try both normal and inverted
});
if (code) {
// Check if the QR code is blurry by examining the location points
const { topRightCorner, topLeftCorner, bottomLeftCorner } = code.location;
const { topRightCorner, topLeftCorner, bottomLeftCorner } =
code.location;
const width = Math.sqrt(
Math.pow(topRightCorner.x - topLeftCorner.x, 2) + Math.pow(topRightCorner.y - topLeftCorner.y, 2)
Math.pow(topRightCorner.x - topLeftCorner.x, 2) +
Math.pow(topRightCorner.y - topLeftCorner.y, 2),
);
const height = Math.sqrt(
Math.pow(bottomLeftCorner.x - topLeftCorner.x, 2) + Math.pow(bottomLeftCorner.y - topLeftCorner.y, 2)
Math.pow(bottomLeftCorner.x - topLeftCorner.x, 2) +
Math.pow(bottomLeftCorner.y - topLeftCorner.y, 2),
);
// Adjust minimum size based on canvas dimensions
const minSize = Math.min(this.canvas.width, this.canvas.height) * 0.1; // 10% of the smaller dimension
const isBlurry = width < minSize || height < minSize ||
!code.data || code.data.length === 0;
const isBlurry =
width < minSize ||
height < minSize ||
!code.data ||
code.data.length === 0;
logger.error(`[WebInlineQRScanner:${this.id}] QR Code detected:`, {
data: code.data,
location: code.location,
attempts: this.scanAttempts,
isBlurry,
dimensions: {
width,
height,
dimensions: {
width,
height,
minSize,
canvasWidth: this.canvas.width,
canvasHeight: this.canvas.height,
relativeWidth: width / this.canvas.width,
relativeHeight: height / this.canvas.height
relativeHeight: height / this.canvas.height,
},
corners: {
topLeft: topLeftCorner,
topRight: topRightCorner,
bottomLeft: bottomLeftCorner
}
bottomLeft: bottomLeftCorner,
},
});
if (isBlurry) {
if (this.scanListener?.onError) {
this.scanListener.onError(new Error("QR code detected but too blurry to read. Please hold the camera steady and ensure the QR code is well-lit."));
this.scanListener.onError(
new Error(
"QR code detected but too blurry to read. Please hold the camera steady and ensure the QR code is well-lit.",
),
);
}
// Continue scanning if QR code is blurry
this.animationFrameId = requestAnimationFrame(() => this.scanQRCode());
this.animationFrameId = requestAnimationFrame(() =>
this.scanQRCode(),
);
return;
}
@@ -342,17 +356,21 @@ export class WebInlineQRScanner implements QRScannerService {
error: error instanceof Error ? error.message : String(error),
stack: error instanceof Error ? error.stack : undefined,
attempt: this.scanAttempts,
videoState: this.video ? {
readyState: this.video.readyState,
paused: this.video.paused,
ended: this.video.ended,
width: this.video.videoWidth,
height: this.video.videoHeight
} : null,
canvasState: this.canvas ? {
width: this.canvas.width,
height: this.canvas.height
} : null
videoState: this.video
? {
readyState: this.video.readyState,
paused: this.video.paused,
ended: this.video.ended,
width: this.video.videoWidth,
height: this.video.videoHeight,
}
: null,
canvasState: this.canvas
? {
width: this.canvas.width,
height: this.canvas.height,
}
: null,
});
if (this.scanListener?.onError) {
this.scanListener.onError(
@@ -375,7 +393,9 @@ export class WebInlineQRScanner implements QRScannerService {
logger.error(`[WebInlineQRScanner:${this.id}] Starting scan`);
// Get camera stream
logger.error(`[WebInlineQRScanner:${this.id}] Requesting camera stream...`);
logger.error(
`[WebInlineQRScanner:${this.id}] Requesting camera stream...`,
);
this.stream = await navigator.mediaDevices.getUserMedia({
video: {
facingMode: "environment",
@@ -441,7 +461,9 @@ export class WebInlineQRScanner implements QRScannerService {
if (this.animationFrameId !== null) {
cancelAnimationFrame(this.animationFrameId);
this.animationFrameId = null;
logger.error(`[WebInlineQRScanner:${this.id}] Animation frame cancelled`);
logger.error(
`[WebInlineQRScanner:${this.id}] Animation frame cancelled`,
);
}
// Stop video
@@ -490,7 +512,9 @@ export class WebInlineQRScanner implements QRScannerService {
}
onStream(callback: (stream: MediaStream | null) => void): void {
logger.error(`[WebInlineQRScanner:${this.id}] Adding stream event listener`);
logger.error(
`[WebInlineQRScanner:${this.id}] Adding stream event listener`,
);
this.events.on("stream", callback);
}