From d67191d7c36652e85c95b3f840e3de418b48f5a2 Mon Sep 17 00:00:00 2001 From: root Date: Wed, 22 Apr 2026 21:05:47 +0000 Subject: [PATCH] Interaktive Fehlerstrom-Simulation: SVG-Schaltkreis mit 5-Schritt-Animation und Reset Made-with: Cursor --- index.html | 131 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 131 insertions(+) diff --git a/index.html b/index.html index e71a4ed..aca5593 100644 --- a/index.html +++ b/index.html @@ -308,6 +308,15 @@ td.mono,th.mono{font-family:'Share Tech Mono',monospace;font-size:.85rem} .subtask h3{margin:0 0 .35rem;color:var(--accent-dark);font-size:1.15rem;font-weight:700} .subtask p.lead{color:var(--muted);margin:0;font-size:.94rem} +/* ─── FAULT SIMULATION ──────────────────────── */ +.fsim-card{background:var(--panel);border:2px solid var(--border);border-radius:16px;padding:1.5rem 1.5rem 1.25rem;margin:1.5rem 0;overflow-x:auto} +.fsim-btn{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:.75rem 1.5rem;font-family:'Outfit',sans-serif;font-weight:700;font-size:.95rem;cursor:pointer;transition:background .2s,transform .15s} +.fsim-btn:hover:not(:disabled){background:var(--accent-dark);transform:translateY(-1px)} +.fsim-btn:disabled{opacity:.65;cursor:not-allowed} +.fsim-btn.reset-mode{background:#6b7280} +.fsim-btn.reset-mode:hover:not(:disabled){background:#4b5563} +#fscbar{transform-box:fill-box;transform-origin:0% 50%;transition:transform .45s ease,stroke .3s} + /* ─── FOOTER ────────────────────────────────── */ footer{padding:2rem 1.25rem 3rem;text-align:center;color:var(--muted);font-size:.85rem;border-top:1px solid var(--border);margin-top:2rem} @@ -735,6 +744,71 @@ footer{padding:2rem 1.25rem 3rem;text-align:center;color:var(--muted);font-size: + + +
+
+ +
+ + + HAUPTSTROMKREIS + STEUERSTROMKREIS + + + + 400V + Source + + + + + + + LS / RLS + Schutzorgan + Auslösung! + + + + + + + ⚡ + + + + + + + + + + Schütz fällt ab + + + + + + + M + Motor M1 + Motor spannungsfrei + + + + + + + + A1 / A2 + Spule + + + + mech. + +
@@ -953,6 +1027,63 @@ document.querySelectorAll('img').forEach(img => { }); }); +/* ─── FAULT CURRENT SIMULATION ─────────────────────── */ +let fsRunning = false, fsFaulted = false; +const FS_G = '#16a34a', FS_R = '#dc2626', FS_GR = '#d1d5db', FS_MU = '#9ca3af'; +function _fss(id, attr, val) { const e = document.getElementById(id); if (e) e.setAttribute(attr, val); } +function _fso(id) { const e = document.getElementById(id); if (e) e.style.opacity = '1'; } + +function runFaultSim() { + if (fsRunning) return; + const btn = document.getElementById('fsimBtn'); + if (fsFaulted) { + fsFaulted = false; + btn.textContent = 'Fehlerstrom simulieren'; + btn.classList.remove('reset-mode'); + // Restore all green + ['fsw2','fsw3','fsw4','fscl','fscr','fscc1','fscc2','fsccoil','fsmot'].forEach(id => _fss(id,'stroke',FS_G)); + _fss('fsr','stroke',FS_G); _fss('fst1','fill',FS_G); _fss('fsccoilt','fill',FS_G); _fss('fsmotm','fill',FS_G); + // Reset contact bar + const bar = document.getElementById('fscbar'); + bar.style.transform = ''; bar.setAttribute('stroke', FS_G); + // Hide bolt + labels + const bolt = document.getElementById('fsbolt'); + bolt.style.opacity = '0'; bolt.style.transform = 'scale(.2)'; + ['fslb-aus','fslb-ab','fslb-mfr'].forEach(id => { const e = document.getElementById(id); if (e) e.style.opacity = '0'; }); + return; + } + fsRunning = true; btn.disabled = true; btn.textContent = '·· ·· ··'; + // Step 1 (0.5s) — fault bolt + setTimeout(() => { + const b = document.getElementById('fsbolt'); + b.style.opacity = '1'; b.style.transform = 'scale(1)'; + }, 500); + // Step 2 (1s) — protection triggers + setTimeout(() => { + _fss('fsr','stroke',FS_R); _fss('fst1','fill',FS_R); _fso('fslb-aus'); + }, 1000); + // Step 3 (1.5s) — control circuit interrupted + setTimeout(() => { + ['fscc1','fscc2','fsccoil'].forEach(id => _fss(id,'stroke',FS_GR)); + _fss('fsccoilt','fill',FS_MU); + }, 1500); + // Step 4 (2s) — contacts open + setTimeout(() => { + const bar = document.getElementById('fscbar'); + bar.style.transform = 'rotate(-32deg)'; + bar.setAttribute('stroke', FS_GR); + ['fscl','fscr','fsw3'].forEach(id => _fss(id,'stroke',FS_GR)); + _fso('fslb-ab'); + }, 2000); + // Step 5 (2.5s) — motor de-energized + setTimeout(() => { + _fss('fsw4','stroke',FS_GR); _fss('fsmot','stroke',FS_GR); + _fss('fsmotm','fill',FS_GR); _fso('fslb-mfr'); + fsRunning = false; fsFaulted = true; + btn.textContent = 'Zurücksetzen'; btn.classList.add('reset-mode'); btn.disabled = false; + }, 2500); +} + /* ─── GALVANIC TOGGLE ───────────────────────────────── */ let galvOn = false; function toggleGalv() {