New version 1.5.0. Many updates, bug fix, and new cool features. See …

…CHANGELOG.md

.env

@@ -1,4 +1,6 @@
 VITE_APP_BASE="/"
+VITE_APP_LOCALE="fr_FR"
+VITE_APP_HOSTNAME="http://localhost:5173"
 VITE_APP_URL="http://localhost:5173"
 VITE_APP_VERSION_RANGE=">1.3.0"
 
@@ -12,11 +14,11 @@ VITE_DEFAULT_TEXT=""
 VITE_DEFAULT_SHOWID="true"
 VITE_DEFAULT_SHOWICON="true"
 VITE_DEFAULT_SHOWTEXT="true"
+VITE_DEFAULT_PRINT_EMPTY="true"
+VITE_DEFAULT_PROJECT_NAME="Nouveau projet"
 
 VITE_ROWS_MIN=1
 VITE_ROWS_MAX=15
 VITE_HEIGHT_MIN=10
 VITE_HEIGHT_MAX=50
 VITE_ALLOWED_MODULES="13,18,24"
-VITE_FAVORITES_FGCOLORS="#000000,#FFFFFF"
-VITE_FAVORITES_BGCOLORS="#FFFFFF,#009E4D,#00AAE1,#ED1C24,#ff000f,#019798,#4D4D4D,#CECECE"

.env.production

@@ -1,4 +1,6 @@
 VITE_APP_BASE="/Tiquettes/"
+VITE_APP_LOCALE="fr_FR"
+VITE_APP_HOSTNAME="https://pantaflex44.github.io"
 VITE_APP_URL="https://pantaflex44.github.io/Tiquettes/"
 VITE_APP_VERSION_RANGE=">1.3.0"
 
@@ -12,11 +14,11 @@ VITE_DEFAULT_TEXT=""
 VITE_DEFAULT_SHOWID="true"
 VITE_DEFAULT_SHOWICON="true"
 VITE_DEFAULT_SHOWTEXT="true"
+VITE_DEFAULT_PRINT_EMPTY="true"
+VITE_DEFAULT_PROJECT_NAME="Nouveau projet"
 
 VITE_ROWS_MIN=1
 VITE_ROWS_MAX=15
 VITE_HEIGHT_MIN=10
 VITE_HEIGHT_MAX=50
-VITE_ALLOWED_MODULES="13,18,24"
-VITE_FAVORITES_FGCOLORS="#000000,#FFFFFF"
-VITE_FAVORITES_BGCOLORS="#FFFFFF,#009E4D,#00AAE1,#ED1C24,#ff000f,#019798,#4D4D4D,#CECECE"
+VITE_ALLOWED_MODULES="13,18,24"

CHANGELOG.md

@@ -1,15 +1,29 @@
 # Changelog
 
-## [1.4.1] - 2024-06-05
+## [1.5.0] - 2024-06-08
+
+### Améliorations
+
+- Amélioration de l'expérience utilisateur avec une interface graphique plus ergonomique
+- Léger nettoyage du code
 
 ### Modifications
 
 - Récriture du système de gestion des thèmes
+- Nouvelle documentation
 
 ### Ajouts
 
 - Ajout de nouveaux pictogrammes: Sèche linge, Sèche serviettes, Chaudière gaz, Piscine et SPA
 - Ajout des fichiers sitemap.xml et robots.txt
