Form submits on return press

This commit is contained in:
PeekabooSteam 2023-11-05 13:05:46 +00:00
parent a04780f311
commit a5bfb4f8d2
3 changed files with 23 additions and 20 deletions

View File

@ -72,10 +72,6 @@ form {
padding: 0;
}
form>div {
margin: 20px 0;
}
.pill {
background-color: var(--background-steel);
border-radius: 999px;
@ -669,8 +665,8 @@ nav.ol-panel> :last-child {
width:10px;
}
.ol-navbar-buttons-group > .protectable > button.lock svg.locked {
filter:invert(100);
.ol-navbar-buttons-group > .protectable > button.lock svg.locked * {
fill:white !important;
}
.ol-navbar-buttons-group > .protectable > button:not([data-protected]).lock svg.unlocked,
@ -850,7 +846,7 @@ nav.ol-panel> :last-child {
column-gap: 10px;
display: flex;
flex-direction: row;
margin: 10px 0px;
margin: 20px 0px;
flex-wrap: wrap;
width: 100%;
row-gap: 10px;

View File

@ -403,19 +403,26 @@ export class OlympusApp {
});
/* Try and connect with the Olympus REST server */
document.addEventListener("tryConnection", () => {
const form = document.querySelector("#splash-content")?.querySelector("#authentication-form");
const username = (form?.querySelector("#username") as HTMLInputElement).value;
const password = (form?.querySelector("#password") as HTMLInputElement).value;
const loginForm = document.getElementById("authentication-form");
if (loginForm instanceof HTMLFormElement) {
loginForm.addEventListener("submit", (ev:SubmitEvent) => {
ev.preventDefault();
ev.stopPropagation();
const username = (loginForm.querySelector("#username") as HTMLInputElement).value;
const password = (loginForm.querySelector("#password") as HTMLInputElement).value;
/* Update the user credentials */
this.getServerManager().setCredentials(username, password);
// Update the user credentials
this.getServerManager().setCredentials(username, password);
/* Start periodically requesting updates */
this.getServerManager().startUpdate();
// Start periodically requesting updates
this.getServerManager().startUpdate();
this.setLoginStatus("connecting");
});
} else {
console.error("Unable to find login form.");
}
this.setLoginStatus("connecting");
})
/* Reload the page, used to mimic a restart of the app */
document.addEventListener("reloadPage", () => {

View File

@ -6,11 +6,11 @@
<div class="app-version">Version <span class="app-version-number">v0.4.5-alpha</span></div>
</div>
<div id="authentication-form">
<form id="authentication-form">
<div><h5>Username</h5> <input type="text" id="username" name="username" required autocomplete="username" placeholder="Enter username..."></div>
<div><h5>Password</h5> <input type="password" id="password" name="password" minlength="8" required autocomplete="current-password" placeholder="Enter password..."></div>
<button id="connection-button" class="ol-button-apply" data-on-click="tryConnection">Connect</button>
</div>
<button type="submit" id="connection-button" class="ol-button-apply">Connect</button>
</form>
<h5 id="login-status"><br></h5>