Skip to content

yotta / pictogram

Go to a project
Commit 2ff19d74 by Arturo Montejo Ráez
Options

add student wizard mockup ready

parent 9885ef02
Inline Side-by-side
Showing with 214 additions and 259 deletions
sails/src/assets/app/i18n/en-gb.json
...@@ -446,7 +446,8 @@ ...@@ -446,7 +446,8 @@
"use_categories": "Use categories", "use_categories": "Use categories",
"username": "Name of account (no spaces)", "username": "Name of account (no spaces)",
"username_exists": "There is already an account with name '{{username}}'", "username_exists": "There is already an account with name '{{username}}'",
"user_created": "User {{name}} {{surname}} created. An email with instructions to activate the account has been sent.", "user_created": "Account created!",
"user_created_text": "An email with instructions to activate the account has been sent to {{email}}.",
"user_exists": "User with email {{email}} already exists", "user_exists": "User with email {{email}} already exists",
"validate_fail": "The user account couldn't be validated", "validate_fail": "The user account couldn't be validated",
"validate_success": "The user account has been validated. Now, you can login from the link below", "validate_success": "The user account has been validated. Now, you can login from the link below",
......
sails/src/assets/app/i18n/es-es.json
...@@ -446,7 +446,8 @@ ...@@ -446,7 +446,8 @@
"use_categories": "Usar categorías", "use_categories": "Usar categorías",
"username": "Nombre cuenta (sin espacios)", "username": "Nombre cuenta (sin espacios)",
"username_exists": "Ya existe un usuario con nombre de cuenta '{{username}}'", "username_exists": "Ya existe un usuario con nombre de cuenta '{{username}}'",
"user_created": "Usuario {{name}} {{surname}} creado. Se ha enviado un email de confirmación para activar su cuenta.", "user_created": "¡Cuenta creada!",
"user_created_text": "Se ha enviado un email de confirmación para activar su cuenta a la dirección {{email}}.",
"user_exists": "Ya existe el usuario con email '{{email}}'", "user_exists": "Ya existe el usuario con email '{{email}}'",
"validate_fail": "La cuenta no se ha podido validar", "validate_fail": "La cuenta no se ha podido validar",
"validate_success": "Cuenta validada. Puede iniciar sesión desde el enlace inferior", "validate_success": "Cuenta validada. Puede iniciar sesión desde el enlace inferior",
......
sails/src/assets/app/img/office.jpg
sails/src/assets/app/img/office.jpg

14.7 KB | W: | H:

sails/src/assets/app/img/office.jpg

11.7 KB | W: | H:

sails/src/assets/app/img/office.jpg
sails/src/assets/app/img/office.jpg
sails/src/assets/app/img/office.jpg
sails/src/assets/app/img/office.jpg
  • 2-up
  • Swipe
  • Onion skin
sails/src/assets/app/img/parents.png
sails/src/assets/app/img/parents.png

32 KB | W: | H:

sails/src/assets/app/img/parents.png

25.4 KB | W: | H:

sails/src/assets/app/img/parents.png
sails/src/assets/app/img/parents.png
sails/src/assets/app/img/parents.png
sails/src/assets/app/img/parents.png
  • 2-up
  • Swipe
  • Onion skin
sails/src/assets/app/img/therapist.png
sails/src/assets/app/img/therapist.png

24.6 KB | W: | H:

sails/src/assets/app/img/therapist.png

23 KB | W: | H:

sails/src/assets/app/img/therapist.png
sails/src/assets/app/img/therapist.png
sails/src/assets/app/img/therapist.png
sails/src/assets/app/img/therapist.png
  • 2-up
  • Swipe
  • Onion skin
