cubegin 0.0.1

package/dist/scramble-image/src/renderers/megaminx.mjs

@@ -0,0 +1,173 @@
+import { MEGAMINX_FACES } from "../../../scramble-puzzle/src/megaminx/megaminx-parser.mjs";
+import "../../../scramble-puzzle/src/index.mjs";
+import { createSvgDocument } from "../svg/svg-document.mjs";
+import { path, text } from "../svg/svg-elements.mjs";
+//#region .build/vendor/scramble-image/src/renderers/megaminx.ts
+const GAP = 2;
+const MINX_RADIUS = 30;
+const UNFOLD_HEIGHT = 2 + 3 * Math.sin(.3 * Math.PI) + Math.sin(.1 * Math.PI);
+const UNFOLD_WIDTH = 4 * Math.cos(.1 * Math.PI) + 2 * Math.cos(.3 * Math.PI);
+const WIDTH = Math.trunc(UNFOLD_WIDTH * 2 * MINX_RADIUS + 3 * GAP);
+const HEIGHT = Math.trunc(UNFOLD_HEIGHT * MINX_RADIUS + 2 * GAP);
+const STROKE = "#000000";
+const STROKE_WIDTH = 1.25;
+const DEFAULT_MEGAMINX_COLORS = {
+	U: "#ffffff",
+	BL: "#ffcc00",
+	BR: "#0000b3",
+	R: "#dd0000",
+	F: "#006600",
+	L: "#8a1aff",
+	D: "#999999",
+	DR: "#ffffb3",
+	DBR: "#ff99ff",
+	B: "#71e600",
+	DBL: "#ff8433",
+	DL: "#88ddff"
+};
+const pentagon = (centerX, centerY, pointUp) => {
+	return [
+		1.3,
+		1.7,
+		.1,
+		.5,
+		.9
+	].map((angle) => (pointUp ? angle - .2 : angle) * Math.PI).map((angle) => ({
+		x: centerX + MINX_RADIUS * Math.cos(angle),
+		y: centerY + MINX_RADIUS * Math.sin(angle)
+	}));
+};
+const edgeLength = MINX_RADIUS * Math.sqrt(2 * (1 - Math.cos(.6 * Math.PI)));
+const radiusCos18 = MINX_RADIUS * Math.cos(.1 * Math.PI);
+const edgeCos18 = edgeLength * Math.cos(.1 * Math.PI);
+const edgeCos54 = edgeLength * Math.cos(.3 * Math.PI);
+const edgeSin18 = edgeLength * Math.sin(.1 * Math.PI);
+const edgeSin54 = edgeLength * Math.sin(.3 * Math.PI);
+const leftCenterX = GAP + radiusCos18 + edgeCos18 + edgeSin18 / 2;
+const leftCenterY = GAP + edgeLength + MINX_RADIUS - edgeSin18;
+const shift = leftCenterX + edgeSin18 * .6 + MINX_RADIUS * (Math.cos(.1 * Math.PI) + Math.cos(.2 * Math.PI));
+const faceBoundary = (face) => {
+	switch (face) {
+		case "U": return pentagon(leftCenterX, leftCenterY, true);
+		case "BL": return pentagon(leftCenterX - edgeCos54, leftCenterY - edgeSin54, false);
+		case "BR": return pentagon(leftCenterX + edgeCos54, leftCenterY - edgeSin54, false);
+		case "R": return pentagon(leftCenterX + edgeCos18, leftCenterY + edgeSin18, false);
+		case "F": return pentagon(leftCenterX, leftCenterY + edgeLength, false);
+		case "L": return pentagon(leftCenterX - edgeCos18, leftCenterY + edgeSin18, false);
+		case "D": return pentagon(shift + GAP + radiusCos18 + edgeCos18, GAP + edgeLength + MINX_RADIUS, false);
+		case "DR": return pentagon(shift + GAP + radiusCos18 + edgeCos18 - edgeCos54, GAP + edgeLength + edgeSin54 + MINX_RADIUS, true);
+		case "DBR": return pentagon(shift + GAP + radiusCos18, GAP + edgeLength - edgeSin18 + MINX_RADIUS, true);
+		case "B": return pentagon(shift + GAP + radiusCos18 + edgeCos18, GAP + MINX_RADIUS, true);
+		case "DBL": return pentagon(shift + GAP + radiusCos18 + 2 * edgeCos18, GAP + edgeLength - edgeSin18 + MINX_RADIUS, true);
+		case "DL": return pentagon(shift + GAP + radiusCos18 + edgeCos18 + edgeCos54, GAP + edgeLength + edgeSin54 + MINX_RADIUS, true);
+	}
+};
+const det = (a, b, c, d) => a * d - b * c;
+const lineIntersection = (firstStart, firstEnd, secondStart, secondEnd) => {
+	const firstDet = det(firstStart.x, firstStart.y, firstEnd.x, firstEnd.y);
+	const secondDet = det(secondStart.x, secondStart.y, secondEnd.x, secondEnd.y);
+	const divisor = det(firstStart.x - firstEnd.x, firstStart.y - firstEnd.y, secondStart.x - secondEnd.x, secondStart.y - secondEnd.y);
+	return {
+		x: det(firstDet, firstStart.x - firstEnd.x, secondDet, secondStart.x - secondEnd.x) / divisor,
+		y: det(firstDet, firstStart.y - firstEnd.y, secondDet, secondStart.y - secondEnd.y) / divisor
+	};
+};
+const polygonPath = (points) => {
+	const [firstPoint, ...remainingPoints] = points;
+	if (firstPoint === void 0) return "";
+	return [
+		`M ${firstPoint.x} ${firstPoint.y}`,
+		...remainingPoints.map((pointValue) => `L ${pointValue.x} ${pointValue.y}`),
+		"Z"
+	].join(" ");
+};
+const createStickerPolygons = (boundary) => {
+	const edgePoints = [];
+	for (let index = 0; index < 5; index += 1) {
+		const current = boundary[index];
+		const next = boundary[(index + 1) % 5];
+		edgePoints[index] = {
+			x: .4 * next.x + .6 * current.x,
+			y: .4 * next.y + .6 * current.y
+		};
+		edgePoints[index + 5] = {
+			x: .6 * next.x + .4 * current.x,
+			y: .6 * next.y + .4 * current.y
+		};
+	}
+	const innerPentagon = [];
+	for (let index = 0; index < 5; index += 1) innerPentagon[index] = lineIntersection(edgePoints[index], edgePoints[5 + (3 + index) % 5], edgePoints[(index + 1) % 5], edgePoints[5 + (4 + index) % 5]);
+	const stickers = [];
+	for (let index = 0; index < 5; index += 1) {
+		stickers[2 * index] = [
+			boundary[index],
+			edgePoints[index],
+			innerPentagon[index],
+			edgePoints[5 + (4 + index) % 5]
+		];
+		stickers[2 * index + 1] = [
+			edgePoints[index],
+			edgePoints[index + 5],
+			innerPentagon[(index + 1) % 5],
+			innerPentagon[index]
+		];
+	}
+	stickers[10] = innerPentagon;
+	return stickers;
+};
+const stickerIndexForOrientation = (stickerIndex, rotateCounterClockwise) => stickerIndex < 10 ? (stickerIndex + 2 * rotateCounterClockwise) % 10 : stickerIndex;
+const faceRotation = (face) => {
+	if (face === "U") return 0;
+	return MEGAMINX_FACES.indexOf(face) <= 5 ? 1 : 2;
+};
+const colorForSticker = (facelet, colors) => colors[MEGAMINX_FACES[facelet] ?? "U"];
+const drawFace = (state, face, colors) => {
+	const faceIndexValue = MEGAMINX_FACES.indexOf(face);
+	const stickers = state.image[faceIndexValue];
+	const rotateCounterClockwise = faceRotation(face);
+	return createStickerPolygons(faceBoundary(face)).map((polygon, stickerIndex) => {
+		const stateStickerIndex = stickerIndexForOrientation(stickerIndex, rotateCounterClockwise);
+		return path({
+			d: polygonPath(polygon),
+			fill: colorForSticker(stickers[stateStickerIndex], colors),
+			stroke: STROKE,
+			"stroke-width": STROKE_WIDTH,
+			"stroke-linejoin": "round"
+		});
+	});
+};
+const labelNode = (face) => {
+	if (face !== "U" && face !== "F") return void 0;
+	const innerPentagon = createStickerPolygons(faceBoundary(face))[10];
+	const center = innerPentagon.reduce((sum, pointValue) => ({
+		x: sum.x + pointValue.x,
+		y: sum.y + pointValue.y
+	}), {
+		x: 0,
+		y: 0
+	});
+	const minY = Math.min(...innerPentagon.map((pointValue) => pointValue.y));
+	const maxY = Math.max(...innerPentagon.map((pointValue) => pointValue.y));
+	return text({
+		x: center.x / innerPentagon.length,
+		y: center.y / innerPentagon.length,
+		style: "font-family: sans-serif",
+		"text-anchor": "middle",
+		dy: `${Math.round(Math.abs(maxY - minY) * .2)}px`
+	}, face);
+};
+const renderMegaminxState = (state, colorScheme = {}) => {
+	const colors = {
+		...DEFAULT_MEGAMINX_COLORS,
+		...colorScheme
+	};
+	const nodes = [];
+	for (const face of MEGAMINX_FACES) {
+		nodes.push(...drawFace(state, face, colors));
+		const label = labelNode(face);
+		if (label !== void 0) nodes.push(label);
+	}
+	return createSvgDocument(WIDTH, HEIGHT, nodes);
+};
+//#endregion
+export { renderMegaminxState };