+- Il est désormais possible de nommer son projet lors de sa création
+- Ajout d'une date de création, d'une date de modification et d'un numéro de version à chaque projet
+- Une date de modification est automatiquement mise à jour après chaque intervention de l'utilisateur
+- Chaque exportation met à jour la version interne du projet
+
+### Partenariats
+
+- Nouveau partenaire: AZ Reso (Artisan électricien du pays Nantais - https://www.google.com/search?q=az+reso+nantes)
 
 
 ## [1.4.0] - 2024-06-02

README.md

@@ -6,7 +6,6 @@ Générateur d'étiquettes pour tableaux / armoires électriques.
 
 https://pantaflex44.github.io/Tiquettes/
 
-
 <u>Licence</u>: MIT<br />
 <u>Auteur</u>: Christophe LEMOINE <pantaflex (at) hotmail (dot) fr><br />
 <u>Création</u>: 26/05/2024<br />
@@ -24,24 +23,39 @@ Deux possibilités:
 - Créer un nouveau projet
 - Importer un projet sauvegarder
 
+![Nouveau projet](docs/_project_actions1.png)
 
 ### Créer un nouveau projet par défaut
 
 ![Nouveau projet](docs/_new_project.png)
 
-L'application définit automatiquement un tableau électrique de 4 rangées, 13 modules par rangée avec une hauteur des étiquettes de 30mm.
+L'application définie automatiquement un tableau électrique de 4 rangées, 13 modules par rangée avec une hauteur des étiquettes de 30mm.
 
 Bien évidement vous pouvez modifier ces valeurs en agissant sur les réglages proposés. Commencez par le réglage du nombre de modules, puis de rangées, et finissez avec la hauteur des étiquettes.
 
-Le tableau s'ajustera automatiquement.
+Le nouveau tableau s'ajustera automatiquement.
 
 ### Importer un projet sauvegardé
 
-![Importer un projet](docs/_import.png)
-
 Tiquettes vous propose d'importer et d'exporter votre travail pour l'archiver ou y retravailler ultérieurement. Une sauvegarde automatique de votre session de travail est aussi intégrée au système.
 
-Pour importer un projet, cliquez sur le bouton ```Choisir un fichier``` puis chargez le fichier correspondant à votre projet. Immédiatement, celui-ci s'affichera plus bas!
+Pour importer un projet, cliquez sur le bouton `Importer` puis chargez le fichier correspondant à votre projet. Immédiatement, celui-ci s'affichera dans la zone de travail!
+
+### Résumé du projet
+
+Une fois le projet chargé, vous retrouverez un résumé de ses propriétés au dessus de la zone de travail.
+
+![Nouveau projet](docs/_project_resume.png)
+
+En premier, se regroupe le nom donné au projet ainsi que la version d'exportation. Cette version se met automatiquement à jour au moment de chaque exportation.
+
+> <b>🛈 Bon à savoir</b>
+>
+> Pour modifier le nom du projet, cliquez dessus puis validez les modifications avec la touche `Entrée` de votre clavier. A contrario, la touche `Echap` annule les modifcations.
+>
+> ![Modifier le nom du projet](docs/_edit_project_name.png)
+
+Puis, vous retrouvez les dates de travail ainsi que le descriptif technique.
 
 ## Utilisation
 
@@ -55,21 +69,21 @@ Chaque module peut avoir une largeur et/ou une position réglable en fonction de
 
 ![Menu contextuel du haut](docs/_top.png)
 
-Le symbole ```+``` vous permet d'agrandir le module d'une largeur sur sa droite.
+Le symbole `+` vous permet d'agrandir le module d'une largeur sur sa droite.
 
-Le symbole ```-``` vous permet de réduire le module d'une largeur.
+Le symbole `-` vous permet de réduire le module d'une largeur.
 
-Le symbole ```←``` vous permet de déplacer le module d'une position sur la gauche.
+Le symbole `←` vous permet de déplacer le module d'une position sur la gauche.
 
-Le symbole ```→``` vous permet de déplacer le module d'une position sur la droite.
+Le symbole `→` vous permet de déplacer le module d'une position sur la droite.
 
 ### Menu contextuel du bas
 
 ![Menu contextuel du bas](docs/_bottom.png)
 
-Le symbole ```Corbeille``` (ou la touche ```Suppr``` du clavier) permet de libérer le module. Il perdra son identifiant, son icône, et sa définition mais conservera sa taille. Il pourra donc de nouveau être englobé dans l'agrandissement des modules précédents.
+Le symbole `Corbeille` (ou la touche `Suppr` du clavier) permet de libérer le module. Il perdra son identifiant, son icône, et sa définition mais conservera sa taille. Il pourra donc de nouveau être englobé dans l'agrandissement des modules précédents.
 
-Le symbole ```Crayon``` (ou la touche ```Entrée``` du clavier) permet d'éditer le module en question.
+Le symbole `Crayon` (ou la touche `Entrée` du clavier) permet d'éditer le module en question.
 
 ### Manipuler les rangées
 
@@ -79,30 +93,28 @@ Pour insérer une rangée, cliquez sur le raccourci présent entre chacune des r
 
 ![Insérer une rangée](docs/_add_row.png)
 
-Pour supprimer une rangée, cliquez sur l'icone ```corbeille```, à gauche du nom de la rangée souhaitée:
+Pour supprimer une rangée, cliquez sur l'icone `corbeille`, à gauche du nom de la rangée souhaitée:
 
 ![Supprimer une rangée](docs/_delete_row.png)
 
-
 ### Raccourcies claviers / souris
 
 Lors de la définition de votre planche d'étiquettes, vous pouvez utiliser votre clavier pour interagir sur les rangées et les modules.
 
-- Pour faire défiler les rangées verticalement, vous pouvez utiliser les flèches ```haut``` et ```bas``` de votre clavier, l'ascenseur de la fenètre ou la roulette de votre souris.
-- Pour faire défiler les rangées horizontalement, vous pouvez utiliser l'ascenseur de la fenètre ou la roulette de votre souris (en appuyant simultanement sur une des touches ```shift``` de votre clavier).
-- Pour déplacer un module horizontalement, sélectionnez le avec votre souris, puis appuyez sur les flèches ```gauche``` et ```droite``` de votre clavier.
-- Pour redimensionner un module, sélectionnez le avec votre souris, puis appuyez sur les touches ```+``` et ```-``` de votre clavier.
-
+- Pour faire défiler les rangées verticalement, vous pouvez utiliser les flèches `haut` et `bas` de votre clavier, l'ascenseur de la fenètre ou la roulette de votre souris.
+- Pour faire défiler les rangées horizontalement, vous pouvez utiliser l'ascenseur de la fenètre ou la roulette de votre souris (en appuyant simultanement sur une des touches `shift` de votre clavier).
+- Pour déplacer un module horizontalement, sélectionnez le avec votre souris, puis appuyez sur les flèches `gauche` et `droite` de votre clavier.
+- Pour redimensionner un module, sélectionnez le avec votre souris, puis appuyez sur les touches `+` et `-` de votre clavier.
 
 ## Edition d'un module
 
 Après avoir cliqué sur le symbole d'édition d'un module, une fenêtre popup s'ouvre et vous offre la possibilité d'affiner sa définition.
 
 ![Edition d'un module](docs/_popup.png)
 
-- *Identifiant* : Identifiant technique du module. Seules les lettres, chiffres et le caractère point son acceptés.
-- *Description* : Une très courte description du module. Les retours à la ligne sont pris en compte.
-- *Pictogramme* : Une petite image illustrant l'environement du module.
+- _Identifiant_ : Identifiant technique du module. Seules les lettres, chiffres et le caractère point son acceptés.
+- _Description_ : Une très courte description du module. Les retours à la ligne sont pris en compte.
+- _Pictogramme_ : Une petite image illustrant l'environement du module.
 
 ## Décorer ses étiquettes
 
@@ -112,6 +124,8 @@ A chacun son style, à chaque coffret sa marque, quoi de mieux que de pouvoir d
 
 Sélectionnez le thème de votre choix puis admirez le style de vos étiquettes changez en temps réel!
 
+![Sélection du thème](docs/_theme_selector2.png)
+
 - Thème Simple
 
 ![Thème Simple](docs/_theme_simple.png)
@@ -174,8 +188,12 @@ Sélectionnez le thème de votre choix puis admirez le style de vos étiquettes
 
 Une fois vos étiquettes réalisées, vous pourrez les imprimer en cliquant sur le bouton adéquat.
 
-Sélectionnez le mode ```paysage``` pour simplifier la mise en page.
+Sélectionnez le mode `paysage` pour simplifier la mise en page.
 
-Choisissez d'imprimer le fond et les images pour avoir un rendu tel votre écran.
+> <b>🛈 Bon à savoir</b>
+>
+> Choisissez d'imprimer le fond et les images pour avoir un rendu tel votre écran.
+>
+> Imprimez toujours en taille réelle sans ajustement de la page. Surtout valable si vous souhaitez imprimer un projet préalablement enregistré en PDF. Acrobat Reader, notamment, ajuste par défaut le document au format papier sélectionné.
 
-## Fin!
+## Fin!

index.html

@@ -41,38 +41,40 @@
         gtag('config', 'G-378MBJK77W');
     </script>
 
-    <nav>
+    <nav class="header">
         <ul>
             <li><a href="https://github.com/pantaflex44/Tiquettes/blob/main/README.md" target="_blank" rel="noopener">
-                <img src="/doc.svg" width="16" height="16" alt="Documentation" />
-                <span>Documentation</span>
-            </a></li>
+                    <img src="/doc.svg" width="16" height="16" alt="Documentation" />
+                    <span>Documentation</span>
+                </a></li>
             <li><a href="https://github.com/pantaflex44/Tiquettes" target="_blank" rel="noopener">
-                <img src="/src.svg" width="16" height="16" alt="Sources" />
-                <span>Sources</span>
-            </a></li>
+                    <img src="/src.svg" width="16" height="16" alt="Sources" />
+                    <span>Sources</span>
+                </a></li>
             <li><a href="https://github.com/pantaflex44/Tiquettes/blob/main/LICENSE" target="_blank" rel="noopener">
-                <img src="/license.svg" width="16" height="16" alt="Licence" />
-                <span>Licence</span>
-            </a></li>
-            <li><a href="https://github.com/pantaflex44/Tiquettes/blob/main/CHANGELOG.md" target="_blank" rel="noopener">
-                <img src="/changelog.svg" width="16" height="16" alt="Changelog" />
-                <span>Changelog</span>
-            </a></li>
+                    <img src="/license.svg" width="16" height="16" alt="Licence" />
+                    <span>Licence</span>
+                </a></li>
+            <li><a href="https://github.com/pantaflex44/Tiquettes/blob/main/CHANGELOG.md" target="_blank"
+                    rel="noopener">
+                    <img src="/changelog.svg" width="16" height="16" alt="Changelog" />
+                    <span>Changelog</span>
+                </a></li>
             <li><a href="#partenariats">
-                <img src="/partners.svg" width="16" height="16" alt="Partenariats" />
-                <span>Partenariats</span>
-            </a></li>
+                    <img src="/partners.svg" width="16" height="16" alt="Partenariats" />
+                    <span>Partenariats</span>
+                </a></li>
             <li><a href="#ressources">
-                <img src="/ressources.svg" width="16" height="16" alt="Ressources" />
-                <span>Ressources</span>
-            </a></li>
+                    <img src="/ressources.svg" width="16" height="16" alt="Ressources" />
+                    <span>Ressources</span>
+                </a></li>
         </ul>
     </nav>
 
     <div id="content">
         <main>
-            <h1><img src="./favicon.svg" width="32" height="32" alt="Tiquettes" /><span>Tiquettes</span><sup class="version"></sup></h1>
+            <h1><img src="./favicon.svg" width="32" height="32" alt="Tiquettes" /><span>Tiquettes</span><sup
+                    class="version"></sup></h1>
             <div class="by">by pantaflex44</div>
             <div class="description">Générateur d'étiquettes pour tableaux et armoires électriques.</div>
 
@@ -86,7 +88,7 @@ <h4>
             </h4>
             <ul class="box_list">
                 <li>
-                    <div class="box_list_title">VOLTA Electricité</div>
+                    <div class="box_list_title">VOLTA Electricité <sup title="Partenaire favoris">⭐</sup></div>
                     <div class="box_list_description">
                         Site dédié à l'électricité industrielle, bâtiment et bricolage. Les principaux savants,
                         téléchargements gratuits de
@@ -99,6 +101,11 @@ <h4>
                         rel="noopener">
                         https://www.volta-electricite.info/index.php
                     </a>
+                    <a class="box_list_link"
+                        href="https://www.volta-electricite.info/forums-volta-electricite/index.php?lng=fr&tconfig=0"
+                        target="_blank" rel="noopener">
+                        Forum
+                    </a>
                 </li>
                 <li>
                     <div class="box_list_title">BricoZone</div>
@@ -112,7 +119,25 @@ <h4>
                         https://www.bricozone.fr (pour la France)
                     </a>
                 </li>
+                <li>
+                    <div class="box_list_title">AZ Reso <sup title="Partenaire favoris">⭐</sup></div>
+                    <div class="box_list_description">
+                        Un artisan du pays Nantais à vos côtés.<br />AZ Reso vous accompagne dans tous vos projets
+                        d'électricité logements et tertiaires. Cabalage courant faible et courant fort, migration
+                        informatique, contrôle d'accès, sécurité électronique, video-surveillance intelligente, ... Neuf
+                        ou rénovation, du logement en passant par les plateaux de bureaux, AZ Reso vous conseillera, et
+                        réalisera vos projets avec sérieux et professionnalisme.<br />Des équipes spécialisées à votre
+                        écoute pour transformer vos idées en solutions concrètes.
+                    </div>
+                    <a class="box_list_link" href="https://https://www.az-reso.fr" target="_blank" rel="noopener">
+                        https://www.az-reso.fr
+                    </a>
+                    <a class="box_list_link" href="https://www.google.com/search?q=az+reso+nantes" target="_blank"
+                        rel="noopener">
+                        Coordonnées (Google)
+                    </a>
 
+                </li>
             </ul>
         </div>