pixeldrain/fnx_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

work on registration form

Browse Source
This commit is contained in:
Wim Brand
2018-06-21 23:41:50 +02:00
parent ffa9fb3395
commit 39404caa6e
12 changed files with 193 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
res/template/account/login.html
View File

@@ -30,7 +30,7 @@
<body>
<div id='body' class="body">
{{template "menu"}}
{{template "menu" .}}
<h1>Log in to your PixelDrain account</h1>
<form action="/login" method="POST" class="highlight_dark border_top border_bottom">

59
res/template/account/register.html
View File

@@ -28,28 +28,39 @@
<meta property="og:image:type" content="image/png" />
<script src="https://www.google.com/recaptcha/api.js"></script>
<script type="text/javascript">var apiEndpoint = '{{.APIEndpoint}}';</script>
</head>
<body>
<div id='body' class="body">
{{template "menu"}}
{{template "menu" .}}
<h1>Register a new Pixeldrain account</h1>
<form action="/login" method="POST" class="highlight_dark border_top border_bottom">
<form onSubmit="return submitForm();" class="highlight_dark border_top border_bottom">
<table style="margin-left: auto; margin-right: auto; text-align: left; max-width: 30em;">
<tr><td>Username (Used to log in)</td></tr>
<tr><td><input name="username" type="text" class="form_input"/></td></tr>
<tr><td><input id="register_username" type="text" autocomplete="username" class="form_input"/></td></tr>
<tr><td>used for logging into your account</td></tr>
<tr><td><hr/></td></tr>
<tr><td>E-mail address (optional):</td></tr>
<tr><td><input id="register_email" type="text" autocomplete="email" class="form_input"/></td></tr>
<tr><td>
your e-mail address will only be used for password
resets and important account notifications.
</td></tr>
<tr><td><hr/></td></tr>
<tr><td>
Enter your password twice:<br/>
(So we can verify that you have not made any typing errors)
(so we can verify that you have not made any typing errors)
</td></tr>
<tr><td><input name="password1" type="password" class="form_input"/></td></tr>
<tr><td><input name="password2" type="password" class="form_input"/></td></tr>
<tr><td><input id="register_password1" type="password" autocomplete="new-password" class="form_input"/></td></tr>
<tr><td><input id="register_password2" type="password" autocomplete="new-password" class="form_input"/></td></tr>
<tr><td><hr/></td></tr>
<tr><td>Prove that you're not a robot (Click the white box)</td></tr>
<tr><td style="text-align: center;">
<div class="g-recaptcha" data-theme="dark" data-sitekey="6LdEeQ0TAAAAALBmDF_k_2LgbpuJM66PGspByViS"></div>
</td></tr>
</tr>
<tr><td><hr/></td></tr>
<tr><td colspan=2 style="text-align: right;"><input type="submit" value="Register" class="button_highlight"/></td></tr>
</table>
</form>
@@ -58,6 +69,40 @@
{{template "footer"}}
</div>
<script type="text/javascript">
function submitForm(){
var uname = document.getElementById("register_username").value;
var email = document.getElementById("register_email").value;
var passwd1 = document.getElementById("register_password1").value;
var passwd2 = document.getElementById("register_password2").value;
var capt = grecaptcha.getResponse();
if (passwd1 !== passwd2) {
alert("Passwords do not match! Good thing we checked.");
return false;
}
var req = new XMLHttpRequest();
req.onreadystatechange = function(){
if (this.readyState === 4) {
var response = JSON.parse(req.responseText);
console.log(response);
}
}
req.open("POST", apiEndpoint+"/user/register", true);
var data = new FormData();
data.append("username", uname);
data.append("email", email);
data.append("password", passwd1);
data.append("recaptcha_response", capt);
req.send(data);
return false;
}
</script>
{{template "analytics"}}
</body>
</html>