0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-03-11 02:12:21 -05:00
ghost/core/client/views/login.js
Gabor Javorszky 6c99b67ab3 Added client side validation
Closes #581.

* Basically adds the client side of node validator, that we're already using
* Validator is plonked onto `Ghost.Validator`
* Usage is identical as to https://github.com/chriso/node-validator
* Has sanitizing values et al
* `Ghost.Validator.error` is redefined, it populates Ghost.Validator._errors (Array)
* `Ghost.Validator.handleErrors` is supposed to print out the multiple error messages, if there are multiple (this is broken due to how notifications are presented `.html` instead of `.append`), and also apply class to element
* The ajax calls are wrapped in an if to prevent network traffic if something's not right on client side
* Added validation to general settings and user settings screens.
* On validation error, optionally adds `.input-error` to whatever element you reference, see below (if `el` exists on the error object). This is the only place where usage is different to the original implementation. Redeclared `error()` function in `init.js`
* Usage: `Ghost.Validate.check(valueToCheck, {message: "the error message", el: $('#the element')}).isEmail()`
* The element above will receive the `.input-error` class. `isEmail()` is one of the stuff you can check against.
2013-09-14 10:52:27 +01:00

157 lines
5.1 KiB
JavaScript

/*global window, document, Ghost, $, _, Backbone, JST */
(function () {
"use strict";
Ghost.Views.Login = Ghost.View.extend({
initialize: function () {
this.render();
$(".js-login-box").css({"opacity": 0}).animate({"opacity": 1}, 500, function () {
$("[name='email']").focus();
});
},
templateName: "login",
events: {
'submit #login': 'submitHandler'
},
submitHandler: function (event) {
event.preventDefault();
var email = this.$el.find('.email').val(),
password = this.$el.find('.password').val(),
redirect = Ghost.Views.Utils.getUrlVariables().r;
Ghost.Validate._errors = [];
Ghost.Validate.check(email).isEmail();
Ghost.Validate.check(password, "Password too short").len(5);
if (Ghost.Validate._errors.length > 0) {
Ghost.Validate.handleErrors();
} else {
$.ajax({
url: '/ghost/signin/',
type: 'POST',
data: {
email: email,
password: password,
redirect: redirect
},
success: function (msg) {
window.location.href = msg.redirect;
},
error: function (xhr) {
Ghost.notifications.addItem({
type: 'error',
message: Ghost.Views.Utils.getRequestErrorMessage(xhr),
status: 'passive'
});
}
});
}
}
});
Ghost.Views.Signup = Ghost.View.extend({
initialize: function () {
this.render();
$(".js-signup-box").css({"opacity": 0}).animate({"opacity": 1}, 500, function () {
$("[name='name']").focus();
});
},
templateName: "signup",
events: {
'submit #signup': 'submitHandler'
},
submitHandler: function (event) {
event.preventDefault();
var name = this.$el.find('.name').val(),
email = this.$el.find('.email').val(),
password = this.$el.find('.password').val();
// This is needed due to how error handling is done. If this is not here, there will not be a time
// when there is no error.
Ghost.Validate._errors = [];
Ghost.Validate.check(name, "Please enter a name").len(1);
Ghost.Validate.check(email, "Please enter a correct email address").isEmail();
Ghost.Validate.check(password, "Please enter a password").len(5);
if (Ghost.Validate._errors.length > 0) {
Ghost.Validate.handleErrors();
} else {
$.ajax({
url: '/ghost/signup/',
type: 'POST',
data: {
name: name,
email: email,
password: password
},
success: function (msg) {
window.location.href = msg.redirect;
},
error: function (xhr) {
Ghost.notifications.addItem({
type: 'error',
message: Ghost.Views.Utils.getRequestErrorMessage(xhr),
status: 'passive'
});
}
});
}
}
});
Ghost.Views.Forgotten = Ghost.View.extend({
initialize: function () {
this.render();
$(".js-forgotten-box").css({"opacity": 0}).animate({"opacity": 1}, 500, function () {
$("[name='email']").focus();
});
},
templateName: "forgotten",
events: {
'submit #forgotten': 'submitHandler'
},
submitHandler: function (event) {
event.preventDefault();
var email = this.$el.find('.email').val();
Ghost.Validate._errors = [];
Ghost.Validate.check(email).isEmail();
if (Ghost.Validate._errors.length > 0) {
Ghost.Validate.handleErrors();
} else {
$.ajax({
url: '/ghost/forgotten/',
type: 'POST',
data: {
email: email
},
success: function (msg) {
window.location.href = msg.redirect;
},
error: function (xhr) {
Ghost.notifications.addItem({
type: 'error',
message: Ghost.Views.Utils.getRequestErrorMessage(xhr),
status: 'passive'
});
}
});
}
}
});
}());