ai-adventure-labs/server/frontend/public/js/connect/auth.js

92 lines
3.4 KiB
JavaScript

export class ServerAuth {
constructor (address, port, tlsEnabled) {
this.address = address;
this.port = port;
this.isTLSenabled = !!tlsEnabled;
}
getAuth () {
const serverdata = JSON.parse(localStorage.getItem(`server:${
!!this.isTLSenabled ? "wss" : "ws"
}:${address}:${port}`) ?? "null");
if (!serverdata) return null;
}
}
ServerAuth.authForm = document.createElement("div");
["auth-window"].forEach(c =>
ServerAuth.authForm.classList.add(c));
ServerAuth.authForm.innerHTML = `
<center><h1>Authorization</h1></center>
<hr/>
<div id="auth-zone">
<center style="" id="register" class="auth-act-item">
<div class="params-auth">
<div class="btn-group" role="group" style="width: 90%; margin-bottom: 15px;">
<button type="button" class="btn btn-light text-dark btn-outline-light">Register</button>
<button type="button" class="btn btn-dark btn-outline-light" id="menu-log-in">Log-In</button>
</div>
<!-- Field: username -->
<div class="mb-3" style="width: 90%; margin-bottom: 15px;">
<label class="form-label">Username</label>
<input type="text" class="form-control text-light bg-dark" id="rg.username">
<div class="form-text text-light">Your username into server.</div>
</div>
<!-- Field: password -->
<div class="mb-3" style="width: 90%; margin-bottom: 15px;">
<label class="form-label">Password</label>
<input type="password" class="form-control text-light bg-dark" id="rg.password">
<div class="form-text text-light">Your password into server.</div>
</div>
<!-- Not field: retry password -->
<div class="mb-3" style="width: 90%; margin-bottom: 15px;">
<label class="form-label">Retry password</label>
<input type="password" class="form-control text-light bg-dark" id="rg.retry-password">
<div class="form-text text-light">Retry password for you don't forget password.</div>
</div>
<!-- Field: server-code -->
<div class="mb-3" style="width: 90%; margin-bottom: 15px;" id="server-code-form" hidden>
<label class="form-label">Server password</label>
<input type="text" class="form-control text-light bg-dark" id="rg.server-code">
<div class="form-text text-light">Enter the password from server.</div>
</div>
</div>
<div class="btn-auth-block">
<hr><button type="button" class="btn btn-dark btn-outline-light" id="reg-btn">Register</button>
</div>
</center>
<center style="" id="log-in" class="auth-act-item" hidden>
<div class="params-auth">
<div class="btn-group" role="group" style="width: 90%; margin-bottom: 15px;">
<button type="button" class="btn btn-dark btn-outline-light" id="menu-register">Register</button>
<button type="button" class="btn btn-light text-dark btn-outline-light">Log-In</button>
</div>
<!-- Field: username -->
<div class="mb-3" style="width: 90%; margin-bottom: 15px;">
<label class="form-label">Username</label>
<input type="text" class="form-control text-light bg-dark" id="username">
<div class="form-text text-light">Your username into server.</div>
</div>
<!-- Field: password -->
<div class="mb-3" style="width: 90%; margin-bottom: 15px;">
<label class="form-label">Password</label>
<input type="password" class="form-control text-light bg-dark" id="password">
<div class="form-text text-light">Your password into server.</div>
</div>
</div>
<div class="btn-auth-block">
<hr><button type="button" class="btn btn-dark btn-outline-light" id="auth-btn">Log-In</button>
</div>
</center>
`;