| @@ -2,7 +2,7 @@ html, body, .scene { | |||||
| min-height: 100%; | min-height: 100%; | ||||
| height: 100%; | height: 100%; | ||||
| color: #eee; | color: #eee; | ||||
| background-color: #333; | |||||
| background-color: #000; | |||||
| font-family: sans-serif; | font-family: sans-serif; | ||||
| } | } | ||||
| @@ -10,6 +10,51 @@ html, body, .scene { | |||||
| display: none; | display: none; | ||||
| } | } | ||||
| a { | |||||
| color: #8888FF; | |||||
| text-decoration: none; | |||||
| } | |||||
| a:visited { | |||||
| color: #8888DD; | |||||
| } | |||||
| a:hover { | |||||
| color: #AAAAEE; | |||||
| } | |||||
| a:hover { | |||||
| text-shadow: 0px 0px 5px #eeeeff; | |||||
| text-decoration: none; | |||||
| } | |||||
| #pick { | |||||
| text-align: center; | |||||
| } | |||||
| #pick-blurb { | |||||
| font-size: 24px; | |||||
| } | |||||
| #game-select { | |||||
| user-select: none; | |||||
| font-size: 32px; | |||||
| background-color: #111; | |||||
| color: #eee; | |||||
| border: 1px solid #333; | |||||
| width: 200px; | |||||
| height: 50px; | |||||
| } | |||||
| #start-button { | |||||
| user-select: none; | |||||
| width: 200px; | |||||
| height: 100px; | |||||
| background-color: #111; | |||||
| border: 1px solid #333; | |||||
| font-size: 48px; | |||||
| color: #eee; | |||||
| } | |||||
| .modal { | .modal { | ||||
| position: fixed; | position: fixed; | ||||
| z-index: 1; | z-index: 1; | ||||
| @@ -20,9 +20,18 @@ | |||||
| <body> | <body> | ||||
| <div class="scene" id="pick"> | <div class="scene" id="pick"> | ||||
| <select id="game-select"> | |||||
| <div id="pick-blurb"> | |||||
| <p>Welcome to Satiate</p> | |||||
| <a href="https://discord.gg/dSwNN8T">Discord Server</a> | |||||
| <p class="version"></p> | |||||
| <p><b>This game contains 18+ content</bpdiv> | |||||
| <p>Select a story:</p> | |||||
| </div> | |||||
| <div> | |||||
| <select id="game-select"> | |||||
| </select> | |||||
| </select> | |||||
| </div> | |||||
| <button id="start-button">Start</button> | <button id="start-button">Start</button> | ||||
| </div> | </div> | ||||
| <div class="hidden-scene" id="game"> | <div class="hidden-scene" id="game"> | ||||
| @@ -2,6 +2,8 @@ | |||||
| let audioContext; | let audioContext; | ||||
| const version = "pre-alpha"; | |||||
| let state = { | let state = { | ||||
| player: { | player: { | ||||
| items: { | items: { | ||||
| @@ -47,9 +49,14 @@ function init(story) { | |||||
| // set up the load screen | // set up the load screen | ||||
| function initStart() { | function initStart() { | ||||
| const versionFields = document.querySelectorAll(".version"); | |||||
| const select = document.querySelector("#game-select"); | const select = document.querySelector("#game-select"); | ||||
| const options = {}; | const options = {}; | ||||
| versionFields.forEach(field => { | |||||
| field.textContent = "Version: " + version; | |||||
| }); | |||||
| stories.forEach(story => { | stories.forEach(story => { | ||||
| const option = document.createElement("option"); | const option = document.createElement("option"); | ||||
| option.value = story.id; | option.value = story.id; | ||||