Add fallback locator point recenter

src/index.ts

@@ -24,34 +24,35 @@ export interface QRCode {
 }
 
 function scan(matrix: BitMatrix): QRCode | null {
-  const location = locate(matrix);
-  if (!location) {
+  const locations = locate(matrix);
+  if (!locations) {
     return null;
   }
-  const extracted = extract(matrix, location);
-  const decoded = decode(extracted.matrix);
 
-  if (!decoded) {
-    return null;
-  }
-
-  return {
-    binaryData: decoded.bytes,
-    data: decoded.text,
-    chunks: decoded.chunks,
-    location: {
-      topRightCorner: extracted.mappingFunction(location.dimension, 0),
-      topLeftCorner: extracted.mappingFunction(0, 0),
-      bottomRightCorner: extracted.mappingFunction(location.dimension, location.dimension),
-      bottomLeftCorner: extracted.mappingFunction(0, location.dimension),
+  for (const location of locations) {
+    const extracted = extract(matrix, location);
+    const decoded = decode(extracted.matrix);
+    if (decoded) {
+      return {
+        binaryData: decoded.bytes,
+        data: decoded.text,
+        chunks: decoded.chunks,
+        location: {
+          topRightCorner: extracted.mappingFunction(location.dimension, 0),
+          topLeftCorner: extracted.mappingFunction(0, 0),
+          bottomRightCorner: extracted.mappingFunction(location.dimension, location.dimension),
+          bottomLeftCorner: extracted.mappingFunction(0, location.dimension),
 
-      topRightFinderPattern: location.topRight,
-      topLeftFinderPattern: location.topLeft,
-      bottomLeftFinderPattern: location.bottomLeft,
+          topRightFinderPattern: location.topRight,
+          topLeftFinderPattern: location.topLeft,
+          bottomLeftFinderPattern: location.bottomLeft,
 
-      bottomRightAlignmentPattern: location.alignmentPattern,
-    },
-  };
+          bottomRightAlignmentPattern: location.alignmentPattern,
+        },
+      };
+    }
+  }
+  return null;
 }
 
 export interface Options {

src/locator/index.ts

@@ -212,6 +212,30 @@ function scorePattern(point: Point, ratios: number[], matrix: BitMatrix) {
   }
 }
 
+function recenterLocation(matrix: BitMatrix, p: Point): Point {
+  let leftX = Math.round(p.x);
+  while (matrix.get(leftX, Math.round(p.y))) {
+    leftX--;
+  }
+  let rightX = Math.round(p.x);
+  while (matrix.get(rightX, Math.round(p.y))) {
+    rightX++;
+  }
+  const x = (leftX + rightX) / 2;
+
+  let topY = Math.round(p.y);
+  while (matrix.get(Math.round(x), topY)) {
+    topY--;
+  }
+  let bottomY = Math.round(p.y);
+  while (matrix.get(Math.round(x), bottomY)) {
+    bottomY++;
+  }
+  const y = (topY + bottomY) / 2;
+
+  return { x, y };
+}
+
 interface Quad {
   top: {
     startX: number;
@@ -225,7 +249,7 @@ interface Quad {
   };
 }
 
-export function locate(matrix: BitMatrix): QRLocation {
+export function locate(matrix: BitMatrix): QRLocation[] {
   const finderPatternQuads: Quad[] = [];
   let activeFinderPatternQuads: Quad[] = [];
   const alignmentPatternQuads: Quad[] = [];
@@ -361,7 +385,45 @@ export function locate(matrix: BitMatrix): QRLocation {
   const { topRight, topLeft, bottomLeft } = reorderFinderPatterns(
     finderPatternGroups[0].points[0], finderPatternGroups[0].points[1], finderPatternGroups[0].points[2],
   );
+  const alignment = findAlignmentPattern(matrix, alignmentPatternQuads, topRight, topLeft, bottomLeft);
+  const result: QRLocation[] = [];
+  if (alignment) {
+    result.push({
+      alignmentPattern: { x: alignment.alignmentPattern.x, y: alignment.alignmentPattern.y },
+      bottomLeft: {x: bottomLeft.x, y: bottomLeft.y },
+      dimension: alignment.dimension,
+      topLeft: {x: topLeft.x, y: topLeft.y },
+      topRight: {x: topRight.x, y: topRight.y },
+    });
+  }
 
+  // We normally use the center of the quads as the location of the tracking points, which is optimal for most cases and will account
+  // for a skew in the image. However, In some cases, a slight skew might not be real and instead be caused by image compression
+  // errors and/or low resolution. For those cases, we'd be better off centering the point exactly in the middle of the black area. We
+  // compute and return the location data for the naively centered points as it is little additional work and allows for multiple
+  // attempts at decoding harder images.
+  const midTopRight = recenterLocation(matrix, topRight);
+  const midTopLeft = recenterLocation(matrix, topLeft);
+  const midBottomLeft = recenterLocation(matrix, bottomLeft);
+  const centeredAlignment = findAlignmentPattern(matrix, alignmentPatternQuads, midTopRight, midTopLeft, midBottomLeft);
+  if (centeredAlignment) {
+    result.push({
+      alignmentPattern: { x: centeredAlignment.alignmentPattern.x, y: centeredAlignment.alignmentPattern.y },
+      bottomLeft: { x: midBottomLeft.x, y: midBottomLeft. y },
+      topLeft: { x: midTopLeft.x, y: midTopLeft. y },
+      topRight: { x: midTopRight.x, y: midTopRight. y },
+      dimension: centeredAlignment.dimension,
+    });
+  }
+
+  if (result.length === 0) {
+    return null;
+  }
+
+  return result;
+}
+
+function findAlignmentPattern(matrix: BitMatrix, alignmentPatternQuads: Quad[], topRight: Point, topLeft: Point, bottomLeft: Point) {
   // Now that we've found the three finder patterns we can determine the blockSize and the size of the QR code.
   // We'll use these to help find the alignment pattern but also later when we do the extraction.
   let dimension: number;
@@ -405,11 +467,5 @@ export function locate(matrix: BitMatrix): QRLocation {
   // so we can only use our best guess.
   const alignmentPattern = modulesBetweenFinderPatterns >= 15 && alignmentPatterns.length ? alignmentPatterns[0] : expectedAlignmentPattern;
 
-  return {
-    alignmentPattern: { x: alignmentPattern.x, y: alignmentPattern.y },
-    bottomLeft: {x: bottomLeft.x, y: bottomLeft.y },
-    dimension,
-    topLeft: {x: topLeft.x, y: topLeft.y },
-    topRight: {x: topRight.x, y: topRight.y },
-  };
+  return { alignmentPattern, dimension };
 }

src/locator/test.ts

@@ -10,7 +10,7 @@ describe("locate", () => {
 
   it('locates a "perfect" image', async () => {
     const binarized = await loadBinarized("./src/locator/test-data/perfect.png");
-    expect(locate(binarized)).toEqual({
+    expect(locate(binarized)[0]).toEqual({
       alignmentPattern: {x: 170.5, y: 170.5},
       bottomLeft: {x: 3.5, y: 173.5},
       dimension: 177,
@@ -21,7 +21,7 @@ describe("locate", () => {
 
   it("locates a QR in a real world image", async () => {
     const binarized = await loadBinarized("./src/locator/test-data/real-world.png");
-    expect(locate(binarized)).toEqual({
+    expect(locate(binarized)[0]).toEqual({
       alignmentPattern: { x: 264.25, y: 177 },
       bottomLeft: { x: 195.5, y: 191.5 },
       dimension: 33,
@@ -32,7 +32,7 @@ describe("locate", () => {
 
   it("locates a small QR code in real world photo", async () => {
     const binarized = await loadBinarized("./src/locator/test-data/small-photo.png");
-    expect(locate(binarized)).toEqual({
+    expect(locate(binarized)[0]).toEqual({
       alignmentPattern: { x: 103, y: 147.5 },
       bottomLeft: { x: 73.5, y: 152 },
       dimension: 29,
@@ -43,7 +43,7 @@ describe("locate", () => {
 
   it("locates a extremely distored QR code", async () => {
     const binarized = await loadBinarized("./src/locator/test-data/distorted-extreme.png");
-    expect(locate(binarized)).toEqual({
+    expect(locate(binarized)[0]).toEqual({
       alignmentPattern: { x: 164.5, y: 39 },
       bottomLeft: { x: 221.5, y: 18.5 },
       dimension: 25,
@@ -54,7 +54,7 @@ describe("locate", () => {
 
   it("locates a damaged QR code and guesses the finder pattern location", async () => {
     const binarized = await loadBinarized("./src/locator/test-data/damaged.png");
-    expect(locate(binarized)).toEqual({
+    expect(locate(binarized)[0]).toEqual({
       alignmentPattern: { x: 219.75, y: 221 },
       bottomLeft: { x: 81.5, y: 215.5 },
       dimension: 29,
@@ -65,7 +65,7 @@ describe("locate", () => {
 
   it("locates a damaged QR code and guesses the finder pattern location", async () => {
     const binarized = await loadBinarized("./src/locator/test-data/damaged.png");
-    expect(locate(binarized)).toEqual({
+    expect(locate(binarized)[0]).toEqual({
       alignmentPattern: { x: 219.75, y: 221 },
       bottomLeft: { x: 81.5, y: 215.5 },
       dimension: 29,
@@ -79,4 +79,15 @@ describe("locate", () => {
     const binarized = await loadBinarized("./src/locator/test-data/malformed-infinity.png");
     expect(locate(binarized)).toEqual(null);
   });
+
+  it("returns a centered alignment as a fallback", async () => {
+    const binarized = await loadBinarized("./src/locator/test-data/odd-skew.png");
+    expect(locate(binarized)[1]).toEqual({
+      alignmentPattern: { x: 163.5, y: 170 },
+      bottomLeft: { x: 56.5, y: 185.5 },
+      dimension: 29,
+      topLeft: { x: 57, y: 60 },
+      topRight: { x: 185.5, y: 57.5 },
+    });
+  });
 });

tests/end-to-end/148/output.json

@@ -1 +1,55 @@
-null
+{
+  "binaryData": [
+    49,
+    50,
+    51,
+    52,
+    53,
+    54,
+    55,
+    56,
+    57,
+    48
+  ],
+  "data": "1234567890",
+  "chunks": [
+    {
+      "type": "numeric",
+      "text": "1234567890"
+    }
+  ],
+  "location": {
+    "topRightCorner": {
+      "x": 263.49999999999994,
+      "y": 291.375
+    },
+    "topLeftCorner": {
+      "x": 290.79762807324306,
+      "y": 234.26604686604492
+    },
+    "bottomRightCorner": {
+      "x": 207.9274477212262,
+      "y": 264.60245217347966
+    },
+    "bottomLeftCorner": {
+      "x": 233.49999999999997,
+      "y": 208.125
+    },
+    "topRightFinderPattern": {
+      "x": 258.5,
+      "y": 277.5
+    },
+    "topLeftFinderPattern": {
+      "x": 276.5,
+      "y": 239.5
+    },
+    "bottomLeftFinderPattern": {
+      "x": 238.5,
+      "y": 222
+    },
+    "bottomRightAlignmentPattern": {
+      "x": 232.84618068755663,
+      "y": 255.48041599830515
+    }
+  }
+}