package/dist/scramble-image/src/renderers/pyraminx-isometric.d.mts

@@ -0,0 +1,9 @@
+import { PyraminxFace } from "../../../scramble-puzzle/src/pyraminx/pyraminx-parser.mjs";
+import { PyraminxState } from "../../../scramble-puzzle/src/pyraminx/pyraminx-state.mjs";
+import { HexColor } from "../color.mjs";
+
+//#region .build/vendor/scramble-image/src/renderers/pyraminx-isometric.d.ts
+type PyraminxIsometricColorScheme = Partial<Record<PyraminxFace, HexColor>>;
+declare const renderPyraminxIsometricState: (state: PyraminxState, colorScheme?: PyraminxIsometricColorScheme) => string;
+//#endregion
+export { PyraminxIsometricColorScheme, renderPyraminxIsometricState };

package/dist/scramble-image/src/renderers/pyraminx-isometric.mjs

@@ -0,0 +1,185 @@
+import { PYRAMINX_FACES } from "../../../scramble-puzzle/src/pyraminx/pyraminx-parser.mjs";
+import "../../../scramble-puzzle/src/index.mjs";
+import { createSvgDocument } from "../svg/svg-document.mjs";
+import { path } from "../svg/svg-elements.mjs";
+//#region .build/vendor/scramble-image/src/renderers/pyraminx-isometric.ts
+const WIDTH = 370;
+const HEIGHT = 146;
+const STROKE = "#000000";
+const STROKE_WIDTH = 2.5;
+const VISIBLE_FACES = [
+	"F",
+	"L",
+	"R",
+	"D"
+];
+const DEFAULT_PYRAMINX_COLORS = {
+	F: "#00ff00",
+	D: "#ffff00",
+	L: "#ff0000",
+	R: "#0000ff"
+};
+const FACE_BOUNDARIES = {
+	F: [
+		{
+			x: 90,
+			y: 96
+		},
+		{
+			x: 162,
+			y: 142
+		},
+		{
+			x: 18,
+			y: 142
+		}
+	],
+	D: [
+		{
+			x: 202,
+			y: 16
+		},
+		{
+			x: 342,
+			y: 16
+		},
+		{
+			x: 272,
+			y: 138
+		}
+	],
+	L: [
+		{
+			x: 90,
+			y: 12
+		},
+		{
+			x: 90,
+			y: 96
+		},
+		{
+			x: 18,
+			y: 142
+		}
+	],
+	R: [
+		{
+			x: 90,
+			y: 96
+		},
+		{
+			x: 90,
+			y: 12
+		},
+		{
+			x: 162,
+			y: 142
+		}
+	]
+};
+const det = (a, b, c, d) => a * d - b * c;
+const lineIntersection = (firstStart, firstEnd, secondStart, secondEnd) => {
+	const firstDet = det(firstStart.x, firstStart.y, firstEnd.x, firstEnd.y);
+	const secondDet = det(secondStart.x, secondStart.y, secondEnd.x, secondEnd.y);
+	const divisor = det(firstStart.x - firstEnd.x, firstStart.y - firstEnd.y, secondStart.x - secondEnd.x, secondStart.y - secondEnd.y);
+	return {
+		x: det(firstDet, firstStart.x - firstEnd.x, secondDet, secondStart.x - secondEnd.x) / divisor,
+		y: det(firstDet, firstStart.y - firstEnd.y, secondDet, secondStart.y - secondEnd.y) / divisor
+	};
+};
+const polygonPath = (points) => {
+	const [firstPoint, ...remainingPoints] = points;
+	if (!firstPoint) return "";
+	return [
+		`M ${formatCoordinate(firstPoint.x)} ${formatCoordinate(firstPoint.y)}`,
+		...remainingPoints.map((pointValue) => `L ${formatCoordinate(pointValue.x)} ${formatCoordinate(pointValue.y)}`),
+		"Z"
+	].join(" ");
+};
+const formatCoordinate = (value) => Number(value.toFixed(3));
+const lineworkPath = (segments) => segments.map(({ start, end }) => `M ${formatCoordinate(start.x)} ${formatCoordinate(start.y)} L ${formatCoordinate(end.x)} ${formatCoordinate(end.y)}`).join(" ");
+const createStickerPolygons = (boundary) => {
+	const edgePoints = [];
+	for (let index = 0; index < 3; index += 1) {
+		const current = boundary[index];
+		const next = boundary[(index + 1) % 3];
+		edgePoints[index] = {
+			x: 1 / 3 * next.x + 2 / 3 * current.x,
+			y: 1 / 3 * next.y + 2 / 3 * current.y
+		};
+		edgePoints[index + 3] = {
+			x: 2 / 3 * next.x + 1 / 3 * current.x,
+			y: 2 / 3 * next.y + 1 / 3 * current.y
+		};
+	}
+	const center = lineIntersection(edgePoints[0], edgePoints[4], edgePoints[2], edgePoints[3]);
+	const stickers = [];
+	for (let index = 0; index < 3; index += 1) {
+		stickers[3 * index] = [
+			boundary[index],
+			edgePoints[index],
+			edgePoints[3 + (2 + index) % 3]
+		];
+		stickers[3 * index + 1] = [
+			edgePoints[index],
+			edgePoints[3 + (index + 2) % 3],
+			center
+		];
+		stickers[3 * index + 2] = [
+			edgePoints[index],
+			edgePoints[index + 3],
+			center
+		];
+	}
+	return stickers;
+};
+const colorForSticker = (facelet, colors) => colors[PYRAMINX_FACES[facelet] ?? "F"];
+const createFaceStickers = (state, face, colors) => {
+	const faceIndex = PYRAMINX_FACES.indexOf(face);
+	const stickers = state.image[faceIndex];
+	return createStickerPolygons(FACE_BOUNDARIES[face]).map((polygon, stickerIndex) => ({
+		points: polygon,
+		fill: colorForSticker(stickers[stickerIndex], colors)
+	}));
+};
+const segmentKey = ({ start, end }) => {
+	const startKey = `${formatCoordinate(start.x)},${formatCoordinate(start.y)}`;
+	const endKey = `${formatCoordinate(end.x)},${formatCoordinate(end.y)}`;
+	return startKey < endKey ? `${startKey}|${endKey}` : `${endKey}|${startKey}`;
+};
+const createLineworkSegments = (stickers) => {
+	const segments = /* @__PURE__ */ new Map();
+	for (const sticker of stickers) for (let index = 0; index < sticker.points.length; index += 1) {
+		const segment = {
+			start: sticker.points[index],
+			end: sticker.points[(index + 1) % sticker.points.length]
+		};
+		segments.set(segmentKey(segment), segment);
+	}
+	return [...segments.values()];
+};
+const drawStickers = (stickers) => stickers.map((sticker) => path({
+	d: polygonPath(sticker.points),
+	fill: sticker.fill,
+	stroke: "none"
+}));
+const drawLinework = (stickers) => path({
+	d: lineworkPath(createLineworkSegments(stickers)),
+	fill: "none",
+	stroke: STROKE,
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round",
+	"stroke-width": STROKE_WIDTH
+});
+const drawFaces = (state, colors) => {
+	const stickers = VISIBLE_FACES.flatMap((face) => createFaceStickers(state, face, colors));
+	return [...drawStickers(stickers), drawLinework(stickers)];
+};
+const renderPyraminxIsometricState = (state, colorScheme = {}) => {
+	return createSvgDocument(WIDTH, HEIGHT, drawFaces(state, {
+		...DEFAULT_PYRAMINX_COLORS,
+		...colorScheme
+	}));
+};
+//#endregion
+export { renderPyraminxIsometricState };

