From 6df407903d72a263c43fa44bb71cad88a6c341b6 Mon Sep 17 00:00:00 2001
From: Lewis Youl <lewis.youl@trustflight.com>
Date: Wed, 27 Dec 2023 09:54:43 +0000
Subject: [PATCH] feat: add diamond dot type

---
 src/constants/dotTypes.ts    |  3 ++-
 src/core/QRSVG.ts            |  4 +++-
 src/figures/dot/svg/QRDot.ts | 21 ++++++++++++++++++++-
 src/index.html               |  4 ++--
 src/types/index.ts           |  2 +-
 5 files changed, 28 insertions(+), 6 deletions(-)

diff --git a/src/constants/dotTypes.ts b/src/constants/dotTypes.ts
index 26d4f498..dfd2a7e3 100644
--- a/src/constants/dotTypes.ts
+++ b/src/constants/dotTypes.ts
@@ -6,5 +6,6 @@ export default {
   classy: "classy",
   classyRounded: "classy-rounded",
   square: "square",
-  extraRounded: "extra-rounded"
+  extraRounded: "extra-rounded",
+  diamond: "diamond"
 } as DotTypes;
diff --git a/src/core/QRSVG.ts b/src/core/QRSVG.ts
index 93656a0a..abe065c0 100644
--- a/src/core/QRSVG.ts
+++ b/src/core/QRSVG.ts
@@ -318,7 +318,9 @@ export default class QRSVG {
           cornersDotClipPath.appendChild(cornersDot._element);
         }
       } else {
-        const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type });
+        // const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type });
+        const dotType = options.dotsOptions.type === "diamond" ? "square" : options.dotsOptions.type;
+        const dot = new QRDot({ svg: this._element, type: dotType });
 
         for (let i = 0; i < dotMask.length; i++) {
           for (let j = 0; j < dotMask[i].length; j++) {
diff --git a/src/figures/dot/svg/QRDot.ts b/src/figures/dot/svg/QRDot.ts
index e12cddf5..17193be3 100644
--- a/src/figures/dot/svg/QRDot.ts
+++ b/src/figures/dot/svg/QRDot.ts
@@ -31,6 +31,9 @@ export default class QRDot {
       case dotTypes.extraRounded:
         drawFunction = this._drawExtraRounded;
         break;
+      case dotTypes.diamond:
+        drawFunction = this._drawDiamond;
+        break;
       case dotTypes.square:
       default:
         drawFunction = this._drawSquare;
@@ -44,7 +47,14 @@ export default class QRDot {
     const cy = y + size / 2;
 
     draw();
-    this._element?.setAttribute("transform", `rotate(${(180 * rotation) / Math.PI},${cx},${cy})`);
+
+    let rotationAttr = `rotate(${(180 * rotation) / Math.PI},${cx},${cy})`;
+
+    if (this._type === "diamond") {
+      rotationAttr = `rotate(${rotation},${cx},${cy})`;
+    }
+
+    this._element?.setAttribute("transform", rotationAttr);
   }
 
   _basicDot(args: BasicFigureDrawArgs): void {
@@ -160,9 +170,18 @@ export default class QRDot {
   }
 
   _drawSquare({ x, y, size }: DrawArgs): void {
+    // console.log('draw sq')
     this._basicSquare({ x, y, size, rotation: 0 });
   }
 
+  _drawDiamond({ x, y, size }: DrawArgs): void {
+    x = x + 4;
+    y = y + 4;
+    size = size - 8;
+
+    this._basicSquare({ x, y, size, rotation: 45 });
+  }
+
   _drawRounded({ x, y, size, getNeighbor }: DrawArgs): void {
     const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
     const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
diff --git a/src/index.html b/src/index.html
index 44dcc685..bc2ceb6f 100644
--- a/src/index.html
+++ b/src/index.html
@@ -14,7 +14,7 @@
               data: "h",
               image: "https://upload.wikimedia.org/wikipedia/commons/5/51/Facebook_f_logo_%282019%29.svg",
               dotsOptions: {
-                type: "extra-rounded",
+                type: "diamond",
                 gradient: {
                   type: "linear", //radial,
                   rotation: Math.PI/2,
@@ -46,7 +46,7 @@
             type: 'svg',
           });
 
-            qrCode.append(document.getElementById("canvas"));
+            // qrCode.append(document.getElementById("canvas"));
             qrCode2.append(document.getElementById("canvas2"));
 
             // qrCode2.download()
diff --git a/src/types/index.ts b/src/types/index.ts
index 39ef2f82..fbdb6903 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -3,7 +3,7 @@ export interface UnknownObject {
   [key: string]: any;
 }
 
-export type DotType = "dots" | "rounded" | "classy" | "classy-rounded" | "square" | "extra-rounded";
+export type DotType = "dots" | "rounded" | "classy" | "classy-rounded" | "square" | "extra-rounded" | "diamond";
 export type CornerDotType = "dot" | "square";
 export type CornerSquareType = "dot" | "square" | "extra-rounded";
 export type Extension = "svg" | "png" | "jpeg" | "webp";