@liquid-js/qr-code-styling 5.0.0-3 → 5.0.0-5

package/lib/qr-code-styling-node.js

@@ -50,7 +50,8 @@ function sanitizeGradient(gradient) {
     DotType.square = "square", DotType.smallSquare = "small-square", DotType.tinySquare = "tiny-square", 
     DotType.diamond = "diamond", DotType.wave = "wave", DotType.heart = "heart", DotType.star = "star", 
     DotType.weave = "weave", DotType.pentagon = "pentagon", DotType.hexagon = "hexagon", 
-    DotType.zebraHorizontal = "zebra-horizontal", DotType.zebraVertical = "zebra-vertical";
+    DotType.zebraHorizontal = "zebra-horizontal", DotType.zebraVertical = "zebra-vertical", 
+    DotType.blocksHorizontal = "blocks-horizontal", DotType.blocksVertical = "blocks-vertical";
 }(DotType || (DotType = {})), function(CornerDotType) {
     CornerDotType.dot = "dot", CornerDotType.square = "square", CornerDotType.heart = "heart", 
     CornerDotType.extraRounded = "extra-rounded", CornerDotType.classy = "classy", CornerDotType.inpoint = "inpoint", 
@@ -175,7 +176,7 @@ let DotElements = {
         return element.setAttribute("d", svgPath`M ${x} ${y} v ${size} h ${size} a ${size} ${size} 0 0 0 ${-size} ${-size} z`), 
         element;
     },
-    cornersRounded: args => {
+    classyDot: args => {
         const {size, x, y, document} = args, element = document.createElementNS("http://www.w3.org/2000/svg", "path");
         return element.setAttribute("d", svgPath`M ${x} ${y} v ${size / 2} a ${size / 2} ${size / 2} 0 0 0 ${size / 2} ${size / 2} h ${size / 2} v ${-size / 2} a ${size / 2} ${size / 2} 0 0 0 ${-size / 2} ${-size / 2} z`), 
         element;
@@ -337,8 +338,8 @@ let SquareElements = {
     [CornerSquareType.centerCircle]: args => SquareElements.centerCircle(args)
 };
 
-let compoundDots_rounded = ({x, y, size, document, getNeighbor}, {corner = DotElements.cornerRounded, end = DotElements.sideRounded} = {}) => {
-    const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0, rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0, topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0, bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0, neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
+function roundedCorners({x, y, size, document, getNeighbor}, {corner = DotElements.cornerRounded, end = DotElements.sideRounded} = {}) {
+    let leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0, rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0, topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0, bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0, neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
     if (0 === neighborsCount) return DotElements.dot({
         x,
         y,
@@ -375,15 +376,17 @@ let compoundDots_rounded = ({x, y, size, document, getNeighbor}, {corner = DotEl
             draw: end
         });
     }
-}, compoundDots_classy = ({x, y, size, document, getNeighbor}, {corner = DotElements.cornerRounded} = {}) => {
-    const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0, rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0, topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0, bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
+}
+
+function classy({x, y, size, document, getNeighbor}, {corner = DotElements.cornerRounded} = {}) {
+    let leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0, rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0, topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0, bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
     return 0 === leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor ? rotateFigure({
         x,
         y,
         size,
         rotation: Math.PI / 2,
         document,
-        draw: DotElements.cornersRounded
+        draw: DotElements.classyDot
     }) : leftNeighbor || topNeighbor ? rightNeighbor || bottomNeighbor ? DotElements.square({
         x,
         y,
@@ -404,8 +407,10 @@ let compoundDots_rounded = ({x, y, size, document, getNeighbor}, {corner = DotEl
         document,
         draw: corner
     });
-}, compoundDots_line = ({x, y, size, document, getNeighbor}, {stripe = size, rotation = 0} = {}) => {
-    const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0, bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
+}
+
+function stripes({x, y, size, document, getNeighbor}, {stripe = size, rotation = 0, endpoint = DotElements.sideRounded, dot = DotElements.dot} = {}) {
+    let topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0, bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
     return topNeighbor && bottomNeighbor ? rotateFigure({
         x,
         y,
@@ -426,7 +431,7 @@ let compoundDots_rounded = ({x, y, size, document, getNeighbor}, {corner = DotEl
         size,
         rotation,
         document,
-        draw: args => DotElements.sideRounded(args, {
+        draw: args => endpoint(args, {
             height: stripe
         })
     })) : bottomNeighbor && !topNeighbor ? (rotation -= Math.PI / 2, rotateFigure({
@@ -435,7 +440,7 @@ let compoundDots_rounded = ({x, y, size, document, getNeighbor}, {corner = DotEl
         size,
         rotation,
         document,
-        draw: args => DotElements.sideRounded(args, {
+        draw: args => endpoint(args, {
             height: stripe
         })
     })) : rotateFigure({
@@ -444,35 +449,39 @@ let compoundDots_rounded = ({x, y, size, document, getNeighbor}, {corner = DotEl
         size,
         rotation,
         document,
-        draw: _ => DotElements.dot({
+        draw: _ => dot({
             x: x + (size - stripe) / 2,
             y: y + (size - stripe) / 2,
             size: stripe,
             document
         })
     });
-}, qrDotFigures = {
+}
+
+let qrDotFigures = {
     [DotType.dot]: args => DotElements.dot(args),
-    [DotType.randomDot]: ({size, ...args}) => {
-        const randomFactor = .25 * Math.random() + .75;
+    [DotType.randomDot]: ({size, x, y, getPRandom, ...args}) => {
+        const rnd = getPRandom || Math.random, randomFactor = .25 * rnd() + .75;
         return DotElements.dot({
             ...args,
-            size: size * randomFactor
+            size: size * randomFactor,
+            x: x + size * rnd() * (1 - randomFactor),
+            y: y + size * rnd() * (1 - randomFactor)
         });
     },
-    [DotType.rounded]: args => compoundDots_rounded(args),
-    [DotType.extraRounded]: args => compoundDots_rounded(args, {
+    [DotType.rounded]: args => roundedCorners(args),
+    [DotType.extraRounded]: args => roundedCorners(args, {
         corner: DotElements.cornerExtraRounded
     }),
-    [DotType.verticalLine]: args => compoundDots_line(args),
-    [DotType.horizontalLine]: ({getNeighbor, ...args}) => compoundDots_line({
+    [DotType.verticalLine]: args => stripes(args),
+    [DotType.horizontalLine]: ({getNeighbor, ...args}) => stripes({
         ...args,
         getNeighbor: getNeighbor ? (x, y) => getNeighbor(y, x) : void 0
     }, {
         rotation: -Math.PI / 2
     }),
-    [DotType.classy]: args => compoundDots_classy(args),
-    [DotType.classyRounded]: args => compoundDots_classy(args, {
+    [DotType.classy]: args => classy(args),
+    [DotType.classyRounded]: args => classy(args, {
         corner: DotElements.cornerExtraRounded
     }),
     [DotType.square]: args => DotElements.square(args),
@@ -496,7 +505,7 @@ let compoundDots_rounded = ({x, y, size, document, getNeighbor}, {corner = DotEl
             height: .85 * args2.size
         })
     }),
-    [DotType.wave]: args => compoundDots_rounded(args, {
+    [DotType.wave]: args => roundedCorners(args, {
         corner: DotElements.cornerExtraRounded,
         end: DotElements.wave
     }),
@@ -513,15 +522,63 @@ let compoundDots_rounded = ({x, y, size, document, getNeighbor}, {corner = DotEl
         outerRadius: args.size / 2,
         innerRadius: args.size / 2
     }),
-    [DotType.zebraVertical]: args => compoundDots_line(args, {
+    [DotType.zebraVertical]: args => stripes(args, {
         stripe: .8 * args.size
     }),
-    [DotType.zebraHorizontal]: ({getNeighbor, ...args}) => compoundDots_line({
+    [DotType.zebraHorizontal]: ({getNeighbor, ...args}) => stripes({
         ...args,
         getNeighbor: getNeighbor ? (x, y) => getNeighbor(y, x) : void 0
     }, {
         stripe: .8 * args.size,
         rotation: -Math.PI / 2
+    }),
+    [DotType.blocksVertical]: args => stripes(args, {
+        stripe: .8 * args.size,
+        endpoint: (_args, _params) => {
+            const rnd = args.getPRandom || Math.random, width = args.size * (1 - .25 * rnd()), x = args.x - (args.size - width) / 2;
+            return DotElements.square({
+                ..._args,
+                x
+            }, {
+                ..._params,
+                width
+            });
+        },
+        dot: _args => {
+            const rnd = args.getPRandom || Math.random, height = args.size * (1 - .25 * rnd()), y = args.y + (args.size - height) * rnd();
+            return DotElements.square({
+                ..._args,
+                y
+            }, {
+                height
+            });
+        }
+    }),
+    [DotType.blocksHorizontal]: ({getNeighbor, ...args}) => stripes({
+        ...args,
+        getNeighbor: getNeighbor ? (x, y) => getNeighbor(y, x) : void 0
+    }, {
+        stripe: .8 * args.size,
+        rotation: -Math.PI / 2,
+        endpoint: (_args, _params) => {
+            const rnd = args.getPRandom || Math.random, width = args.size * (1 - .25 * rnd()), x = args.x - (args.size - width) / 2;
+            return DotElements.square({
+                ..._args,
+                x
+            }, {
+                ..._params,
+                width
+            });
+        },
+        dot: _args => {
+            const rnd = args.getPRandom || Math.random, height = args.size * (1 - .25 * rnd()), y = args.y + (args.size - height) * rnd();
+            return DotElements.square({
+                ..._args,
+                y
+            }, {
+                height
+            });
+        }
     })
 };
 
@@ -598,6 +655,21 @@ function parseColor(cstr) {
     };
 }
 
+function getRng(matrix, i, j, match = !0) {
+    let seed;
+    return () => {
+        if (null == seed) {
+            seed = 0;
+            let ix = 0;
+            for (let xOffset = -3; xOffset < 4; xOffset++) for (let yOffset = -3; yOffset < 4; yOffset++) ix++, 
+            seed |= Number(matrix[(i + xOffset + matrix.length << yOffset) % matrix.length]?.[(j + yOffset + matrix.length << xOffset) % matrix.length] === match) << ix;
+        }
+        let t = seed += 1831565813;
+        return t = Math.imul(t ^ t >>> 15, 1 | t), t ^= t + Math.imul(t ^ t >>> 7, 61 | t), 
+        ((t ^ t >>> 14) >>> 0) / 4294967296;
+    };
+}
+
 let squareMask = [ [ 1, 1, 1, 1, 1, 1, 1 ], [ 1, 0, 0, 0, 0, 0, 1 ], [ 1, 0, 0, 0, 0, 0, 1 ], [ 1, 0, 0, 0, 0, 0, 1 ], [ 1, 0, 0, 0, 0, 0, 1 ], [ 1, 0, 0, 0, 0, 0, 1 ], [ 1, 1, 1, 1, 1, 1, 1 ] ], cornerSquareTypes = new Set(Object.values(CornerSquareType));
 
 let dotMask = [ [ 0, 0, 0, 0, 0, 0, 0 ], [ 0, 0, 0, 0, 0, 0, 0 ], [ 0, 0, 1, 1, 1, 0, 0 ], [ 0, 0, 1, 1, 1, 0, 0 ], [ 0, 0, 1, 1, 1, 0, 0 ], [ 0, 0, 0, 0, 0, 0, 0 ], [ 0, 0, 0, 0, 0, 0, 0 ] ], cornerDotTypes = new Set(Object.values(CornerDotType));
@@ -605,6 +677,7 @@ let dotMask = [ [ 0, 0, 0, 0, 0, 0, 0 ], [ 0, 0, 0, 0, 0, 0, 0 ], [ 0, 0, 1, 1,
 class QRSVG {
     options;
     _element;
+    _fakeMatrix;
     get element() {
         return this._element;
     }
@@ -746,16 +819,18 @@ class QRSVG {
         options.shape === ShapeType.circle ? (margin = this.options.backgroundOptions && this.options.backgroundOptions.margin || 0, 
         additionalDots = Math.floor((minSize / dotSize - count - 2 * margin) / 2), fakeCount = count + 2 * additionalDots) : options.imageOptions.mode == ImageMode.background && (additionalDots = 1, 
         fakeCount = count + 2 * additionalDots);
-        let xFakeBeginning = xBeginning - additionalDots * dotSize, yFakeBeginning = yBeginning - additionalDots * dotSize, colorX = xFakeBeginning, colorY = yFakeBeginning, colorCount = count + 2 * additionalDots, fakeMatrix = new Array(fakeCount), center = Math.floor(fakeCount / 2);
+        let xFakeBeginning = xBeginning - additionalDots * dotSize, yFakeBeginning = yBeginning - additionalDots * dotSize, colorX = xFakeBeginning, colorY = yFakeBeginning, colorCount = count + 2 * additionalDots;
+        this._fakeMatrix = new Array(fakeCount);
+        let center = Math.floor(fakeCount / 2);
         for (let i = 0; i < fakeCount; i++) {
-            fakeMatrix[i] = new Array(fakeCount);
+            this._fakeMatrix[i] = new Array(fakeCount);
             for (let j = 0; j < fakeCount; j++) {
                 if (i > additionalDots - 1 && i < fakeCount - additionalDots && j > additionalDots - 1 && j < fakeCount - additionalDots) {
                     let ii = i - additionalDots, jj = j - additionalDots;
-                    filter && !filter(ii, jj) ? fakeMatrix[i][j] = void 0 : fakeMatrix[i][j] = !!this.qr.isDark(jj, ii);
+                    filter && !filter(ii, jj) ? this._fakeMatrix[i][j] = void 0 : this._fakeMatrix[i][j] = !!this.qr.isDark(jj, ii);
                     continue;
                 }
-                options.shape === ShapeType.circle && Math.sqrt((i - center) * (i - center) + (j - center) * (j - center)) > center ? fakeMatrix[i][j] = void 0 : fakeMatrix[i][j] = i != additionalDots - 1 && i != fakeCount - additionalDots && j != additionalDots - 1 && j != fakeCount - additionalDots ? this.qr.isDark(j - 2 * additionalDots < 0 ? j : j >= count ? j - 2 * additionalDots : j - additionalDots, i - 2 * additionalDots < 0 ? i : i >= count ? i - 2 * additionalDots : i - additionalDots) : (j == additionalDots - 1 && (i < additionalDots + 8 || i > fakeCount - additionalDots - 9) || j == fakeCount - additionalDots && i < additionalDots + 8 || i == additionalDots - 1 && (j < additionalDots + 8 || j > fakeCount - additionalDots - 9) || i == fakeCount - additionalDots && j < additionalDots + 8) && void 0;
+                options.shape === ShapeType.circle && Math.sqrt((i - center) * (i - center) + (j - center) * (j - center)) > center ? this._fakeMatrix[i][j] = void 0 : this._fakeMatrix[i][j] = i != additionalDots - 1 && i != fakeCount - additionalDots && j != additionalDots - 1 && j != fakeCount - additionalDots ? this.qr.isDark(j - 2 * additionalDots < 0 ? j : j >= count ? j - 2 * additionalDots : j - additionalDots, i - 2 * additionalDots < 0 ? i : i >= count ? i - 2 * additionalDots : i - additionalDots) : (j == additionalDots - 1 && (i < additionalDots + 8 || i > fakeCount - additionalDots - 9) || j == fakeCount - additionalDots && i < additionalDots + 8 || i == additionalDots - 1 && (j < additionalDots + 8 || j > fakeCount - additionalDots - 9) || i == fakeCount - additionalDots && j < additionalDots + 8) && void 0;
             }
         }
         let typeNr = (count - 17) / 4, alignment = QRUtil.getPatternPosition(typeNr);
@@ -763,19 +838,21 @@ class QRSVG {
             let iAlign = alignment.find(v => i - additionalDots > v - 3 && i - additionalDots < v + 3);
             for (let j = 0; j < fakeCount; j++) {
                 let jAlign = alignment.find(v => j - additionalDots > v - 3 && j - additionalDots < v + 3);
-                null != fakeMatrix[i][j] && (this.lightDotsMask && (draw = iAlign && jAlign && (iAlign != alignment[0] && jAlign != alignment[0] || jAlign != alignment[0] && jAlign != alignment[alignment.length - 1] || iAlign != alignment[0] && iAlign != alignment[alignment.length - 1]) ? getQrDotFigure(DotType.square) : getQrDotFigure(DotType.tinySquare)), 
-                fakeMatrix[i][j] ? this.dotsMaskGroup && this.dotsMaskGroup.appendChild(draw({
+                null != this._fakeMatrix[i][j] && (this.lightDotsMask && (draw = iAlign && jAlign && (iAlign != alignment[0] && jAlign != alignment[0] || jAlign != alignment[0] && jAlign != alignment[alignment.length - 1] || iAlign != alignment[0] && iAlign != alignment[alignment.length - 1]) ? getQrDotFigure(DotType.square) : getQrDotFigure(DotType.tinySquare)), 
+                this._fakeMatrix[i][j] ? this.dotsMaskGroup && this.dotsMaskGroup.appendChild(draw({
                     x: xFakeBeginning + i * dotSize,
                     y: yFakeBeginning + j * dotSize,
                     size: dotSize,
                     document: this.options.document,
-                    getNeighbor: (xOffset, yOffset) => !0 === fakeMatrix[i + xOffset]?.[j + yOffset]
+                    getNeighbor: (xOffset, yOffset) => !0 === this._fakeMatrix[i + xOffset]?.[j + yOffset],
+                    getPRandom: getRng(this._fakeMatrix, i, j)
                 })) : this.lightDotsMask && this.lightDotsMaskGroup && this.lightDotsMaskGroup.appendChild(draw({
                     x: xFakeBeginning + i * dotSize,
                     y: yFakeBeginning + j * dotSize,
                     size: dotSize,
                     document: this.options.document,
-                    getNeighbor: (xOffset, yOffset) => !1 === fakeMatrix[i + xOffset]?.[j + yOffset]
+                    getNeighbor: (xOffset, yOffset) => !1 === this._fakeMatrix[i + xOffset]?.[j + yOffset],
+                    getPRandom: getRng(this._fakeMatrix, i, j, !1)
                 })));
             }
         }
@@ -844,13 +921,15 @@ class QRSVG {
                     y: y + j * dotSize,
                     size: dotSize,
                     document: this.options.document,
-                    getNeighbor: (xOffset, yOffset) => !!squareMask[i + xOffset]?.[j + yOffset]
+                    getNeighbor: (xOffset, yOffset) => !!squareMask[i + xOffset]?.[j + yOffset],
+                    getPRandom: getRng(this._fakeMatrix, x / dotSize + i, y / dotSize + j, !1)
                 })) : this.lightDotsMask && !dotMask[i]?.[j] && this.lightDotsMaskGroup && this.lightDotsMaskGroup.appendChild(draw({
                     x: x + i * dotSize,
                     y: y + j * dotSize,
                     size: dotSize,
                     document: this.options.document,
-                    getNeighbor: (xOffset, yOffset) => !squareMask[i + xOffset]?.[j + yOffset] && !dotMask[i + xOffset]?.[j + yOffset]
+                    getNeighbor: (xOffset, yOffset) => !squareMask[i + xOffset]?.[j + yOffset] && !dotMask[i + xOffset]?.[j + yOffset],
+                    getPRandom: getRng(this._fakeMatrix, x / dotSize + i, y / dotSize + j, !1)
                 }));
                 if (this.lightDotsMask) for (let i = -1; i < 8; i++) for (let j = -1; j < 8; j++) -1 != i && 7 != i && -1 != j && 7 != j || this.lightDotsMaskGroup && this.lightDotsMaskGroup.appendChild(draw({
                     x: x + i * dotSize,
@@ -860,7 +939,8 @@ class QRSVG {
                     getNeighbor: (xOffset, yOffset) => {
                         let ii = i + xOffset, jj = j + yOffset;
                         return ii >= -1 && ii <= 7 && jj >= -1 && jj <= 7 && (-1 == ii || 7 == ii || -1 == jj || 7 == jj);
-                    }
+                    },
+                    getPRandom: getRng(this._fakeMatrix, x / dotSize + i, y / dotSize + j, !1)
                 }));
             }
             (options.cornersDotOptions?.gradient || options.cornersDotOptions?.color) && ([cornersDotMask, cornersDotMaskGroup] = this.createMask(`mask-corners-dot-color-${column}-${row}`), 
@@ -902,7 +982,8 @@ class QRSVG {
                     y: y + j * dotSize,
                     size: dotSize,
                     document: this.options.document,
-                    getNeighbor: (xOffset, yOffset) => !!dotMask[i + xOffset]?.[j + yOffset]
+                    getNeighbor: (xOffset, yOffset) => !!dotMask[i + xOffset]?.[j + yOffset],
+                    getPRandom: getRng(this._fakeMatrix, x / dotSize + i, y / dotSize + j, !1)
                 }));
             }
         });