nouvel article, boutons dans les builders, makeArticleNode, JS MAJ page, tri quand déplacement ou suppression

14 files changed, 173 insertions, 32 deletions

diff --git a/public/css/main.css b/public/css/main.css
index 50c2173..cb44e16 100644
--- a/public/css/main.css
+++ b/public/css/main.css
@@ -28,8 +28,8 @@ section > p /* boutons spéciaux mode admin */
 }
 .galery_photos .html_from_editor img
 {
-        max-width: 400px;
-        max-height: 250px;
+        max-width: 300px;
+        max-height: 200px;
 }
 article
 {
@@ -50,6 +50,11 @@ article .logo2
 {
         width: 100%;
 }
+article img
+{
+        max-width: 100%;
+        height: auto;
+}
 .new_content_text
 {
         max-height: 250px;
@@ -120,4 +125,9 @@ main button:hover
         cursor: pointer; /* curseur qui pointe du doigt */
         background-color: #ffff00;
         border-radius: 4px;
+}
+
+article a:hover
+{
+        cursor: pointer;
 }
\ No newline at end of file
diff --git a/public/css/trombinoscope.css b/public/css/trombinoscope.css
index f42dad8..357e6b0 100644
--- a/public/css/trombinoscope.css
+++ b/public/css/trombinoscope.css
@@ -1,4 +1,10 @@
 article img
 {
         border-radius: 50%;
+}
+
+.grid_columns
+{
+        /* écrase les 3 colonnes par défaut */
+  grid-template-columns: repeat(4, 1fr);
 }
\ No newline at end of file
diff --git a/public/images/SAR_Constructions.jpg b/public/images/SAR_Constructions.jpg
new file mode 100644
index 0000000..1b9cb81
--- /dev/null
+++ b/public/images/SAR_Constructions.jpg
diff --git a/public/images/Ysoline Rabin.jpg b/public/images/Ysoline Rabin.jpg
new file mode 100644
index 0000000..2ecfcc4
--- /dev/null
+++ b/public/images/Ysoline Rabin.jpg
diff --git a/public/images/beatrice_carre.jpg b/public/images/beatrice_carre.jpg
new file mode 100644
index 0000000..8db4036
--- /dev/null
+++ b/public/images/beatrice_carre.jpg
diff --git a/public/images/eaulibre.jpg b/public/images/eaulibre.jpg
new file mode 100644
index 0000000..02b1917
--- /dev/null
+++ b/public/images/eaulibre.jpg
diff --git a/public/images/frank_pouliquen.jpg b/public/images/frank_pouliquen.jpg
new file mode 100644
index 0000000..7bb3ead
--- /dev/null
+++ b/public/images/frank_pouliquen.jpg
diff --git a/public/images/leclerc_bigouden.png b/public/images/leclerc_bigouden.png
new file mode 100644
index 0000000..596ead7
--- /dev/null
+++ b/public/images/leclerc_bigouden.png
diff --git a/public/images/silhouette nageur.jpg b/public/images/silhouette nageur.jpg
new file mode 100644
index 0000000..526cc0f
--- /dev/null
+++ b/public/images/silhouette nageur.jpg
diff --git a/public/images/silhouette nageuse.jpg b/public/images/silhouette nageuse.jpg
new file mode 100644
index 0000000..e4f7307
--- /dev/null
+++ b/public/images/silhouette nageuse.jpg
diff --git a/public/images/yves_pouliquen.jpg b/public/images/yves_pouliquen.jpg
new file mode 100644
index 0000000..435c69e
--- /dev/null
+++ b/public/images/yves_pouliquen.jpg
diff --git a/public/index.php b/public/index.php
index 3c6f261..2512d6d 100644
--- a/public/index.php
+++ b/public/index.php
@@ -69,9 +69,9 @@ elseif(isset($_GET['action']) && $_GET['action'] === 'modif_mdp')
 }
 
 // -- contrôleurs --
-$director = new Director($entityManager);
+$director = new Director($entityManager, true);
 $director->makeRootNode($id);
-$node = $director->getRootNode();
+$node = $director->getNode();
 
 // -- vues --
 $view_builder = new ViewBuilder($node);
diff --git a/public/js/main.js b/public/js/main.js
index 1351fea..c05eb2f 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -30,10 +30,10 @@ function copyInClipBoard(link){
 }
 
 // complète les fonctions dans tinymce.js
