Integrates a PrismaUI full-screen main-menu overlay with input capture and a bridge to the server browser. Adds F4TMainMenuBridge and F4TMainMenuVanillaSettings stubs, exposes Show/Hide/IsMainMenuVisible/IsCustomMenuInputCaptured in F4TPrismaUI, and routes gamepad input via SetMainMenuActive in F4TMenuInput. MainMenuInject implements robust readiness checks with Bink/frame gating and disables legacy multiplayer-row injection (constexpr false). Fixes cursor clipping by clearing RE::MenuCursor constraints each frame and removes unsupported viewport meta from HTML. Adds window.CO_App/handleControllerInput stubs and updates docs/changelog.
109 lines
4.6 KiB
HTML
109 lines
4.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Commonwealth Online — Main Menu</title>
|
|
<link rel="stylesheet" href="styles.css">
|
|
<link rel="stylesheet" href="../settings/settings.css">
|
|
</head>
|
|
<body>
|
|
<div class="main-screen" id="mainScreen">
|
|
<!-- Title-screen scenic background -->
|
|
<div class="scene-layer" aria-hidden="true"></div>
|
|
<div class="scene-overlay" aria-hidden="true"></div>
|
|
|
|
<!-- CRT / HUD texture overlays -->
|
|
<div class="screen-effects" aria-hidden="true"></div>
|
|
|
|
<!-- Left main menu panel -->
|
|
<aside class="left-panel">
|
|
<img
|
|
class="brand-logo"
|
|
src="../shared/logo.svg"
|
|
alt="Commonwealth Online"
|
|
width="220"
|
|
height="54"
|
|
>
|
|
|
|
<nav class="menu" id="menu" aria-label="Main menu">
|
|
<button type="button" class="menu-item" data-index="0" data-action="multiplayer">
|
|
<span class="menu-item__label">MULTIPLAYER</span>
|
|
<span class="menu-item__bar" aria-hidden="true"></span>
|
|
</button>
|
|
|
|
<button type="button" class="menu-item" data-index="1" data-action="creations">
|
|
<span class="menu-item__label">CREATIONS</span>
|
|
<span class="menu-item__bar" aria-hidden="true"></span>
|
|
</button>
|
|
|
|
<button type="button" class="menu-item" data-index="2" data-action="settings">
|
|
<span class="menu-item__label">SETTINGS</span>
|
|
<span class="menu-item__bar" aria-hidden="true"></span>
|
|
</button>
|
|
|
|
<button type="button" class="menu-item" data-index="3" data-action="help">
|
|
<span class="menu-item__label">HELP</span>
|
|
<span class="menu-item__bar" aria-hidden="true"></span>
|
|
</button>
|
|
|
|
<button type="button" class="menu-item" data-index="4" data-action="quit">
|
|
<span class="menu-item__label">QUIT</span>
|
|
<span class="menu-item__bar" aria-hidden="true"></span>
|
|
</button>
|
|
</nav>
|
|
</aside>
|
|
|
|
<!-- Settings view (content mounted by ../settings/settings.js) -->
|
|
<section class="settings-view" id="settingsPanel" aria-label="Settings" hidden></section>
|
|
|
|
<!-- Bottom controller prompts (main menu) -->
|
|
<footer class="prompt-bar" id="mainPromptBar" aria-label="Controller prompts">
|
|
<div class="prompt">
|
|
<span class="prompt__glyph prompt__glyph--icon" aria-hidden="true">
|
|
<img class="prompt__glyph-img" data-glyph-src="../shared/icons/Xbox/T_X_A_White_Alt.png" src="../shared/icons/Xbox/T_X_A_White_Alt.png" alt="" draggable="false">
|
|
</span>
|
|
<span class="prompt__label">SELECT</span>
|
|
</div>
|
|
<div class="prompt">
|
|
<span class="prompt__glyph prompt__glyph--icon" aria-hidden="true">
|
|
<img class="prompt__glyph-img" data-glyph-src="../shared/icons/Xbox/T_X_B_White_Alt.png" src="../shared/icons/Xbox/T_X_B_White_Alt.png" alt="" draggable="false">
|
|
</span>
|
|
<span class="prompt__label">BACK</span>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Settings mode prompt bar -->
|
|
<footer class="prompt-bar prompt-bar--settings" id="settingsPromptBar" aria-label="Settings prompts" hidden>
|
|
<div class="prompt" data-prompt="move">
|
|
<span class="prompt__glyph prompt__glyph--text" aria-hidden="true">↑↓</span>
|
|
<span class="prompt__label">MOVE</span>
|
|
</div>
|
|
<div class="prompt" data-prompt="change">
|
|
<span class="prompt__glyph prompt__glyph--text" aria-hidden="true">←→</span>
|
|
<span class="prompt__label">CHANGE</span>
|
|
</div>
|
|
<div class="prompt" data-prompt="select">
|
|
<span class="prompt__glyph prompt__glyph--icon" aria-hidden="true">
|
|
<img class="prompt__glyph-img" data-glyph-src="../shared/icons/Xbox/T_X_A_White_Alt.png" src="../shared/icons/Xbox/T_X_A_White_Alt.png" alt="" draggable="false">
|
|
</span>
|
|
<span class="prompt__label">SELECT</span>
|
|
</div>
|
|
<div class="prompt" data-prompt="back">
|
|
<span class="prompt__glyph prompt__glyph--icon" aria-hidden="true">
|
|
<img class="prompt__glyph-img" data-glyph-src="../shared/icons/Xbox/T_X_B_White_Alt.png" src="../shared/icons/Xbox/T_X_B_White_Alt.png" alt="" draggable="false">
|
|
</span>
|
|
<span class="prompt__label">BACK</span>
|
|
</div>
|
|
<div class="prompt" data-prompt="tab">
|
|
<span class="prompt__glyph prompt__glyph--text" aria-hidden="true">TAB</span>
|
|
<span class="prompt__label">SWITCH FOCUS</span>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
|
|
<script src="../settings/settings-data.js"></script>
|
|
<script src="../settings/settings.js"></script>
|
|
<script src="script.js"></script>
|
|
</body>
|
|
</html>
|