got-feedBack/feedBack
1
0
Fork 0
mirror of https://github.com/got-feedBack/feedBack.git synced 2026-08-11 03:09:57 +00:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

feat(drum_highway_3d): materials & themes — studio env map, metal cymbals, BG_THEMES, cinematic, glow/vibrancy (D3) (#712)

Browse Source 
- _makeStudioEnv: procedural PMREM environment (no RoomEnvironment addon
  vendored) -> scene.environment; rebuilt on kit-change, disposed both
  teardown paths
- Cymbals roughness 0.2 / metalness 0.85 / envMapIntensity 1.2 (metal
  finally reads); discs satin 0.45 + envInt 0.5; floor 0.7 + envInt 0.35;
  hit bar envInt 1.0
- BG_THEMES port (guitar ids/values; drum 'default' = original palette
  byte-for-byte; single pick drives clear/fog + board + lane stripes);
  drumH3dSetTheme + drum_h3d_bg_theme; live _applyTheme
- Cinematic lighting toggle (0.3/1.2 on, 0.4/1.0 off = stock)
- Glow slider (base * glow*2; 0.5 default = stock) across notes/hit
  bar/snare stripe; Lane vibrancy slider (stripe base 0.12+0.24v +
  halo/ghost opacities), stacking under the D2 approach highlight
- Fixed pre-existing floor/hit-bar geometry+material leak on kit change
- Tests: theme table parity + default preservation + fallbacks (13)

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Byron Gamatos
2026-07-02 08:54:17 +02:00
committed by GitHub
co-authored by Claude Fable 5
parent 80fc371f11
commit 4214ef365e
5 changed files with 374 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/drum_highway_3d/settings.html
+72 -6
View File
@@ -45,7 +45,63 @@
<!-- Graphics -->
<div class="mt-6 border-t border-gray-800 pt-4">
<h4 class="text-xs font-medium text-gray-300 mb-2">Graphics</h4>
<label for="drumh3d-fx-bloom" class="flex items-center gap-2 text-xs text-gray-300 cursor-pointer">
<label for="drumh3d-fx-theme" class="text-xs font-medium text-gray-400 mb-1 block">Scene theme</label>
<select id="drumh3d-fx-theme"
onchange="window.drumH3dSetTheme && window.drumH3dSetTheme(this.value)"
class="w-full bg-dark-700 border border-gray-800 rounded-lg px-3 py-2 text-xs text-gray-300 outline-none">
<option value="default">Default (original)</option>
<option value="midnight">Midnight</option>
<option value="charcoal">Charcoal</option>
<option value="deeppurple">Deep Purple</option>
<option value="forest">Forest</option>
<option value="warmslate">Warm Slate</option>
<option value="deepfocus">Deep Focus</option>
<option value="deepsea">Deep Sea</option>
<option value="cathode">Cathode</option>
<option value="cathodegreen">Cathode Green</option>
<option value="hearth">Hearth</option>
</select>
<p class="text-xs text-gray-500 mt-1 mb-3">
Background, floor and lane colours — the same theme names as the
guitar highway, so your look carries across instruments. Piece
colours stay with the Palette above.
</p>
<label for="drumh3d-fx-cinematic" class="flex items-center gap-2 text-xs text-gray-300 cursor-pointer">
<input type="checkbox" id="drumh3d-fx-cinematic" checked
onchange="window.drumH3dSetFx && window.drumH3dSetFx('cinematic', this.checked)">
Cinematic lighting
</label>
<p class="text-xs text-gray-500 mt-1">
Dimmer ambience, stronger key light — more depth on the cymbals
and drumheads.
</p>
<label for="drumh3d-fx-glow" class="text-xs font-medium text-gray-400 mb-1 mt-3 block">
Glow strength <span id="drumh3d-fx-glow-val" class="text-gray-500 font-mono">0.50</span>
</label>
<input type="range" id="drumh3d-fx-glow"
min="0" max="1" step="0.05" value="0.5"
oninput="window.drumH3dSetFx && window.drumH3dSetFx('glow', this.value); document.getElementById('drumh3d-fx-glow-val').textContent = parseFloat(this.value).toFixed(2)"
class="w-full">
<p class="text-xs text-gray-500 mt-1">
How hard the notes and hit line self-illuminate (0.5 = stock).
Pairs with bloom.
</p>
<label for="drumh3d-fx-vibrancy" class="text-xs font-medium text-gray-400 mb-1 mt-3 block">
Lane vibrancy <span id="drumh3d-fx-vibrancy-val" class="text-gray-500 font-mono">0.85</span>
</label>
<input type="range" id="drumh3d-fx-vibrancy"
min="0" max="1" step="0.05" value="0.85"
oninput="window.drumH3dSetFx && window.drumH3dSetFx('vibrancy', this.value); document.getElementById('drumh3d-fx-vibrancy-val').textContent = parseFloat(this.value).toFixed(2)"
class="w-full">
<p class="text-xs text-gray-500 mt-1">
Lane stripe and accent-ring strength — lower for a calmer deck.
</p>
<label for="drumh3d-fx-bloom" class="flex items-center gap-2 text-xs text-gray-300 cursor-pointer mt-3">
<input type="checkbox" id="drumh3d-fx-bloom" checked
onchange="window.drumH3dSetFx && window.drumH3dSetFx('bloom', this.checked)">
Glow (bloom)
@@ -489,11 +545,21 @@
hydrateFxBool('sparks', 'drumh3d-fx-sparks');
hydrateFxBool('timingFx', 'drumh3d-fx-timing');
hydrateFxBool('streakFx', 'drumh3d-fx-streak');
const storedHitFx = parseFloat(localStorage.getItem('drum_h3d_bg_hitFx'));
if (Number.isFinite(storedHitFx)) {
const v = Math.min(1, Math.max(0, storedHitFx));
document.getElementById('drumh3d-fx-hitfx').value = String(v);
document.getElementById('drumh3d-fx-hitfx-val').textContent = v.toFixed(2);
hydrateFxBool('cinematic', 'drumh3d-fx-cinematic');
const hydrateFxRange = (key, elId, valId) => {
const n = parseFloat(localStorage.getItem('drum_h3d_bg_' + key));
if (!Number.isFinite(n)) return;
const v = Math.min(1, Math.max(0, n));
document.getElementById(elId).value = String(v);
document.getElementById(valId).textContent = v.toFixed(2);
};
hydrateFxRange('hitFx', 'drumh3d-fx-hitfx', 'drumh3d-fx-hitfx-val');
hydrateFxRange('glow', 'drumh3d-fx-glow', 'drumh3d-fx-glow-val');
hydrateFxRange('vibrancy', 'drumh3d-fx-vibrancy', 'drumh3d-fx-vibrancy-val');
const storedTheme = localStorage.getItem('drum_h3d_bg_theme');
const themeSel = document.getElementById('drumh3d-fx-theme');
if (storedTheme && Array.from(themeSel.options).some(o => o.value === storedTheme)) {
themeSel.value = storedTheme;
}
} catch (e) {
console.warn('[Drum-Hwy3D settings] hydration failed:', e);