46 lines
3.1 KiB
JavaScript
46 lines
3.1 KiB
JavaScript
export function buildStructuralSidebar(modeTitle, sInfo, esc) {
|
||
return `
|
||
<div class="former-sidebar-header">
|
||
<h3>${modeTitle}</h3>
|
||
<button class="btn btn-sm" onclick="navigate(state.project ? 'dashboard' : 'landing')">Close</button>
|
||
</div>
|
||
<div style="padding:12px 16px">
|
||
<div style="font-size:12px;color:var(--text-secondary);margin-bottom:8px">
|
||
${sInfo?.svgPath ? esc(sInfo.svgPath.split('/').pop()) : 'No SVG'} |
|
||
${sInfo?.svgWidth?.toFixed(1) || '?'} × ${sInfo?.svgHeight?.toFixed(1) || '?'} mm
|
||
</div>
|
||
<div class="form-row" style="margin:4px 0">
|
||
<span class="form-label" style="font-size:11px;min-width:70px">Pattern</span>
|
||
<select class="form-input" id="sf-pattern" style="font-size:11px" onchange="updateStructuralLive()">
|
||
${['hexagon','triangle','diamond','voronoi','grid','gyroid'].map(p =>
|
||
`<option value="${p}" ${p === sInfo?.pattern ? 'selected' : ''}>${p}</option>`
|
||
).join('')}
|
||
</select>
|
||
</div>
|
||
<div class="form-row" style="margin:4px 0">
|
||
<span class="form-label" style="font-size:11px;min-width:70px">Cell (mm)</span>
|
||
<input class="form-input" id="sf-cell" type="number" step="0.5" value="${sInfo?.cellSize || 10}" style="font-size:11px" onchange="updateStructuralLive()">
|
||
</div>
|
||
<div class="form-row" style="margin:4px 0">
|
||
<span class="form-label" style="font-size:11px;min-width:70px">Wall (mm)</span>
|
||
<input class="form-input" id="sf-wall" type="number" step="0.1" value="${sInfo?.wallThick || 1.2}" style="font-size:11px" onchange="updateStructuralLive()">
|
||
</div>
|
||
<div class="form-row" style="margin:4px 0">
|
||
<span class="form-label" style="font-size:11px;min-width:70px">Height (mm)</span>
|
||
<input class="form-input" id="sf-height" type="number" step="1" value="${sInfo?.height || 20}" style="font-size:11px" onchange="updateStructuralLive()">
|
||
</div>
|
||
<div style="margin-top:8px">
|
||
<button class="btn btn-sm btn-primary" onclick="renderStructuralPreview()" style="width:100%">Render Preview</button>
|
||
</div>
|
||
</div>
|
||
<div id="former-render-result" style="display:none;padding:8px 16px;border-top:1px solid var(--border-light);background:rgba(166,227,161,0.08)">
|
||
<div style="font-size:12px;color:var(--success);margin-bottom:4px;font-weight:600">Render Complete</div>
|
||
<div id="former-render-files" style="font-size:11px;color:var(--text-secondary);margin-bottom:6px;font-family:var(--font-mono);line-height:1.5"></div>
|
||
<div style="display:flex;gap:4px">
|
||
<button class="btn btn-sm" onclick="formerReturnToEditor()" style="flex:1">Return to Editor</button>
|
||
<button class="btn btn-sm" onclick="openOutputFolder()" style="flex:1;border-color:var(--accent);color:var(--accent)">Open Folder</button>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|