mirror of
https://github.com/slynn1324/tinypin.git
synced 2026-01-23 02:25:08 +00:00
116 lines
No EOL
3.9 KiB
HTML
116 lines
No EOL
3.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>tinypin</title>
|
|
<meta charset="utf-8">
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
|
|
<link rel="apple-touch-icon" sizes="180x180" href="pub/icons/apple-touch-icon.png">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="pub/icons/favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="pub/icons/favicon-16x16.png">
|
|
<link rel="manifest" href="pub/icons/site.webmanifest">
|
|
<link rel="mask-icon" href="pub/icons/safari-pinned-tab.svg" color="#5bbad5">
|
|
<link rel="shortcut icon" href="pub/icons/favicon.ico">
|
|
<meta name="msapplication-TileColor" content="#da532c">
|
|
<meta name="msapplication-config" content="pub/icons/browserconfig.xml">
|
|
<meta name="theme-color" content="#ffffff">
|
|
|
|
<link rel="stylesheet" href="pub/bulma-custom.css" />
|
|
</head>
|
|
<body>
|
|
<div class="modal is-active">
|
|
<div class="modal-background" data-onclick="aboutModal.close"></div>
|
|
<div class="modal-card">
|
|
<header class="modal-card-head">
|
|
<p class="modal-card-title">tinypin » log in</p>
|
|
</header>
|
|
<form method="post" action="./login">
|
|
<section class="modal-card-body">
|
|
|
|
<div class="field">
|
|
<label class="label" for="username">username</label>
|
|
<div class="control">
|
|
<input class="input" name="username" id="username" type="text">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="label" for="password">password</label>
|
|
<div class="control">
|
|
<input class="input" name="password" id="password" type="password">
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
<footer class="modal-card-foot">
|
|
<button id="submitButton" class="button is-success" type="submit">login</button>
|
|
<a class="button" href="register">create account</a>
|
|
<span id="nope"></span>
|
|
</footer>
|
|
</form>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<script>
|
|
|
|
// clear previously stored values
|
|
window.localStorage.clear();
|
|
|
|
if ( window.location.hash == "#nope" ){
|
|
document.getElementById("nope").innerText = "nope.";
|
|
}
|
|
|
|
const username = document.getElementById("username");
|
|
const password = document.getElementById("password");
|
|
const submitButton = document.getElementById("submitButton");
|
|
|
|
const validate = () => {
|
|
|
|
let valid = true;
|
|
|
|
if ( username.value.length < 1 ){
|
|
if ( username.getAttribute("data-visited") == "y" ){
|
|
username.classList.add("is-danger");
|
|
}
|
|
valid = false;
|
|
} else {
|
|
username.classList.remove("is-danger");
|
|
}
|
|
|
|
if ( password.value.length < 1 ){
|
|
if ( password.getAttribute("data-visited") == "y" ){
|
|
password.classList.add("is-danger");
|
|
}
|
|
valid = false;
|
|
} else {
|
|
password.classList.remove('is-danger');
|
|
}
|
|
|
|
if ( valid ){
|
|
submitButton.disabled = false;
|
|
} else {
|
|
submitButton.disabled = true;
|
|
}
|
|
|
|
|
|
}
|
|
|
|
// document.addEventListener('input', validate);
|
|
// document.addEventListener('focusin', (evt) => {
|
|
// if ( evt.target == username ){
|
|
// username.setAttribute("data-visited", "y");
|
|
// } else if ( evt.target == password ){
|
|
// password.setAttribute("data-visited", "y");
|
|
// }
|
|
// });
|
|
// document.addEventListener('focusout', (evt) => {
|
|
// validate();
|
|
// });
|
|
|
|
</script>
|
|
</body>
|
|
|
|
</html> |