Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

squishjs

Package Overview
Dependencies
Maintainers
2
Versions
49
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

squishjs - npm Package Compare versions

Comparing version 0.5.3 to 0.6.1

src/util/index.js

8

index.js

@@ -1,2 +0,2 @@

const { unsquishSize, squishSize, squish, unsquish } = require('./src/squish');
const { squish, unsquish } = require('./src/squish');
const { gameNode, GameNode } = require('./src/GameNode');

@@ -8,3 +8,2 @@ const InternalGameNode = require('./src/InternalGameNode');

const shapeUtils = require('./src/util/shapes');
const StateSignals = require('./src/util/state-codes');

@@ -14,4 +13,2 @@ module.exports = {

unsquish,
squishSize,
unsquishSize,
gameNode,

@@ -22,4 +19,3 @@ Game,

Shapes,
ShapeUtils: shapeUtils,
StateSignals
ShapeUtils: shapeUtils
};
{
"name": "squishjs",
"version": "0.5.3",
"version": "0.6.1",
"description": "squish & unsquish stuff",

@@ -5,0 +5,0 @@ "scripts": {

const listenable = require("./util/listenable");
const InternalGameNode = require('./InternalGameNode');
const Shapes = require('./Shapes');
const StateSignals = require('./util/state-codes');
const gameNode = (color, onClick, coordinates2d, border, fill, text, asset, playerIds, effects, input, buf, stateSignal, holdHandlers) => {
const node = new InternalGameNode(color, onClick, coordinates2d, border, fill, text, asset, playerIds, effects, input, buf, stateSignal, holdHandlers);
const gameNode = (color, onClick, coordinates2d, border, fill, text, asset, playerIds, effects, input) => {
const node = new InternalGameNode(color, onClick, coordinates2d, border, fill, text, asset, playerIds, effects, input);
return listenable(node, node.onStateChange.bind(node));
};
class State {
constructor(stateSignal, playerIds) {
this.node = gameNode(null, null, null, null, null, null, null, playerIds, null, null, null, stateSignal);
this.id = this.node.id;
}
addChild(child) {
this.node.addChild(child);
}
addChildren(...nodes) {
for (let nodeIndex = 0; nodeIndex < nodes.length; nodeIndex++) {
this.addChild(nodes[nodeIndex]);
class Shape {
constructor({ color, onClick, shapeType, coordinates2d, border, fill, playerIds, effects, input }) {
if (!coordinates2d || !shapeType) {
throw new Error("Shape requires coordinates2d and shapeType");
}
}
removeChild(nodeId) {
this.node.removeChild(nodeId);
}
addListener(listener) {
this.node.addListener(listener);
}
clearChildren(excludedNodeIds) {
this.node.clearChildren(excludedNodeIds);
}
}
class Audio {
constructor(playerIds, buf) {
this.node = gameNode(null, null, null, null, null, null, null, playerIds, null, null, buf);
this.node = gameNode(color, onClick, coordinates2d, border, fill, null, null, playerIds, effects, input);
this.id = this.node.id;

@@ -70,33 +43,8 @@ }

class Shape {
constructor(color, shapeType, shapeInfo, playerIds, onClick, effects, input, holdHandlers) {
this.node = gameNode(color, onClick, shapeInfo.coordinates2d, shapeInfo.border, shapeInfo.fill, null, null, playerIds, effects, input, null, null, holdHandlers);
this.id = this.node.id;
}
addChild(child) {
this.node.addChild(child);
}
addChildren(...nodes) {
for (let nodeIndex = 0; nodeIndex < nodes.length; nodeIndex++) {
this.addChild(nodes[nodeIndex]);
class Text {
constructor({ textInfo, playerIds, input }) {
if (!textInfo) {
throw new Error("Text node requires textInfo");
}
}
removeChild(nodeId) {
this.node.removeChild(nodeId);
}
addListener(listener) {
this.node.addListener(listener);
}
clearChildren(excludedNodeIds) {
this.node.clearChildren(excludedNodeIds);
}
}
class Text {
constructor(textInfo, playerIds, input) {
this.node = gameNode(null, null, null, null, null, textInfo, null, playerIds, null, input);

@@ -130,3 +78,6 @@ this.id = this.node.id;

class Asset {
constructor(onClick, coordinates2d, assetInfo, playerIds) {
constructor({ assetInfo, onClick, coordinates2d, playerIds }) {
if (!assetInfo) {
throw new Error("Asset node requires assetInfo");
}
this.node = gameNode(null, onClick, coordinates2d, null, null, null, assetInfo, playerIds);

@@ -164,5 +115,3 @@ this.id = this.node.id;

Shape,
Text,
Audio,
State
Text
};

@@ -169,0 +118,0 @@

let id = 0;
class InternalGameNode {
constructor(color, onClick, coordinates2d, border, fill, text, asset, playerIds = [], effects = null, input = null, buf = null, stateSignal = null, holdHandlers = {}) {
constructor(color, onClick, coordinates2d, border, fill, text, asset, playerIds = [], effects = null, input = null) {
this.id = id++;

@@ -21,5 +21,2 @@ this.children = new Array();

this.playerIds = playerIds || [];
this.buf = buf;
this.stateSignal = stateSignal;
this.holdHandlers = holdHandlers;
}

@@ -26,0 +23,0 @@

@@ -21,20 +21,6 @@ const InternalGameNode = require("./InternalGameNode");

const BORDER_SUBTYPE = 54;
const BUF_SUBTYPE = 55;
const STATE_SUBTYPE = 56;
const { getFractional, hypLength } = require('./util/');
const squishSpec = {
stateSignal: {
type: STATE_SUBTYPE,
squish: (i) => [i],
unsquish: (arr) => arr[0]
},
buf: {
type: BUF_SUBTYPE,
squish: (i) => {
return i
},
unsquish: (arr) => {
return arr;
}
},
id: {

@@ -77,9 +63,25 @@ type: ID_SUBTYPE,

type: COORDINATES_2D_SUBTYPE,
squish: (p) => {
squish: (p, scale) => {
const originalCoords = p.flat();
const squished = new Array(originalCoords.length * 2);
for (const i in originalCoords) {
squished[2 * i] = Math.floor(originalCoords[i]);
squished[(2 * i) + 1] = Math.round(100 * (originalCoords[i] - Math.floor(originalCoords[i])));
if (scale) {
const isX = i % 2 == 0;
const scaleValue = isX ? scale.x : scale.y;
const scaled = scaleValue * originalCoords[i];
const removedSpace = Math.round(100 * (1 - scaleValue));
const shifted = scaled + (removedSpace / 2);
squished[2 * i] = shifted;
squished[(2 * i) + 1] = getFractional(shifted);
} else {
squished[2 * i] = Math.floor(originalCoords[i]);
squished[(2 * i) + 1] = Math.round(100 * (originalCoords[i] - Math.floor(originalCoords[i])));
}
}
return squished;

@@ -119,16 +121,21 @@ },

type: TEXT_SUBTYPE,
squish: (t) => {
squish: (t, scale) => {
const textX = scale ? t.x * scale.x : t.x;
const textY = scale ? t.y * scale.y : t.y;
const align = t.align || 'left';
const squishedText = new Array(t.text.length + 10 + align.length);
squishedText[0] = Math.floor(t.x);
squishedText[1] = Math.round(100 * (t.x - Math.floor(t.x)));
squishedText[0] = Math.floor(textX);
squishedText[1] = Math.round(100 * (textX - Math.floor(textX)));
squishedText[2] = Math.floor(t.y);
squishedText[3] = Math.round(100 * (t.y - Math.floor(t.y)));
squishedText[2] = Math.floor(textY);
squishedText[3] = Math.round(100 * (textY - Math.floor(textY)));
const textSize = t.size || 12;
squishedText[4] = Math.floor(textSize);
squishedText[5] = Math.round(100 * (textSize - Math.floor(textSize)));
const textSize = t.size || 1;
const scaledTextSize = scale ? textSize * hypLength(scale.x, scale.y) : textSize;
squishedText[4] = Math.floor(scaledTextSize);
squishedText[5] = Math.round(100 * (scaledTextSize - Math.floor(scaledTextSize)));
const textColor = t.color || Colors.BLACK;

@@ -175,18 +182,26 @@ const squishedTextColor = squishSpec.color.squish(textColor);

type: ASSET_SUBTYPE,
squish: (a) => {
squish: (a, scale) => {
const assetKey = Object.keys(a)[0];
const squishedAssets = new Array(8 + assetKey.length);
squishedAssets[0] = Math.floor(a[assetKey].pos.x);
squishedAssets[1] = Math.round(100 * (a[assetKey].pos.x - Math.floor(a[assetKey].pos.x)));
squishedAssets[2] = Math.floor(a[assetKey].pos.y);
squishedAssets[3] = Math.round(100 * (a[assetKey].pos.y - Math.floor(a[assetKey].pos.y)));
const asset = a[assetKey];
squishedAssets[4] = Math.floor(a[assetKey].size.x);
squishedAssets[5] = Math.round(100 * (a[assetKey].size.x - Math.floor(a[assetKey].size.x)));
const posX = scale ? ((scale.x * asset.pos.x) + Math.round(100 * (1 - scale.x)) / 2) : asset.pos.x;
const posY = scale ? ((scale.y * asset.pos.y) + Math.round(100 * (1 - scale.y)) / 2) : asset.pos.y;
squishedAssets[6] = Math.floor(a[assetKey].size.y);
squishedAssets[7] = Math.round(100 * (a[assetKey].size.y - Math.floor(a[assetKey].size.y)));
const sizeX = scale ? scale.x * asset.size.x : asset.size.x;
const sizeY = scale ? scale.y * asset.size.y : asset.size.y;
squishedAssets[0] = Math.floor(posX);
squishedAssets[1] = getFractional(posX);
squishedAssets[2] = Math.floor(posY);
squishedAssets[3] = getFractional(posY);
squishedAssets[4] = Math.floor(sizeX);
squishedAssets[5] = getFractional(sizeX);
squishedAssets[6] = Math.floor(sizeY);
squishedAssets[7] = getFractional(sizeY);
for (let i = 0; i < assetKey.length; i++) {

@@ -316,5 +331,3 @@ squishedAssets[8 + i] = assetKey.charCodeAt(i);

'handleClick',
'input',
'buf',
'stateSignal'
'input'
];

@@ -329,93 +342,48 @@

const unsquish = (squished) => {
assert(squished[0] == 3);
assert(squished[0] == 3);
assert(squished.length === squished[1]);
const unsquishedLength = unsquishSize([
squished[1],
squished[2],
squished[3],
squished[4],
squished[5],
squished[6],
squished[7],
squished[8]
]);
let squishedIndex = 2;
assert(squished.length === unsquishedLength);//squished[1]);
let constructedGameNode = new InternalGameNode();
let squishedIndex = 9;
while(squishedIndex < squished.length) {
let constructedGameNode = new InternalGameNode();
const subFrameType = squished[squishedIndex];
const subFrameLength = squished[squishedIndex + 1];
const subFrame = squished.slice(squishedIndex + 2, squishedIndex + subFrameLength);
while(squishedIndex < squished.length) {
const subFrameType = squished[squishedIndex];
const subFrameLength = unsquishSize([
squished[squishedIndex + 1],
squished[squishedIndex + 2],
squished[squishedIndex + 3],
squished[squishedIndex + 4],
squished[squishedIndex + 5],
squished[squishedIndex + 6],
squished[squishedIndex + 7],
squished[squishedIndex + 8]
]);
const subFrame = squished.slice(squishedIndex + 9, squishedIndex + subFrameLength);
if (!typeToSquishMap[subFrameType]) {
console.warn("Unknown sub frame type " + subFrameType);
break;
} else {
const objField = typeToSquishMap[subFrameType];
const unsquishFun = squishSpec[objField]['unsquish'];
const unsquishedVal = unsquishFun(subFrame);
constructedGameNode[objField] = unsquishedVal;
if (!typeToSquishMap[subFrameType]) {
console.warn("Unknown sub frame type " + subFrameType);
break;
} else {
const objField = typeToSquishMap[subFrameType];
const unsquishFun = squishSpec[objField]['unsquish'];
const unsquishedVal = unsquishFun(subFrame);
constructedGameNode[objField] = unsquishedVal;
}
squishedIndex += subFrameLength;
}
squishedIndex += subFrameLength;
return constructedGameNode;
}
return constructedGameNode;
}
const squishSize = (size) => {
const a = Math.floor((size / Math.pow(255, 7)) % 255);
const b = Math.floor((size / Math.pow(255, 6)) % 255);
const c = Math.floor((size / Math.pow(255, 5)) % 255);
const d = Math.floor((size / Math.pow(255, 4)) % 255);
const e = Math.floor((size / Math.pow(255, 3)) % 255);
const f = Math.floor((size / Math.pow(255, 2)) % 255);
const g = Math.floor((size / Math.pow(255, 1)) % 255);
const h = Math.floor((size / Math.pow(255, 0)) % 255);
return [a, b, c, d, e, f, g, h];
};
const squish = (entity, scale = null) => {
let squishedPieces = [];
const unsquishSize = (squishedSize) => {
return squishedSize[0] * Math.pow(255, 7) +
squishedSize[1] * Math.pow(255, 6) +
squishedSize[2] * Math.pow(255, 5) +
squishedSize[3] * Math.pow(255, 4) +
squishedSize[4] * Math.pow(255, 3) +
squishedSize[5] * Math.pow(255, 2) +
squishedSize[6] * Math.pow(255, 1) +
squishedSize[7];
};
for (const keyIndex in squishSpecKeys) {
const key = squishSpecKeys[keyIndex];
if (key in entity) {
const attr = entity[key];
if (attr !== undefined && attr !== null) {
const squished = squishSpec[key].squish(attr, scale);
squishedPieces.push([squishSpec[key]['type'], squished.length + 2, ...squished]);
}
}
}
const squish = (entity) => {
let squishedPieces = [];
const squished = squishedPieces.flat();
return [3, squished.length + 2, ...squished];
for (const keyIndex in squishSpecKeys) {
const key = squishSpecKeys[keyIndex];
if (key in entity) {
const attr = entity[key];
if (attr !== undefined && attr !== null) {
const squished = squishSpec[key].squish(attr);
const squishedLength = squishSize(squished.length + 9);
squishedPieces.push([squishSpec[key]['type'], ...squishedLength, ...squished]);
}
}
}
const squished = squishedPieces.flat();
const squishedLength = squishSize(squished.length + 9);
return [3, ...squishedLength, ...squished];
}

@@ -425,5 +393,3 @@

squish,
unsquish,
squishSize,
unsquishSize
unsquish
};

@@ -9,2 +9,4 @@ const { squish, unsquish } = require('../src/squish');

const hypLength = (x, y) => Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
const compareSquished = (preSquish, unsquished) => {

@@ -64,10 +66,7 @@ for (const key in preSquish) {

test("Simple shape", () => {
const gameNode = new GameNode.Shape(
COLORS.RED,
Shapes.POLYGON,
{
coordinates2d: ShapeUtils.rectangle(10, 10, 50, 50),
fill: COLORS.RED
}
);
const gameNode = new GameNode.Shape({
fill: COLORS.RED,
coordinates2d: ShapeUtils.rectangle(10, 10, 50, 50),
shapeType: Shapes.POLYGON
});
const squishedGameNode = squish(gameNode.node);

@@ -79,11 +78,9 @@ const unsquishedGameNode = unsquish(squishedGameNode);

test("Simple shape visible to 2 players", () => {
const gameNode = new GameNode.Shape(
COLORS.RED,
Shapes.POLYGON,
{
coordinates2d: ShapeUtils.rectangle(10, 10, 50, 50),
fill: COLORS.RED
},
[1, 2]
);
const gameNode = new GameNode.Shape({
shapeType: Shapes.POLYGON,
coordinates2d: ShapeUtils.rectangle(10, 10, 50, 50),
fill: COLORS.RED,
playerIds: [1, 2]
});
const squishedGameNode = squish(gameNode.node);

@@ -100,9 +97,12 @@ const unsquishedGameNode = unsquish(squishedGameNode);

const gameNode = new GameNode.Text({
text: 'Hello, world!',
x: 4,
y: 20,
size: 5,
align: 'center',
color: COLORS.RED
}, playerIds);
textInfo: {
text: 'Hello, world!',
x: 4,
y: 20,
size: 5,
align: 'center',
color: COLORS.RED
},
playerIds
});

@@ -120,8 +120,10 @@ const squishedGameNode = squish(gameNode.node);

const gameNode = new GameNode.Text({
text: 'ayy lmao',
x: 40,
y: 40,
size: 1,
align: 'center',
color: COLORS.BLACK
textInfo: {
text: 'ayy lmao',
x: 40,
y: 40,
size: 1,
align: 'center',
color: COLORS.BLACK
}
});

@@ -135,6 +137,5 @@

test("Asset node", () => {
const gameNode = new GameNode.Asset(
null,
ShapeUtils.rectangle(0, 0, 10, 10),
{
const gameNode = new GameNode.Asset({
coordinates2d: ShapeUtils.rectangle(0, 0, 10, 10),
assetInfo: {
'some-asset-ref': {

@@ -151,3 +152,3 @@ pos: {

}
);
});
const squishedNode = squish(gameNode.node);

@@ -159,12 +160,8 @@ const unsquishedNode = unsquish(squishedNode);

test("Shape with shadow", () => {
const gameNode = new GameNode.Shape(
COLORS.WHITE,
Shapes.POLYGON,
{
coordinates2d: ShapeUtils.rectangle(20, 20, 30, 30),
fill: COLORS.WHITE
},
[42],
null,
{
const gameNode = new GameNode.Shape({
shapeType: Shapes.POLYGON,
coordinates2d: ShapeUtils.rectangle(20, 20, 30, 30),
fill: COLORS.WHITE,
playerIds: [42],
effects: {
shadow: {

@@ -175,3 +172,3 @@ color: COLORS.BLACK,

}
);
});

@@ -185,14 +182,10 @@ const squishedNode = squish(gameNode.node);

test("Shape with onClick", () => {
const gameNode = new GameNode.Shape(
COLORS.GREEN,
Shapes.POLYGON,
{
coordinates2d: ShapeUtils.rectangle(0, 0, 100, 100),
fill: COLORS.GREEN
},
null,
() => {
const gameNode = new GameNode.Shape({
shapeType: Shapes.POLYGON,
coordinates2d: ShapeUtils.rectangle(0, 0, 100, 100),
fill: COLORS.GREEN,
onClick: () => {
console.log('some function');
}
);
});

@@ -206,15 +199,16 @@ const squished = squish(gameNode.node);

test("Text with text input", () => {
const gameNode = new GameNode.Text({
text: 'ayy lmao',
x: 40,
y: 40,
size: 1,
align: 'center',
color: COLORS.BLACK
},
null,
{
type: 'text',
oninput: () => {
console.log("I am handling text");
const gameNode = new GameNode.Text({
textInfo: {
text: 'ayy lmao',
x: 40,
y: 40,
size: 1,
align: 'center',
color: COLORS.BLACK
},
input: {
type: 'text',
oninput: () => {
console.log("I am handling text");
}
}

@@ -228,12 +222,83 @@ });

test("Text with text input", () => {
const gameNode = new GameNode.Audio(
null,
[1, 2, 3]
);
const squishedNode = squish(gameNode.node);
test("scaled shape", () => {
const gameNode = new GameNode.Shape({
fill: COLORS.GREEN,
coordinates2d: ShapeUtils.rectangle(0, 0, 100, 100),
shapeType: Shapes.POLYGON
});
// A box taking up the entire space ((0, 0), (100, 100))
// scaled down to 80%
// .8 (x scale factor) * 100 (width) = 80
// .8 (y scale factor) * 100 (height) = 80
// 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);
// top left
assert(unsquishedNode.coordinates2d[0] == 10);
assert(unsquishedNode.coordinates2d[1] == 10);
// bottom right
assert(unsquishedNode.coordinates2d[4] == 90);
assert(unsquishedNode.coordinates2d[5] == 90);
});
test("scaled text", () => {
const gameNode = new GameNode.Text({
textInfo: {
text: 'Hello, world!',
x: 4,
y: 20,
size: 5,
align: 'center',
color: COLORS.RED
}
});
const xScale = .6;
const yScale = .5;
const scaledTextSize = 5 * hypLength(xScale, yScale);
const squishedScaledNode = squish(gameNode.node, {x: xScale, y: yScale});
const unsquishedNode = unsquish(squishedScaledNode);
assert(unsquishedNode.text.x.toFixed(2) === (4 * xScale).toFixed(2));
assert(unsquishedNode.text.y.toFixed(2) === (20 * yScale).toFixed(2));
assert(unsquishedNode.text.size.toFixed(2) === scaledTextSize.toFixed(2));
});
test("scaled asset node", () => {
const gameNode = new GameNode.Asset({
onClick: (player, x, y) => {
},
coordinates2d: ShapeUtils.rectangle(20, 60, 60, 20),
assetInfo: {
'some-asset-ref': {
pos: {x: 20, y: 60},
size: {x: 60, y: 20}
}
}
});
const squishedNode = squish(gameNode.node, {x: .85, y: .85});
const unsquishedNode = unsquish(squishedNode);
const asset = unsquishedNode.asset['some-asset-ref'];
assert(asset.pos.x === (.85 * 20) + 7.5);
assert(asset.pos.y === (.85 * 60) + 7.5);
assert(asset.size.x === .85 * 60);
assert(asset.size.y === .85 * 20);
});
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc