feat: warp tunnel effect when entering portals (#250)
Adds three floating portal objects (Batcave, Workshop, The Void) around the platform edge, each with an animated vortex interior shader. Clicking a portal or pressing W triggers the fullscreen warp tunnel post-processing effect — a swirling GLSL vortex with ring bands, 8-arm spiral, cyan/purple color sweep, inward scene distortion, and a white flash at the peak. - WarpTunnelShader + ShaderPass wired into existing EffectComposer - Portal inner vortex: custom ShaderMaterial (5-arm spiral + ring bands) - Raycaster click detection on portal disc meshes - triggerWarp() state machine: build-up → hold → flash → fade-out - 'W' key demo cycles through portals - #warp-indicator HUD element with expanding letter-spacing pulse Fixes #250
This commit is contained in:
30
style.css
30
style.css
@@ -184,6 +184,36 @@ body.photo-mode #overview-indicator {
|
||||
100% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
|
||||
}
|
||||
|
||||
/* === WARP TUNNEL INDICATOR === */
|
||||
#warp-indicator {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: #00aaff;
|
||||
font-family: var(--font-body);
|
||||
font-size: 13px;
|
||||
letter-spacing: 0.35em;
|
||||
text-transform: uppercase;
|
||||
pointer-events: none;
|
||||
z-index: 50;
|
||||
padding: 6px 18px;
|
||||
background: rgba(0, 0, 16, 0.65);
|
||||
border: 1px solid #00aaff;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#warp-indicator.visible {
|
||||
display: block;
|
||||
animation: warp-pulse 0.4s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes warp-pulse {
|
||||
0%, 100% { opacity: 0.8; letter-spacing: 0.35em; }
|
||||
50% { opacity: 1.0; letter-spacing: 0.5em; }
|
||||
}
|
||||
|
||||
/* === CRT / CYBERPUNK OVERLAY === */
|
||||
.crt-overlay {
|
||||
position: fixed;
|
||||
|
||||
Reference in New Issue
Block a user