From 2bae799b9f110f56ff66a20cc19a83cff9c92d56 Mon Sep 17 00:00:00 2001 From: joemaddalone Date: Mon, 9 Jun 2025 16:16:13 -0500 Subject: [PATCH] nesting prototype --- .cursorignore | 1 - demo/package-lock.json | 2 +- scripts/preview.mjs | 17 ++++++++++++----- src/index.js | 16 ++++++++++++++++ src/macros/cross.js | 1 + src/macros/ellipse.js | 1 + src/macros/isocube.js | 1 + src/macros/kite.js | 1 + src/macros/lens.js | 1 + src/macros/polygram.js | 1 + src/macros/radialLines.js | 1 + src/macros/rect.js | 1 + src/macros/regPolygon.js | 1 + src/macros/roundedRect.js | 1 + src/macros/roundedSquare.js | 1 + src/macros/sector.js | 1 + src/macros/segment.js | 1 + src/macros/square.js | 1 + src/macros/star.js | 1 + src/macros/symH.js | 1 + src/macros/symI.js | 1 + src/macros/symV.js | 1 + src/macros/symX.js | 1 + src/macros/triangle.js | 1 + 24 files changed, 49 insertions(+), 7 deletions(-) diff --git a/.cursorignore b/.cursorignore index 85178fb..b6a700c 100644 --- a/.cursorignore +++ b/.cursorignore @@ -1,3 +1,2 @@ # Add directories or file patterns to ignore during indexing (e.g. foo/ or *.csv) demo -scripts diff --git a/demo/package-lock.json b/demo/package-lock.json index 455218f..25a9ed6 100644 --- a/demo/package-lock.json +++ b/demo/package-lock.json @@ -15,7 +15,7 @@ }, "..": { "name": "@joemaddalone/path", - "version": "1.3.2", + "version": "1.4.0", "license": "ISC", "devDependencies": { "@babel/core": "^7.16.0", diff --git a/scripts/preview.mjs b/scripts/preview.mjs index 6521e19..ac8ab9e 100755 --- a/scripts/preview.mjs +++ b/scripts/preview.mjs @@ -30,11 +30,17 @@ const P = new Path(); P.M(250, 250); let x = c x = x.replace(/\s+/g, ''); -const cmd = x.split('('); -const name = cmd[0]; -const args = cmd[1].split(','); -const numericArgs = args.map(arg => parseFloat(arg)); -P[name](...numericArgs); +const commands = x.split(').'); +commands.forEach(command => { + if (command) { + const [name, argsStr] = command.split('('); + if (argsStr) { + const args = argsStr.replace(')', '').split(','); + const numericArgs = args.map(arg => parseFloat(arg)); + P[name](...numericArgs); + } + } +}); @@ -58,6 +64,7 @@ const htmlContent = ` background-color: white; box-shadow: 0 0 10px rgba(0,0,0,0.1); } + path { fill: none; } diff --git a/src/index.js b/src/index.js index 998d48c..ab41cfb 100644 --- a/src/index.js +++ b/src/index.js @@ -44,9 +44,25 @@ export default class Path { * @default [] */ this.attributes = {}; + this.lastCX = 0; + this.lastCY = 0; return this; } + nest = (cx, cy) => { + if (cx === undefined) { + cx = this.lastCX; + } else { + this.lastCX = cx; + } + if (cy === undefined) { + cy = this.lastCY; + } else { + this.lastCY = cy; + } + return [cx, cy]; + }; + /** * @function angleInRadians * @memberof Path diff --git a/src/macros/cross.js b/src/macros/cross.js index d36abde..af1ae66 100644 --- a/src/macros/cross.js +++ b/src/macros/cross.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const cross = function (width, height, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const l = cx - width / 2; const r = l + width; const t = cy - height / 2; diff --git a/src/macros/ellipse.js b/src/macros/ellipse.js index b63db26..79a3ae4 100644 --- a/src/macros/ellipse.js +++ b/src/macros/ellipse.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const ellipse = function (width, height, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const rx = width / 2; const ry = height / 2; diff --git a/src/macros/isocube.js b/src/macros/isocube.js index 22f4cbf..d87fff9 100644 --- a/src/macros/isocube.js +++ b/src/macros/isocube.js @@ -8,6 +8,7 @@ * @return {Path} the path object for chaining */ const isocube = function (size, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); this.regPolygon(size, 6, cx, cy, centerEnd) const inner = this.constructor.radialPoints(0 / 2, cx, cy, 6); diff --git a/src/macros/kite.js b/src/macros/kite.js index 43132a2..23b37a0 100644 --- a/src/macros/kite.js +++ b/src/macros/kite.js @@ -10,6 +10,7 @@ * @return {Path} the path object for chaining */ const kite = function (width, height, dh, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); dh = dh || parseInt(height * 0.33, 10); const [t, _, b] = this.constructor.radialPoints(height / 2, cx, cy, 4); const h = parseInt(t[1], 10) + dh; diff --git a/src/macros/lens.js b/src/macros/lens.js index 594da7c..751894e 100644 --- a/src/macros/lens.js +++ b/src/macros/lens.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const lens = function (width, height, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); this.M(cx - width / 2, cy) .Q(cx, cy - height, cx + width / 2, cy) .Q(cx, cy + height, cx - width / 2, cy); diff --git a/src/macros/polygram.js b/src/macros/polygram.js index c6453f2..e836c0e 100644 --- a/src/macros/polygram.js +++ b/src/macros/polygram.js @@ -17,6 +17,7 @@ const polygram = function ( vertexSkip = 2, centerEnd = true, ) { + [cx ,cy] = this.nest(cx, cy); this.polygon( this.constructor.radialPoints(size / 2, cx, cy, points, null, vertexSkip), ); diff --git a/src/macros/radialLines.js b/src/macros/radialLines.js index a3ca412..afec8d9 100644 --- a/src/macros/radialLines.js +++ b/src/macros/radialLines.js @@ -17,6 +17,7 @@ const radialLines = function ( cy, centerEnd = true, ) { + [cx ,cy] = this.nest(cx, cy); const inner = this.constructor.radialPoints(innerSize / 2, cx, cy, points); const outer = this.constructor.radialPoints(outerSize / 2, cx, cy, points); diff --git a/src/macros/rect.js b/src/macros/rect.js index 40f1025..e893e15 100644 --- a/src/macros/rect.js +++ b/src/macros/rect.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const rect = function (width, height, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); this.M(cx - width / 2, cy - height / 2) .right(width) .down(height) diff --git a/src/macros/regPolygon.js b/src/macros/regPolygon.js index b2c9c80..57588bd 100644 --- a/src/macros/regPolygon.js +++ b/src/macros/regPolygon.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const regPolygon = function (size, sides, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); this.polygon(this.constructor.radialPoints(size / 2, cx, cy, sides)); if (centerEnd) { this.M(cx, cy); diff --git a/src/macros/roundedRect.js b/src/macros/roundedRect.js index 4232b63..b16ca78 100644 --- a/src/macros/roundedRect.js +++ b/src/macros/roundedRect.js @@ -10,6 +10,7 @@ * @return {Path} the path object for chaining */ const roundedRect = function (width, height, radius, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const top = cy - height / 2; const left = cx - width / 2; const right = left + width; diff --git a/src/macros/roundedSquare.js b/src/macros/roundedSquare.js index 7112aca..dd68838 100644 --- a/src/macros/roundedSquare.js +++ b/src/macros/roundedSquare.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const roundedSquare = function (size, radius, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); return this.roundedRect(size, size, radius, cx, cy, centerEnd); }; diff --git a/src/macros/sector.js b/src/macros/sector.js index 6a962a0..f6f4ab5 100644 --- a/src/macros/sector.js +++ b/src/macros/sector.js @@ -10,6 +10,7 @@ * @return {Path} the path object for chaining */ const sector = function (cx, cy, size, startAngle, endAngle, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const radius = size / 2; const start = this.constructor.clockwisePoint( cx, diff --git a/src/macros/segment.js b/src/macros/segment.js index 6794f97..983e5d6 100644 --- a/src/macros/segment.js +++ b/src/macros/segment.js @@ -17,6 +17,7 @@ const segment = function ( endAngle, centerEnd = true, ) { + [cx ,cy] = this.nest(cx, cy); const radius = size / 2; const start = this.constructor.clockwisePoint( cx, diff --git a/src/macros/square.js b/src/macros/square.js index 4b1363c..c676d38 100644 --- a/src/macros/square.js +++ b/src/macros/square.js @@ -8,6 +8,7 @@ * @return {Path} the path object for chaining */ const square = function (size, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); return this.rect(size, size, cx, cy, centerEnd); }; diff --git a/src/macros/star.js b/src/macros/star.js index b50e189..dac1cb5 100644 --- a/src/macros/star.js +++ b/src/macros/star.js @@ -10,6 +10,7 @@ * @return {Path} the path object for chaining */ const star = function (outerSize, innerSize, points, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const innerRadius = innerSize / 2; const outerRadius = outerSize / 2; const increment = 360 / (points * 2); diff --git a/src/macros/symH.js b/src/macros/symH.js index 6ed6de9..5c3622b 100644 --- a/src/macros/symH.js +++ b/src/macros/symH.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const symH = function (width, height, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const l = cx - width / 2; const r = l + width; const t = cy - height / 2; diff --git a/src/macros/symI.js b/src/macros/symI.js index ca129f0..3c02595 100644 --- a/src/macros/symI.js +++ b/src/macros/symI.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const symI = function (width, height, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const l = cx - width / 2; const r = l + width; const t = cy - height / 2; diff --git a/src/macros/symV.js b/src/macros/symV.js index 52eeff3..bc38cf9 100644 --- a/src/macros/symV.js +++ b/src/macros/symV.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const symV = function (width, height, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const l = cx - width / 2; const r = l + width; const t = cy - height / 2; diff --git a/src/macros/symX.js b/src/macros/symX.js index 6230fe4..edf1142 100644 --- a/src/macros/symX.js +++ b/src/macros/symX.js @@ -9,6 +9,7 @@ * @return {Path} the path object for chaining */ const symX = function (width, height, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const l = cx - width / 2; const r = l + width; const t = cy - height / 2; diff --git a/src/macros/triangle.js b/src/macros/triangle.js index 3264fb7..edb62c5 100644 --- a/src/macros/triangle.js +++ b/src/macros/triangle.js @@ -8,6 +8,7 @@ * @return {Path} the path object for chaining */ const triangle = function (size, cx, cy, centerEnd = true) { + [cx ,cy] = this.nest(cx, cy); const sq3 = Math.sqrt(3); const a = [cx, cy - (sq3 / 3) * size]; const b = [cx - size / 2, cy + (sq3 / 6) * size];