Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41c1 David Annebicque IUT MMI: Bureau H013 CReSTIC:

Présentation au sujet: "Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41c1 David Annebicque IUT MMI: Bureau H013 CReSTIC:"— Transcription de la présentation:

1 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41c1 David Annebicque David.annebicque@univ-reims.fr IUT MMI: Bureau H013 CReSTIC: Bureau C203 POO Avancée - Symfony M42C1 Support disponible : www.davidannebicque.fr/cours/ECR130

2 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Assets  Inclure des fichiers externes dans votre « code »  => utilisation d’assetic !  C’est un bundle…  Principe  Mettre tous les fichiers appartenant au bundle dans le bundle  Resources/public/…  « installer » les assets  Php app/console assets:install web/  Intérêt  Symfony compile l’ensembles des fichiers css en un seul (mimification).  Idem pour le JS  Contraintes  Cache  Installation nécessaire 2

3 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Assets  Pour du CSS  {% stylesheets  'bundles/nomdubundle/fichier.css'   filter='cssrewrite' %}   {% endstylesheets %} 3

4 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Assets  Pour un fichier js  {% javascripts  '@NomDuBundle/Resources/public/fichier.js'  %}   {% endjavascripts %}  Remarque !  Pour du JS on pointe le répertoire du bundle  Pour le CSS on pointe le répertoire d’installation 4

5 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Assets  Pour une image (ou un fichier)  Il est propre au bundle  Il est « uploadé », indépendant du bundle, …  Ou tout autre fichier 5

6 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Configurer Assetics  Dans le fichier config.yml du répertoire app/config  Vous devez ajouter vos bundles pour que assetics puisse aller fouiller et recopier les fichiers nécessaires. 6

7 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Travail  Intégrer du CSS et Jquery  Afficher les images des animaux du zoo  Mettre à jour la base de données  Afficher les images  Idée : avalanche123/imagine-bundle  Pour redimensionner à la volée des images  => attention au cache !!  Proposer une zone déroulante (select) avec les espèces. En fonction du choix afficher les animaux concernés 7

8 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Les formulaires  Il existe une bibliothèque dans Symfony qui va vous simplifier la vie  Cette bibliothèque est utilisable en dehors de Symfony  L’utilisation de cette bibliothèque repose, dans une majorité de cas sur une entité  Sans forcément dépendre d’une base de données. 8

9 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque 9

10 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Les formulaires  Créer un formulaire nécessite relativement peu de code,  Vous ne gérez pas la mise en forme et l’écriture du HTML associé  Symfony2 est livré avec de nombreux types prédéfinis (voir Types de champ intégrés).Types de champ intégrés  On peut créer tous les types personnalisés que l’on souhaite  Affichage du formulaire dans un template twig 10 {{ form ( form ) }}

11 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Sauvegarder le formulaire 11

12 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque  Ce contrôleur suit un pattern commun dans la manière de gérer les formulaires, et a trois scénarios possibles :  1. Lors du chargement initial de la page dans votre navigateur, le formulaire est simplement créé et affiché.  handleRequest() détermine que le formulaire n'a pas été soumis et ne fait rien.  isValid() retourne false si le formulaire n'a pas été soumis.  2. Lorsque l'utilisateur soumet le formulaire, handleRequest() s'en rend compte et écrit immédiatement les données soumises dans les propriétés task et dueDate de l'objet $task.  Ensuite, cet objet est validé. S'il est invalide, isValid() retourne encore false et le formulaire est affiché de nouveau avec toutes ses erreurs de validation.  3. Lorsque l'utilisateur soumet le formulaire avec des données valides, les données soumises sont toujours écrites dans l'objet, mais cette fois, isValid() retourne true.  Vous pouvez utiliser l'objet $task (comme le persister en base de données) avant de rediriger l'utilisateur vers une autre page par exemple. 12

13 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Types de champ intégrés: Champs texte  text text  textarea textarea  email email  integer integer  money money  number number  password password  percent percent  search search  url url 13

14 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Types de champ intégrés: Choice  choice choice  entity entity  country country  language language  locale locale  timezone timezone  currency currency 14

15 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Types de champ intégrés: Date et heure  date date  datetime datetime  time time  birthday birthday 15

16 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Types de champ intégrés: Autres champs  checkbox checkbox  file file  radio radio 16

17 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Types de champ intégrés: Autres champs  Champs de type Groupe¶  collection collection  repeated repeated  Champs cachés¶  hidden hidden  Boutons¶  button button  reset reset  Submit Submit  Champs de base¶  form form 17

