D4rkst3r/d4rk_divegear
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: weggegebene Flasche beendet den Tauchgang + HUD-Feinschliff

Browse Source 
Bug: wer die getragene Flasche im Tauchgang weggab, konnte unbegrenzt
weiteratmen. Der Client hielt nur eine Slot-Nummer, die niemand mehr
gegenpruefte, und der Sync lief ins Leere. ox_inventory feuert clientseitig bei
jeder Inventar-Aenderung - dort wird jetzt beim Server nachgefragt. Ist die
Flasche weg, kommt die Ausruestung ab; wurde sie nur umsortiert, bindet der
Client auf den neuen Slot um, damit Aufraeumen im Inventar nichts kostet.

HUD:
- Werte aus den Uhren heraus in eine zweite Zeile: Druck, Lampe und Tiefe
  liegen jetzt auf einer Linie. In der Skala kollidierte die Zahl mit
  Strichen, Zeiger und rotem Bereich
- Skaliert mit der Bildschirmhoehe (entworfen auf 1080p), sonst waere das in
  festen Pixeln gebaute HUD auf 1440p und 4K deutlich zu klein.
  config.hudScale kommt als Geschmacksregler obendrauf
- Zustandsklassen sitzen jetzt am HUD statt an den Uhren, weil Instrument und
  Wert in getrennten Grid-Zellen liegen

README-Renderings nachgezogen.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
D4rkst3r
2026-08-11 10:04:08 +02:00
co-authored by Claude Opus 5
parent 30c40c9f69
commit fcca73bc7a
13 changed files with 223 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files
nui/index.html
+32 -28
View File
@@ -5,22 +5,20 @@
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- Zeile 1: die drei Instrumente. Zeile 2: ihre Werte, mit der Lampe
dazwischen - alles auf einer Linie. -->
<div id="hud" class="hidden">
<!-- Finimeter: Restdruck der Flasche, roter Bereich = Reserve -->
<div class="dial" id="pressure">
<div class="dial-face">
<svg viewBox="0 0 100 100" aria-hidden="true">
<circle class="face" cx="50" cy="50" r="46"></circle>
<path class="zone" id="pressure-zone"></path>
<g class="ticks" id="pressure-ticks"></g>
<g class="needle" id="pressure-needle">
<line x1="50" y1="58" x2="50" y2="17"></line>
<circle cx="50" cy="50" r="3.4"></circle>
</g>
</svg>
<div class="dial-value"><span id="pressure-value">0</span><span class="unit">bar</span></div>
</div>
<span id="pressure-label" class="caption">DRUCK</span>
<div class="dial-face" id="pressure-face">
<svg viewBox="0 0 100 100" aria-hidden="true">
<circle class="face" cx="50" cy="50" r="46"></circle>
<path class="zone" id="pressure-zone"></path>
<g class="ticks" id="pressure-ticks"></g>
<g class="needle" id="pressure-needle">
<line x1="50" y1="58" x2="50" y2="17"></line>
<circle cx="50" cy="50" r="3.4"></circle>
</g>
</svg>
</div>
<!-- Restluft als Ring, die Zahl auf die es ankommt -->
@@ -36,20 +34,21 @@
</div>
<!-- Tiefenmesser: roter Bereich = Tiefengrenze des Atemgases -->
<div class="dial" id="depth">
<div class="dial-face">
<svg viewBox="0 0 100 100" aria-hidden="true">
<circle class="face" cx="50" cy="50" r="46"></circle>
<path class="zone" id="depth-zone"></path>
<g class="ticks" id="depth-ticks"></g>
<g class="needle" id="depth-needle">
<line x1="50" y1="58" x2="50" y2="17"></line>
<circle cx="50" cy="50" r="3.4"></circle>
</g>
</svg>
<div class="dial-value"><span id="depth-value">0.0</span><span class="unit">m</span></div>
</div>
<span id="depth-label" class="caption">TIEFE</span>
<div class="dial-face" id="depth-face">
<svg viewBox="0 0 100 100" aria-hidden="true">
<circle class="face" cx="50" cy="50" r="46"></circle>
<path class="zone" id="depth-zone"></path>
<g class="ticks" id="depth-ticks"></g>
<g class="needle" id="depth-needle">
<line x1="50" y1="58" x2="50" y2="17"></line>
<circle cx="50" cy="50" r="3.4"></circle>
</g>
</svg>
</div>
<div class="readout" id="pressure-readout">
<span id="pressure-label" class="caption">DRUCK</span>
<div class="value"><span id="pressure-value">0</span><span class="unit">bar</span></div>
</div>
<div id="lamp" class="lamp">
@@ -58,6 +57,11 @@
</svg>
<span id="lamp-label">LAMPE</span>
</div>
<div class="readout" id="depth-readout">
<span id="depth-label" class="caption">TIEFE</span>
<div class="value"><span id="depth-value">0.0</span><span class="unit">m</span></div>
</div>
</div>
<script src="script.js"></script>