package/dist/scramble-image/src/renderers/pyraminx.d.mts

@@ -0,0 +1,9 @@
+import { PyraminxFace } from "../../../scramble-puzzle/src/pyraminx/pyraminx-parser.mjs";
+import { PyraminxState } from "../../../scramble-puzzle/src/pyraminx/pyraminx-state.mjs";
+import { HexColor } from "../color.mjs";
+
+//#region .build/vendor/scramble-image/src/renderers/pyraminx.d.ts
+type PyraminxColorScheme = Partial<Record<PyraminxFace, HexColor>>;
+declare const renderPyraminxState: (state: PyraminxState, colorScheme?: PyraminxColorScheme) => string;
+//#endregion
+export { PyraminxColorScheme, renderPyraminxState };

package/dist/scramble-image/src/renderers/pyraminx.mjs

@@ -0,0 +1,111 @@
+import { PYRAMINX_FACES } from "../../../scramble-puzzle/src/pyraminx/pyraminx-parser.mjs";
+import "../../../scramble-puzzle/src/index.mjs";
+import { createSvgDocument } from "../svg/svg-document.mjs";
+import { path } from "../svg/svg-elements.mjs";
+//#region .build/vendor/scramble-image/src/renderers/pyraminx.ts
+const PIECE_SIZE = 30;
+const GAP = 5;
+const WIDTH = 6 * PIECE_SIZE + 4 * GAP;
+const HEIGHT = Math.trunc(2 * 1.5 * Math.sqrt(3) * PIECE_SIZE + 3 * GAP);
+const STROKE = "#000000";
+const STROKE_WIDTH = 1.25;
+const DEFAULT_PYRAMINX_COLORS = {
+	F: "#00ff00",
+	D: "#ffff00",
+	L: "#ff0000",
+	R: "#0000ff"
+};
+const det = (a, b, c, d) => a * d - b * c;
+const lineIntersection = (firstStart, firstEnd, secondStart, secondEnd) => {
+	const firstDet = det(firstStart.x, firstStart.y, firstEnd.x, firstEnd.y);
+	const secondDet = det(secondStart.x, secondStart.y, secondEnd.x, secondEnd.y);
+	const divisor = det(firstStart.x - firstEnd.x, firstStart.y - firstEnd.y, secondStart.x - secondEnd.x, secondStart.y - secondEnd.y);
+	return {
+		x: det(firstDet, firstStart.x - firstEnd.x, secondDet, secondStart.x - secondEnd.x) / divisor,
+		y: det(firstDet, firstStart.y - firstEnd.y, secondDet, secondStart.y - secondEnd.y) / divisor
+	};
+};
+const triangleBoundary = (x, y, pointsUp) => {
+	const radius = Math.trunc(Math.sqrt(3) * PIECE_SIZE);
+	return [
+		7 / 6,
+		11 / 6,
+		.5
+	].map((angle) => (pointsUp ? angle + 1 / 3 : angle) * Math.PI).map((angle) => ({
+		x: x + radius * Math.cos(angle),
+		y: y + radius * Math.sin(angle)
+	}));
+};
+const polygonPath = (points) => {
+	const [firstPoint, ...remainingPoints] = points;
+	if (firstPoint === void 0) return "";
+	return [
+		`M ${firstPoint.x} ${firstPoint.y}`,
+		...remainingPoints.map((pointValue) => `L ${pointValue.x} ${pointValue.y}`),
+		"Z"
+	].join(" ");
+};
+const createStickerPolygons = (boundary) => {
+	const edgePoints = [];
+	for (let index = 0; index < 3; index += 1) {
+		const current = boundary[index];
+		const next = boundary[(index + 1) % 3];
+		edgePoints[index] = {
+			x: 1 / 3 * next.x + 2 / 3 * current.x,
+			y: 1 / 3 * next.y + 2 / 3 * current.y
+		};
+		edgePoints[index + 3] = {
+			x: 2 / 3 * next.x + 1 / 3 * current.x,
+			y: 2 / 3 * next.y + 1 / 3 * current.y
+		};
+	}
+	const center = lineIntersection(edgePoints[0], edgePoints[4], edgePoints[2], edgePoints[3]);
+	const stickers = [];
+	for (let index = 0; index < 3; index += 1) {
+		stickers[3 * index] = [
+			boundary[index],
+			edgePoints[index],
+			edgePoints[3 + (2 + index) % 3]
+		];
+		stickers[3 * index + 1] = [
+			edgePoints[index],
+			edgePoints[3 + (index + 2) % 3],
+			center
+		];
+		stickers[3 * index + 2] = [
+			edgePoints[index],
+			edgePoints[index + 3],
+			center
+		];
+	}
+	return stickers;
+};
+const faceBoundary = (face) => {
+	switch (face) {
+		case "F": return triangleBoundary(2 * GAP + 3 * PIECE_SIZE, GAP + Math.sqrt(3) * PIECE_SIZE, true);
+		case "D": return triangleBoundary(2 * GAP + 3 * PIECE_SIZE, 2 * GAP + 2 * Math.sqrt(3) * PIECE_SIZE, false);
+		case "L": return triangleBoundary(GAP + 1.5 * PIECE_SIZE, GAP + Math.sqrt(3) / 2 * PIECE_SIZE, false);
+		case "R": return triangleBoundary(3 * GAP + 4.5 * PIECE_SIZE, GAP + Math.sqrt(3) / 2 * PIECE_SIZE, false);
+	}
+};
+const colorForSticker = (facelet, colors) => colors[PYRAMINX_FACES[facelet] ?? "F"];
+const drawFace = (state, face, colors) => {
+	const faceIndex = PYRAMINX_FACES.indexOf(face);
+	const stickers = state.image[faceIndex];
+	return createStickerPolygons(faceBoundary(face)).map((polygon, stickerIndex) => path({
+		d: polygonPath(polygon),
+		fill: colorForSticker(stickers[stickerIndex], colors),
+		stroke: STROKE,
+		"stroke-width": STROKE_WIDTH,
+		"stroke-linejoin": "round"
+	}));
+};
+const renderPyraminxState = (state, colorScheme = {}) => {
+	const colors = {
+		...DEFAULT_PYRAMINX_COLORS,
+		...colorScheme
+	};
+	return createSvgDocument(WIDTH, HEIGHT, PYRAMINX_FACES.flatMap((face) => drawFace(state, face, colors)));
+};
+//#endregion
+export { renderPyraminxState };

package/dist/scramble-image/src/renderers/skewb-isometric.d.mts

@@ -0,0 +1,9 @@
+import { SkewbFace } from "../../../scramble-puzzle/src/skewb/skewb-parser.mjs";
+import { SkewbState } from "../../../scramble-puzzle/src/skewb/skewb-state.mjs";
+import { HexColor } from "../color.mjs";
+
+//#region .build/vendor/scramble-image/src/renderers/skewb-isometric.d.ts
+type SkewbIsometricColorScheme = Partial<Record<SkewbFace, HexColor>>;
+declare const renderSkewbIsometricState: (state: SkewbState, colorScheme?: SkewbIsometricColorScheme) => string;
+//#endregion
+export { SkewbIsometricColorScheme, renderSkewbIsometricState };