1
0

Save point: Scene 3 reworked - LAB 484 title top-left, divine life path typewriter, buttons removed

This commit is contained in:
avi
2026-05-07 19:14:04 -05:00
parent aed9f6a64d
commit 1ffd51d254

View File

@@ -137,43 +137,18 @@
} }
#scene3Title { #scene3Title {
visibility: hidden; position: absolute;
font-size: 1.8rem; top: 2rem;
margin-bottom: 2rem; left: 2rem;
font-size: 3rem;
font-weight: bold;
color: #00ff00;
opacity: 0; opacity: 0;
transform: scale(0.8); transition: opacity 1.5s ease-out;
transition: opacity 1.5s ease-out, transform 1.5s ease-out;
} }
#scene3Title.visible { #scene3Title.visible {
visibility: visible;
opacity: 1; opacity: 1;
transform: scale(1);
}
#lab484Btn, #decentralizationBtn {
position: fixed;
bottom: 5%;
left: 50%;
transform: translateX(-50%);
z-index: 5;
padding: 1rem 3rem;
font-size: 1.1rem;
background-color: #001100;
color: #00ff00;
border: 2px solid #00ff00;
cursor: pointer;
visibility: hidden;
opacity: 0;
pointer-events: none;
transition: opacity 0.5s ease, background-color 0.2s ease;
font-family: 'Courier New', monospace;
letter-spacing: 2px;
display: none;
}
#lab484Btn:hover, #decentralizationBtn:hover {
background-color: #003300;
} }
</style> </style>
</head> </head>
@@ -195,10 +170,8 @@
</div> </div>
<div id="scene3" class="scene"> <div id="scene3" class="scene">
<div id="scene3Title">YOU'RE AT LAB 484</div> <div id="scene3Title">LAB 484</div>
<div id="scene3Text"></div> <div id="scene3Text"></div>
<button id="lab484Btn">LAB 484?</button>
<button id="decentralizationBtn">DECENTRALIZATION?</button>
</div> </div>
<script> <script>
@@ -550,7 +523,6 @@
sceneElem.style.display = 'flex'; sceneElem.style.display = 'flex';
const title = document.getElementById('scene3Title'); const title = document.getElementById('scene3Title');
const textContainer = document.getElementById('scene3Text'); const textContainer = document.getElementById('scene3Text');
const lab484Btn = document.getElementById('lab484Btn');
let opacity = 0; let opacity = 0;
const fadeIn = setInterval(() => { const fadeIn = setInterval(() => {
@@ -559,28 +531,14 @@
opacity = 1; opacity = 1;
clearInterval(fadeIn); clearInterval(fadeIn);
// Show title with animation
setTimeout(() => { setTimeout(() => {
title.classList.add('visible'); title.classList.add('visible');
}, 300); }, 300);
typewriterLines( typewriterLines(
["ALL MATERIAL PROVISION FOR YOUR DIVINE LIFE PATH"], ["LAB 484 STANDS FOR ALL MATERIAL PROVISION FOR YOUR DIVINE LIFE PATH"],
textContainer, textContainer,
() => { () => {},
lab484Btn.style.display = 'block';
lab484Btn.style.visibility = 'visible';
let btnOpacity = 0;
const btnFadeIn = setInterval(() => {
btnOpacity += 0.05;
if (btnOpacity >= 1) {
btnOpacity = 1;
clearInterval(btnFadeIn);
lab484Btn.style.pointerEvents = 'auto';
}
lab484Btn.style.opacity = btnOpacity;
}, 30);
},
120 120
); );
} }
@@ -597,59 +555,7 @@
document.getElementById('followBtn').addEventListener('click', transitionToScene2); document.getElementById('followBtn').addEventListener('click', transitionToScene2);
document.getElementById('learnBtn').addEventListener('click', handleLearnClick); document.getElementById('learnBtn').addEventListener('click', handleLearnClick);
// "LAB 484?" button click handler
document.getElementById('lab484Btn').addEventListener('click', function() {
const btn = document.getElementById('lab484Btn');
const textContainer = document.getElementById('scene3Text');
const decentralizationBtn = document.getElementById('decentralizationBtn');
btn.style.pointerEvents = 'none';
btn.style.opacity = 0;
btn.style.visibility = 'hidden';
textContainer.textContent = '';
typewriterLines(
["LAB 484 IS A DECENTRALIZED TECH INCUBATOR THAT CURRENTLY HAS 12 STARTUPS UNDERNEATH IT"],
textContainer,
() => {
decentralizationBtn.style.display = 'block';
decentralizationBtn.style.visibility = 'visible';
let btnOpacity = 0;
const btnFadeIn = setInterval(() => {
btnOpacity += 0.05;
if (btnOpacity >= 1) {
btnOpacity = 1;
clearInterval(btnFadeIn);
decentralizationBtn.style.pointerEvents = 'auto';
}
decentralizationBtn.style.opacity = btnOpacity;
}, 30);
},
60
);
});
// "DECENTRALIZATION?" button click handler
document.getElementById('decentralizationBtn').addEventListener('click', function() {
const btn = document.getElementById('decentralizationBtn');
const textContainer = document.getElementById('scene3Text');
btn.style.pointerEvents = 'none';
btn.style.opacity = 0;
btn.style.visibility = 'hidden';
textContainer.textContent = '';
typewriterLines(
["DECENTRALIZATION IS A SIGN — A NUDGE TO TRUST YOUR OWN PATH AND CONNECT DIRECTLY WITH OTHERS WHO FEEL THE SAME PULL."],
textContainer,
() => {
// Scene 3 complete - placeholder for Scene 4
},
120
);
});
// Keyboard shortcuts for testing // Keyboard shortcuts for testing
document.addEventListener('keydown', (e) => { document.addEventListener('keydown', (e) => {