2016-03-19 21:37:04 +01:00
|
|
|
'use strict';
|
|
|
|
|
|
|
|
const config = require('../config.js');
|
2016-04-09 18:54:23 +02:00
|
|
|
const views = require('../util/views.js');
|
2016-03-19 21:37:04 +01:00
|
|
|
|
2016-04-09 18:54:23 +02:00
|
|
|
class RegistrationView {
|
2016-03-29 12:32:51 +02:00
|
|
|
constructor() {
|
2016-04-09 18:54:23 +02:00
|
|
|
this.template = views.getTemplate('user-registration');
|
2016-03-19 21:37:04 +01:00
|
|
|
}
|
|
|
|
|
2016-04-08 10:35:38 +02:00
|
|
|
render(ctx) {
|
2016-04-10 10:23:27 +02:00
|
|
|
ctx.userNamePattern = config.userNameRegex;
|
|
|
|
ctx.passwordPattern = config.passwordRegex;
|
|
|
|
|
2016-04-09 18:54:23 +02:00
|
|
|
const target = document.getElementById('content-holder');
|
2016-04-10 10:23:27 +02:00
|
|
|
const source = this.template(ctx);
|
2016-03-19 21:37:04 +01:00
|
|
|
|
2016-04-08 10:35:38 +02:00
|
|
|
const form = source.querySelector('form');
|
|
|
|
const userNameField = source.querySelector('#user-name');
|
|
|
|
const passwordField = source.querySelector('#user-password');
|
|
|
|
const emailField = source.querySelector('#user-email');
|
2016-04-07 19:03:49 +02:00
|
|
|
|
2016-04-09 18:54:23 +02:00
|
|
|
views.decorateValidator(form);
|
2016-03-19 21:37:04 +01:00
|
|
|
|
2016-03-28 22:33:20 +02:00
|
|
|
form.addEventListener('submit', e => {
|
2016-03-19 21:37:04 +01:00
|
|
|
e.preventDefault();
|
2016-04-09 18:54:23 +02:00
|
|
|
views.clearMessages(target);
|
|
|
|
views.disableForm(form);
|
2016-04-08 10:35:38 +02:00
|
|
|
ctx.register(
|
2016-03-28 22:33:20 +02:00
|
|
|
userNameField.value,
|
|
|
|
passwordField.value,
|
|
|
|
emailField.value)
|
2016-04-09 18:54:23 +02:00
|
|
|
.always(() => { views.enableForm(form); });
|
2016-03-19 21:37:04 +01:00
|
|
|
});
|
2016-04-08 10:35:38 +02:00
|
|
|
|
2016-04-09 18:54:23 +02:00
|
|
|
views.listenToMessages(target);
|
|
|
|
views.showView(target, source);
|
2016-03-19 21:37:04 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
module.exports = RegistrationView;
|