From 389ccbaf8c735a2925b97dc87ae5887f69bc9a81 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?F=C3=A9lix=20MARQUET?= <fpmovie4@gmail.com>
Date: Sun, 28 May 2023 09:34:10 +0100
Subject: [PATCH] Add of the press enter to search

---
 publications.html                 |  4 +--
 src/css/style_publications.css    |  2 ++
 src/js/publication/publication.js | 44 +++++++++++++++++++++++--------
 3 files changed, 37 insertions(+), 13 deletions(-)

diff --git a/publications.html b/publications.html
index 191c1d3..f371444 100644
--- a/publications.html
+++ b/publications.html
@@ -48,8 +48,8 @@
   <button class="button" onclick="revue()">Article de revue</button>
   <button class="button" onclick="communication()">Communication</button>
   <button class="button" onclick="reset()">Toutes</button>
-  <input type="text" id="entry_text" placeholder="Saisir texte">
-  <button class="button" id="search_button" onclick="search()">Rechercher</button>
+  <input type="text" id="entry_text" placeholder="Saisir texte" onkeypress="search(event)">
+  <button class="button" id="search_button" onclick="search(event)">Rechercher</button>
 </div>
  <div class="publi">
     <p><img src="src/img/publications/pink square.png" alt="pink square" class="squares">
diff --git a/src/css/style_publications.css b/src/css/style_publications.css
index 40140e3..8ca6da9 100644
--- a/src/css/style_publications.css
+++ b/src/css/style_publications.css
@@ -34,6 +34,8 @@ img{
     font-size: 16px;
     margin-right: 10px;
     margin-left: 10px;
+    border-radius: 20px;
+    cursor: pointer;
 }
 
 .publi{
diff --git a/src/js/publication/publication.js b/src/js/publication/publication.js
index eeeb460..c478954 100644
--- a/src/js/publication/publication.js
+++ b/src/js/publication/publication.js
@@ -1,20 +1,42 @@
-function search() {
-  const searchInput = document.getElementById('entry_text');
-  const searchTerm = searchInput.value.trim().toLowerCase();  // on récupère le terme recherché en minuscule
-  const paragraphs = document.querySelectorAll('.publi p');   // on prend tous les paragraphes
+function search(event) {
+  //ajout de la fonction entrée pour la recherche
+  if(event.key === 'Enter'){
+    const searchInput = document.getElementById('entry_text');
+    const searchTerm = searchInput.value.trim().toLowerCase();  // on récupère le terme recherché en minuscule
+    const paragraphs = document.querySelectorAll('.publi p');   // on prend tous les paragraphes
 
-  for (let i = 0; i < paragraphs.length; i++) {  // boucle qui parcourt tous les paragraphes
-    const paragraph = paragraphs[i];
-    const paragraphText = paragraph.textContent.toLowerCase(); // on récupère le texte du paragraphe en minuscule
+    for (let i = 0; i < paragraphs.length; i++) {  // boucle qui parcourt tous les paragraphes
+      const paragraph = paragraphs[i];
+      const paragraphText = paragraph.textContent.toLowerCase(); // on récupère le texte du paragraphe en minuscule
 
-    if (paragraphText.includes(searchTerm)) {   //on cherche si le texte du paragraphe contient le terme recherché
-      paragraph.style.display = 'block';      // si oui, on affiche le paragraphe
-    } else {
-      paragraph.style.display = 'none';    // sinon, on le cache
+      if (paragraphText.includes(searchTerm)) {   //on cherche si le texte du paragraphe contient le terme recherché
+        paragraph.style.display = 'block';      // si oui, on affiche le paragraphe
+      } else {
+        paragraph.style.display = 'none';    // sinon, on le cache
+      }
+    }
+  }
+  //ajout de la fonction click pour la recherche
+  else{
+    const searchInput = document.getElementById('entry_text');
+    const searchTerm = searchInput.value.trim().toLowerCase();  // on récupère le terme recherché en minuscule
+    const paragraphs = document.querySelectorAll('.publi p');   // on prend tous les paragraphes
+
+    for (let i = 0; i < paragraphs.length; i++) {  // boucle qui parcourt tous les paragraphes
+      const paragraph = paragraphs[i];
+      const paragraphText = paragraph.textContent.toLowerCase(); // on récupère le texte du paragraphe en minuscule
+
+      if (paragraphText.includes(searchTerm)) {   //on cherche si le texte du paragraphe contient le terme recherché
+        paragraph.style.display = 'block';      // si oui, on affiche le paragraphe
+      } else {
+        paragraph.style.display = 'none';    // sinon, on le cache
+      }
     }
   }
 }
 
+
+
 function revue(){
   const searchTerm = 'pink square';   // recherche de 'pink square'
   const paragraphs = document.querySelectorAll('.publi p'); // on prend tous les paragraphes