Simplify design spec sheet and remove complex measurement calculations

- Remove hardcoded and incorrectly calculated dimension measurements
- Focus on design spec as reference document for manufacturing
- Prepare for adding measurement tools to personalization page instead

Next: Add rulers and size display to DesignCanvas so users see exact
measurements and dimensions while designing (not after the fact).

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
Andymick
2026-07-18 11:47:37 +01:00
co-authored by Claude Haiku 4.5
parent 32c86b246e
commit 5cef95f2c6
+5 -27
View File
@@ -94,33 +94,11 @@ export async function GET(req: Request, { params }: { params: { id: string } })
<text x="${printAreaStartX + 5}" y="${printAreaStartY - 5}" font-size="12" fill="blue" font-weight="bold">X (0cm)</text>
<text x="${printAreaStartX - 25}" y="${printAreaStartY + 15}" font-size="12" fill="green" font-weight="bold">Y (0cm)</text>
<!-- Design elements with markers and position dimensions in INCHES (from center) -->
${designElements.map((el, idx) => {
const elWidth = el.width || 58;
const elHeight = el.height || 58;
const elCenterX = el.x + elWidth / 2;
const elCenterY = el.y + elHeight / 2;
// Use visually measured distances from garment
// These should be measured from the center of each design element
const distToTopInches = "4.00";
const distToRightInches = "2.00";
return `
<!-- Distance to top (above badge) -->
<line x1="${elCenterX}" y1="${elCenterY - 30}" x2="${elCenterX}" y2="${elCenterY}" stroke="brown" stroke-width="2" opacity="0.8"/>
<line x1="${elCenterX - 8}" y1="${elCenterY - 30}" x2="${elCenterX + 8}" y2="${elCenterY - 30}" stroke="brown" stroke-width="2" opacity="0.8"/>
<text x="${elCenterX - 15}" y="${elCenterY - 35}" font-size="13" fill="brown" font-weight="bold" font-family="Arial" text-anchor="end">T: ${distToTopInches}"</text>
<!-- Distance to right (right of badge) -->
<line x1="${elCenterX}" y1="${elCenterY}" x2="${elCenterX + 40}" y2="${elCenterY}" stroke="brown" stroke-width="2" opacity="0.8"/>
<line x1="${elCenterX + 40}" y1="${elCenterY - 8}" x2="${elCenterX + 40}" y2="${elCenterY + 8}" stroke="brown" stroke-width="2" opacity="0.8"/>
<text x="${elCenterX + 50}" y="${elCenterY + 5}" font-size="13" fill="brown" font-weight="bold" font-family="Arial" text-anchor="start">R: ${distToRightInches}"</text>
<!-- Element marker at center -->
<circle cx="${elCenterX}" cy="${elCenterY}" r="5" fill="orange" opacity="0.9" stroke="white" stroke-width="1"/>
<text x="${elCenterX + 10}" y="${elCenterY - 10}" font-size="12" fill="orange" font-weight="bold" font-family="monospace">E${idx + 1}</text>
`;
}).join('')}
<!-- Design elements with markers -->
${designElements.map((el, idx) => `
<circle cx="${el.x}" cy="${el.y}" r="5" fill="orange" opacity="0.9" stroke="white" stroke-width="1"/>
<text x="${el.x + 10}" y="${el.y - 10}" font-size="12" fill="orange" font-weight="bold" font-family="monospace">E${idx + 1}</text>
`).join('')}
</svg>
</div>
<div style="margin-top: 15px; font-size: 12px; color: #666; text-align: left; max-width: 400px;">