diff --git a/app/assets/css/launcher.css b/app/assets/css/launcher.css index c91cc784..dda286b6 100644 --- a/app/assets/css/launcher.css +++ b/app/assets/css/launcher.css @@ -331,7 +331,7 @@ p { } #welcomeButton:active { color: #c7c7c7; - text-shadow: 0px 0px 20px #c7c7c7; + text-shadow: 0px 0px 20px #c7c7c7; } #welcomeSVG { -webkit-transform: translate3d(0, 0, 0); @@ -1267,6 +1267,24 @@ p { justify-content: center; } +#server_selection_button { + background: none; + border: none; + outline: none; + cursor: pointer; + line-height: 24px; + padding: 0px; + transition: 0.25s ease; +} +#server_selection_button:hover, +#server_selection_button:focus { + text-shadow: 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 20px #fff; +} +#server_selection_button:active { + color: #c7c7c7; + text-shadow: 0px 0px 20px #c7c7c7, 0px 0px 20px #c7c7c7, 0px 0px 20px #c7c7c7; +} + /* Progress bar styles. */ #launch_progress[value] { height: 3px; diff --git a/app/assets/js/scripts/landing.js b/app/assets/js/scripts/landing.js index 1bf4bab9..fe3f60e7 100644 --- a/app/assets/js/scripts/landing.js +++ b/app/assets/js/scripts/landing.js @@ -2,23 +2,24 @@ * Script for landing.ejs */ // Requirements -const cp = require('child_process') -const {URL} = require('url') +const cp = require('child_process') +const {URL} = require('url') // Internal Requirements -const {AssetGuard} = require(path.join(__dirname, 'assets', 'js', 'assetguard.js')) -const AuthManager = require(path.join(__dirname, 'assets', 'js', 'authmanager.js')) -const DiscordWrapper = require(path.join(__dirname, 'assets', 'js', 'discordwrapper.js')) -const Mojang = require(path.join(__dirname, 'assets', 'js', 'mojang.js')) -const ProcessBuilder = require(path.join(__dirname, 'assets', 'js', 'processbuilder.js')) -const ServerStatus = require(path.join(__dirname, 'assets', 'js', 'serverstatus.js')) +const {AssetGuard} = require(path.join(__dirname, 'assets', 'js', 'assetguard.js')) +const AuthManager = require(path.join(__dirname, 'assets', 'js', 'authmanager.js')) +const DiscordWrapper = require(path.join(__dirname, 'assets', 'js', 'discordwrapper.js')) +const Mojang = require(path.join(__dirname, 'assets', 'js', 'mojang.js')) +const ProcessBuilder = require(path.join(__dirname, 'assets', 'js', 'processbuilder.js')) +const ServerStatus = require(path.join(__dirname, 'assets', 'js', 'serverstatus.js')) // Launch Elements -const launch_content = document.getElementById('launch_content') -const launch_details = document.getElementById('launch_details') -const launch_progress = document.getElementById('launch_progress') -const launch_progress_label = document.getElementById('launch_progress_label') -const launch_details_text = document.getElementById('launch_details_text') +const launch_content = document.getElementById('launch_content') +const launch_details = document.getElementById('launch_details') +const launch_progress = document.getElementById('launch_progress') +const launch_progress_label = document.getElementById('launch_progress_label') +const launch_details_text = document.getElementById('launch_details_text') +const server_selection_button = document.getElementById('server_selection_button') /* Launch Progress Wrapper Functions */ @@ -93,9 +94,12 @@ document.getElementById('launch_button').addEventListener('click', function(e){ } }) -// TODO convert this to dropdown menu. // Bind selected server -document.getElementById('server_selection').innerHTML = '\u2022 ' + AssetGuard.getServerById(ConfigManager.getGameDirectory(), ConfigManager.getSelectedServer()).name +server_selection_button.innerHTML = '\u2022 ' + AssetGuard.getServerById(ConfigManager.getGameDirectory(), ConfigManager.getSelectedServer()).name +server_selection_button.addEventListener('click', (e) => { + e.target.blur() + toggleOverlay(true, 'serverSelectContent') +}) // Update Mojang Status Color const refreshMojangStatuses = async function(){ diff --git a/app/assets/js/scripts/overlay.js b/app/assets/js/scripts/overlay.js index 0a03af57..b9e453e8 100644 --- a/app/assets/js/scripts/overlay.js +++ b/app/assets/js/scripts/overlay.js @@ -2,8 +2,6 @@ * Script for overlay.ejs */ -//document.getElementById('overlayDismiss').href = 'javascript:void(0);' - /* Overlay Wrapper Functions */ /** @@ -89,4 +87,11 @@ function setDismissHandler(handler){ } else { document.getElementById('overlayDismiss').onclick = handler } -} \ No newline at end of file +} + +/* Server Select View */ + +// Bind server select cancel button. +document.getElementById('serverSelectCancel').addEventListener('click', () => { + toggleOverlay(false) +}) \ No newline at end of file diff --git a/app/landing.ejs b/app/landing.ejs index 40be735d..91bb06f8 100644 --- a/app/landing.ejs +++ b/app/landing.ejs @@ -125,8 +125,7 @@ <div id="launch_content"> <button id="launch_button">PLAY</button> <div class="bot_divider"></div> - <!-- Span until we implement the real selection --> - <span class="bot_label" id="server_selection"style="line-height: 24px;">• No Server Selected</span> + <button id="server_selection_button" class="bot_label">• No Server Selected</button> </div> <div id="launch_details"> <div id="launch_details_left">