-function switchPositions(articleId, direction)
+function switchPositions(article_id, direction)
 {
-        const current_article = document.getElementById(articleId).parentElement.parentElement;
-        var other_article = current_article;
+        const current_article = findParent(document.getElementById(article_id), 'article');
+        var other_article;
 
         if(direction == 'down'){
                 other_article = current_article.nextElementSibling;
@@ -41,14 +41,23 @@ function switchPositions(articleId, direction)
         else if(direction == 'up'){
                 other_article = current_article.previousElementSibling;
         }
-        const other_article_id = other_article.querySelector('div[id]').id;
+        
+        var other_article_id;
+        try{
+                other_article_id = other_article.querySelector('div[id]').id;
+                other_article_id = 'i' + other_article_id.slice(1); // peut mieux faire
+        }
+        catch(error){
+                console.log('Inversion impossible');
+                return;
+        }
         
     fetch('index.php?action=switch_positions', {
         method: 'POST',
         headers: {
         'Content-Type': 'application/json'
         },
-        body: JSON.stringify({ id1: articleId, id2: other_article_id })
+        body: JSON.stringify({ id1: article_id, id2: other_article_id })
     })
     .then(response => response.json())
     .then(data => {
@@ -155,4 +164,15 @@ function submitDate(id_date)
     .catch(error => {
         console.error('Erreur:', error);
     });
+}
+
+function findParent(element, tag_name) {
+    while (element !== null) {
+        if (element.tagName === tag_name.toUpperCase()) // tagName est en majuscules
+        {
+            return element;
+        }
+        element = element.parentElement;
+    }
+    return null;
 }
\ No newline at end of file
diff --git a/public/js/tinymce.js b/public/js/tinymce.js
index d3c9739..cb1938a 100644
--- a/public/js/tinymce.js
+++ b/public/js/tinymce.js
@@ -1,15 +1,26 @@
 let editors = {};
 
 function openEditor(id, page = '') {
-    const real_id = 'i' + id.slice(1);
+    var creation_mode;
+    var real_id;
+    var article;
 
-    // Récupérer et sauvegarder le contenu d'origine de l'article
-    const articleContent = document.getElementById(id).innerHTML;
-    document.getElementById(id).setAttribute('data-original-content', articleContent);
+    // création ou modification d'un article?
+    if(id[0] === 'n'){
+        creation_mode = true;
+        article = document.getElementById(id);
+    }
+    else{
+        creation_mode = false;
+        // Récupérer et sauvegarder le contenu d'origine de l'article
+        real_id = 'i' + id.slice(1);
+        article = document.getElementById(id);
+        document.getElementById(id).setAttribute('data-original-content', article.innerHTML);
+    }
 
     tinymce.init({
         selector: `#${id}`,
-        language: 'fr_FR', // télécharger des paquets de langue ici: https://www.tiny.cloud/get-tiny/language-packages/
+        language: 'fr_FR', // téléchargement ici: https://www.tiny.cloud/get-tiny/language-packages/
         language_url: 'js/tinymce-langs/fr_FR.js', // ou installer tweeb/tinymce-i18n avec composer
         license_key: 'gpl',
         branding: false,
@@ -23,14 +34,18 @@ function openEditor(id, page = '') {
                 editors[id] = editor;
                 
                 // boutons "Modifier", "Supprimer", "déplacer vers le haut", "déplacer vers le bas", "Annuler" et "Soumettre"
-                document.querySelector(`#edit-${id}`).classList.add('hidden');
                 document.querySelector(`#cancel-${id}`).classList.remove('hidden');
                 document.querySelector(`#submit-${id}`).classList.remove('hidden');
-                document.querySelector(`#delete-${real_id}`).classList.add('hidden');
-                // boutons absents page article
-                if(page != 'article'){
-                    document.querySelector(`#position_up-${id}`).classList.add('hidden');
-                    document.querySelector(`#position_down-${id}`).classList.add('hidden');
+                if(creation_mode === false){
+                    document.querySelector(`#edit-${id}`).classList.add('hidden');
+                    document.querySelector(`#delete-${real_id}`).classList.add('hidden');
+                    if(page != 'article'){
+                        document.querySelector(`#position_up-${id}`).classList.add('hidden');
+                        document.querySelector(`#position_down-${id}`).classList.add('hidden');
+                    }
+                }
+                else{
+                    document.querySelector(`#new-${id}`).classList.add('hidden'); // id = new-new-id_node
                 }
             });
         },
@@ -60,7 +75,9 @@ function openEditor(id, page = '') {
     });
 
     // Remplacer le contenu de l'article par l'éditeur
-    document.getElementById(id).innerHTML = articleContent;
+    if(creation_mode === false){
+        document.getElementById(id).innerHTML = article.innerHTML;
+    }
 }
 
 function deleteArticle(id, page = '') {
@@ -100,33 +117,78 @@ function deleteArticle(id, page = '') {
     }
 }
 
-function closeEditor(id, page = '', display_old = true)
+function closeEditor(id, page = '', restore_old = true)
 {
-    const real_id = 'i' + id.slice(1);
+    var creation_mode;
+    var real_id;
+    var article;
+    var parent;
+
+    // création ou modification d'un article?
+    if(id[0] === 'n'){
+        creation_mode = true;
+    }
+    else{
+        creation_mode = false;
+    }
 
     // Fermer l'éditeur
     tinymce.remove(`#${id}`);
     delete editors[id];
     
+    if(creation_mode){
+        article = document.getElementById(id);
+        parent = findParent(article, 'section');
+    }
+    else{
+        real_id = 'i' + id.slice(1);
+    }
+
     // Restaurer le contenu d'origine de l'article
-    if(display_old){
+    if(restore_old){
         const originalContent = document.getElementById(id).getAttribute('data-original-content');
         document.getElementById(id).innerHTML = originalContent;
     }
 
-    // boutons "Modifier", "Supprimer", "déplacer vers le haut", "déplacer vers le bas", "Annuler" et "Soumettre"
-    document.querySelector(`#edit-${id}`).classList.remove('hidden');
+    // boutons: "Nouvel article", Modifier", "Supprimer", "déplacer vers le haut", "déplacer vers le bas", "Annuler" et "Valider"
     document.querySelector(`#cancel-${id}`).classList.add('hidden');
     document.querySelector(`#submit-${id}`).classList.add('hidden');
-    document.querySelector(`#delete-${real_id}`).classList.remove('hidden');
-    // boutons absents page article
+    if(creation_mode){
+        document.querySelector(`#new-${id}`).classList.remove('hidden'); // id = new-new-id_node
+    }
+    else{
+        document.querySelector(`#edit-${id}`).classList.remove('hidden');
+        if(page != 'article'){
+            document.querySelector(`#position_up-${id}`).classList.remove('hidden');
+            document.querySelector(`#position_down-${id}`).classList.remove('hidden');
+            document.querySelector(`#delete-${id}`).classList.remove('hidden');
+        }
+    }
     if(page != 'article'){
-        document.querySelector(`#position_up-${id}`).classList.remove('hidden');
+        /*document.querySelector(`#position_up-${id}`).classList.remove('hidden');
         document.querySelector(`#position_down-${id}`).classList.remove('hidden');
-    }    
+        document.querySelector(`#delete-${id}`).classList.remove('hidden');*/
+    }
+    else{
+        //document.querySelector(`#delete-${real_id}`).classList.remove('hidden');
+    }
+    
 }
 
-function submitArticle(id, page = '') {
+function submitArticle(id, page = '', clone = null) {
+    //var creation_mode;
+    if(id[0] === 'n'){
+        //creation_mode = true;
+
+        // sécurité
+        if(clone == null){
+            return;
+        }
+    }
+    else{
+        //creation_mode = false;
+    }
+
     // Récupérer l'éditeur correspondant à l'article
     const editor = editors[id];
     if(!editor) {
@@ -150,7 +212,50 @@ function submitArticle(id, page = '') {
         if (data.success) {
             // Fermer l'éditeur et mettre à jour le contenu de l'article
             closeEditor(id, page, false);
-            document.getElementById(id).innerHTML = html;
+            if(id[0] === 'n'){
+                var share_btn = document.querySelector(`.share.hidden`); // combinaison de deux classes
+                var new_btn = document.querySelector(`#new-${id}`);
+                var edit_btn = document.querySelector(`#edit-${id}`);
+                var pos_up_btn = document.querySelector(`#position_up-${id}`);
+                var pos_down_btn = document.querySelector(`#position_down-${id}`);
+                var delete_btn = document.querySelector(`#delete-${id}`);
+                var cancel_btn = document.querySelector(`#cancel-${id}`);
+                var submit_btn = document.querySelector(`#submit-${id}`);
+
+                share_btn.classList.remove('hidden')
+                new_btn.classList.add('hidden');
+                edit_btn.classList.remove('hidden');
+                pos_up_btn.classList.remove('hidden');
+                pos_down_btn.classList.remove('hidden');
+                delete_btn.classList.remove('hidden');
+                //cancel_btn.classList.add('hidden');
+                //submit_btn.classList.add('hidden');
+
+                var article = document.getElementById(id);
+                var parent = findParent(article, 'article');
+                //share_btn.setAttribute('href', '#' + data.article_id);
+                share_btn.setAttribute('onclick', "copyInClipBoard('" + window.location.href + data.article_id + "')"); // # de l'ancre ajouté au clic sur le lien ouvrant l'éditeur
+                article.id = data.article_id;
+                edit_btn.id = 'edit-' + data.article_id;
+                edit_btn.querySelector('.action_icon').setAttribute('onclick', "openEditor('" + data.article_id + "')");
+                pos_up_btn.id = 'position_up-' + data.article_id;
+                pos_up_btn.querySelector('.action_icon').setAttribute('onclick', "switchPositions('" + data.article_id + "', 'up')");
+                pos_down_btn.id = 'position_down-' + data.article_id;
+                pos_down_btn.querySelector('.action_icon').setAttribute('onclick', "switchPositions('" + data.article_id + "', 'down')");
+                delete_btn.id = 'delete-' + data.article_id;
+                delete_btn.querySelector('.action_icon').setAttribute('onclick', "deleteArticle('" + data.article_id + "')");
+                cancel_btn.id = 'cancel-' + data.article_id;
+                cancel_btn.querySelector('button').setAttribute('onclick', "closeEditor('" + data.article_id + "')");
+                submit_btn.id = 'submit-' + data.article_id;
+                submit_btn.querySelector('button').setAttribute('onclick', "submitArticle('" + data.article_id + "')");
+
+                var next_div = parent.nextElementSibling.nextElementSibling;
+                parent.parentNode.replaceChild(clone, parent);
+                next_div.appendChild(parent);
+            }
+            else{
+                //document.getElementById(id).innerHTML = html;
+            }
         }
         else {
             alert('Erreur lors de la sauvegarde de l\'article.');