ltadeu6/skeledance
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add golden-hour veil driven by real sun altitude

Browse source 
New #duskSky layer — purple high up through coral to deep orange at the
horizon — whose opacity is a smoothstepped triangle peaking at +1° sun
altitude and vanishing outside -6°..+8°. It rides above the day sky and
also glows over the stars right after sunset and before sunrise.
Hidden in balada/chuva.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_015HtPHsTnDcLVSCiF5FGHZj
This commit is contained in:
vini 2026-07-19 22:02:37 -03:00
parent aa832727da
commit a181614e38
2 changed files with 27 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

26
plugin/contents/ui/dancer.html
View file

@ -1158,6 +1158,26 @@ body.chuva #sunChuvaFace { opacity: 1; transition: opacity 5s ease; }
}
body.dia:not(.balada):not(.chuva) #daySky { opacity: 1; }
/* Hora dourada: véu de amanhecer/pôr do sol. A opacidade é dirigida por
JS (pico com o sol a ~1° de altitude, zero fora de -6°..+8°), então o
brilho laranja aparece dos dois lados do crepúsculo — inclusive sobre
as estrelas logo depois do pôr do sol. */
#duskSky {
position: absolute;
inset: 0;
pointer-events: none;
opacity: 0;
transition: opacity 8s ease;
background: linear-gradient(to bottom,
rgba(70, 45, 110, 0.00) 0%,
rgba(150, 70, 130, 0.30) 30%,
rgba(232, 108, 88, 0.48) 52%,
rgba(255, 158, 68, 0.80) 66%,
rgba(90, 55, 45, 0.40) 66.1%,
rgba(30, 25, 35, 0.00) 100%);
}
body.balada #duskSky, body.chuva #duskSky { opacity: 0 !important; }
/* Névoa do horizonte (pintada pelo tema via JS) fica discreta de dia
para não acinzentar o céu */
.fog-layer { transition: opacity 12s ease; }
@ -1359,6 +1379,8 @@ body.dia:not(.balada):not(.chuva) .grave-wrap { opacity: 1; }
<!-- Céu diurno (fade conforme o sol real sobe) -->
<div id="daySky"></div>
<!-- Hora dourada (opacidade dirigida pela altitude real do sol) -->
<div id="duskSky"></div>
<div class="day-cloud cloud-a"></div>
<div class="day-cloud cloud-b"></div>
<div class="day-cloud cloud-c"></div>
@ -1959,6 +1981,7 @@ function buildMoonPhaseTexture(phase) {
fica pousado no horizonte (34%), como sempre foi. O timelapse
acelera o ciclo junto, já que tudo deriva de skyNowMs(). ── */
let sunNoonAlt = 60, sunNoonKey = -1;
const duskSkyEl = document.getElementById('duskSky');
function updateDayMode(date, observer, sunAlt) {
const dayKey = Math.floor(date.getTime() / 86400000);
if (dayKey !== sunNoonKey) {
@ -1971,6 +1994,9 @@ function updateDayMode(date, observer, sunAlt) {
'--sun-bottom', (34 + 44 * climb).toFixed(2) + '%');
/* -3°: meio do crepúsculo civil — troca com as transições longas do CSS */
document.body.classList.toggle('dia', sunAlt > -3);
/* hora dourada: triângulo com pico no sol a +1°, zerando em -6° e +8° */
const dusk = Math.max(0, 1 - Math.abs(sunAlt - 1) / 7);
duskSkyEl.style.opacity = (dusk * dusk * (3 - 2 * dusk)).toFixed(3);
}
function updateSolarSystem(date, lst, W, H, horizonPx) {