18 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque  Chaque type de champ a un certain nombre d'options différentes qui peuvent lui être passées. Beaucoup d'entre elles sont spécifiques à chacun d'entres-eux et vous pouvez trouver ces détails dans la documentation de chaque type.  Cependant, beaucoup de paramètres sont communs (héritage…) 18

19 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Formulaires: Required  La plus commune des options est l'option required, qui peut être appliquée à tous les champs.  Par défaut, cette dernière est définie à true, signifiant que les navigateurs supportant HTML5 vont appliquer la validation côté client si le champ est laissé vide.  Si vous ne souhaitez pas ce comportement, vous pouvez soit définir l'option required de vos champs à false, ou soit désactiver la validation HTML5. 19

20 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Formulaires: label  Par défaut, Symfony et le module Form essaye de deviner le label de votre champ… Cependant vous pouvez le définir vous même  Le label d'un champ de formulaire peut être défini grâce à l'option label, qui s'applique à n'importe quel champ:  ->add('dueDate', 'date', array(  'widget' => 'single_text',  'label' => 'Due Date',  ))  Le label d'un champ peut aussi être défini dans le template lorsque vous affichez le formulaire, voir ci-dessous. 20

21 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Formulaires: prédictions  required : L'option required peut être devinée grâce aux règles de validation (est-ce que le champ est NotBlank ou NotNull?) ou grâce aux métadonnées de Doctrine (est-ce que le champ est nullable?). Ceci est très utile car votre validation côté client va automatiquement correspondre à vos règles de validation.  max_length : Si le champ est de type texte, alors l'option max_length peut être devinée grâce aux contraintes de validation (si Length ou Range sont utilisées) ou grâce aux métadonnées de Doctrine (via la longueur du champ).  ->add('task', text, array('max_length' => 4,’required’=>false,…)) 21

22 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Formulaires et templates  form_start(form) - Affiche la balise d'ouverture form.  form_errors(form) - Affiche les erreurs globales du formulaire (les erreurs spécifiques à chaque champ seront affichées à côté des champs);  form_row(form.dueDate) - Affiche le label, les erreurs éventuelles et le widget HTML d'un champ donné (ex dueDate) dans un élément div (par défaut);  form_end() - Affiche la balise de fermeture du formulaire ainsi que tous les champs qui n'ont pas encore été affichés. C'est utile pour afficher les champs cachés et pour profiter de la protection CSRF automatique. 22

23 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Formulaires et templates  Form_label: affiche le label avec sa classe et l’ID du champs  form_errors: affiche les erreurs associées au champs en fonction de la validation configurée  Form_widget: affiche le champs 23

24 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Paramétrer les actions 24

25 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Mais en fait c’est moche !  Oui ! Pourquoi ?  Tout le code de votre formulaire est dans votre controller…  C’est mal !  Votre formulaire n’est utilisable qu’une seule fois  C’est mal !  Si je veux ajouter et modifier je vais devoir faire deux formulaires  C’est mal  … 25

26 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Classes de formulaire  C’est magique !  Réutilisabilité des formulaires  Découplage de votre code de « formulaire » et de votre controller  Paramétrage plus fin, avec la validation  Ca se génère presque automatiquement !  Concrètement  Tout ce qu’on vient de voir reste vrai !  Mais ca se fait dans un fichier séparé !  L’utilisation dans le controller est un peu simplifiée 26

27 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Création du fichier  Src/DA/MonBundle/Form/Type/FichierType.php (par convention) 27 Php app/console doctrine:generate:form NomDuBundle:Entity

28 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Utilisation de la classe de formulaire 28

29 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Astuces  Lorsque vous associez un formulaire à un objet, tous les champs sont mappés. Chaque champ du formulaire qui n'existe pas dans l'objet associé entrainera la levée d'une exception.  Dans le cas où vous avez besoin de champs supplémentaires dans le formulaire (par exemple une checkbox « Acceptez-vous les conditions d'utilisation ») qui ne doit pas être mappée à l'objet sous-jacent, vous devez définir l'option mapped à false: 29

30 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Sauvegarde du formulaire avec doctrine  C’est juste simple ! 30

31 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Theming  Chaque partie de l'affichage d'un formulaire peut être personnalisée. Vous êtes libre de :  changer la manière dont chaque « partie » du formulaire est affichée,  changer les balises utilisées pour afficher les erreurs,  personnaliser la manière dont la balise textarea doit être affichée.  …  Symfony utilise des templates pour afficher chaque partie d'un formulaire, comme les balises tags, les balises input, les messages d'erreur et tout le reste.  Dans Twig, chaque « fragment » de formulaire est représenté par un bloc Twig. Pour personnaliser n'importe quelle partie d'un formulaire, vous avez juste besoin de réécrire le bloc approprié. 31

