--- a/client/app/auth/auth.css Thu Jun 11 15:36:07 2015 +0200
+++ b/client/app/auth/auth.css Thu Jun 11 15:36:42 2015 +0200
@@ -6,4 +6,16 @@
.auth input{
width: 300px;
margin: 10px 0;
+}
+
+.ng-invalid {
+ border-color: red;
+ outline-color: red;
+}
+
+.messages {
+ font-size: smaller;
+ padding-top: 5px;
+ padding-bottom: 10px;
+ color: red;
}
\ No newline at end of file
--- a/client/app/auth/auth_controller.js Thu Jun 11 15:36:07 2015 +0200
+++ b/client/app/auth/auth_controller.js Thu Jun 11 15:36:42 2015 +0200
@@ -1,7 +1,7 @@
(function(){
'use strict';
- angular.module('ammicoAuth',['ngRoute'])
+ angular.module('ammicoAuth',['ngRoute', 'ngMessages'])
.controller('authCtrl', function($location, $rootScope, $routeParams, $modal){
$modal.open({
templateUrl: 'auth/' + $routeParams.action + '_modal.html',
@@ -37,16 +37,49 @@
};
})
.controller('authregisterCtrl', function($scope, $modalInstance, authApi){
- $scope.register = function () {
- authApi.user.save({
- email: $scope.email,
- password: $scope.password,
- }, function(){
- $modalInstance.close('/auth/login');
- });
+ $scope.message = "";
+
+ $scope.user = {
+ email: "",
+ password: "",
+ confirmPassword: ""
+ };
+
+ $scope.submit = function(isValid) {
+ console.log(isValid);
+ console.log($scope);
+ console.log($scope.email);
+ if (isValid) {
+ authApi.user.save({
+ email: $scope.user.email,
+ password: $scope.user.password,
+ }, function(){
+ $modalInstance.close('/auth/login');
+ });
+ } else {
+ $scope.message = "Il reste toujours des champs invalides";
+ }
};
$scope.back = function () {
$modalInstance.close('/auth/login');
};
+ })
+ .directive("compareTo", function(){
+ return {
+ require: "ngModel",
+ scope: {
+ otherModelValue: "=compareTo"
+ },
+ link: function($scope, element, attributes, ngModel) {
+
+ ngModel.$validators.compareTo = function(modelValue) {
+ return modelValue == $scope.otherModelValue;
+ };
+
+ $scope.$watch("otherModelValue", function() {
+ ngModel.$validate();
+ });
+ }
+ }
});
})();
--- a/client/app/auth/login_modal.html Thu Jun 11 15:36:07 2015 +0200
+++ b/client/app/auth/login_modal.html Thu Jun 11 15:36:42 2015 +0200
@@ -4,8 +4,14 @@
<form ng-submit="login()">
<div class="modal-body ng-scope">
- <input type="text" class="form-control" ng-model='email' placeholder="Email">
- <input type="password" class="form-control" ng-model='password' placeholder="Password">
+ <div class="form-group">
+ <label>Votre Email</label>
+ <input type="text" class="form-control" ng-model='email' placeholder="Email" autofocus>
+ </div>
+ <div class="form-group">
+ <label>Mot de Passe</label>
+ <input type="password" class="form-control" ng-model='password' placeholder="Password">
+ </div>
</div>
<div class="modal-footer ng-scope">
--- a/client/app/auth/register_modal.html Thu Jun 11 15:36:07 2015 +0200
+++ b/client/app/auth/register_modal.html Thu Jun 11 15:36:42 2015 +0200
@@ -2,16 +2,37 @@
<h3 class="modal-title">Créer un Compte</h3>
</div>
-<form ng-submit="register()">
- <div class="modal-body ng-scope">
- <input type="text" class="form-control" ng-model='username' placeholder="Nom d'utilisateur"></input>
- <input type="text" class="form-control" ng-model='email' placeholder="Email"></input>
- <input type="password" class="form-control" ng-model='password' placeholder="Mot de passe"></input>
- <input type="password" class="form-control" ng-model='password2' placeholder="Confirmer le mot de pass"></input>
+<form name="registrationForm" novalidate ng-submit="submit(registrationForm)">
+ <div class="modal-body ng-scope">
+ <h3>{{ message }}</h3>
+ <div class="form-group">
+ <label>Email</label>
+ <input type="text" name="email" class="form-control" ng-model="user.email" required autofocus/>
+ <div ng-messages="registrationForm.email.$error">
+ <ng-messages-include src="components/messages.html"></ng-messages-include>
+ </div>
+ </div>
+ <div class="form-group">
+ <label>Mot de passe</label>
+ <input type="password" name="password" class="form-control" ng-model="user.password" required />
+ <div ng-messages="registrationForm.password.$error">
+ <ng-messages-include src="components/messages.html"></ng-messages-include>
+ </div>
+ </div>
+ <div class="form-group">
+ <label>Confirmer le mot de passe</label>
+ <input type="password" name="confirmPassword" class="form-control"
+ ng-model="user.confirmPassword"
+ required compare-to="user.password" />
+ <div ng-messages="registrationForm.confirmPassword.$error">
+ <ng-messages-include src="components/messages.html"></ng-messages-include>
+ </div>
+ </div>
</div>
-
<div class="modal-footer ng-scope">
- <button type="button" ng-click="back()" class="btn btn-warning">Retour</button>
- <button type="submit" class="btn btn-primary">Créer</button>
+ <div class="form-group">
+ <button type="button" ng-click="back()" class="btn btn-warning">Retour</button>
+ <button type="submit" class="btn btn-primary">Créer</button>
+ </div>
</div>
</form>
\ No newline at end of file
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/client/app/components/messages.html Thu Jun 11 15:36:42 2015 +0200
@@ -0,0 +1,7 @@
+<div class="messages">
+ <div ng-message="required">Obligatoire</div>
+ <div ng-message="minlength">Trop court</div>
+ <div ng-message="maxlength">Trop long</div>
+ <div ng-message="email">Adresse email incorrecte</div>
+ <div ng-message="compareTo">Vous devez rentrer le même mot de passe</div>
+</div>
\ No newline at end of file