Intégration des modals dans la directive tableau

Simplification des appels à l'API
Ajout d'un filtre pour gérer les différences entre les attributs des entrées reçues et à envoyer
Corrections mineures dans la directive tableau
Interception des requêtes et réponses HTTP pour gérer l'authentification automatique et la redirection au besoin + ajout du token dans les requêtes d'édition de la BDD
Modification des modals pour un design responsive + intégration avec la directive tableau
	Ajout de controlleurs dans ce but

TODO

 === TABLEAU ===
 
+Ajouter un titre
 Rajouter export CSV
-Mode éditions/ajout
-Remettre la fonctionnalité des filtres
 Lors de la suppression des ligne ajouter une animation ?
-Export des données pour réutilisation future ?
+Gérer le bouton de supression multiple (avec possibilité de mettre du texte à la place d'un bouton)
+Gérer les alertes correctement (via un service)
+Lors de l'édition d'une date, celle-ci est affiché de manière étrange dans le tableau (pas urgent)
+
+=== MODALS ===
+
+Pré-sélectionner une date de calendrier (par défaut aujourd'hui) dans l'ajout d'un joueur
+Rajouter les vérifications des formulaires
+Pour l'édition des équipes, rétablir une copie de l'entrée si le modal est "dismissed" (voir joueur pour modèle)
+Pour l'édition des joueurs, passer le filtrage de la date dans un $watch pour éviter une entrée bizarre dans le tableau (voir TODO tableau)
+
+=== JOUEURS ÉQUIPE ===
+
+Faire les modifications pour les modals (comme pour joueurs.js)
+
+=== JOUEURS & JOUEURS ÉQUIPES & ÉQUIPES ===
+
+Gérer les modifications du tableau après appel à l'API
+
+=== INTERCEPTEUR HTTP ===
+
+Voir avec Matthias comment gérer le token avec la méthode DELETE
+
+=== AUTHENTIFICATION ===
+
+En cas de redirection vers l'authentification, revenir à l'URL précédent après la connexion
 
 === GENERAL ===
 
-Authentification automatique
+Rajouter AceCream dans l'entête de page
 Fonctionnalité de vérification du tournois avant lancement
 Faire la documentation
 Rediriger sur l'authentification si la personne ne s'est pas authentifiée
-Faire des tests sur apicall
-Réorganiser le code par module
-Entrepôt de données
+Faire des tests

app/A RAJOUTER.html

-
-<!-- Page Joueur & Joueur / Equipe-->
-<div style="display:inline-block;" ng-app="panelAdminApp" ng-controller="EditerJoueurCtrl">
-	<button ng-click="chargerEquipesListe();open()" class="btn btn-xs btn-primary">
-		<span class="glyphicon glyphicon-edit" aria-hidden="true"></span> Éditer
-	</button>
-</div>
-<div style="display:inline-block;" ng-app="panelAdminApp" ng-controller="SupprimerJoueurCtrl">
-	<button class="btn btn-xs btn-danger" ng-click="open()">
-		<span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Supprimer
-	</button>
-</div>
-<div ng-app="panelAdminApp" ng-controller="AjoutJoueurCtrl">
-	<button type="button" ng-click="chargerEquipesListe();chargerTeam();open()" class="btn btn-success btn-block btn-default">
-		<span class="glyphicon glyphicon-plus"></span> Ajouter un joueur
-	</button>
-</div>
-
-
-<!-- Page Equipe -->
-<div style="display:inline-block;" ng-app="panelAdminApp" ng-controller="EditerEquipeCtrl">
-	<button ng-click="chargerEquipesListe();open()" class="btn btn-xs btn-primary">
-		<span class="glyphicon glyphicon-edit" aria-hidden="true"></span> Éditer
-	</button>
-</div>
-<div style="display:inline-block;" >
-	<button class="btn btn-xs btn-warning" ng-click="listeJoueurs(equipe.NameTeam)">
-		<span class="glyphicons glyphicon-th-list" aria-hidden="true"></span> Joueurs
-	</button>
-</div>
-<div style="display:inline-block;" ng-app="panelAdminApp" ng-controller="SupprimerEquipeCtrl">
-	<button class="btn btn-xs btn-danger" ng-click="open()">
-		<span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Supprimer
-	</button>
-</div>
-<div ng-app="panelAdminApp" ng-controller="AjoutEquipeCtrl">
-	<button type="button" ng-click="open()" class="btn btn-success btn-block btn-default">
-		<span class="glyphicon glyphicon-plus"></span> Ajouter une équipe
-	</button>
-</div>
\ No newline at end of file

app/app/scripts/directives/tableau.js

-'use strict';
-
-/**
- * @ngdoc directive
- * @name appApp.directive:tableau
- * @description
- * # tableau
- */
-angular.module('appApp')
-  .directive('tableau', function () {
-    return {
-      template: '<div></div>',
-      restrict: 'E',
-      link: function postLink(scope, element, attrs) {
-        element.text('this is the tableau directive');
-      }
-    };
-  });

app/index.html

@@ -76,12 +76,10 @@
         <script src="scripts/controllers/joueursEquipe.js"></script>
         <script src="scripts/controllers/equipes.js"></script>
         <script src="scripts/controllers/joueurs.js"></script>
-        <script src="scripts/controllers/ajoutJoueur.js"></script>
-        <script src="scripts/controllers/editerJoueur.js"></script>
-        <script src="scripts/controllers/supprimerJoueur.js"></script>
-        <script src="scripts/controllers/ajoutEquipe.js"></script>
-        <script src="scripts/controllers/editerEquipe.js"></script>
-        <script src="scripts/controllers/supprimerEquipe.js"></script>
+        <script src="scripts/controllers/modal/ajoutJoueur.js"></script>
+        <script src="scripts/controllers/modal/ajoutEquipe.js"></script>
+        <script src="scripts/controllers/modal/ajoutJoueurEquipe.js"></script>
+        <script src="scripts/controllers/modal/editerEquipe.js"></script>
         <script src="scripts/services/apicall.js"></script>
         <script src="scripts/directives/chargement.js"></script>
         <script src="scripts/filters/slice.js"></script>
@@ -90,6 +88,10 @@
         <script src="scripts/directives/chargementligne.js"></script>
         <script src="scripts/services/intercepteurhttpreponses.js"></script>
         <script src="scripts/directives/tableau.js"></script>
+        <script src="scripts/controllers/modal/modalinstance.js"></script>
+        <script src="scripts/controllers/modal/editjoueur.js"></script>
+        <script src="scripts/services/valeurs.js"></script>
+        <script src="scripts/filters/assocfilter.js"></script>
         <!-- endbuild -->
         
         <!-- Ajouts persos -->

app/scripts/app.js

@@ -6,83 +6,43 @@
  * @description
  * Module principal de l'application. Se charge de gérer les vues et controleurs a utiliser en fonction de la route
  */
- angular.module('panelAdminApp', [], function($httpProvider) {
-  // Use x-www-form-urlencoded Content-Type
-  $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
-
-  $httpProvider.interceptors.push('intercepteurHttpReponses');
-  /**
-   * The workhorse; converts an object to x-www-form-urlencoded serialization.
-   * @param {Object} obj
-   * @return {String}
-   */ 
-  var param = function(obj) {
-    var query = '', name, value, fullSubName, subName, subValue, innerObj, i;
-
-    for(name in obj) {
-      value = obj[name];
-
-      if(value instanceof Array) {
-        for(i=0; i<value.length; ++i) {
-          subValue = value[i];
-          fullSubName = name + '[' + i + ']';
-          innerObj = {};
-          innerObj[fullSubName] = subValue;
-          query += param(innerObj) + '&';
-        }
-      }
-      else if(value instanceof Object) {
-        for(subName in value) {
-          subValue = value[subName];
-          fullSubName = name + '[' + subName + ']';
-          innerObj = {};
-          innerObj[fullSubName] = subValue;
-          query += param(innerObj) + '&';
-        }
-      }
-      else if(value !== undefined && value !== null)
-        query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
-    }
-
-    return query.length ? query.substr(0, query.length - 1) : query;
-  };
-
-  // Override $http service's default transformRequest
-  $httpProvider.defaults.transformRequest = [function(data) {
-    return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
-  }];
-});
 angular
-  .module('panelAdminApp', ['ngRoute', 'ui.bootstrap'])
-  .config(['$routeProvider', '$httpProvider', function ($routeProvider, $httpProvider) {
-    $routeProvider
-      .when('/', {
-        templateUrl: 'views/main.html',
-        controller: 'MainCtrl'
-      })
-      .when('/authentification', {
-        templateUrl: 'views/authentification.html',
-        controller: 'AuthentificationCtrl'
-      })
-      .when('/equipes', {
-        templateUrl: 'views/equipes.html',
-        controller: 'EquipesCtrl'
-      })
-      .when('/joueurs', {
-        templateUrl: 'views/joueurs.html',
-        controller: 'JoueursCtrl'
-      })
-      .when('/ajouterJoueur', {
-        templateUrl: 'views/ajouterJoueur.html',
-        controller: 'AjouterJoueurCtrl'
-      })
-      .when('/teams/:idEquipe/players', {
-        templateUrl: 'views/joueursEquipe.html',
-        controller: 'JoueursEquipeCtrl'
-      })
-      // Redirection vers l'authentification en cas de page non-gérée
-      .otherwise({
-        templateUrl: 'views/authentification.html',
-        controller: 'AuthentificationCtrl'
-      }); 
+	.module('panelAdminApp', ['ngRoute', 'ui.bootstrap'])
+	.config(['$routeProvider', '$httpProvider', 'apicallProvider', 'urlAPI', function ($routeProvider, $httpProvider, apicallProvider, urlAPI) {
+	
+    	apicallProvider.setUrl(urlAPI);  
+    	
+    	// Vérification du code de retour de l'API
+  		$httpProvider.interceptors.push('intercepteurHttpReponses');
+
+		$routeProvider
+			.when('/', {
+				templateUrl: 'views/main.html',
+				controller: 'MainCtrl'
+			})
+			.when('/authentification', {
+				templateUrl: 'views/authentification.html',
+				controller: 'AuthentificationCtrl'
+			})
+			.when('/equipes', {
+				templateUrl: 'views/equipes.html',
+				controller: 'EquipesCtrl'
+			})
+			.when('/joueurs', {
+				templateUrl: 'views/joueurs.html',
+				controller: 'JoueursCtrl'
+			})
+			.when('/ajouterJoueur', {
+				templateUrl: 'views/ajouterJoueur.html',
+				controller: 'AjouterJoueurCtrl'
+			})
+			.when('/teams/:idEquipe/players', {
+				templateUrl: 'views/joueursEquipe.html',
+				controller: 'JoueursEquipeCtrl'
+			})
+			// Redirection vers l'authentification en cas de page non-gérée
+			.otherwise({
+				templateUrl: 'views/authentification.html',
+				controller: 'AuthentificationCtrl'
+			}); 
   }]);

app/scripts/controllers/ajoutEquipe.js

-'use strict';
-
-
-var app = angular.module('panelAdminApp');
-
-//Configuration du service d'appel à l'API
-app.config(function(apicallProvider, urlAPI){
-    apicallProvider.setUrl(urlAPI);  
-});
-
-app.controller('AjoutEquipeCtrl', ['$scope','$modal','$log', 'apicall', function ($scope, $modal, $log, apicall) {
-
-  $scope.items = {name:'', points:'', drapeau:''};
-
-  $scope.open = function (size) {
-    var modalInstance = $modal.open({
-      templateUrl: 'views/ajoutEquipe.html',
-      controller: 'ModalInstanceCtrl',
-      size: size,
-      resolve: {
-        items: function () {
-          return $scope.items;
-        }
-      }
-    });
-    modalInstance.result.then(function () {
-
-      $log.info('Object envoyé au serveur :', $scope.items);
-
-      // ajout du joueur
-      apicall.addEquipe($scope.items)
-        .success(function(data){
-          $log.info(data);
-          // if(data.code == -1){$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : Mauvais paramètres'});}
-          // else if(data.code == 0){$scope.alertes.push({type : 'success', msg: 'Création du joueur réussie'});}
-          // else if(data.code == -2){$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : Database error'});}
-          // else{$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : API error'});}
-          $scope.chargerEquipes();
-        })
-        .error(function(){$scope.alertes.push({type : 'danger', msg: 'Impossible de créer une équipe'});
-      });
-    }, function () {
-      $log.info('Modal dismissed at: ' + new Date());
-    });
-  };
-
-}]);
-
-// Please note that $modalInstance represents a modal window (instance) dependency.
-// It is not the same as the $modal service used above.
-
-angular.module('ui.bootstrap').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {
-  
-  $scope.items=items;
-
-  $scope.ok = function () {
-    $modalInstance.close();
-  };
-
-  $scope.cancel = function () {
-    $modalInstance.dismiss('cancel');
-  };
-});
\ No newline at end of file

app/scripts/controllers/ajoutJoueur.js

-'use strict';
-
-
-var app = angular.module('panelAdminApp');
-
-//Configuration du service d'appel à l'API
-app.config(function(apicallProvider, urlAPI){
-    apicallProvider.setUrl(urlAPI);  
-});
-
-app.controller('AjoutJoueurCtrl', ['$scope','$modal','$log', 'apicall', function ($scope, $modal, $log, apicall) {
-
-  $scope.items = {name:'', firstname:'', sex:'', birthdate:'', team:'', list:[]};
-
-  $scope.chargerTeam = function() {
-    $scope.items = {name:'', firstname:'', sex:'', birthdate:'', team:$scope.joueursEquipe[0].Team, list:[]};
-  }
-   //Récupération de la liste des equipes
-  $scope.chargerEquipesListe = function() {
-    apicall.getEquipes().success(function(data){    
-      $scope.items.list = data.teams;
-      $log.info($scope.items.list);
-    }).error(function(){
-      $scope.alertes.push({type : 'danger', msg: 'Impossible de récupérer la liste des equipes (cliquer pour essayer de recharger)'});
-    });
-  };
-
-  $scope.open = function (size) {
-    var modalInstance = $modal.open({
-      templateUrl: 'views/ajoutJoueur.html',
-      controller: 'ModalInstanceCtrl',
-      size: size,
-      resolve: {
-        items: function () {
-          return $scope.items;
-        }
-      }
-    });
-    modalInstance.result.then(function () {
-
-      var perso = {};
-      jQuery.extend(perso,$scope.items);
-      delete perso.list;
-
-      $log.info('Object envoyé au serveur :', perso);
-
-      // ajout du joueur
-      apicall.addJoueurs(perso)
-        .success(function(data){
-          $log.info(data);
-          // if(data.code == -1){$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : Mauvais paramètres'});}
-          // else if(data.code == 0){$scope.alertes.push({type : 'success', msg: 'Création du joueur réussie'});}
-          // else if(data.code == -2){$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : Database error'});}
-          // else{$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : API error'});}
-          $scope.chargerJoueurs();
-        })
-        .error(function(){$scope.alertes.push({type : 'danger', msg: 'Impossible de créer un joueur (cliquer pour essayer de recharger)'});
-      });
-    }, function () {
-      $log.info('Modal dismissed at: ' + new Date());
-    });
-  };
-
-}]);
-
-// Please note that $modalInstance represents a modal window (instance) dependency.
-// It is not the same as the $modal service used above.
-
-angular.module('ui.bootstrap').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {
-  
-  $scope.items=items;
-
-  $scope.ok = function () {
-    $modalInstance.close();
-  };
-
-  $scope.cancel = function () {
-    $modalInstance.dismiss('cancel');
-  };
-});
\ No newline at end of file

app/scripts/controllers/app/scripts/directives/tableau.js

-'use strict';
-
-/**
- * @ngdoc directive
- * @name controllersApp.directive:tableau
- * @description
- * # tableau
- */
-angular.module('controllersApp')
-  .directive('tableau', function () {
-    return {
-      template: '<div></div>',
-      restrict: 'E',
-      link: function postLink(scope, element, attrs) {
-        element.text('this is the tableau directive');
-      }
-    };
-  });

app/scripts/controllers/authentification.js

@@ -8,20 +8,28 @@
  * Controller of the panelAdminApp
  */
 angular.module('panelAdminApp')
-	.controller('AuthentificationCtrl', function ($scope) {
+	.controller('AuthentificationCtrl', ['$scope', '$log', 'apicall', 'infosConnexion', function ($scope, $log, apicall, infosConnexion) {
   
+  		/* Gestion des alertes */
   		$scope.alertes = [];
   		
 		$scope.lancerConnexion = function(){
 		
-			$scope.alertes.push({type : 'info', msg: 'Connexion en cours'});
-			$scope.alertes.push({type : 'success', msg: 'Authentification réussie'});
-			$scope.alertes.push({type : 'danger', msg: 'Authentification échouée'});
+			apicall.authentification(infosConnexion).success(function(donnees){
+			
+				$log.info('Connexion réussie');
+				infosConnexion.token = donnees.token;
+				
+			}).error(function(){
+			
+				$log.info('Connexion échouée');
+			})
 		};
-		
+
 		$scope.fermerAlerte = function(index){
 		
 			$scope.alertes.splice(index, 1);
 		};
-    
-});
+
+		$scope.infosConnexion = infosConnexion;
+}]);

app/scripts/controllers/editerEquipe.js

-'use strict';
-
-
-var app = angular.module('panelAdminApp');
-
-//Configuration du service d'appel à l'API
-app.config(function(apicallProvider, urlAPI){
-    apicallProvider.setUrl(urlAPI);  
-});
-
-app.controller('EditerEquipeCtrl', ['$scope','$modal','$log', 'apicall', function ($scope, $modal, $log, apicall) {
-
-  $scope.items = {name:$scope.equipe.NameTeam, points:$scope.equipe.Points, drapeau:$scope.equipe.URL};
-
-  $scope.open = function (size) {
-    var modalInstance = $modal.open({
-      templateUrl: 'views/editerEquipe.html',
-      controller: 'ModalInstanceCtrl',
-      size: size,
-      resolve: {
-        items: function () {
-          return $scope.items;
-        }
-      }
-    });
-    modalInstance.result.then(function () {
-
-      $log.info('Object envoyé au serveur :', $scope.items);
-
-      // ajout du joueur
-      apicall.setEquipe($scope.items)
-        .success(function(data){
-          $log.info(data);
-          // if(data.code == -1){$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : Mauvais paramètres'});}
-          // else if(data.code == 0){$scope.alertes.push({type : 'success', msg: 'Création du joueur réussie'});}
-          // else if(data.code == -2){$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : Database error'});}
-          // else{$scope.alertes.push({type : 'danger', msg: 'Création du joueur impossible : API error'});}
-          $scope.chargerEquipes();
-        })
-        .error(function(){$scope.alertes.push({type : 'danger', msg: 'Impossible de créer un joueur (cliquer pour essayer de recharger)'});
-      });
-    }, function () {
-      $log.info('Modal dismissed at: ' + new Date());
-    });
-  };
-
-}]);
-
-// Please note that $modalInstance represents a modal window (instance) dependency.
-// It is not the same as the $modal service used above.
-
-angular.module('ui.bootstrap').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {
-  
-  $scope.items=items;
-
-  $scope.ok = function () {
-    $modalInstance.close();
-  };
-
-  $scope.cancel = function () {
-    $modalInstance.dismiss('cancel');
-  };
-});
\ No newline at end of file

app/scripts/controllers/editerJoueur.js

-'use strict';
-
-
-var app = angular.module('panelAdminApp');
-
-//Configuration du service d'appel à l'API
-app.config(function(apicallProvider, urlAPI){
-  
-    apicallProvider.setUrl(urlAPI);  
-});
-
-app.controller('EditerJoueurCtrl', ['$scope','$modal','$log', 'apicall', function ($scope, $modal, $log, apicall) {
-
-  $scope.items = {name:$scope.joueur.Name, firstname:$scope.joueur.FirstName, sex:$scope.joueur.Sex, birthdate:$scope.joueur.DateBirth, team:$scope.joueur.Team, list:[]};
-
-  //Récupération de la liste des equipes
-  $scope.chargerEquipesListe = function() {
-    apicall.getEquipes().success(function(data){    
-      $scope.items.list = data.teams;
-      $log.info($scope.teams);
-    }).error(function(){
-      $scope.alertes.push({type : 'danger', msg: 'Impossible de récupérer la liste des equipes (cliquer pour essayer de recharger)'});
-    });
-  };
-
-  $scope.open = function (size) {
-    var modalInstance = $modal.open({
-      templateUrl: 'views/editerJoueur.html',
-      controller: 'ModalInstanceCtrl',
-      size: size,
-      resolve: {
-        items: function () {
-          return $scope.items;
-        }
-      }
-    });
-
-    modalInstance.result.then(function () {
-        var perso = {};
-        jQuery.extend(perso,$scope.items);
-        delete perso.list;
-
-        $log.info('Object envoyé au serveur :', perso);
-
-        apicall.setJoueurs(perso).success(function(data){
-          $log.info(data);
-          $scope.chargerJoueurs();
-        }).error(function(){
-          $scope.alertes.push({type : 'danger', msg: 'Impossible de modifier un joueur (cliquer pour essayer de recharger)'});
-        });
-    }, function () {
-      $log.info('Modal dismissed at: ' + new Date());
-    });
-  };
-}]);
-
-// Please note that $modalInstance represents a modal window (instance) dependency.
-// It is not the same as the $modal service used above.
-
-angular.module('ui.bootstrap').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {