squishjs 0.6.42 → 0.7.2

package/test/StateUpdates.js

@@ -0,0 +1,10 @@
+const { COLORS } = require("../src/Colors");
+const assert = require("assert");
+const Squisher = require('../src/Squisher');
+const { unsquish } = require('../src/squish');
+
+const { FakeGame, verifyArrayEquality, rectNode, polygonNode, circleNode } = require('./utils');
+
+test("two layers - square over square", () => {
+    console.log("two layers - one square over another");
+});

package/test/Terrain.test.js

@@ -13,7 +13,6 @@ const outputTerrainMap = (board) => {
 		});
 		rtnString += '\n';
 	});
-	console.log(rtnString);
 };
 
 const hasTerrain = (board) => {

package/test/main.test.js

@@ -1,8 +1,9 @@
 const { squish, unsquish } = require('../src/squish');
 const { GameNode } = require('../src/GameNode');
-const { COLORS, randomColor } = require("../src/Colors");
+const { COLORS } = require("../src/Colors");
 const Shapes = require('../src/Shapes');
 const ShapeUtils = require('../src/util/shapes');
+const { verifyArrayEquality } = require('./utils');
 
 const assert = require('assert');
 
@@ -21,10 +22,7 @@ const compareSquished = (preSquish, unsquished) => {
                 if (!preSquish.coordinates2d) {
                     assert(!unsquished.coordinates2d);
                 } else {
-                    const preSquishFlat = preSquish.coordinates2d.flat();
-                    for (let i = 0; i < unsquished.coordinates2d.length; i++) {
-                        assert(preSquishFlat[i] === unsquished.coordinates2d[i]);
-                    }
+                    verifyArrayEquality(preSquish.coordinates2d, unsquished.coordinates2d);
                 }
             } else if (key === 'input' || key == 'text') {
                 // TODO: Handle all of this in a more generic way
@@ -67,8 +65,8 @@ test("Simple shape", () => {
         coordinates2d: ShapeUtils.rectangle(10, 10, 50, 50),
         shapeType: Shapes.POLYGON
     });
-    const squishedGameNode = squish(gameNode.node);
-    const unsquishedGameNode = unsquish(squishedGameNode);
+    const squishedGameNode = squish(gameNode);
+    const unsquishedGameNode = unsquish(squishedGameNode).node;
     compareSquished(gameNode.node, unsquishedGameNode);
 });
 
@@ -80,8 +78,8 @@ test("Simple shape visible to 2 players", () => {
         playerIds: [1, 2]
     });
 
-    const squishedGameNode = squish(gameNode.node);
-    const unsquishedGameNode = unsquish(squishedGameNode);
+    const squishedGameNode = squish(gameNode);
+    const unsquishedGameNode = unsquish(squishedGameNode).node;
     compareSquished(gameNode.node, unsquishedGameNode);
     assert(unsquishedGameNode.playerIds.length == 2);
     assert(unsquishedGameNode.playerIds[0] == 1);
@@ -98,12 +96,12 @@ test("Simple text visible to 255 players", () => {
             size: 5,
             align: 'center',
             color: COLORS.RED
-        }, 
+        },
         playerIds
     });
 
