fix: keep the 2D exit plate on window hover at the destination
This commit is contained in:
@@ -85,6 +85,12 @@ export function createSignStage(resources: SceneResourceBag) {
|
||||
panel.style.setProperty('--chapter-heading-offset', offset);
|
||||
};
|
||||
|
||||
let world: Element | null = null;
|
||||
const arrivedAtDestination = () => {
|
||||
world ??= document.querySelector('.journey-world');
|
||||
return world?.getAttribute('data-arrived') === 'true';
|
||||
};
|
||||
|
||||
const update = (width: number, height: number) => {
|
||||
if (dirty || width !== viewportWidth || height !== viewportHeight) {
|
||||
dirty = false;
|
||||
@@ -100,7 +106,9 @@ export function createSignStage(resources: SceneResourceBag) {
|
||||
const rect = windowElement.getBoundingClientRect();
|
||||
tilt.x = Math.max(-1, Math.min(1, ((event.clientX - rect.left) / rect.width) * 2 - 1));
|
||||
tilt.y = Math.max(-1, Math.min(1, ((event.clientY - rect.top) / rect.height) * 2 - 1));
|
||||
if (event.pointerType === 'mouse') tilt.hover = true;
|
||||
// At the destination the engine is off and the twin would render
|
||||
// dark, so the window keeps its 2D plate (gantry.css agrees).
|
||||
if (event.pointerType === 'mouse') tilt.hover = !arrivedAtDestination();
|
||||
}, { passive: true });
|
||||
resources.listen(windowElement, 'pointerleave', () => {
|
||||
tilt.x = 0;
|
||||
|
||||
@@ -467,7 +467,8 @@ html[data-gantry='incoming'] .journey-hud {
|
||||
transform: translateY(-6px);
|
||||
}
|
||||
@media (hover: hover) {
|
||||
html[data-gantry]:has(.gantry-window:hover) .journey-hud { opacity: 0; }
|
||||
/* Not at the destination: the engine is off there and the twin is dark. */
|
||||
html[data-gantry]:not(:has(.journey-world[data-arrived='true'])):has(.gantry-window:hover) .journey-hud { opacity: 0; }
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
html .journey-hud {
|
||||
|
||||
Reference in New Issue
Block a user