diff options
| -rw-r--r-- | app/assets/javascripts/models/password_reset.js.coffee | 20 | ||||
| -rw-r--r-- | app/assets/javascripts/views/passwords/reset_form.js.coffee | 31 | ||||
| -rw-r--r-- | app/views/passwords/new.html.erb | 16 |
3 files changed, 58 insertions, 9 deletions
diff --git a/app/assets/javascripts/models/password_reset.js.coffee b/app/assets/javascripts/models/password_reset.js.coffee new file mode 100644 index 00000000..c9da0a3c --- /dev/null +++ b/app/assets/javascripts/models/password_reset.js.coffee @@ -0,0 +1,20 @@ +#= require ./translation + +class csx.Models.PasswordReset extends Backbone.Model + translation: new csx.Translation('user') + defaults: + email: null + + requiredFields: ['email'] + + validate: (attributes, options) -> + errors = {} + + unless new csx.Models.Email(attributes.email).isValid() + errors['email'] = @translation.errorFor('email', 'invalid') + + _.each @requiredFields, (field) => + if _.isEmpty(attributes[field]) + errors[field] = @translation.errorFor(field, 'blank') + + return errors if _.keys(errors).length > 0 diff --git a/app/assets/javascripts/views/passwords/reset_form.js.coffee b/app/assets/javascripts/views/passwords/reset_form.js.coffee new file mode 100644 index 00000000..8d08e017 --- /dev/null +++ b/app/assets/javascripts/views/passwords/reset_form.js.coffee @@ -0,0 +1,31 @@ +class csx.Views.PasswordResetForm extends csx.AutoView + @viewName 'password-reset-form' + modelKey: "user" + events: + 'input #user_email': 'onInput' + 'submit form': 'onSubmit' + + initialize: () -> + @model = new csx.Models.PasswordReset() + + render: -> + @renderErrors(@model.validationError) + + onInput: (event) -> + $element = $(event.target) + @model.set(@fieldNameFor($element), @valueFor($element)) + @$('input[type=submit]').prop('disabled', !@model.isValid()) + @render() + + onSubmit: (event) -> + if !@model.isValid() + @$('input[type=submit]').prop('disabled', true) + event.preventDefault() + event.stopPropagation() + @render() + + valueFor: (element) -> + if element.is(':checkbox') + element.prop('checked') + else + element.val() diff --git a/app/views/passwords/new.html.erb b/app/views/passwords/new.html.erb index 72be491d..af01e910 100644 --- a/app/views/passwords/new.html.erb +++ b/app/views/passwords/new.html.erb @@ -1,14 +1,12 @@ <div class="row"> - <div class="col"> + <div class="col" data-autoview="password-reset-form"> <h1>Forgot your password?</h1> - <%= form_for(@user, url: passwords_path) do |f| %> - <fieldset> - <legend>Type your email address below to reset your password.</legend> - <div class="form-group"> - <%= f.email_field :email, placeholder: "Email", class: "form-control", required: :required %> - </div> - <button type="submit" class="btn btn-primary">Send me reset password instructions</button> - </fieldset> + <%= form_for(@user, url: passwords_path, html: { class: "form-horizontal needs-validation", novalidate: :novalidate }) do |f| %> + <div class="form-group"> + <%= f.email_field :email, placeholder: "Email", class: "form-control", required: :required %> + <div class="invalid-feedback"></div> + </div> + <%= f.submit "Send me reset password instructions", class: "btn btn-primary" %> <% end %> </div> </div> |