Schafkopf-Server/Public/login.html
Christoph Hagen 213bb1c179 Extract login pages to own files
Fix api

Remove login window
2022-10-12 19:56:25 +02:00

71 lines
3.0 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>Schafkopf</title>
<meta name='viewport' content='width=device-width, initial-scale=1'/>
<link rel='stylesheet' type='text/css' media='screen' href='style.css'/>
<link rel='stylesheet' type='text/css' media='screen' href='login.css'/>
<script src='api.js'></script>
<script src='storage.js'></script>
<script src='login.js'></script>
</head>
<body>
<div id="login-window">
<div id="login-window-vertical-center">
<div id="login-window-inner">
<div id="sheephead-logo">\_______/<br>\ - - /<br>\ | /<br>\_/<br><br>Sheephead</div>
<label for="usrname">Username<a href="register.html">Create account</a></label>
<input type="text" id="user-name" name="usrname" required/>
<label for="psw">Password<a href="reset.html">Reset password</a></label>
<input type="password" id="user-pwd" name="psw" required/>
<button class="login-buttons standard-button" onclick="loginUser()">Log in</button>
<div id="user-hint"></div>
</div>
</div>
</div>
<script>
function loginUser() {
const username = getLoginName();
const password = getLoginPassword();
if (username == "") {
setTextHint("Please enter your user name");
return
}
if (password == "") {
setTextHint("Please enter a password");
return
}
performLoginPlayerRequest(username, password)
.then(function(token) {
storePlayerNameAndToken(username, token)
window.location.href = "schafkopf.html";
}).catch(function(error) {
console.log("Failed to log in")
console.log(error)
// TODO: Create better error message for user
setTextHint(error);
})
}
function showDebugLogins() {
document.getElementById("login-window-inner").innerHTML +=
"<button class=\"login-buttons standard-button\" onclick=\"loginDebugUser('a')\">Player A</button>" +
"<button class=\"login-buttons standard-button\" onclick=\"loginDebugUser('b')\">Player B</button>" +
"<button class=\"login-buttons standard-button\" onclick=\"loginDebugUser('c')\">Player C</button>" +
"<button class=\"login-buttons standard-button\" onclick=\"loginDebugUser('d')\">Player D</button>"
}
function loginDebugUser(name) {
setLoginName(name)
setLoginPassword(name)
loginUser()
}
loadExistingSession()
</script>
</body>
</html>