Lower horizon, shrink dancer, planet symbols
Horizon drops from 41.5% to 34% of screen height (sky canvas, floor grid, fog, sun rest position, day gradient and grave all follow), the skeleton shrinks 44vh -> 38vh, and planet labels use the classical astronomical symbols with text presentation forced. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_015HtPHsTnDcLVSCiF5FGHZj
This commit is contained in:
vini
parent
a4129eddf0
commit
8181315a8c
1 changed files with 28 additions and 26 deletions
|
|
@ -88,7 +88,7 @@ body.balada .nebula::after { opacity: 1; }
|
|||
/* Horizon glow line */
|
||||
.horizon {
|
||||
position: absolute;
|
||||
bottom: 41.5%;
|
||||
bottom: 34%;
|
||||
left: 0; right: 0;
|
||||
height: 3px;
|
||||
background: linear-gradient(
|
||||
|
|
@ -322,7 +322,7 @@ body.balada .music-ticker {
|
|||
.robot-wrap {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 28%;
|
||||
bottom: 23%;
|
||||
transform: translateX(-50%);
|
||||
opacity: 0;
|
||||
transition: opacity 0.8s;
|
||||
|
|
@ -343,7 +343,7 @@ body.balada .music-ticker {
|
|||
|
||||
.skeleton-gif {
|
||||
display: block;
|
||||
height: 44vh;
|
||||
height: 38vh;
|
||||
width: auto;
|
||||
filter: drop-shadow(0 0 20px rgba(0,200,255,0.4));
|
||||
}
|
||||
|
|
@ -797,8 +797,8 @@ body.balada .music-ticker {
|
|||
height: 280px;
|
||||
border-radius: 50%;
|
||||
left: 50%;
|
||||
/* --sun-bottom segue o sol real (modo dia); 41.5% = pousado no horizonte */
|
||||
bottom: var(--sun-bottom, 41.5%);
|
||||
/* --sun-bottom segue o sol real (modo dia); 34% = pousado no horizonte */
|
||||
bottom: var(--sun-bottom, 34%);
|
||||
transform: translateX(-50%) translateY(50%);
|
||||
transition:
|
||||
bottom 2.8s cubic-bezier(0.16, 1, 0.3, 1),
|
||||
|
|
@ -841,7 +841,7 @@ body.balada .music-ticker {
|
|||
============================================================ */
|
||||
.fog-layer {
|
||||
position: absolute;
|
||||
bottom: 41.5%;
|
||||
bottom: 34%;
|
||||
left: 0; right: 0;
|
||||
height: 38%;
|
||||
pointer-events: none;
|
||||
|
|
@ -1144,10 +1144,10 @@ body.chuva #sunChuvaFace { opacity: 1; transition: opacity 5s ease; }
|
|||
#c86fe0 0%,
|
||||
#f18ade 26%,
|
||||
#ffaede 44%,
|
||||
#ffcfe0 54%,
|
||||
#ffe4c9 58.5%,
|
||||
#86e29e 58.6%,
|
||||
#4fbb6b 78%,
|
||||
#ffcfe0 60%,
|
||||
#ffe4c9 66%,
|
||||
#86e29e 66.1%,
|
||||
#4fbb6b 82%,
|
||||
#2e9550 100%);
|
||||
}
|
||||
body.dia:not(.balada):not(.chuva) #daySky { opacity: 1; }
|
||||
|
|
@ -1233,12 +1233,12 @@ body.dia:not(.balada):not(.chuva) .horizon {
|
|||
|
||||
/* De dia o esqueleto dorme: some o dançarino, fica a lápide no gramado.
|
||||
Perspectiva: monte e sombra são elipses bem achatadas no plano do chão,
|
||||
e a pedra fica plantada entre o horizonte (41.5%) e a borda inferior. */
|
||||
e a pedra fica plantada entre o horizonte (34%) e a borda inferior. */
|
||||
body.dia:not(.balada):not(.chuva) .robot-wrap { opacity: 0 !important; }
|
||||
.grave-wrap {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 22%;
|
||||
bottom: 18%;
|
||||
transform: translateX(-50%);
|
||||
opacity: 0;
|
||||
transition: opacity 4s ease;
|
||||
|
|
@ -1460,19 +1460,20 @@ let cameraRotationStartMs = Date.now();
|
|||
let cameraRotationOriginAz = CAMERA_HOME_AZ;
|
||||
const FOV_AZ = 140; // largura da tela em graus de azimute
|
||||
const ALT_TOP = 75; // altitude no topo da tela
|
||||
const HORIZON_F = 0.585; // fração da altura da tela até o horizonte
|
||||
const HORIZON_F = 0.66; // fração da altura da tela até o horizonte
|
||||
const TWINKLE_MAG = 4.0; // até esta magnitude a estrela cintila; acima é estática
|
||||
const DEG = Math.PI / 180;
|
||||
window.__skyTimeOffset = 0; // debug: ms somados ao relógio p/ testar a rotação
|
||||
/* Sem o Astronomy Engine o céu continua funcionando; só Lua/planetas somem */
|
||||
/* Sem o Astronomy Engine o céu continua funcionando; só Lua/planetas somem.
|
||||
Rótulos usam os símbolos astronômicos clássicos no lugar dos nomes. */
|
||||
const PLANET_SPECS = typeof Astronomy === 'undefined' ? [] : [
|
||||
[Astronomy.Body.Mercury, 'Mercúrio', [190, 188, 182]],
|
||||
[Astronomy.Body.Venus, 'Vênus', [255, 241, 204]],
|
||||
[Astronomy.Body.Mars, 'Marte', [238, 105, 70]],
|
||||
[Astronomy.Body.Jupiter, 'Júpiter', [232, 202, 164]],
|
||||
[Astronomy.Body.Saturn, 'Saturno', [224, 195, 128]],
|
||||
[Astronomy.Body.Uranus, 'Urano', [151, 223, 226]],
|
||||
[Astronomy.Body.Neptune, 'Netuno', [91, 126, 220]],
|
||||
[Astronomy.Body.Mercury, '☿', [190, 188, 182]],
|
||||
[Astronomy.Body.Venus, '♀', [255, 241, 204]],
|
||||
[Astronomy.Body.Mars, '♂', [238, 105, 70]],
|
||||
[Astronomy.Body.Jupiter, '♃', [232, 202, 164]],
|
||||
[Astronomy.Body.Saturn, '♄', [224, 195, 128]],
|
||||
[Astronomy.Body.Uranus, '♅', [151, 223, 226]],
|
||||
[Astronomy.Body.Neptune, '♆', [91, 126, 220]],
|
||||
];
|
||||
const KM_PER_AU = 149597870.7;
|
||||
const MOON_RADIUS_KM = 1737.4;
|
||||
|
|
@ -1925,7 +1926,7 @@ function buildMoonPhaseTexture(phase) {
|
|||
|
||||
/* ── Modo dia: a altitude real do Sol comanda o sol do desktop.
|
||||
Nasce -> sobe até ~78% da tela na culminação -> desce no pôr; à noite
|
||||
fica pousado no horizonte (41.5%), como sempre foi. O timelapse
|
||||
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;
|
||||
function updateDayMode(date, observer, sunAlt) {
|
||||
|
|
@ -1937,7 +1938,7 @@ function updateDayMode(date, observer, sunAlt) {
|
|||
}
|
||||
const climb = Math.max(0, Math.min(1, sunAlt / sunNoonAlt));
|
||||
document.documentElement.style.setProperty(
|
||||
'--sun-bottom', (41.5 + 36.5 * climb).toFixed(2) + '%');
|
||||
'--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);
|
||||
}
|
||||
|
|
@ -2029,7 +2030,7 @@ function drawSolarSystem(c) {
|
|||
}
|
||||
|
||||
c.save();
|
||||
c.font = `${Math.max(11, Math.round(canvas.height * 0.0095))}px ui-monospace, monospace`;
|
||||
c.font = `${Math.max(16, Math.round(canvas.height * 0.021))}px ui-monospace, monospace`;
|
||||
c.textAlign = 'left';
|
||||
c.textBaseline = 'middle';
|
||||
for (const planet of planets) {
|
||||
|
|
@ -2053,7 +2054,8 @@ function drawSolarSystem(c) {
|
|||
c.shadowColor = 'rgba(4,8,20,0.95)';
|
||||
c.shadowBlur = 4;
|
||||
c.fillStyle = `rgba(${r},${g},${b},0.92)`;
|
||||
c.fillText(planet.name, planet.x + planet.radius + 7, planet.y - 1);
|
||||
/* \uFE0E: forma de texto, evita a versão emoji de ♀ e ♂ */
|
||||
c.fillText(planet.name + '\uFE0E', planet.x + planet.radius + 7, planet.y - 1);
|
||||
}
|
||||
c.restore();
|
||||
}
|
||||
|
|
@ -2257,7 +2259,7 @@ let cameraRotationFileVal = null;
|
|||
const floorCanvas = document.getElementById('floorCanvas');
|
||||
const floorCtx = floorCanvas.getContext('2d');
|
||||
|
||||
const FLOOR_RATIO = 0.42;
|
||||
const FLOOR_RATIO = 0.345;
|
||||
|
||||
/* Disco floor tiles */
|
||||
const DISCO_COLORS = [
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue