Added ContextMenu documentation + added some tl;dr

docs/#Project/Pages/Behaviors.md

@@ -1,3 +1,16 @@
+> TL;DR
+> Behaviors.ts définis les comportements qui sont utilisés.
+
+> Actuellement sont activés par défaut :
+> - Corps rigide (simple) : Est restraint dans le parent
+> - Ancrage : Impose la priorité de position et de taille
+> - Flex : se redimensionne automatiquement
+
+> Désactivés:
+> - Corps rigide (complet) : Est restraint par les parents et par ses voisins (fonctionne mais pas intuitif)
+> - Poussé : quand un conteneur est ajouté au bout de la bande filante, pousse tous les conteneurs à sa gauche (fonctionne mais pas intuitif)
+> - Swap : échange de place avec un autre conteneur lorsqu'ils sont superposés (buggué ne pas utiliser)
+
 # Comportements des conteneurs
 
 Ce document traite des comportements spéciaux et uniques qu'un conteneur peut avoir.
@@ -21,8 +34,6 @@ Cependant, il a une règle commune pour tout comportement qui s'applique à ses
 
 Il s'agit d'appliquer les comportements spéciaux de ses enfants (rigide ou ancré).
 
-Traduit avec www.DeepL.com/Translator (version gratuite)
-
 
 ## Applications
 
@@ -37,11 +48,10 @@ An example would be trying to overlap an element in order to use it as a layer.
 
 ## Références de code et algorithmes
 
-Dans le module `PropertiesOperations.ts` dans les fonctions suivantes :
+Dans le module `ContainerOperations.ts` dans les fonctions suivantes :
 - `OnPropertyChange()`
-- `OnPropertiesSubmit()`
 
-et dans le module `ContainerOperation.ts` dans `AddContainer()`,
+et dans le module `AddContainer.ts` dans `AddContainer()`,
 
 il utilise la fonction `ApplyBehaviors` du module `Behaviors.ts` pour appliquer les comportements spéciaux de ses enfants.
 

docs/#Project/Pages/CICD.md

@@ -5,7 +5,7 @@ This project uses Azure Pipelines to runs automatic tests.
 Its `azure-pipelines.yml` configuration file can be found at the root project folder.
 
 
-# Drone.io
+# Drone.io (deprecated)
 
 Due to the limitations of Azure Pipelines (limited free usage, no parallel, no dockerhub...), it might be more useful to use Drone.io.
 However `pnpm` will not be as useful as in Azure Pipelines since we cannot cache on the parent machine.

docs/#Project/Pages/ContextMenu.md

@@ -0,0 +1,55 @@
+> TL;DR: Menu.tsx est le composant qui affiche et qui traite l'event contextmenu sur la page
+> InitActions de Editor.tsx prépare le modèle pour Menu.tsx
+> ContextMenuActions définient les actions de l'API
+
+# Context Menu
+
+Ce document présente comment le menu contextuel est implémenté.
+
+
+# Event listener
+
+Pour implémenter le menu contextuel, il faut en premier ajouter un event listener sur `contextmenu`.
+
+Cela se fait dans le composant `Menu.tsx` via la fonction `UseMouseEvents()`.
+
+Elle équipe plusieurs events sur la page en plus de `contextmenu` afin de fermer correctement lorsque l'on clique ailleurs.
+
+Il n'existe donc qu'un seul menu contextuel pour toute la page.
+
+
+# Affichage du contenu
+
+On a vu que `Menu.tsx` s'occupe de traiter l'event `contextmenu`. Regardons maintenant comment elle affiche le menu.
+
+Ce composant utilise une hashmap `actions: Map<string, IMenuAction[]>` pour lire les différentes actions possible, la clé servant d'identifiant et de pattern.
+
+En effet, la fonction `AddClassSpecificActions`, obtenant le composant html lit les *classes* et vérifie s'il est présent dans le dictionnaire avec `props.actions.get(className)`.
+
+S'il est présent, alors on itère sur les différentes actions possible pour cette classe pour ajouter des `MenuItem` représentant une ligne du menu contextuel. Chaque `MenuItem` possède un fonction qui sera exécutée lorsque la ligne est cliquée. Il possède également un texte, un titre qui sera affiché si le curseur survole la ligne, et, optionnellement, un raccourci qui sera affiché à droite de la ligne.
+
+En plus des actions de classes, il y a aussi des actions universelles comme le `undo` ou `redo` qui sont affichées n'importe où on clique. Celle-ci ont pour id `''`, une chaine de caractères vide. On itère sur cette liste d'action pour ajouter les lignes.
+
+L'ordre d'affichage est donc défini :
+
+1) actions de classes
+2) actions universelles
+
+L'ordre des classes est l'ordre d'ajout dans le dictionnaire.
+
+
+# Création du dictionnaire
+
+Parlons de l'initialisation du dictionnaire.
+
+Le composant `Menu` est utilisé dans `Editor`. C'est aussi ici que l'ont crée le dictionnaire.
+
+La fonction `InitActions` s'occupe d'enrichîr le dictionnaire des différentes actions.
+
+On peut voir qu'au début de la fonction que les actions universelles y sont initialisées. Ensuite, les actions spécifiques aux classes y sont ajoutés avec au début les actions définies dans SVGLayoutDesigner et après, les actions définies dans la configuration de l'API (donc `Diviser remplissage par exemple`).
+
+Chaque action provenant de l'API utilise la fonction `GetAction` du fichier utilitaire `ContextMenuActions.ts`.
+
+Cette fonction équipe l'action qui sera exécutée d'une autre fonction appelé `SetContainerList`. Cette autre fonction s'occupe de faire un appel REST vers l'api sur le point d'accès `Configuration.APIConfiguration.apiSetContainerListUrl` ou, si elle n'est pas définie, sur `VITE_API_SET_CONTAINER_LIST_URL`.
+
+Cela veut dire que pour l'instant toutes les actions provenant de l'API a pour but de remplacer, d'ajouter ou de supprimer des conteneurs.

docs/#Project/Pages/DataStructure.md

@@ -1,3 +1,6 @@
+
+> TL;DR: Ce projet utilise un dictionnaire pour représenter un arbre/graphe
+
 # Préface
 
 Ce document explique la structure de données utilisée pour les conteneurs.

docs/#Project/Pages/SmartComponent.md

@@ -1,3 +1,5 @@
+Source: https://dev.azure.com/techformsa/SmartConfigurator/_wiki?pageId=122&friendlyName=Int%C3%A9grer-le-projet-en-tant-que-composant-dans-Modeler#
+
 - [Préface](#préface)
 - [Customiser et build le projet (recommandé)](#customiser-et-build-le-projet-(recommandé))
   * [Configurer les options de build](#configurer-les-options-de-build)