diff --git a/index.html b/index.html index f1298b5..5a50eea 100644 --- a/index.html +++ b/index.html @@ -11,6 +11,11 @@
Star Gazer 2000
Start Game
+
+

Options

+ + +
diff --git a/resources/css/default.css b/resources/css/default.css index 199eaf3..041e672 100644 --- a/resources/css/default.css +++ b/resources/css/default.css @@ -15,6 +15,10 @@ body { font-family: "ShareTech"; } +canvas { + cursor: none; +} + #startScreen { width: 100vw; height: 100vh; @@ -22,11 +26,10 @@ body { } #startTitle { - position: relative; width: 60vw; height: 10vh; - top: 20vh; - margin: 0 auto; + margin: 0 auto; + padding-top: 10vh; text-align: center; line-height: 10vh; font-size: 10vh; @@ -35,11 +38,9 @@ body { } #startButton { - position: relative; width: 30vw; height: 10vh; - top: 30vh; - margin: 0 auto; + margin: 10vh auto; border-radius: 5px; border-width: 5px; border-style: solid; @@ -58,6 +59,13 @@ body { color: #3f0d76; } -canvas { - cursor: none; +#startMenu { + width: 30vw; + height: 10vh; + margin: 10vh auto; + color: #FFF; +} + +#startMenu h1 { + text-align: center; } \ No newline at end of file diff --git a/resources/js/Config.js b/resources/js/Config.js index e9cc5dc..803d662 100644 --- a/resources/js/Config.js +++ b/resources/js/Config.js @@ -2,7 +2,6 @@ var Config = { GAZE_SERVER_URL: "ws://localhost:8001/gaze", TARGET_FPS: 60, SHOW_DEBUG_INFO: true, - USE_MOUSE_INPUT_AS_FAKE_GAZE_DATA: true, USE_LOGGER: true, SCREEN_WIDTH: screen.width, SCREEN_HEIGHT: screen.height, diff --git a/resources/js/index.js b/resources/js/index.js index e31f8bb..20d6cfa 100644 --- a/resources/js/index.js +++ b/resources/js/index.js @@ -5,9 +5,13 @@ import FakeGazeDataProvider from "./gaze/FakeGazeDataProvider.js"; import GazeDataProvider from "./gaze/GazeDataProvider.js"; var canvas = document.querySelector("canvas"), - starScreen = document.querySelector("#startScreen"); + starScreen = document.querySelector("#startScreen"), + options = { + useMouse: false, + }; function init() { + loadOptions(); if (Config.USE_LOGGER === true) { Logger.enable(); } @@ -15,8 +19,12 @@ function init() { prepareGame); } +function loadOptions() { + options.useMouse = document.querySelector("#useMouseInput").checked; +} + function prepareGame() { - let dataProvider = getDataProvider(); + loadOptions(); StarGazer.init({ canvas: canvas, fps: Config.TARGET_FPS, @@ -24,7 +32,7 @@ function prepareGame() { showDebug: Config.SHOW_DEBUG_INFO, width: Config.SCREEN_WIDTH, height: Config.SCREEN_HEIGHT, - gazeDataProvider: dataProvider, + gazeDataProvider: getDataProvider(), }); canvas.requestFullscreen().then(startGame); } @@ -36,7 +44,7 @@ function startGame() { function getDataProvider() { let provider; - if (Config.USE_MOUSE_INPUT_AS_FAKE_GAZE_DATA === true) { + if (options.useMouse === true) { provider = new FakeGazeDataProvider(); } else { provider = new GazeDataProvider();