AegisSight/AegisSight-Globe
2
0
Fork 0
Code Issues Pull-Requests Actions Pakete Projekte Releases Wiki Aktivität

Mouse-Over Tooltips fuer alle Layer und Visual Modes

Quellcode durchsuchen 
Jedes interaktive Element hat einen erklaerenden Tooltip:
- Layer-Checkboxen: Datenquelle, Refresh-Rate, Anzahl
- Layer-Namen: Inhalt und Farbkodierung
- Visual Modes: Erklaerung des Effekts
- Custom CSS-Tooltips passend zum Dark-Theme
Dieser Commit ist enthalten in:
Claude Dev
2026-03-24 12:54:46 +01:00
Ursprung 9b4ea4cd28
Commit 15725e9f81
2 geänderte Dateien mit 45 neuen und 20 gelöschten Zeilen
Patch-Datei herunterladen Vergleichs-Datei herunterladen Alle Dateien ausklappen Alle Dateien einklappen

40
static/index.html
Datei anzeigen

@@ -47,49 +47,49 @@
<h3 class="panel-title">LAYER</h3>
<div class="panel-section">
<label class="layer-toggle">
<input type="checkbox" id="layer-flights">
<input type="checkbox" id="layer-flights" title="Echtzeit-Flugverkehr weltweit (OpenSky Network, ~7.000 Flugzeuge, 15s Refresh)">
<span class="layer-dot dot-flights"></span>
<span class="layer-name">Flugverkehr</span>
<span class="layer-name" title="~7.000 Flugzeuge weltweit, Position + Hoehe + Geschwindigkeit">Flugverkehr</span>
<span class="layer-count" id="count-flights">-</span>
</label>
<div class="layer-loading" id="loading-flights"></div>
<div class="layer-status" id="status-flights"></div>
<label class="layer-toggle">
<input type="checkbox" id="layer-ships">
<input type="checkbox" id="layer-ships" title="Echtzeit-Schiffsverkehr weltweit (AISStream AIS-Daten, kontinuierlich)">
<span class="layer-dot dot-ships"></span>
<span class="layer-name">Schiffsverkehr</span>
<span class="layer-name" title="Tausende Schiffe global, MMSI + SOG + COG">Schiffsverkehr</span>
<span class="layer-count" id="count-ships">-</span>
</label>
<div class="layer-loading" id="loading-ships"></div>
<div class="layer-status" id="status-ships"></div>
<label class="layer-toggle">
<input type="checkbox" id="layer-quakes">
<input type="checkbox" id="layer-quakes" title="Erdbeben M2.5+ der letzten 24h (USGS Earthquake Hazards, 5min Refresh)">
<span class="layer-dot dot-quakes"></span>
<span class="layer-name">Erdbeben</span>
<span class="layer-name" title="Magnitude 2.5+, Farbe nach Alter (rot=frisch, gelb=aelter)">Erdbeben</span>
<span class="layer-count" id="count-quakes">-</span>
</label>
<div class="layer-loading" id="loading-quakes"></div>
<div class="layer-status" id="status-quakes"></div>
<label class="layer-toggle">
<input type="checkbox" id="layer-gdelt">
<input type="checkbox" id="layer-gdelt" title="Geokodierte Nachrichten der letzten 24h (GDELT Global Event Database)">
<span class="layer-dot dot-gdelt"></span>
<span class="layer-name">Nachrichten</span>
<span class="layer-name" title="Geokodierte News-Events, thematisch zur aktuellen Weltlage">Nachrichten</span>
<span class="layer-count" id="count-gdelt">-</span>
</label>
<div class="layer-loading" id="loading-gdelt"></div>
<div class="layer-status" id="status-gdelt"></div>
<label class="layer-toggle">
<input type="checkbox" id="layer-satellites">
<input type="checkbox" id="layer-satellites" title="Satelliten-Orbits in Echtzeit (CelesTrak TLE: ISS, GPS, Galileo, Starlink)">
<span class="layer-dot dot-satellites"></span>
<span class="layer-name">Satelliten</span>
<span class="layer-name" title="ISS (rot), GPS (orange), Galileo (blau), Starlink (grau)">Satelliten</span>
<span class="layer-count" id="count-satellites">-</span>
</label>
<div class="layer-loading" id="loading-satellites"></div>
<div class="layer-status" id="status-satellites"></div>
<label class="layer-toggle">
<input type="checkbox" id="layer-disasters">
<input type="checkbox" id="layer-disasters" title="Aktive Naturkatastrophen (NASA EONET: Waldbraende, Vulkane, Stuerme, Fluten)">
<span class="layer-dot dot-disasters"></span>
<span class="layer-name">Katastrophen</span>
<span class="layer-name" title="Waldbraende, Vulkane, Stuerme, Fluten, Erdrutsche, Eisschmelze">Katastrophen</span>
<span class="layer-count" id="count-disasters">-</span>
</label>
<div class="layer-loading" id="loading-disasters"></div>
@@ -98,14 +98,14 @@
<div class="panel-divider"></div>
<div class="panel-section">
<label class="layer-toggle">
<input type="checkbox" id="layer-daynight">
<input type="checkbox" id="layer-daynight" title="Tag/Nacht-Beleuchtung basierend auf aktueller Sonnenposition">
<span class="layer-dot dot-daynight"></span>
<span class="layer-name">Tag/Nacht</span>
<span class="layer-name" title="Sonnenlicht-Simulation zeigt aktuelle Tages-/Nachtseite">Tag/Nacht</span>
</label>
<label class="layer-toggle">
<input type="checkbox" id="layer-labels" checked>
<input type="checkbox" id="layer-labels" title="Laendergrenzen, Staedte und Gewaessernamen (Esri World Boundaries)" checked>
<span class="layer-dot dot-labels"></span>
<span class="layer-name">Ortsnamen</span>
<span class="layer-name" title="Laendergrenzen, Hauptstaedte, Fluesse, Meere">Ortsnamen</span>
</label>
</div>
<div class="panel-divider"></div>
@@ -113,10 +113,10 @@
<div class="panel-section">
<div style="font-size:9px;letter-spacing:1.5px;color:var(--accent);margin-bottom:6px;">ANSICHT</div>
<div style="display:flex;gap:4px;flex-wrap:wrap;">
<button class="vmode-btn active" data-mode="standard" onclick="VisualModes.set('standard')">STD</button>
<button class="vmode-btn" data-mode="nvg" onclick="VisualModes.set('nvg')">NVG</button>
<button class="vmode-btn" data-mode="flir" onclick="VisualModes.set('flir')">FLIR</button>
<button class="vmode-btn" data-mode="crt" onclick="VisualModes.set('crt')">CRT</button>
<button class="vmode-btn active" data-mode="standard" title="Standard: Photorealistische Darstellung" onclick="VisualModes.set('standard')">STD</button>
<button class="vmode-btn" data-mode="nvg" title="Night Vision: Gruener Monochrom-Filter (Nachtsichtgeraet)" onclick="VisualModes.set('nvg')">NVG</button>
<button class="vmode-btn" data-mode="flir" title="FLIR Thermal: Infrarot-Darstellung fuer Waermesignaturen" onclick="VisualModes.set('flir')">FLIR</button>
<button class="vmode-btn" data-mode="crt" title="CRT Monitor: Retro-Ueberwachungsbildschirm mit Scanlines" onclick="VisualModes.set('crt')">CRT</button>
</div>
</div>
<div class="panel-divider"></div>