RnD/pumpingStation
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Editor: inline parameters diagram at top of Basin Geometry

Browse Source 
~3 KB inline SVG showing the 5 threshold lines + inlet/outlet pipe
arrows + floor datum, using the same names as the editor fields
(basinHeight, overflowLevel, maxLevel, startLevel, minLevel,
dryRunLevel). No new inputs — purely a visual reminder of what
each field refers to, so operators don't have to alt-tab to the
wiki to figure out which pipe edge to measure.

Wrapped in <details open> so users can collapse it once they
know the layout — no forced scroll through the diagram on every
edit session.

Matches the vocabulary in wiki/diagrams/basin-model.drawio.svg
(inlet = bottom of pipe, outlet = top of pipe, 0 m datum at
basin floor, dryRunLevel derived from %).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
znetsixe
2026-04-23 10:19:23 +02:00
parent 1ebbcb62cc
commit 12904b4902
1 changed files with 46 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
pumpingStation.html
View File

@@ -252,6 +252,52 @@
<h4>Basin Geometry</h4>
<p style="font-size:12px;color:#777;margin:0 0 8px 0;">All heights measured from the basin floor (0 m).</p>
<details open style="margin:0 0 12px 0;padding:6px;background:#fafafa;border:1px solid #e5e5e5;border-radius:4px;">
<summary style="cursor:pointer;font-size:12px;color:#0c99d9;user-select:none;font-weight:600;">📐 Parameters diagram</summary>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 440 310" style="display:block;width:100%;max-width:440px;margin-top:6px;" font-family="Arial,sans-serif" font-size="11">
<defs>
<marker id="ps-arrow" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
<path d="M 0 0 L 10 5 L 0 10 z" fill="#1F4E79" />
</marker>
</defs>
<!-- Tank body -->
<rect x="170" y="30" width="100" height="260" fill="#F0F8FF" stroke="#333" stroke-width="1.5" />
<!-- Dead-volume band at bottom -->
<rect x="171" y="270" width="98" height="19" fill="#AACCE0" />
<!-- basinHeight (rim) -->
<line x1="165" y1="30" x2="275" y2="30" stroke="#333" stroke-width="1.5" />
<text x="280" y="34" fill="#333" font-size="10">basinHeight</text>
<!-- overflowLevel -->
<line x1="165" y1="55" x2="275" y2="55" stroke="#C0392B" stroke-dasharray="4 2" stroke-width="1.5" />
<text x="280" y="58" fill="#C0392B" font-size="10">overflowLevel</text>
<!-- maxLevel -->
<line x1="165" y1="90" x2="275" y2="90" stroke="#D68910" stroke-dasharray="4 2" stroke-width="1.5" />
<text x="280" y="93" fill="#D68910" font-size="10">maxLevel</text>
<!-- startLevel -->
<line x1="165" y1="150" x2="275" y2="150" stroke="#1E8449" stroke-dasharray="4 2" stroke-width="1.5" />
<text x="280" y="153" fill="#1E8449" font-size="10">startLevel</text>
<!-- Inlet arrow -->
<line x1="130" y1="180" x2="170" y2="180" stroke="#1F4E79" stroke-width="2" marker-end="url(#ps-arrow)" />
<text x="125" y="177" text-anchor="end" fill="#1F4E79" font-size="10" font-weight="bold">Inlet</text>
<text x="125" y="189" text-anchor="end" fill="#777" font-size="9">bottom of pipe</text>
<!-- minLevel -->
<line x1="165" y1="215" x2="275" y2="215" stroke="#6C3483" stroke-dasharray="4 2" stroke-width="1.5" />
<text x="280" y="218" fill="#6C3483" font-size="10">minLevel</text>
<!-- dryRunLevel -->
<line x1="165" y1="245" x2="275" y2="245" stroke="#C0392B" stroke-dasharray="4 2" stroke-width="1.5" />
<text x="280" y="248" fill="#C0392B" font-size="10">dryRunLevel</text>
<text x="280" y="259" fill="#999" font-style="italic" font-size="9">safety — from %</text>
<!-- Outlet arrow -->
<line x1="270" y1="278" x2="310" y2="278" stroke="#1F4E79" stroke-width="2" marker-end="url(#ps-arrow)" />
<text x="315" y="275" fill="#1F4E79" font-size="10" font-weight="bold">Outlet</text>
<text x="315" y="287" fill="#777" font-size="9">top of pipe</text>
<!-- Floor / datum -->
<line x1="165" y1="290" x2="275" y2="290" stroke="#000" stroke-width="2" />
<text x="155" y="294" text-anchor="end" fill="#000" font-size="10">0 m (datum)</text>
</svg>
</details>
<div class="form-row">
<label for="node-input-basinVolume"><i class="fa fa-cube"></i> Basin Volume (m³)</label>
<input type="number" id="node-input-basinVolume" min="0" step="0.1" />