From 859d88df98e47b553b7a667d7738379da2eaa3db Mon Sep 17 00:00:00 2001 From: Maxime Puys Date: Wed, 7 Feb 2024 11:17:18 +0100 Subject: [PATCH] Updated: lab4 --- labs/4/lab4.md | 137 ++++++++++--------------------------------------- 1 file changed, 27 insertions(+), 110 deletions(-) diff --git a/labs/4/lab4.md b/labs/4/lab4.md index d2bab24..63f7e8b 100644 --- a/labs/4/lab4.md +++ b/labs/4/lab4.md @@ -46,123 +46,40 @@ Les objectifs de ce TP sont : - Faites en sorte que le votre template `index.html.twig` étende le template `base.html.twig` pour ne pas avoir à dupliquer de code HTML. - -### 1.2 Filtres personnalisés -Créez un filtre Twig personnalisé pour résumer les Twoks qui sont trop longs. Nommez ce filtre `summarize`. - -```php -// src/Twig/AppExtension.php - -namespace App\Twig; - -use Twig\Extension\AbstractExtension; -use Twig\TwigFilter; - -class AppExtension extends AbstractExtension -{ - public function getFilters() - { - return [ - new TwigFilter('summarize', [$this, 'summarizeText']), - ]; - } - - public function summarizeText($text, $max = 50) - { - if (strlen($text) > $max) { - return substr($text, 0, $max) . '...'; - } - - return $text; - } -} -``` - -Utilisez ce filtre dans votre template pour afficher un résumé des Twoks. - -```twig -{{ twok.content|summarize(100) }} -``` +3. **Filtres personnalisés :** + - Créez un filtre Twig personnalisé pour résumer les `Twoks` qui sont trop + longs. Implémentez le filtre dans le fichier `src/Twig/AppExtension.php` + et nommez ce filtre `summarize`. Voir [doc sur les extension + Twig](https://symfony.com/doc/current/templates.html#writing-a-twig-extension). + - Utilisez ce filtre dans votre template pour afficher un résumé des `Twoks`. + ```twig + {{ twok.content|summarize(100) }} + ``` ## Partie 2 : Interaction avec les Twoks (45 min) -### 2.1 Affichage conditionnel -Ajoutez un affichage conditionnel pour montrer un message spécial si un Twok a été créé le jour même. - -```twig -{% if twok.createdAt|date('Y-m-d') == "now"|date('Y-m-d') %} -

Nouveau Twok!

-{% endif %} -``` - -### 2.2 Inclusion de Templates -Créez un template séparé pour afficher les détails d'un Twok (`twok_detail.html.twig`) et incluez-le dans votre liste de Twoks. - -```twig -// twok_detail.html.twig -
-

{{ twok.content|summarize(100) }}

-

Posté le: {{ twok.createdAt|date('d/m/Y H:i') }}

-
-``` +1. **Affichage conditionnel :** + - Ajoutez un affichage conditionnel pour montrer un message spécial (ex: "Nouveau Twok !") si un + `Twok` a été créé le jour même. -```twig -{% for twok in twoks %} - {% include 'twok_detail.html.twig' %} -{% endfor %} -``` +2. **Inclusion de Templates :** + - Créez un template séparé pour afficher les détails d'un `Twok` + (`twok_detail.html.twig`) et incluez-le dans votre liste de `Twoks`. -### 2.3 Macros Twig pour les boutons -Définissez une macro Twig pour générer des boutons de like et de partage pour chaque Twok. - -```twig -{% macro action_buttons(twokId) %} -
- - -
-{% endmacro %} - -{% import _self as macros %} -``` - -Utilisez cette macro dans le template de détail du Twok. - -```twig -{{ macros.action_buttons(twok.id) }} -``` +3. **Macros Twig pour les boutons :** + - Définissez une macro Twig pour générer des boutons de like et de partage + pour chaque `Twok`. Utilisez cette macro dans le template de détail du `Twok`. ## Partie 3 : Fonctionnalités Avancées (45 min) -### 3.1 Structures de Contrôle -Expérimentez avec des structures de contrôle avancées en affichant les Twoks en alternance : un Twok sur fond clair, l'autre sur fond sombre, en utilisant la fonction `cycle`. - -```twig -{% for twok in twoks %} -
- {% include 'twok_detail.html.twig' %} -
-{% endfor %} - - -``` - -### 3.2 Gestion des Assets -Utilisez la fonction `asset` pour inclure des images ou des styles CSS spécifiques aux Twoks. - -```twig - -``` - -### 3.3 Tests Twig -Utilisez des tests Twig pour afficher des informations spécifiques, par exemple, tester si le contenu du Twok contient le mot "Symfony". - -```twig -{% if twok.content contains 'Symfony' %} -

Ce Twok mentionne Symfony!

-{% endif %} -``` +1. **Affichage alterné :** + - Expérimentez avec des structures de contrôle avancées en affichant les + `Twoks` en alternance : un `Twok` sur fond clair, l'autre sur fond sombre. -## Conclusion +2. **`Twoks` par utilisateur :** + - Créez un nouveau template `twok_by_user.html.twig` qui permettra de lister + l'ensemble des utilisateurs avec pour chaqun une liste de ses `Twoks`. -Cette session vous a permis de plonger dans les fonctionnalités avancées de Twig pour améliorer l'affichage et l'interaction avec les données dans une application Symfony. Vous avez travaillé sur l'affichage conditionnel, l'inclusion de templates, la création de filtres et de macros personnalisés, et bien plus. Ces compétences vous aideront à créer des interfaces utilisateur riches et interactives dans vos futurs projets Symfony. +3. **Ordre des `Twoks` :** + - Dans votre template `index.html.twig`, faites en sorte qu'il soit possible + de lister les `Twoks` du plus ancien au plus récent et l'inverse.