-    const squishedGameNode = squish(gameNode.node);
-    const unsquishedGameNode = unsquish(squishedGameNode);
+    const squishedGameNode = squish(gameNode);
+    const unsquishedGameNode = unsquish(squishedGameNode).node;
     compareSquished(gameNode.node, unsquishedGameNode);
     assert(unsquishedGameNode.playerIds.length == 255);
     for (let i = 0; i < playerIds.length; i++) {
@@ -115,14 +113,14 @@ test("Text node with unicode", () => {
     const gameNode = new GameNode.Text({
         textInfo: {
             text: '💯😂💯',
-            x: 40, 
+            x: 40,
             y: 40,
             size: 1,
             align: '😂😂😂😂😂',//center',
             color: COLORS.BLACK
         }
     });
-
+    console.log("123:")
     const squishedNode = new Uint8ClampedArray(squish(gameNode.node));
     const unsquishedNode = unsquish(squishedNode);
     compareSquished(squishedNode.node, unsquishedNode);
@@ -137,7 +135,7 @@ test("Text node", () => {
     const gameNode = new GameNode.Text({
         textInfo: {
             text: 'ayy lmao',
-            x: 40, 
+            x: 40,
             y: 40,
             size: 1,
             align: 'center',
@@ -145,8 +143,8 @@ test("Text node", () => {
         }
     });
 
-    const squishedNode = squish(gameNode.node);
-    const unsquishedNode = unsquish(squishedNode);
+    const squishedNode = squish(gameNode);
+    const unsquishedNode = unsquish(squishedNode).node;
     compareSquished(squishedNode.node, unsquishedNode);
 });
 
@@ -166,8 +164,8 @@ test("Asset node", () => {
             }
         }
     });
-    const squishedNode = squish(gameNode.node);
-    const unsquishedNode = unsquish(squishedNode);
+    const squishedNode = squish(gameNode);
+    const unsquishedNode = unsquish(squishedNode).node;
     compareSquished(squishedNode.node, unsquishedNode);
 });
 
@@ -185,8 +183,8 @@ test("Shape with shadow", () => {
         }
     });
 
-    const squishedNode = squish(gameNode.node);
-    const unsquishedNode = unsquish(squishedNode);
+    const squishedNode = squish(gameNode);
+    const unsquishedNode = unsquish(squishedNode).node;
     compareSquished(squishedNode.node, unsquishedNode);
 
 });
@@ -201,8 +199,8 @@ test("Shape with onClick", () => {
         }
     });
 
-    const squished = squish(gameNode.node);
-    const unsquished = unsquish(squished);
+    const squished = squish(gameNode);
+    const unsquished = unsquish(squished).node;
 
     compareSquished(gameNode.node, unsquished);
 });