sails/src/assets/scripts/modules/login/controllers/login.js
...@@ -26,12 +26,14 @@ function LoginCtrl( ...@@ -26,12 +26,14 @@ function LoginCtrl(
rightTo: function (state) { rightTo: function (state) {
$scope.slide.back = false; $scope.slide.back = false;
$scope.slide.prev = $scope.slide.state;
$timeout(function () { $timeout(function () {
$scope.slide.state = state; $scope.slide.state = state;
}, 0); }, 0);
}, },
leftTo: function (state) { leftTo: function (state) {
$scope.slide.back = true; $scope.slide.back = true;
$scope.slide.prev = $scope.slide.state;
$timeout(function () { $timeout(function () {
$scope.slide.state = state; $scope.slide.state = state;
}, 0); }, 0);
......
sails/src/assets/scripts/modules/login/views/login.html
...@@ -95,7 +95,7 @@ ...@@ -95,7 +95,7 @@
<div class="col-md-4"> <div class="col-md-4">
<legend translate>parents_tutor</legend> <legend translate>parents_tutor</legend>
<div class="text-center"> <div class="text-center">
<a ng-click="slide.rightTo('tutor')"><img src="img/parents.png" alt="Tutor" title="Tutor" /></a> <a ng-click="slide.rightTo('tutor')"><img src="img/parents.png" alt="{{'parents_tutor' | translate}}" title="{{'parents_tutor' | translate}}" /></a>
</div> </div>
<div> <div>
<p>Gestione los pictogramas de su hijo o hija y configure su dispositivo de comunicación.</p> <p>Gestione los pictogramas de su hijo o hija y configure su dispositivo de comunicación.</p>
...@@ -104,7 +104,7 @@ ...@@ -104,7 +104,7 @@
<div class="col-md-4"> <div class="col-md-4">
<legend translate>therapist</legend> <legend translate>therapist</legend>
<div class="text-center"> <div class="text-center">
<a ng-click="slide.rightTo('therapist')"><img src="img/therapist.png" alt="Therapist" title="Therapist" /></a> <a ng-click="slide.rightTo('therapist')"><img src="img/therapist.png" alt="{{'therapist' | translate}}" title="{{'therapist' | translate}}" /></a>
</div> </div>
<div> <div>
<p>Gestione pictogramas, dispositivos, grabe sesiones de terapia y obtenga estadísticas de evolución.</p> <p>Gestione pictogramas, dispositivos, grabe sesiones de terapia y obtenga estadísticas de evolución.</p>
...@@ -113,7 +113,7 @@ ...@@ -113,7 +113,7 @@
<div class="col-md-4"> <div class="col-md-4">
<legend translate>office_center</legend> <legend translate>office_center</legend>
<div class="text-center"> <div class="text-center">
<a ng-click="slide.rightTo('office')"><img src="img/office.jpg" alt="Office" title="Office" /></a> <a ng-click="slide.rightTo('office')"><img src="img/office.jpg" alt="{{'office_center' | translate}}" title="{{'office_center' | translate}}" /></a>
</div> </div>
<div> <div>
<p>Gestione alumnos y equipos de intervención, además de todas las funcionalidades propias de un terapeuta.</p> <p>Gestione alumnos y equipos de intervención, además de todas las funcionalidades propias de un terapeuta.</p>
...@@ -127,8 +127,9 @@ ...@@ -127,8 +127,9 @@
--> -->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="tutor"> <div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="tutor">
<legend translate>parents_tutor</legend> <legend translate>parents_tutor</legend>
<div class="col-md-4 col-md-offset-1 text-center"> <div class="row">
<img src="img/parents.png" alt="Tutor" title="Tutor" /> <div class="col-md-4 text-center">
<img src="img/parents.png" alt="{{'parents_tutor' | translate}}" title="{{'parents_tutor' | translate}}" />
</div> </div>
<div class="form-group col-md-4" id="tutor_form"> <div class="form-group col-md-4" id="tutor_form">
<input type="hidden" ng-model="formdata.role" value="tutor"></input> <input type="hidden" ng-model="formdata.role" value="tutor"></input>
...@@ -144,24 +145,37 @@ ...@@ -144,24 +145,37 @@
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}"/> <input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}"/>
</div> </div>
</fieldset> </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 class="row form-group"> <div class="row form-group">
<div class="col-xs-6"> <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-xs-6"> <div class="col-md-4">
<button class="btn btn-primary float-right" ng-click="slide.rightTo('accept')">{{ 'next' | translate }} &gt;&gt; </button> <button class="btn btn-primary float-right" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button>
</div>
</div> </div>
</div> </div>
</div> </div>
<!-- <!--
SLIDE 4: Therapist account form SLIDE 4: Therapist account form
--> -->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="therapist"> <div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="therapist">
<legend translate>therapist</legend> <legend translate>therapist</legend>
<div class="col-md-4 col-md-offset-1 text-center"> <div class="row">
<img src="img/therapist.png" alt="Tutor" title="Tutor" /> <div class="col-md-4 text-center">
<img src="img/therapist.png" alt="{{'therapist' | translate}}" title="{{'therapist' | translate}}" />
</div> </div>
<div class="form-group col-md-4" id="tutor_form"> <div class="form-group col-md-4" id="tutor_form">
<input type="hidden" ng-model="formdata.role" value="therapist"></input> <input type="hidden" ng-model="formdata.role" value="therapist"></input>
...@@ -177,15 +191,24 @@ ...@@ -177,15 +191,24 @@
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}"/> <input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}"/>
</div> </div>
</fieldset> </fieldset>
<div class="row form-group"> <div class="form-group">
<div class="col-xs-6"> <input type="checkbox" ng-model="formdata.disclaimer_accepted">
<button class="btn btn-default" ng-click="slide.back = true; slide.state = 'accounts'">&lt;&lt; {{ 'back' | translate }} </button> <span translate>disclaimer_accept</span>
</div> </div>
<div class="col-xs-6"> <div class="form-group">
<button class="btn btn-primary float-right" ng-click="slide.back = false; slide.state = 'accept'">{{ 'next' | translate }} &gt;&gt; </button> <label>Captcha</label>
<div vc-recaptcha></div>
</div> </div>
</div> </div>
</div> </div>
<div class="row form-group">
<div class="col-md-4">
<button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button>
</div>
<div class="col-md-4">
<button class="btn btn-primary float-right" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button>
</div>
</div>
</div> </div>
<!-- <!--
...@@ -193,8 +216,9 @@ ...@@ -193,8 +216,9 @@
--> -->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="office"> <div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="office">
<legend translate>office_center</legend> <legend translate>office_center</legend>
<div class="col-md-4 col-md-offset-1 text-center"> <div class="row">
<img src="img/office.jpg" alt="Office" title="Office" /> <div class="col-md-4 text-center">
<img src="img/office.jpg" alt="{{'office_center' | translate}}" title="{{'office_center' | translate}}" />
</div> </div>
<div class="form-group col-md-4" id="office_form"> <div class="form-group col-md-4" id="office_form">
<input type="hidden" ng-model="formdata.role" value="office"></input> <input type="hidden" ng-model="formdata.role" value="office"></input>
...@@ -214,52 +238,43 @@ ...@@ -214,52 +238,43 @@
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}"/> <input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}"/>
</div> </div>
</fieldset> </fieldset>
<div class="row form-group">
<div class="col-xs-6">
<button class="btn btn-default" ng-click="slide.back = true; slide.state = 'accounts'">&lt;&lt; {{ 'back' | translate }} </button>
</div>
<div class="col-xs-6">
<button class="btn btn-primary float-right" ng-click="slide.back = false; slide.state = 'accept'">{{ 'next' | translate }} &gt;&gt; </button>
</div>
</div>
</div>
</div>
<!--
SLIDE 6: Terms of services and captcha
-->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="accept">
<div class="form-group"> <div class="form-group">
<legend></legend>
<input type="checkbox" ng-model="formdata.disclaimer_accepted"> <input type="checkbox" ng-model="formdata.disclaimer_accepted">
<span translate>disclaimer_accept</span> <span translate>disclaimer_accept</span>
</div> </div>
<div class="form-group"> <div class="form-group">
<legend>Captcha</legend> <label>Captcha</label>
<div vc-recaptcha></div> <div vc-recaptcha></div>
</div> </div>
</div>
</div>
<div class="row form-group"> <div class="row form-group">
<div class="col-xs-6"> <div class="col-md-4">
<button class="btn btn-default" ng-click="slide.back = true; slide.state = '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-xs-6"> <div class="col-md-4">
<button class="btn btn-primary float-right" ng-click="slide.back = false; slide.state = 'accept'">{{ 'next' | translate }} &gt;&gt; </button> <button class="btn btn-primary float-right" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button>
</div> </div>
</div> </div>
</div> </div>
<!-- <!--
SLIDE 7: Confirmation message SLIDE 6: Confirmation message
--> -->
<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>
<p> {{ 'user_created_text' | translate }} </p>
<br>
<img src="img/child.jpg"/>
</div> </div>
<!-- <!--
SLIDE 8: Change password SLIDE 7: Change password
--> -->
<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="change_password">
</div> </div>
</div> </div>
......
sails/src/assets/scripts/modules/login/views/loginform.html deleted 100644 → 0
<!-- Form column and offset -->
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-4">
<!-- Formulario -->
<!-- LoginCtrl controls here, see app.js -->
<form name="loginForm" ng-submit="login()" novalidate>
<!-- Email -->
<div class="form-group">
<label translate>email</label>:
<input type="email" class="form-control" id="login_email" placeholder="{{ 'your_email' | translate}}" required ng-model="credentials.email" />
</div>
<!-- Password -->
<div class="form-group">
<label translate>password</label>:
<input type="password" class="form-control" id="login_password" placeholder="{{ 'your_password' | translate}}" required ng-model="credentials.password" />
</div>
<div class="row">
<div class="col-xs-6">
<!-- Login -->
<div class="pull-left">
<button type="submit" class="btn btn-primary" translate>login</button>
</div>
<!-- Spinner -->
<div class="pull-left">
<i ng-class="{'fa fa-spinner fa-spin fa-2x fa-fw margin-bottom': true, 'spin_disabled': !submitted}"></i>
</div>
</div>
<div class="col-xs-6 margin-top7">
<!-- Remember -->
<div class="checkbox">
<label>
<input type="checkbox" id="login_savepassword" ng-model="credentials.savepassword" />{{ 'remember' | translate }}
</label>
</div>
</div>
</div>
<br>
<!-- Remember password -->
<div class="row text-center">
<a href="/app/#/changepass" translate>password_forgotten</a>
</div>
<!-- Create account -->
<div class="row text-center">
<a ng-click="pane.state = 'accounts'; pane2.state = 'accounts'" translate>create_an_account</a>
</div>
</form>
</div>
<!--/. form column -->
<!-- Image column -->
<div class="col-md-4 text-center">
<img src="img/login.png" alt="Pictogram" title="Pictogram" />
</div>
<!--/. image column -->
<div class="col-md-2">
</div>
</div>
<!--/. login -->
sails/src/assets/scripts/modules/login/views/signup.html deleted 100644 → 0
<div class="switch-panel-body" ng-switch="pane2.state">
<!-- signup pane -->
<div class="switch-animation" ng-switch-when="accounts">
<h2>Elija el tipo de cuenta</h2>
<div class="row">
<div class="col-md-4">
<legend translate>parents_tutor</legend>
<div class="text-center">
<a ng-click="showTutorForm()"><img src="img/parents.png" alt="Parents" title="Parents" /></a>
</div>
<div>
<p>Gestione los pictogramas de su hijo o hija y configure su dispositivo de comunicación.</p>
</div>
</div>
<div class="col-md-4">
<legend translate>therapist</legend>
<div class="text-center">
<a ng-click="showTherapistForm()"><img src="img/therapist.png" alt="Therapist" title="Therapist" /></a>
</div>
<div>
<p>Gestione pictogramas, dispositivos, grabe sesiones de terapia y obtenga estadísticas de evolución.</p>
</div>
</div>
<div class="col-md-4">
<legend translate>office_center</legend>
<div class="text-center">
<a ng-click="pane2.state = 'signup_office'"><img src="img/office.jpg" alt="Office" title="Office" /></a>
</div>
<div>
<p>Gestione alumnos y equipos de intervención, además de todas las funcionalidades propias de un terapeuta.</p>
</div>
</div>
</div>
</div>
<div class="switch-animation row" ng-switch-when="signup_office">
<legend translate>office_center</legend>
<div class="col-md-4 text-center">
<img src="img/office.jpg" alt="Office" title="Office" />
</div>
<div class="form-group col-md-4" id="office_form">
<div class="form-group">
<input type="text" class="form-control" placeholder="{{ 'name' | translate }}" ng-model="formdata.office.name"/>
</div>
<div class="form-group">
<input type="email" class="form-control" placeholder="{{ 'email' | translate }}" ng-model="formdata.office.email"/>
</div>
<fieldset>
<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 }}"/>
</div>
<div class="form-group">
<input type="password" class="form-control" id="signin_password2" placeholder="{{ 'password_confirm' | translate }}"/>
</div>
</fieldset>
<div class="row form-group">
<div class="col-xs-6">
<button class="btn btn-default" ng-click="pane2.state = 'accounts'">&lt;&lt; Volver</button>
</div>
<div class="col-xs-6">
<button class="btn btn-primary float-right">Continuar &gt;&gt; </button>
</div>
</div>
</div>
</div>
<!-- login pane -->
<div class="switch-animation" ng-switch-when="signup2">
<div class="form-group">
<legend></legend>
<input type="checkbox" ng-model="formdata.disclaimer_accepted">
<span translate>disclaimer_accept</span>
</div>
<div class="form-group">
<legend>Captcha</legend>
<div vc-recaptcha></div>
</div>
</div>
</div>
<div class="row text-center">
<br><br>
<a ng-click="pane.state = 'login'"><< {{ 'back_to_login' | translate }}</a>
</div>
sails/src/assets/scripts/modules/supervisor/controllers/students.js
...@@ -13,6 +13,7 @@ dashboardControllers.controller('StudentsCtrl', function StudentsCtrl( ...@@ -13,6 +13,7 @@ dashboardControllers.controller('StudentsCtrl', function StudentsCtrl(
$window, $window,
$translate, $translate,
ngToast, ngToast,
$timeout,
IOService) { IOService) {
$scope.formdatastudent = { $scope.formdatastudent = {
username: '', username: '',
...@@ -27,6 +28,27 @@ dashboardControllers.controller('StudentsCtrl', function StudentsCtrl( ...@@ -27,6 +28,27 @@ dashboardControllers.controller('StudentsCtrl', function StudentsCtrl(
office: $scope.user.office || { name: '' } office: $scope.user.office || { name: '' }
}; };
$scope.slide = {
state: 'accounts',
prev: 'accounts',
back: false,
rightTo: function (state) {
$scope.slide.back = false;
$scope.slide.prev = $scope.slide.state;
$timeout(function () {
$scope.slide.state = state;
}, 0);
},
leftTo: function (state) {
$scope.slide.back = true;
$scope.slide.prev = $scope.slide.state;
$timeout(function () {
$scope.slide.state = state;
}, 0);
}
};
// Flags for showing buttons according to role // Flags for showing buttons according to role
$scope.user = JSON.parse($window.sessionStorage.user); $scope.user = JSON.parse($window.sessionStorage.user);
......
sails/src/assets/scripts/modules/supervisor/views/students.html
<!-- StudentsCtrl controls here, see app.js --> <!-- StudentsCtrl controls here, see app.js -->
<div class="panel panel-default"> <div class="panel panel-default">
<!-- Default panel contents --> <!-- Default panel contents -->
<div class="panel-heading"><h3 class="panel-title" translate>students</h3> <div class="panel-heading"><h3 class="color-green" translate>students</h3>
<!-- span ng-if="user.isAdmin">({{user.office.currentStudents}}/{{user.office.maxStudents}} - <span translate="licenses_left" translate-values="{number: num_licenses_left}"></span>)</span --> <!-- span ng-if="user.isAdmin">({{user.office.currentStudents}}/{{user.office.maxStudents}} - <span translate="licenses_left" translate-values="{number: num_licenses_left}"></span>)</span -->
<div class="panel-body"> <div class="panel-body">
......
sails/src/assets/scripts/modules/supervisor/views/students_add.html
<h3 class="color_green" translate>add_student</h3>
<form name="AddStudentForm" role="form" ng-submit="add_student()" ng-controller="StudentAddCtrl"> <form name="AddStudentForm" role="form" ng-submit="add_student()" ng-controller="StudentAddCtrl">
<div class="switch-panel-body" ng-switch="slide.state">
<!--
SLIDE 1: Account type selection
-->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="accounts">
<div class="row">
<div class="col-md-4">
<legend translate>Asociar cuenta existente</legend>
<div class="text-center">
<a ng-click="slide.rightTo('existing')"><img src="img/child-existing.jpg" alt="{{'parents_tutor' | translate}}" title="{{'parents_tutor' | translate}}" /></a>
</div>
<div>
<p>Asocie a su perfil la cuenta de un/a alumno/a ya registrado/a para poder gestionarla.</p>
</div>
</div>
<div class="col-md-4">
<legend translate>Nueva cuenta oficial</legend>
<div class="text-center">
<a ng-click="slide.rightTo('new')"><img src="img/child-new.jpg" alt="{{'therapist' | translate}}" title="{{'therapist' | translate}}" /></a>
</div>
<div>
<p>Alta de una nueva cuenta de alumno/a con licencia oficial.</p>
</div>
</div>
<div class="col-md-4">
<legend translate>Crear cuenta de prueba</legend>
<div class="text-center">
<a ng-click="slide.rightTo('test')"><img src="img/child-test.jpg" alt="{{'office_center' | translate}}" title="{{'office_center' | translate}}" /></a>
</div>
<div>
<p>Cree una cuenta temporal para probar gratuitamente Pictogram. Puede activar una licencia en esta cuenta para mantenerla más allá de los tres meses de prueba.</p>
</div>
</div>
</div>
</div>
<!--
SLIDE 2: Associate existing account
-->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="existing">
<legend translate>Asociar cuenta de alumno/a</legend>
<div class="row"> <div class="row">
<div class="col-sm-6"> <div class="col-md-4 col-md-offset-2 text-center">
<fieldset> <img src="img/child-existing.jpg" alt="{{'parents_tutor' | translate}}" title="{{'parents_tutor' | translate}}" />
</div>
<div class="form-group col-md-4">
<input class="form-control" type="text" id="student_license" mask="wwww-wwww-wwww-wwww" clean="true" placeholder="{{ 'license_number' | translate }}" ng-model="formdatastudent.license_number" required>
</div>
</div>
<div class="row form-group">
<div class="col-md-4 col-md-offset-2 ">
<button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button>
</div>
<div class="col-md-4">
<button class="btn btn-primary float-right" ng-click="slide.rightTo('confirmation')">{{ 'Asociar' | translate }} &gt;&gt; </button>
</div>
</div>
</div>
<legend translate>account</legend> <!--
SLIDE 3: New official account
-->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="new">
<legend translate>Crear nueva cuenta oficial</legend>
<div class="row">
<div class="col-md-4 col-md-offset-2 text-center">
<img src="img/child-new.jpg" alt="{{'therapist' | translate}}" title="{{'therapist' | translate}}" />
</div>
<div class="form-group col-md-4">
<div class="form-group"> <div class="form-group">
<input type="username" class="form-control" id="setup_username" placeholder="{{ 'username' | translate }}" required ng-model="formdatastudent.username" /> <input type="username" class="form-control" id="setup_username" placeholder="{{ 'username' | translate }}" required ng-model="formdatastudent.username" />
</div> </div>
<div class="form-group"> <div class="form-group">
<input type="password" class="form-control" id="setup_password1" placeholder="{{ 'password_new_type' | translate }}" ng-model="formdatastudent.password" required /> <input type="password" class="form-control" id="setup_password1" placeholder="{{ 'password_new_type' | translate }}" ng-model="formdatastudent.password" required />
</div> </div>
<div class="form-group"> <div class="form-group">
<input type="password" class="form-control" id="setup_password2" placeholder="{{ 'password_confirm' | translate }}" ng-model="formdatastudent.password_confirm" required /> <input type="password" class="form-control" id="setup_password2" placeholder="{{ 'password_confirm' | translate }}" ng-model="formdatastudent.password_confirm" required />
</div> </div>
<div class="form-group">
{{ 'language' | translate }}: <select class="form-control" name="student_language" id="student_language" ng-model="formdatastudent.lang">
<option value="es-es" selected>Español</option>
<option value="en-us">English</option>
</select>
</div>
<div class="form-group"> <div class="form-group">
<input class="form-control" type="text" id="student_license" mask="wwww-wwww-wwww-wwww" clean="true" placeholder="{{ 'license_number' | translate }}" ng-model="formdatastudent.license_number" required> <input class="form-control" type="text" id="student_license" mask="wwww-wwww-wwww-wwww" clean="true" placeholder="{{ 'license_number' | translate }}" ng-model="formdatastudent.license_number" required>
</div> </div>
</div> </div>
<div class="col-sm-6">
<legend translate>personal_data</legend>
<div class="form-group">
<input type="text" class="form-control" id="student_name" placeholder="{{ 'name' | translate }}" required ng-model="formdatastudent.name" />
</div> </div>
<div class="row form-group">
<div class="form-group"> <div class="col-md-4 col-md-offset-2 ">
<input type="text" class="form-control" id="student_surname" placeholder="{{ 'surname' | translate }}" required ng-model="formdatastudent.surname" /> <button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button>
</div>
<div class="col-md-4">
<button class="btn btn-primary float-right" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button>
</div>
</div>
</div> </div>
<!--
SLIDE 5: Office account form
-->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="test">
<legend translate>Crear cuenta de prueba</legend>
<div class="row"> <div class="row">
<div class="col-md-4 col-md-offset-2 text-center">
<div class="col-sm-6"> <img src="img/child-test.jpg" alt="{{'office_center' | translate}}" title="{{'office_center' | translate}}" />
</div>
<div class="form-group col-md-4" id="office_form">
<div class="form-group"> <div class="form-group">
<p class="input-group"> <input type="username" class="form-control" id="setup_username" placeholder="{{ 'username' | translate }}" required ng-model="formdatastudent.username" />
<input type="text" class="form-control" datepicker-popup="{{ 'day_format' | translate }}" ng-model="formdatastudent.birthdate" placeholder="{{ 'birthdate' | translate }}" is-open="opened_cal_student" close-text="{{'close' | translate}}" required />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open_calendar($event)"><i class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div> </div>
<div class="form-group">
<input type="password" class="form-control" id="setup_password1" placeholder="{{ 'password_new_type' | translate }}" ng-model="formdatastudent.password" required />
</div> </div>
<div class="col-sm-6">
<div class="form-group"> <div class="form-group">
<select class="form-control" name="student_gender" id="student_gender" ng-model="formdatastudent.gender" required> <input type="password" class="form-control" id="setup_password2" placeholder="{{ 'password_confirm' | translate }}" ng-model="formdatastudent.password_confirm" required />
<option value="F" selected translate>woman</option>
<option value="M" translate>man</option>
</select>
</div> </div>
</div> </div>
</div> </div>
<div class="row form-group">
<div class="form-group"> <div class="col-md-4 col-md-offset-2 ">
<span translate>country</span>: <button class="btn btn-default" ng-click="slide.leftTo('accounts')">&lt;&lt; {{ 'back' | translate }} </button>
<select class="form-control" name="student_country" id="student_country" ng-model="formdatastudent.country" required> </div>
<option value="ES" selected>España</option> <div class="col-md-4">
<option value="US">United States</option> <button class="btn btn-primary float-right" ng-click="slide.rightTo('confirmation')">{{ 'create_account' | translate }} &gt;&gt; </button>
<option value="UK">United Kingdom</option>
<option value="IE">Ireland</option>
</select>
</div> </div>
</div> </div>
</div> </div>
<!-- Fin de row -->
<div class="form-group text-center">
<button type="button" class="btn btn-default" ng-click="resetForm()">{{'cancel'|translate}}</button> <!--
<button type="submit" class="btn btn-primary" translate>add</button> SLIDE 6: Confirmation message
-->
<div ng-class="slide.back ? 'switch-animation-back' : 'switch-animation'" ng-switch-when="confirmation">
<h2>{{ 'user_created' | translate }} </h2>
<p> La nueva cuenta ya está disponible en su lista de alumnos.</p>
<br>
<img src="img/child.jpg"/>
</div> </div>
</div>
<div class="text-center">
<button type="button" class="btn btn-default" ng-click="resetForm(); hidestudentadd = true">{{'cancel'|translate}}</button>
</div>
</form> </form>
<hr /> <hr />
sails/src/assets/styles/main.css
...@@ -1106,18 +1106,25 @@ input.editable.scene-name { ...@@ -1106,18 +1106,25 @@ input.editable.scene-name {
/* Estilos para ngSwitch */ /* Estilos para ngSwitch */
.switch-panel-body { .switch-panel-body {
position:relative; position:relative;
width: 900px; width: 930px;
height: 500px;
margin: auto; margin: auto;
overflow:hidden;
}
.switch-animation,
.switch-animation-back {
width: 900px;
} }
.switch-animation.ng-enter, .switch-animation.ng-enter,
.switch-animation.ng-leave, .switch-animation.ng-leave,
.switch-animation-back.ng-enter, .switch-animation-back.ng-enter,
.switch-animation-back.ng-leave { .switch-animation-back.ng-leave {
-webkit-transition:0.2s linear all; -webkit-transition:0.5s linear all;
-moz-transition:0.2s linear all; -moz-transition:0.5s linear all;
-o-transition:0.2s linear all; -o-transition:0.5s linear all;
transition:0.2s linear all; transition: 0.5s linear all;
position:absolute; position:absolute;
} }
......
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