A dark, mysterious five-act ARG built around hidden archives and forgotten witnesses.
Commit 640e2e95
640e2e95b9f7Merged
Fenria-Aspen <[email protected]> · 1 month ago · 1 file · +1 added
Description
Add landing page with intro and navigation
Details
- Commit
- 640e2e95b9f7
- Parent
- 58283b6a8b63
assets/js/pages/landing.jsaddedView file
1+
// Landing page and intro sequences2+
3+
const LandingPage = {4+
render() {5+
return `6+
<section class="hero landing-hero">7+
<div class="glitch-text" data-text="THE HOLLOW ARCHIVE">8+
THE HOLLOW ARCHIVE9+
</div>10+
<p class="lead">An interactive experience about forgotten names, hidden ledgers, and the witness who remembers.</p>11+
<p class="subtitle">Completion: ${GameState.getCompletion()}%</p>12+
</section>13+
14+
<section class="panel intro-panel">15+
<p class="panel-title">CLASSIFIED TRANSMISSION</p>16+
<blockquote>17+
"The archive does not keep records. It keeps what was never meant to be remembered. Some names are erased from history. Others fade into silence. But they are not gone—they are *hidden*. And hidden things wait for those patient enough to seek them."18+
</blockquote>19+
</section>20+
21+
<section class="panel action-panel">22+
<p class="panel-title">ARCHIVE ACCESS PROTOCOLS</p>23+
24+
<div class="action-grid">25+
<button class="action-btn" data-action="begin">26+
<span class="action-icon">►</span>27+
BEGIN ACT I28+
</button>29+
30+
${GameState.unlockedSections.has('secrets') ? `31+
<button class="action-btn secret-btn" data-action="secrets">32+
<span class="action-icon">⚡</span>33+
HIDDEN SECTIONS34+
</button>35+
` : ''}36+
37+
${GameState.completedActs.size > 0 ? `38+
<button class="action-btn" data-action="continue">39+
<span class="action-icon">⟳</span>40+
CONTINUE (ACT ${GameState.currentAct + 1})41+
</button>42+
` : ''}43+
</div>44+
</section>45+
46+
<section class="panel info-panel">47+
<p class="panel-title">REQUIRED READING</p>48+
<ul class="info-list">49+
<li>📖 Five acts of discovery await.</li>50+
<li>🔐 Cipher knowledge will be tested.</li>51+
<li>📝 Collect evidence as you progress.</li>52+
<li>🔗 Everything is connected. Nothing is coincidence.</li>53+
<li>⚠️ Some secrets are meant to stay hidden.</li>54+
</ul>55+
</section>56+
57+
<section class="panel social-panel">58+
<p class="panel-title">TRANSMISSION FREQUENCY</p>59+
<p>Found something? Share your discoveries.</p>60+
<div class="social-buttons">61+
<button onclick="navigator.clipboard.writeText(window.location.href)">Copy Link</button>62+
<button onclick="window.open('https://twitter.com/intent/tweet?text=I%27m%20exploring%20The%20Hollow%20Archive%20%23ARG')">Share on Twitter</button>63+
</div>64+
</section>65+
`;66+
},67+
68+
attach() {69+
document.querySelectorAll('.action-btn').forEach(btn => {70+
btn.addEventListener('click', (e) => {71+
const action = e.currentTarget.dataset.action;72+
if (action === 'begin') {73+
this.startGame();74+
} else if (action === 'continue') {75+
UIRouter.navigate('act' + GameState.currentAct);76+
} else if (action === 'secrets') {77+
UIRouter.navigate('secrets');78+
}79+
});80+
});81+
},82+
83+
startGame() {84+
GameState.unlockSection('act1');85+
GameState.currentAct = 0;86+
GameState.currentPage = 'act1';87+
GameState.save();88+
UIRouter.navigate('act1');89+
}90+
};