diff --git a/doc/source/administrator/impression/impressions.md b/doc/source/administrator/impression/impressions.md
index 2863bf665f2dcf1fadb9400f260742c0ed5c7263..88089a4b442c8c9a739b85bdf0738fbff4c55ead 100644
--- a/doc/source/administrator/impression/impressions.md
+++ b/doc/source/administrator/impression/impressions.md
@@ -13,103 +13,180 @@ Elles offrent à l'administrateur 4 possibilités de personnalisation :
-**Configuration du mode d'impression dans une carte**
-
## Configuration générale
Avant toute chose, pour qu'un utilisateur ait la possibilité d'imprimer sa carte, il faut :
- Qu'il en possède les droits
-- Que l'administrateur ait autorisé les impressions sur la carte
-
-#### Associer le modèle d'impression à un groupe
+- Que l'administrateur ait ajouté le bouton d'impression sur la carte
-Pour qu'un utilisateur ait les droits d'impression, il faut que son compte soit associé à un groupe qui possède au moins un modèle d'impression (cf. Documentation des groupes)
+#### 1- Donner les droits d'impression aux utilisateurs
-#### Ajout du bouton d'impression sur la carte
+Pour qu'un utilisateur ait les droits d'impression, il faut que son compte soit associé à un groupe qui possède au moins un modèle d'impression (cf. [Documentationdesgroupes](../rights/group.md)) [Documentation des groupes](http://documentation.veremes.net/vmap2/administrator/rights/group.html).
-Les utilisateurs doivent ajouter l'outil d'impression dans leur carte respective pour activer l'impression, car c'est une option configurable.
+#### 2- Ajouter le bouton d'impression sur la carte
-L'icon présent ci dessous doit être ajouté dans les barres latérales ou inférieures de la carte
+La seconde condition pour qu'un utilisateur puisse réaliser une impression, c'est que l'administrateur ait ajouté le bouton (cf. image ci-dessous) sur la carte. Cette fonctionnalité est paramétrable carte par carte afin de permettre à l'administrateur d'adapter son application en fonction des besoins..
+_<center>Icône de l'impression à ajouter dans la barre latérales ou inférieures de la carte.</center>_
+
+
+Exemple :
-## Modèles
+## Modèles d'impression
+
+Les Modèles d'impression sont des templates utilisés pour obtenir le rendu principal de l'impression. Ils permettent de définir et ajuster la disposition, le contenu et le format des cartes imprimées en assurant une présentation cohérente et personnalisée selon les besoins spécifiques de l'utilisateur.
+
+Pour créer un modèle, cliquer sur `Ajouter` depuis le mode `Impressions` > ` Modèle d'impressions` et remplir l'ensemble des informations demandées par le formulaire (un nom, un format de page, une orientation, les groupes d'utilisateurs autorisés à utiliser ce modèle, ainsi qu'une définition HTML).
+
+Chaque modèle d'impression peut être personnalisé à partir de variable afin de récupérer les images de la carte, la légende, des informations sur l'utilisateur qui lance l'impression...
+
+Voici les différentes variable et balises utilisables dans les impressions :
-Les Modèles dans le mode "Impressions" de vMap sont des templates utilisés pour les impressions sur une carte. Ils permettent de définir et ajuster la disposition, le contenu et le format des cartes imprimées, assurant une présentation cohérente et personnalisée selon les besoins spécifiques de l'utilisateur.
+### 1- Variables / balises correspondant aux images
-La première étape consiste à créer un modèle d'impression. Pour cela, cliquez sur "Ajouter" et remplissez le formulaire en associant, un nom, un format de page, une orientation, les groupes d'utilisateurs autorisés à utiliser ce modèle, ainsi qu'une définition HTML.
+3 balises sont disponibles :
-### Identifiants Clés
+- `map_image` : Image de la carte. Balise à intégrer dans un élément `HTML` de type `img`.
+- `map_overview` : Image dde l'overview (mini carte). Balise à intégrer dans un élément `HTML` de type `img`.
+- `map_legend` : Image de la légende. Balise à intégrer dans un élément `HTML` de type `div`.
-Comme mentionné précédemment, il existe plusieurs identifiants clés permettant d'afficher différents éléments cartographiques dans le modèle d'impression.
+Dans le cas d'une carte en comparaison, il est aussi possible de récupérer la carte et la légende comparée. Dans ce cas, les noms des balises sont un peu différents :
-- **map_image** : En attribuant cet identifiant à une balise `<img>`, la carte résultante de l'impression sera placée dans cette balise.
-- **map_overview** : En attribuant cet identifiant à une balise `<img>`, la carte de supervision sera affichée dans cette balise.
-- **map_legend** : En attribuant cet identifiant à une balise `<div>`, le contenu de la légende de la carte sera copié dans cette balise.
+- `map_image_compare_1` : Image de la carte de gauche. Balise à intégrer dans un élément `HTML` de type `img`.
+- `map_image_compare_2` : Image de la carte de droite. Balise à intégrer dans un élément `HTML` de type `img`.
+- `map_legend_compare` : Image de la légende de la carte de comparaison. Balise à intégrer dans un élément `HTML` de type `div`.
-### Mode comparaison
+Exemple permettant d'afficher l'image de la carte dans une impression (balise `map_image`) :
-- **map_image_compare_1** : En attribuant cet identifiant à une balise `<img>`, la carte principale sera imprimée dans cette balise.
-- **map_image_compare_2** : En attribuant cet identifiant à une balise `<img>`, la carte de comparaison sera imprimée dans cette balise.
-- **map_legend_compare** : En attribuant cet identifiant à une balise `<div>`, le contenu de la légende de la carte de comparaison sera copié dans cette balise.
+Partie `HTML` :
+
+```
+<img id="map_image" class="map_image" src="images/transparent.png">
+```
+
+La taille de l'image est définie dans la partie CSS de la définition du modèle :
+
+```
+.map_image {
+ background-color: #D8D8D8 !important;
+ height: 22cm;
+ width: 14cm;
+ border: 1px solid black;
+}
+```
-### Exemple d'affichage de la légende dans une impression
+Exemple permettant d'afficher la légende de la carte dans une impression (balise `map_image`) :
-Pour intégrer la légende d'une carte dans une impression, vous pouvez utiliser le code suivant. Ce code utilise les directives AngularJS ng-if et ng-repeat pour afficher dynamiquement les éléments de la légende.
+Partie `HTML` :
```
-<div id="map_legend" ng-if="map_legend">
- <div ng-repeat="legendLayer in map_legend">
- <div ng-repeat="legend in legendLayer.legendObjects" class="legend_object">
- <div class="legend_layer_name">{{ legend.layerName }}</div><br>
- <img ng-src="{{ legend.legendURL }}" class="legend_image" />
- </div>
- </div>
+<!-- Mode normal -->
+<div ng-if="!compare_mode" class="container" style="top: 5cm; left: 1.5cm;">
+ <label class="legend_headline">Légende</label><br>
+ <div id="map_legend" ng-if="map_legend">
+ <div ng-repeat="legendLayer in map_legend">
+ <div ng-repeat="legend in legendLayer.legendObjects" class="legend_object">
+ <div class="legend_layer_name">{{ legend.layerName }}</div><br>
+ <img ng-src="{{ legend.legendURL }}" class="legend_image" />
+ </div>
+ </div>
+ </div>
</div>
```
-**Description des Directives Utilisées** :
+```
+<!-- Mode comparaison -->
+<div ng-if="compare_mode" class="container" style="top: 5cm; left: 1.5cm;">
+ <div id="map_legend" ng-if="map_legend">
+ <label class="legend_headline">Légende 1</label>
+ <div ng-repeat="legendLayer in map_legend">
+ <div ng-repeat="legend in legendLayer.legendObjects" class="legend_object">
+ <div class="legend_layer_name">{{ legend.legendName }}</div>
+ <img ng-src="{{ legend.legendURL }}" class="legend_image" />
+ </div>
+ </div>
+ </div>
+ <div id="map_legend_compare" ng-if="map_legend_compare">
+ <label class="legend_headline">Légende 2</label>
+ <div ng-repeat="legendLayer in map_legend_compare">
+ <div ng-repeat="legend in legendLayer.legendObjects" class="legend_object">
+ <div class="legend_layer_name">{{ legend.legendName || legend.layerName }}</div>
+ <img ng-src="{{ legend.legendURL }}" class="legend_image" />
+ </div>
+ </div>
+ </div>
+</div>
+```
+
+Partie `CSS` :
+
+```
+.map_legend {
+ width: 3cm;
+ margin-top: 16px;
+}
+
+#map_legend_compare {
+ margin-top: 100px;
+}
+
+.map_legend_compare_mode {
+ width: 3cm;
+ margin-top: 16px;
+}
+```
-- `ng-if="map_legend"` : Cette directive AngularJS conditionne l'affichage de la légende. Le contenu ne sera affiché que si la variable `map_legend` existe et contient des données.
-- `ng-repeat="legendLayer in map_legend"` : Cette directive permet de parcourir chaque élément de la variable `map_legend`. Pour chaque élément (qui représente un calque de la légende), une nouvelle `<div>` sera créée.
-- `ng-repeat="legend in legendLayer.legendObjects"` : À l'intérieur de chaque calque de légende, cette directive parcourt les objets de la légende (les éléments individuels à afficher). Pour chaque objet, une nouvelle `<div>` sera créée avec la classe `legend_object`.
-- `{{ legend.layerName }}` : Cette interpolation affiche le nom du calque de la légende.
-- `ng-src="{{ legend.legendURL }}"` : Cette directive AngularJS lie dynamiquement l'URL de l'image de la légende à l'attribut `src` de la balise `<img>`. Cela permet d'afficher l'image correspondante à chaque élément de la légende.
-### Variables Disponibles
-Tous les paramètres que vous définissez depuis le mode "Paramètres" seront interprétés comme des variables et pourront être inclus dans le résultat en les encadrant par des accolades dans la définition. Par exemple, si vous définissez un paramètre `map_title` dans le formulaire de votre modèle, vous pouvez l'utiliser dans votre modèle en écrivant `{{map_title}}`.
+### 2- Autres variables disponibles
-En plus des paramètres définis par l'utilisateur, certains paramètres dynamiques sont automatiquement affectés et peuvent également être utilisés de cette manière.
+En plus de pouvoir intégrer dynamiquement des images dans l'impression, vMap donne la possibilité d'intégrer de nombreuses valeurs faisant référence :
+- à l'utilisateur qui réalise l'impression
+- à des informations de la carte
+- ou encore à la date
-- **map_scale** : échelle de la carte imprimée
-- **date** : date du jour
-- **date_hour**: date + heure du jour
-- **layer_sources** : sources des couches
-- **map_legend**: légende de la carte principale
-- **user_name** : nom de l”utilisateur
-- **user_login** : login de l”utilisateur
-- **user_company** : société de l”utilisateur
-- **user_department** : service de l”utilisateur
-- **user_email** : adresse mail de l”utilisateur
-- **user_id** : identifiant de l”utilisateur
+Ces informations doivent être ajoutées dans la définition `HTML` encadrées par des accolades (Exemple `{{date}}`) :
-## Styles
+- `map_scale` : échelle de la carte imprimée
+- `date` : date du jour
+- `date_hour` : date + heure du jour
+- `layer_sources` : sources des couches
+- `map_legend`: légende de la carte principale
+- `user_name` : nom de l”utilisateur
+- `user_login` : login de l”utilisateur
+- `user_company` : société de l”utilisateur
+- `user_department` : service de l”utilisateur
+- `user_email` : adresse mail de l”utilisateur
+- `user_id` : identifiant de l'utilisateur
-Le "style" des impressions permettent aux utilisateurs de sélectionner le style qu'ils souhaitent appliquer lors de la phase de préparation des impressions. Chaque utilisateur possède ses propres styles configurés par l'administrateur et définis en HTML avec des balises de styles CSS. Ces styles surchargent ceux du modèle d'impression utilisé et peuvent, entre autres, impacter les couleurs, les espacements, etc.
+### 2- Directives Utilisables dans la définition modèle :
+
+- `ng-if="map_legend"` : Cette directive AngularJS conditionne l'affichage de la légende. Le contenu n'est affiché que si la variable `map_legend` existe et contient des données.
+- `ng-repeat="legendLayer in map_legend"` : Cette directive permet de parcourir chaque élément de la variable `map_legend`. Pour chaque élément (qui représente un calque de la légende), une nouvelle `<div>` est créée.
+- `ng-repeat="legend in legendLayer.legendObjects"` : À l'intérieur de chaque calque de légende, cette directive parcourt les objets de la légende (les éléments individuels à afficher). Pour chaque objet, une nouvelle `<div>` est créée avec la classe `legend_object`.
+- `{{ legend.layerName }}` : Cette interpolation affiche le nom du calque de la légende.
+- `ng-src="{{ legend.legendURL }}"` : Cette directive AngularJS lie dynamiquement l'URL de l'image de la légende à l'attribut `src` de la balise `<img>`. Cela permet d'afficher l'image correspondante à chaque élément de la légende.
+
+## Styles d'impression
+
+Le "style" d'impressions permettent à l'application de pouvoir définir un style différent pour chaque utilisateur.
+Configurés par l'administrateur et définis en HTML avec des balises de styles CSS, les styles surchargent ceux du modèle d'impression utilisé et peuvent, entre autres, impacter les couleurs, les espacements, un logo etc.
### Exemple de modification du logo dans une impression
-Pour modifier le logo dans le header du modèle d'impression par défaut de vMap, nommé "Modèle par défaut", nous devons d'abord identifier la balise contenant notre image. Cette balise peut être identifiée grâce à sa classe unique utilisée uniquement pour l'image du logo.
+Pour modifier le logo dans le header du modèle d'impression par défaut de vMap, nommé "Modèle par défaut", il faut tout d'abord identifier la balise contenant l'image à rendre variable en fonction de l'utilisateur qui est connecté. Cette balise peut être identifiée grâce à sa classe et celle-ci doit être unique.
-Lors de la création de notre style d'impression permettant la permutation du logo, nous allons ajouter dans la définition CSS le bout de code suivant. Ce code permet de remplacer le contenu de la balise image avec la classe `logo` par l'image en base 64 fournie.
+Une fois la balise détectée, créer un style d'impression en cliquant sur `Ajouter` depuis le mode `Impressions` > ` Style d'impressions` et remplir l'ensemble des informations demandées par le formulaire (un nom, les utilisateurs associés à ce style ainsi qu'une définition CSS).
+
+Dans l'exemple évoqué, celui de rendre variable le logo du modèle d'impression, voici un bout de code CSS, qui remplace le contenu de la balise `image` avec la classe `logo` par l'image en base 64 mentionnée en CSS.
```
<style>
@@ -123,6 +200,8 @@ Ce style va surcharger le logo existant dans le modèle d'impression par défaut
## Échelles
-Le mode "Impressions" de vMap inclut une liste d'échelles par défaut qui permettent aux utilisateurs de choisir la représentation la plus appropriée pour leurs cartes imprimées. Les échelles définissent le rapport entre les distances sur la carte et les distances réelles sur le terrain, assurant ainsi une représentation précise et adaptée aux besoins spécifiques de l'utilisateur.
+L'outil d'impression de vMap inclut une liste d'échelles permettant aux utilisateurs d'imprimer une carte à une échelle bien précise.
+
+
-
\ No newline at end of file
+Cette liste d'échelle est paramétrable à partir du mode `Impressions` > `Echelles d'impression` de l'application vMap.
\ No newline at end of file
diff --git a/doc/source/images/administrator/impressions/ajouter_outil_impression_dans_la_carte.png b/doc/source/images/administrator/impressions/ajouter_outil_impression_dans_la_carte.png
index 2e4f4377628dba37f784ee9ba1f078890d18bab1..82b4e1d0131310e0d3d732402a50259b047f99e7 100644
Binary files a/doc/source/images/administrator/impressions/ajouter_outil_impression_dans_la_carte.png and b/doc/source/images/administrator/impressions/ajouter_outil_impression_dans_la_carte.png differ
diff --git a/doc/source/images/administrator/impressions/icon_outil_impression.png b/doc/source/images/administrator/impressions/icon_outil_impression.png
index d9cb48d2891d86a08b0e96a2d491083b699b9047..c60eee4a71722bb2ac528e84210a602cff8b3b2b 100644
Binary files a/doc/source/images/administrator/impressions/icon_outil_impression.png and b/doc/source/images/administrator/impressions/icon_outil_impression.png differ