forked from avi/signalelsewhere
Save point: Scene 3 updated - LAB 484 incubator text, recruitment typewriter WE ARE LOOKING FOR PEOPLE...
This commit is contained in:
53
index.html
53
index.html
@@ -656,7 +656,7 @@
|
|||||||
}, 30);
|
}, 30);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Scene 3 loader with I AM A... sequence and 3 choice buttons
|
// Scene 3 loader with recruitment text sequence and 3 choice buttons
|
||||||
function loadScene3(sceneElem) {
|
function loadScene3(sceneElem) {
|
||||||
sceneElem.style.display = 'flex';
|
sceneElem.style.display = 'flex';
|
||||||
const title = document.getElementById('scene3Title');
|
const title = document.getElementById('scene3Title');
|
||||||
@@ -680,17 +680,27 @@
|
|||||||
}, 300);
|
}, 300);
|
||||||
|
|
||||||
typewriterLines(
|
typewriterLines(
|
||||||
[" IN NUMEROLOGY, THE NUMBERS 484 STAND FOR ALL MATERIAL PROVISION FOR YOUR DIVINE LIFE PATH", "\n\nLAB 484 IS A TECH INCUBATOR THAT HAS 11 STARTUPS UNDERNEATH IT"],
|
["LAB 484 IS AN INCUBATOR THAT HAS 11 DECENTRALIZED STARTUPS UNDERNEATH IT"],
|
||||||
textContainer,
|
textContainer,
|
||||||
() => {
|
() => {
|
||||||
// After typewriter text finishes, start I AM A... sequence
|
// After typewriter text finishes, wait 3 seconds then type recruitment text
|
||||||
iAmText.textContent = '';
|
iAmText.textContent = '';
|
||||||
iAmText.style.visibility = 'visible';
|
iAmText.style.visibility = 'visible';
|
||||||
let segIndex = 0;
|
|
||||||
const segments = [" I", "AM", "A..."];
|
|
||||||
|
|
||||||
function typeNextSegment() {
|
setTimeout(() => {
|
||||||
if (segIndex >= segments.length) {
|
cursor.style.display = 'block';
|
||||||
|
cursor.style.opacity = '1';
|
||||||
|
let blinkCount = 0;
|
||||||
|
let isVisible = true;
|
||||||
|
const blinkInterval = setInterval(() => {
|
||||||
|
isVisible = !isVisible;
|
||||||
|
cursor.style.opacity = isVisible ? '1' : '0';
|
||||||
|
blinkCount++;
|
||||||
|
if (blinkCount >= 6) {
|
||||||
|
clearInterval(blinkInterval);
|
||||||
|
cursor.style.display = 'none';
|
||||||
|
|
||||||
|
typeCalmly(iAmText, "WE ARE LOOKING FOR PEOPLE WHO WANT THE WORLD TO CHANGE AND ARE DOING SOMETHING ABOUT IT...", () => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
choiceBtns.forEach(btn => {
|
choiceBtns.forEach(btn => {
|
||||||
btn.style.display = 'block';
|
btn.style.display = 'block';
|
||||||
@@ -707,28 +717,10 @@
|
|||||||
}, 30);
|
}, 30);
|
||||||
});
|
});
|
||||||
}, 3000);
|
}, 3000);
|
||||||
return;
|
});
|
||||||
}
|
|
||||||
|
|
||||||
cursor.style.display = 'block';
|
|
||||||
cursor.style.opacity = '1';
|
|
||||||
let blinkCount = 0;
|
|
||||||
let isVisible = true;
|
|
||||||
const blinkInterval = setInterval(() => {
|
|
||||||
isVisible = !isVisible;
|
|
||||||
cursor.style.opacity = isVisible ? '1' : '0';
|
|
||||||
blinkCount++;
|
|
||||||
if (blinkCount >= 6) {
|
|
||||||
clearInterval(blinkInterval);
|
|
||||||
cursor.style.display = 'none';
|
|
||||||
iAmText.textContent += segments[segIndex];
|
|
||||||
segIndex++;
|
|
||||||
setTimeout(typeNextSegment, 3000);
|
|
||||||
}
|
}
|
||||||
}, 500);
|
}, 500);
|
||||||
}
|
}, 3000);
|
||||||
|
|
||||||
typeNextSegment();
|
|
||||||
},
|
},
|
||||||
200
|
200
|
||||||
);
|
);
|
||||||
@@ -785,16 +777,17 @@
|
|||||||
s2Btn.style.pointerEvents = 'auto';
|
s2Btn.style.pointerEvents = 'auto';
|
||||||
}
|
}
|
||||||
|
|
||||||
// Scene 3 skip (cursor blinking / I AM A... typing)
|
// Scene 3 skip (typewriter / cursor / typing)
|
||||||
const scene3 = document.getElementById('scene3');
|
const scene3 = document.getElementById('scene3');
|
||||||
const cursor = document.getElementById('blinkCursor');
|
const cursor = document.getElementById('blinkCursor');
|
||||||
const iAmText = document.getElementById('scene2Text');
|
const iAmText = document.getElementById('scene2Text');
|
||||||
const creatorBtn = document.getElementById('creatorBtn');
|
const creatorBtn = document.getElementById('creatorBtn');
|
||||||
const builderBtn = document.getElementById('builderBtn');
|
const builderBtn = document.getElementById('builderBtn');
|
||||||
const developerBtn = document.getElementById('developerBtn');
|
const developerBtn = document.getElementById('developerBtn');
|
||||||
if (scene3.style.display === 'flex' && (cursor.style.display === 'block' || (cursor.style.display === 'none' && iAmText.textContent.length > 0 && iAmText.textContent.length < 8))) {
|
const fullText = "WE ARE LOOKING FOR PEOPLE WHO WANT THE WORLD TO CHANGE AND ARE DOING SOMETHING ABOUT IT...";
|
||||||
|
if (scene3.style.display === 'flex' && (cursor.style.display === 'block' || (iAmText.textContent.length > 0 && iAmText.textContent.length < fullText.length))) {
|
||||||
cursor.style.display = 'none';
|
cursor.style.display = 'none';
|
||||||
iAmText.textContent = ' I AM A...';
|
iAmText.textContent = fullText;
|
||||||
iAmText.style.visibility = 'visible';
|
iAmText.style.visibility = 'visible';
|
||||||
[creatorBtn, builderBtn, developerBtn].forEach(btn => {
|
[creatorBtn, builderBtn, developerBtn].forEach(btn => {
|
||||||
btn.style.display = 'block';
|
btn.style.display = 'block';
|
||||||
|
|||||||
Reference in New Issue
Block a user