32 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque  Pour comprendre comment tout cela fonctionne, personnalisons le fragment form_row et ajoutons l'attribut « class » à l'élément div qui entoure chaque ligne. Pour faire cela, créez un nouveau fichier de template qui va stocker la nouvelle balise : 32

33 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Utilisation d’un thème pour le formulaire  Utilisation du thème 33

34 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Travail à faire  Proposer un formulaire pour pouvoir ajouter un nouvel animal et créer une nouvelle espèce.  Commencer à concevoir la gestion des espèces et des animaux  Attention ! Placez les fonctionnalités dans les bons contrôleurs !  Nous ajouterons la sécurité par la suite. 34

35 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Ajout de la sécurité  La sécurité est un élément complexe et puissant dans Symfony.  Vous pouvez faire vous-même votre système de login et de sécurisation.  Cependant, et comme c’est l’idée de Symfony, nous allons utiliser un Bundle largement reconnu dans la communauté de Symfony  FOSUserBundle  FOS (Friends Of Symfony) est un groupe d’utilisateurs passionnés de Symfony qui propose des Bundles de très grande qualité. 35

36 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Installation et configuration de FOSUserBundle  Installation de FOSUserBundle  https://github.com/FriendsOfSymfony/FOSUserBundle/blob/master/Res ources/doc/index.md https://github.com/FriendsOfSymfony/FOSUserBundle/blob/master/Res ources/doc/index.md  Grace à composer le bundle se télécharge ainsi que ses dépendances.  Vous devez ensuite l’activer dans le appKernel en ajoutant la ligne suivante dans le tableau $bundle  Vous devez ensuite créer une classe User en fonction de l’ORM de votre choix. Cette classe est une Entity !  Recopiez le code et adaptez le namespace à votre bundle.  Paramétrez votre sécurité  App/configu/security.yml 36 new FOS\UserBundle\FOSUserBundle(),

37 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Security.yml 37

38 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Config.yml 38

39 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Routing.yml 39

40 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Update de la BDD 40

41 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Console et FOS  https://github.com/FriendsOfSymfony/FOSUserBundle/blob/master/R esources/doc/command_line_tools.md https://github.com/FriendsOfSymfony/FOSUserBundle/blob/master/R esources/doc/command_line_tools.md 41

42 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Requêtes avec Doctrine 42

43 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque DQL et CreateQuery 43

44 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque DQL et CreateQuery  Particularité  Notation « objet » donc utilisation d’alias obligatoire  Écriture proche du SQL 44

45 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Constructeur de requêtes de Doctrine : QueryBuilder¶¶  Seconde méthode pour créer des requêtes dans Symfony.  Intérêt  Vraie notation objet (avec tout ce que cela implique !)  Généralement bien intégrée dans un bon IDE  Notation peut être plus lisible  Inconvénients  Concepts identique au SQL, et mêmes appellations, mais malgré tout petit apprentissage nécessaire 45

46 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Constructeur de requêtes de Doctrine : QueryBuilder¶¶ 46

47 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Favoriser les dépôts  Jusqu’à présent les requêtes étaient dans le contrôleur.  Pourquoi ?  Parce qu’on instancie à chaque fois un repository avant d’executer une requête…  C’est mal !  Par réutilisable  Logique métier pas isolée du reste du projet  Pas facile de tester 47

48 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Favoriser les dépôts  Le dépôt c’est le fichier « MonEntityRepository.php » qu’on a créé à chaque fois qu’on ajoutait une entité  Si vus avez répondu « no » lors de la création de l’entité il est toujours possible d’ajouter un dépôt à une entité: 48 /** @ORM\Entity(repositoryClass="Acme\StoreBundle\Entity\ProductRepository") */ class Product php app/console doctrine:generate:entities Acme

49 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque Exemple de dépôt 49 Dans le contrôleur Dans le dépôt

50 Université de Reims Champagne-Ardenne IUT Troyes – DUT MMI 2 ème Année M41C1 David Annebicque QueryBuilder  Il est bien sûr possible (et vivement recommandé) d’utiliser le QueryBuilder dans le dépôt.  Toute la documentation officielle ici:  http://doctrine-dbal.readthedocs.org/en/latest/reference/query- builder.html http://doctrine-dbal.readthedocs.org/en/latest/reference/query- builder.html 50