Skip to content

yotta / pictogram

Go to a project
Commit 8367f4c3 by Arturo Montejo Ráez
Options

Signup form for tutors ready

parent 71a8171b
Inline Side-by-side
Showing with 148 additions and 119 deletions
sails/src/assets/app/i18n/en-gb.json
...@@ -121,6 +121,7 @@ ...@@ -121,6 +121,7 @@
"edit": "Edit", "edit": "Edit",
"email": "Email address", "email": "Email address",
"email_confirm": "E-mail address confirmation", "email_confirm": "E-mail address confirmation",
"email_invalid": "Invalid email",
"email_match": "The emails must match", "email_match": "The emails must match",
"email_type": "E-mail address", "email_type": "E-mail address",
"enable_sound_for": "Enable sound for", "enable_sound_for": "Enable sound for",
......
sails/src/assets/app/i18n/es-es.json
...@@ -121,6 +121,7 @@ ...@@ -121,6 +121,7 @@
"edit": "Editar", "edit": "Editar",
"email": "Correo electrónico", "email": "Correo electrónico",
"email_confirm": "Repite tu email", "email_confirm": "Repite tu email",
"email_invalid": "El email no es válido",
"email_match": "Los emails deben coincidir", "email_match": "Los emails deben coincidir",
"email_type": "Introduce tu email", "email_type": "Introduce tu email",
"enable_sound_for": "Habilitar sonido para", "enable_sound_for": "Habilitar sonido para",
......
sails/src/assets/scripts/modules/login/controllers/login.js
...@@ -113,40 +113,56 @@ function LoginCtrl( ...@@ -113,40 +113,56 @@ function LoginCtrl(
role: '', role: '',
}; };
$scope.minlength = CONSTANTS.password_minlength; $scope.minlength = CONSTANTS.password_minlength;
$scope.reset = function () { /* Forms objects */
$scope.formdata = formdata_empty; $scope.forms = {};
};
$scope.reset = function () {
$scope.formdata = formdata_empty;
};
$scope.reset(); $scope.reset();
// Signup form submit // Signup form submit
$scope.signup = function () { $scope.signup = function (formName) {
var form;
if (formName == 'tutorForm')
form = $scope.forms.tutorForm;
else if (formName == 'therapistForm')
form = $scope.forms.therapistForm;
else
form = $scope.forms.officeForm;
if (typeof $scope.formdata.email == 'undefined' || form.email.$invalid) {
ngToast.danger($translate.instant('email_invalid'));
return;
}
if ($scope.formdata.password.length < CONSTANTS.password_minlength) { if ($scope.formdata.password.length < CONSTANTS.password_minlength) {
ngToast.danger({ content: $translate.instant('password_short', {minlength: CONSTANTS.password_minlength}) }); ngToast.danger($translate.instant('password_short', {minlength: CONSTANTS.password_minlength}));
return; return;
} }
if (!$scope.formdata.disclaimer_accepted) { if ($scope.formdata.password !== $scope.formdata.password_confirm) {
ngToast.danger({ content: $translate.instant('disclaimer_requested') }); ngToast.danger($translate.instant('password_match'));
return; return;
} }
if (!$scope.formdata.role) { if (!$scope.formdata.disclaimer_accepted) {
ngToast.danger({ content: $translate.instant('case_requested') }); ngToast.danger($translate.instant('disclaimer_requested'));
return; return;
} }
if (!$scope.signInForm.$valid) if (form.$invalid)
return; return;
$http $http
.post(config.backend + '/sup', $scope.formdata) .post(config.backend + '/sup', $scope.formdata)
.success(function () { .success(function () {
ngToast.success({ content: $translate.instant('user_created', { name: $scope.formdata.name, surname: $scope.formdata.surname }) }); $scope.slide.rightTo('confirmation');
$scope.reset();
}) })
.error(function () { .error(function () {
ngToast.danger({ content: $translate.instant('user_exists', {email: $scope.formdata.email}) }); ngToast.danger({ content: $translate.instant('user_exists', {email: $scope.formdata.email}) });
......
sails/src/assets/scripts/modules/login/views/login.html
...@@ -86,9 +86,6 @@ ...@@ -86,9 +86,6 @@
</div> </div>
</div> </div>
<form name="signupForm" role="form" ng-submit="signup()">
<!-- <!--
SLIDE 2: Account selection SLIDE 2: Account selection
--> -->
...@@ -146,145 +143,159 @@ ...@@ -146,145 +143,159 @@
<!-- <!--
SLIDE 3: Tutor account form SLIDE 3: Tutor account form
--> -->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="tutor"> <form name="forms.tutorForm" role="form" ng-submit="signup('tutorForm')" novalidate ng-if="formdata.role == 'tutor'">
<legend translate>parents_tutor</legend>
<div class="row"> <div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="tutor">
<div class="col-md-4 text-center"> <legend translate>parents_tutor</legend>
<img src="img/parents.png" alt="{{'parents_tutor' | translate}}" title="{{'parents_tutor' | translate}}" /> <div class="row">
</div> <div class="col-md-4 text-center">
<div class="form-group col-md-4" id="tutor_form"> <img src="img/parents.png" alt="{{'parents_tutor' | translate}}" title="{{'parents_tutor' | translate}}" />
<input type="hidden" ng-model="formdata.role" value="tutor"></input>
<div class="form-group">
<label translate>email</label>
<input type="email" class="form-control" placeholder="{{ 'email' | translate }}" required required ng-model="formdata.email"/>
</div> </div>
<fieldset> <div class="form-group col-md-4">
<label translate>password</label> <input type="hidden" ng-model="formdata.role" value="tutor"></input>
<span class="color_red text_sm pull-right" ng-show="formdata.password != formdata.password_confirm" translate>password_match</span>
<span class="color_red text_sm pull-right" ng-show="formdata.password.length < minlength" translate>password_short</span>
<div class="form-group"> <div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="{{ 'password_type' | translate }}" required ng-model="formdata.password"/> <label translate>email</label>
<div class="form-group">
<input type="email" class="form-control" name="email" placeholder="{{ 'email' | translate }}" ng-model="formdata.email"/>
<span class="color_red text_sm pull-right" ng-show="forms.tutorForm.email.$dirty && forms.tutorForm.email.$invalid" translate>email_invalid</span>
</div>
</div> </div>
<fieldset>
<label translate>password</label>
<div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="{{ 'password_type' | translate }}" name="password" required ng-model="formdata.password"/>
</div>
<div class="form-group">
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}" name="password_confirm" required ng-model="formdata.password_confirm"/>
<span class="color_red text_sm pull-right" ng-show="formdata.password != formdata.password_confirm && forms.tutorForm.password.$dirty && forms.tutorForm.password_confirm.$dirty" translate>password_match</span>
<span class="color_red text_sm pull-right" ng-show="formdata.password.length < minlength && forms.tutorForm.password.$dirty && forms.tutorForm.password_confirm.$dirty"> {{ 'password_short' | translate:'{ minlength: minlength }' }}</span>
</div>
</fieldset>
<div class="form-group"> <div class="form-group">
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}" required ng-model="formdata.password_confirm"/> <input type="checkbox" ng-model="formdata.disclaimer_accepted">
<span translate>disclaimer_accept</span>
</div> </div>
</fieldset>
<div class="form-group">
<input type="checkbox" ng-model="formdata.disclaimer_accepted">
<span translate>disclaimer_accept</span>
</div>
<div class="form-group"> <div class="form-group">
<label>Captcha</label> <label>Captcha</label>
<div vc-recaptcha></div> <div vc-recaptcha></div>
</div> </div>
</div>
</div> </div>
</div> <div class="row form-group">
<div class="row form-group"> <div class="col-md-4">
<div class="col-md-4"> <button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button>
<button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button> </div>
</div> <div class="col-md-4">
<div class="col-md-4"> <button type="submit" class="btn btn-primary" ng-disabled="forms.tutorForm.$invalid || !formdata.disclaimer_accepted">{{ 'create_account' | translate }} &gt;&gt; </button>
<button type="submit" class="btn btn-primary" ng-disabled="signupForm.$invalid" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button> </div>
</div> </div>
</div> </div>
</div>
</form>
<!-- <!--
SLIDE 4: Therapist account form SLIDE 4: Therapist account form
--> -->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="therapist"> <form name="forms.therapistForm" role="form" ng-submit="signup('therapistForm')" novalidate ng-if="formdata.role == 'therapist'">
<legend translate>therapist</legend>
<div class="row"> <div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="therapist">
<div class="col-md-4 text-center"> <legend translate>therapist</legend>
<img src="img/therapist.png" alt="{{'therapist' | translate}}" title="{{'therapist' | translate}}" /> <div class="row">
</div> <div class="col-md-4 text-center">
<div class="form-group col-md-4" id="tutor_form"> <img src="img/therapist.png" alt="{{'therapist' | translate}}" title="{{'therapist' | translate}}" />
<div class="form-group">
<label translate>email</label>
<input type="email" class="form-control" placeholder="{{ 'email' | translate }}" required ng-model="formdata.office.email"/>
</div> </div>
<fieldset> <div class="form-group col-md-4" id="tutor_form">
<label translate>password</label>
<span class="color_red text_sm pull-right" ng-show="formdata.password != formdata.password_confirm" translate>password_match</span>
<div class="form-group"> <div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="{{ 'password_type' | translate }}" required ng-model="formdata.password"/> <label translate>email</label>
<input type="email" class="form-control" placeholder="{{ 'email' | translate }}" ng-model="formdata.email"/>
</div> </div>
<fieldset>
<label translate>password</label>
<div class="form-group">
<span class="color_red text_sm pull-right" ng-show="formdata.password != formdata.password_confirm" translate>password_match</span>
<input type="password" class="form-control" id="signin_password1" placeholder="{{ 'password_type' | translate }}" required ng-model="formdata.password"/>
</div>
<div class="form-group">
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}" required ng-model="formdata.password_confirm"/>
</div>
</fieldset>
<div class="form-group"> <div class="form-group">
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}" required ng-model="formdata.password_confirm"/> <input type="checkbox" ng-model="formdata.disclaimer_accepted">
<span translate>disclaimer_accept</span>
</div>
<div class="form-group">
<label>Captcha</label>
<div vc-recaptcha></div>
</div> </div>
</fieldset>
<div class="form-group">
<input type="checkbox" ng-model="formdata.disclaimer_accepted">
<span translate>disclaimer_accept</span>
</div>
<div class="form-group">
<label>Captcha</label>
<div vc-recaptcha></div>
</div> </div>
</div> </div>
</div> <div class="row form-group">
<div class="row form-group"> <div class="col-md-4">
<div class="col-md-4"> <button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button>
<button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button> </div>
</div> <div class="col-md-4">
<div class="col-md-4"> <button type="submit" class="btn btn-primary" ng-disabled="forms.therapistForm.$invalid" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button>
<button type="submit" class="btn btn-primary" ng-disabled="signupForm.$invalid" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button> </div>
</div> </div>
</div> </div>
</div>
</form>
<!-- <!--
SLIDE 5: Office account form SLIDE 5: Office account form
--> -->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="office">
<legend translate>office_center</legend> <form name="forms.officeForm" role="form" ng-submit="signup('officeForm')" novalidate ng-if="formdata.role == 'office'">
<div class="row">
<div class="col-md-4 text-center"> <div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="office">
<img src="img/office.jpg" alt="{{'office_center' | translate}}" title="{{'office_center' | translate}}" /> <legend translate>office_center</legend>
</div> <div class="row">
<div class="form-group col-md-4" id="office_form"> <div class="col-md-4 text-center">
<div class="form-group"> <img src="img/office.jpg" alt="{{'office_center' | translate}}" title="{{'office_center' | translate}}" />
<label translate>name</label>
<input type="text" class="form-control" placeholder="{{ 'name' | translate }}" required ng-model="formdata.name"/>
</div>
<div class="form-group">
<label translate>email</label>
<input type="email" class="form-control" placeholder="{{ 'email' | translate }}" required ng-model="formdata.email"/>
</div> </div>
<fieldset> <div class="form-group col-md-4" id="office_form">
<label translate>password</label>
<span class="color_red text_sm pull-right" ng-show="formdata.password != formdata.password_confirm" translate>password_match</span>
<div class="form-group"> <div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="{{ 'password_type' | translate }}" required ng-model="formdata.password"/> <label translate>name</label>
<input type="text" class="form-control" placeholder="{{ 'name' | translate }}" required ng-model="formdata.name"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}" required ng-model="formdata.password_confirm"/> <label translate>email</label>
<input type="email" class="form-control" placeholder="{{ 'email' | translate }}" required ng-model="formdata.email"/>
</div>
<fieldset>
<label translate>password</label>
<span class="color_red text_sm pull-right" ng-show="formdata.password != formdata.password_confirm" translate>password_match</span>
<div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="{{ 'password_type' | translate }}" required ng-model="formdata.password"/>
</div>
<div class="form-group">
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}" required ng-model="formdata.password_confirm"/>
</div>
</fieldset>
<div class="form-group">
<input type="checkbox" ng-model="formdata.disclaimer_accepted">
<span translate>disclaimer_accept</span>
</div>
<div class="form-group">
<label>Captcha</label>
<div vc-recaptcha></div>
</div> </div>
</fieldset>
<div class="form-group">
<input type="checkbox" ng-model="formdata.disclaimer_accepted">
<span translate>disclaimer_accept</span>
</div>
<div class="form-group">
<label>Captcha</label>
<div vc-recaptcha></div>
</div> </div>
</div> </div>
</div> <div class="row form-group">
<div class="row form-group"> <div class="col-md-4">
<div class="col-md-4"> <button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button>
<button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button> </div>
</div> <div class="col-md-4">
<div class="col-md-4"> <button type="submit" class="btn btn-primary" ng-disabled="forms.officeForm.$invalid" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button>
<button type="submit" class="btn btn-primary" ng-disabled="signupForm.$invalid" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button> </div>
</div> </div>
</div> </div>
</div>
</form> </form>
<!-- <!--
SLIDE 6: Confirmation message SLIDE 6: Confirmation message
...@@ -292,7 +303,7 @@ ...@@ -292,7 +303,7 @@
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="confirmation"> <div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="confirmation">
<h2>{{ 'user_created' | translate }} </h2> <h2>{{ 'user_created' | translate }} </h2>
<p> {{ 'user_created_text' | translate }} </p> <p> {{ 'user_created_text' | translate:'{ email: formdata.email }' }} </p>
<br> <br>
<img src="img/child.png"/> <img src="img/child.png"/>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment