Render recaptcha on registration page

This commit is contained in:
Jesse 2020-07-08 03:20:43 -04:00
parent b037ce80c3
commit 3c6a3f1d30
No known key found for this signature in database
GPG key ID: 1A8AB3257B32D91F
3 changed files with 15 additions and 0 deletions

View file

@ -22,6 +22,7 @@
<link rel='apple-touch-startup-image' href='img/apple-touch-startup-image-1668x2224.png' media='(min-device-width: 834px) and (max-device-width: 834px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)'/>
<link rel='apple-touch-startup-image' href='img/apple-touch-startup-image-2048x2732.png' media='(min-device-width: 1024px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait)'/>
<link rel='manifest' href='manifest.json'/>
<script src="https://www.google.com/recaptcha/api.js"></script>
</head>
<body>
<div id='top-navigation-holder'></div>

View file

@ -38,6 +38,8 @@
<div class='messages'></div>
<div class='buttons'>
<div id="recaptcha"></div>
<br>
<input type='submit' value='Create an account'/>
</div>
</form>

View file

@ -5,6 +5,7 @@ const api = require("../api.js");
const views = require("../util/views.js");
const template = views.getTemplate("user-registration");
const RECAPTCHA_SITE_KEY = "site key";
class RegistrationView extends events.EventTarget {
constructor() {
@ -20,6 +21,13 @@ class RegistrationView extends events.EventTarget {
views.syncScrollPosition();
views.decorateValidator(this._formNode);
this._formNode.addEventListener("submit", (e) => this._evtSubmit(e));
this.renderRecaptcha();
}
renderRecaptcha() {
grecaptcha.render(this._recaptchaNode, {
"sitekey": RECAPTCHA_SITE_KEY
});
}
clearMessages() {
@ -66,6 +74,10 @@ class RegistrationView extends events.EventTarget {
get _emailFieldNode() {
return this._formNode.querySelector("[name=email]");
}
get _recaptchaNode() {
return this._formNode.querySelector("#recaptcha");
}
}
module.exports = RegistrationView;