@@ -211,7 +209,7 @@ test("Text with text input", () => {
     const gameNode = new GameNode.Text({
         textInfo: {
             text: 'ayy lmao',
-            x: 40, 
+            x: 40,
             y: 40,
             size: 1,
             align: 'center',
@@ -225,8 +223,8 @@ test("Text with text input", () => {
         }
     });
 
-    const squishedNode = squish(gameNode.node);
-    const unsquishedNode = unsquish(squishedNode);
+    const squishedNode = squish(gameNode);
+    const unsquishedNode = unsquish(squishedNode).node;
     compareSquished(gameNode.node, unsquishedNode);
 });
 
@@ -241,22 +239,22 @@ test("scaled shape", () => {
     // scaled down to 80%
     // .8 (x scale factor) * 100 (width) = 80
     // .8 (y scale factor) * 100 (height) = 80
-    // This gets you the correct size. 
+    // This gets you the correct size.
     // To scale the position to re-center the data, we need to shift x and y by 1/2 of the amount of space we just removed in each direction.
     // So we removed 20 units from the width, and now we need to shift everything right 10 units to keep it horizontally centered.
     // Then we need to repeat this for the height.
     // This would result in the scaled top left corner being at (10, 10) and the bottom right corner at (90, 90)
 
-    const squishedScaledNode = squish(gameNode.node, {x: .8, y: .8});
-    const unsquishedNode = unsquish(squishedScaledNode);
+    const squishedScaledNode = squish(gameNode, {x: .8, y: .8});
+    const unsquishedNode = unsquish(squishedScaledNode).node;
 
     // top left
-    assert(unsquishedNode.coordinates2d[0] == 10);
-    assert(unsquishedNode.coordinates2d[1] == 10);
+    assert(unsquishedNode.coordinates2d[0][0] == 10);
+    assert(unsquishedNode.coordinates2d[0][1] == 10);
 
     // bottom right
-    assert(unsquishedNode.coordinates2d[4] == 90);
-    assert(unsquishedNode.coordinates2d[5] == 90);
+    assert(unsquishedNode.coordinates2d[2][0] == 90);
+    assert(unsquishedNode.coordinates2d[2][1] == 90);
 });
 
 test("scaled text", () => {
@@ -276,8 +274,8 @@ test("scaled text", () => {
 
     const scaledTextSize = 5 * hypLength(xScale, yScale);
 
-    const squishedScaledNode = squish(gameNode.node, {x: xScale, y: yScale});
-    const unsquishedNode = unsquish(squishedScaledNode);
+    const squishedScaledNode = squish(gameNode, {x: xScale, y: yScale});
+    const unsquishedNode = unsquish(squishedScaledNode).node;
 
     assert(unsquishedNode.text.x.toFixed(2) === (4 * xScale + Math.round((1 - xScale) * 100) / 2).toFixed(2));
     assert(unsquishedNode.text.y.toFixed(2) === (20 * yScale + Math.round((1 - yScale) * 100) / 2).toFixed(2));
@@ -298,8 +296,8 @@ test("scaled asset node", () => {
         }
     });
 
-    const squishedNode = squish(gameNode.node, {x: .85, y: .85});
-    const unsquishedNode = unsquish(squishedNode);
+    const squishedNode = squish(gameNode, {x: .85, y: .85});
+    const unsquishedNode = unsquish(squishedNode).node;
 
     const asset = unsquishedNode.asset['some-asset-ref'];
 

package/test/utils.js

@@ -0,0 +1,91 @@
+const Game = require('../src/Game');
+const { COLORS } = require('../src/Colors');
+const { GameNode } = require('../src/GameNode');
+const ShapeUtils = require('../src/util/shapes');
+const Shapes = require('../src/Shapes');
+const subtypes = require('../src/subtypes');
+
+const assert = require('assert');
+
+class FakeGame extends Game {
+    static metadata() {
+        return {
+            name: 'Test game'
+        };
+    }
+
+    constructor(layers) {
+        super();
+        this.layers = layers;
+    }
+
+    getLayers() {
+        return this.layers;
+    }
+}
+
+const verifyArrayEquality = (actual, expected) => {
+    assert(expected.length == actual.length);
+
+    for (let i = 0; i < expected.length; i++) {
+        if (expected[i].length && actual[i].length) {
+            verifyArrayEquality(expected[i], actual[i]);
+        } else {
+            assert(expected[i] === actual[i]);
+        }
+    }
+};
+
+const polygonNode = ({ coordinates, fill }) => {
+    return new GameNode.Shape({
+        fill: fill,
+        coordinates2d: coordinates,
+        shapeType: Shapes.POLYGON
+    });
+};
+
+const circleNode = ({ center, radius, fill }) => {
+    return new GameNode.Shape({
+        fill,
+        coordinates2d: [center.x, center.y, radius],
+        shapeType: Shapes.CIRCLE
+    });
+}
+
+const rectNode = ({ x, y, width, height, fill = COLORS.RED }) => {
+    return new GameNode.Shape({
+        fill: fill,
+        coordinates2d: ShapeUtils.rectangle(x, y, width, height),
+        shapeType: Shapes.POLYGON
+    });
+};
+
+const textNode = ({ text, x, y, align, color }) => {
+    return new GameNode.Text({
+        textInfo: {
+            x,
+            y,
+            align,
+            color,
+            text
+        }
+    });
+};
+
+const lineNode = ({ color, coords }) => {
+    return new GameNode.Shape({
+        color,
+        coordinates2d: coords,
+        shapeType: Shapes.LINE
+    });
+};
+
+module.exports = {
+    FakeGame,
+    verifyArrayEquality,
+    rectNode,
+    polygonNode,
+    circleNode,
+    textNode,
+    lineNode
+}

package/testapp.html

@@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html>
+    <head>
+        <meta charset="UTF-8">
+        <title>Homegames</title>
+    </head>
+    <body>
+        <div>
+            <canvas id='tester-canvas'></canvas>
+        </div>
+    </body>
+    <script src="src/squish.js"></script>
+    <script src="render-tester.js"></script>
+    <style>
+
+        body { 
+            margin: 0;
+        }
+
+        canvas, body {
+            width: 100vw;
+            height: 100vh;
+        }
+
+    </style>
+</html>