Render recaptcha on registration page
This commit is contained in:
parent
b037ce80c3
commit
3c6a3f1d30
3 changed files with 15 additions and 0 deletions
|
@ -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-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='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'/>
|
<link rel='manifest' href='manifest.json'/>
|
||||||
|
<script src="https://www.google.com/recaptcha/api.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id='top-navigation-holder'></div>
|
<div id='top-navigation-holder'></div>
|
||||||
|
|
|
@ -38,6 +38,8 @@
|
||||||
|
|
||||||
<div class='messages'></div>
|
<div class='messages'></div>
|
||||||
<div class='buttons'>
|
<div class='buttons'>
|
||||||
|
<div id="recaptcha"></div>
|
||||||
|
<br>
|
||||||
<input type='submit' value='Create an account'/>
|
<input type='submit' value='Create an account'/>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -5,6 +5,7 @@ const api = require("../api.js");
|
||||||
const views = require("../util/views.js");
|
const views = require("../util/views.js");
|
||||||
|
|
||||||
const template = views.getTemplate("user-registration");
|
const template = views.getTemplate("user-registration");
|
||||||
|
const RECAPTCHA_SITE_KEY = "site key";
|
||||||
|
|
||||||
class RegistrationView extends events.EventTarget {
|
class RegistrationView extends events.EventTarget {
|
||||||
constructor() {
|
constructor() {
|
||||||
|
@ -20,6 +21,13 @@ class RegistrationView extends events.EventTarget {
|
||||||
views.syncScrollPosition();
|
views.syncScrollPosition();
|
||||||
views.decorateValidator(this._formNode);
|
views.decorateValidator(this._formNode);
|
||||||
this._formNode.addEventListener("submit", (e) => this._evtSubmit(e));
|
this._formNode.addEventListener("submit", (e) => this._evtSubmit(e));
|
||||||
|
this.renderRecaptcha();
|
||||||
|
}
|
||||||
|
|
||||||
|
renderRecaptcha() {
|
||||||
|
grecaptcha.render(this._recaptchaNode, {
|
||||||
|
"sitekey": RECAPTCHA_SITE_KEY
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
clearMessages() {
|
clearMessages() {
|
||||||
|
@ -66,6 +74,10 @@ class RegistrationView extends events.EventTarget {
|
||||||
get _emailFieldNode() {
|
get _emailFieldNode() {
|
||||||
return this._formNode.querySelector("[name=email]");
|
return this._formNode.querySelector("[name=email]");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get _recaptchaNode() {
|
||||||
|
return this._formNode.querySelector("#recaptcha");
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = RegistrationView;
|
module.exports = RegistrationView;
|
||||||
|
|
Reference in a new issue