From a89a4f2315af3d5913d9fb83a64ed4fda430e170 Mon Sep 17 00:00:00 2001
From: Florian SYLVAIN <f.salututo@gmail.com>
Date: Thu, 6 Jan 2022 14:31:11 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Improving=20filters?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ProjetProgWeb/app.js         | 37 +++++++++++++++++++-----------------
 ProjetProgWeb/class/dump.php | 14 ++++++++++++--
 ProjetProgWeb/navbar.php     |  3 ++-
 ProjetProgWeb/stylesheet.css |  7 +++++++
 4 files changed, 41 insertions(+), 20 deletions(-)

diff --git a/ProjetProgWeb/app.js b/ProjetProgWeb/app.js
index 2cdc1f5..007d543 100644
--- a/ProjetProgWeb/app.js
+++ b/ProjetProgWeb/app.js
@@ -146,7 +146,8 @@ function displayResults(results) {
 
             let qTitle = elem[2]
             let title = document.createElement('p')
-            title.innerText = qTitle
+            pre_replacement = new RegExp(searchString, 'gi').exec(qTitle)
+            title.innerHTML = qTitle.replace(pre_replacement, `<mark>${pre_replacement}</mark>`)
 
             let firstElement = document.createElement('div')
             firstElement.classList.add('result-element-header')
@@ -187,7 +188,7 @@ function displayResults(results) {
         })
 
         let nb = document.createElement("p")
-        nb.innerHTML = `Nombre de résultats pour "${searchString}": 
+        nb.innerHTML = `Nombre de résultats en ${queryOption} pour "${searchString}": 
             ${new Intl.NumberFormat('fr-FR', { maximumSignificantDigits: 3 }).format(count)}.`
         resultsCount.appendChild(nb)
 
@@ -245,21 +246,23 @@ function realTimeDisplay() {
         fetch(`api.php?q=suggestion&search=${search}&option=${queryOption}`)
             .then(response => response.json())
             .then(results => {
-                suggestions.innerHTML = ""
-                if (!results.data.length) {
-                    hideSuggestions()
-                } else if (document.activeElement === searchBar) {
-                    showSuggestions()
-                }
-                results.data.forEach(elem => {
-                    let name = document.createElement('p')
-                    name.innerHTML = elem
-                    name.addEventListener('click', () => {
-                        searchBar.value = elem
-                        apiRequestThese(elem)
+                if (results.data) {
+                    suggestions.innerHTML = ""
+                    if (!results.data.length) {
+                        hideSuggestions()
+                    } else if (document.activeElement === searchBar) {
+                        showSuggestions()
+                    }
+                    results.data.forEach(elem => {
+                        let name = document.createElement('p')
+                        name.innerHTML = elem
+                        name.addEventListener('click', () => {
+                            searchBar.value = elem
+                            apiRequestThese(elem)
+                        })
+                        suggestions.appendChild(name)
                     })
-                    suggestions.appendChild(name)
-                })
+                }
             })
     }
 }
@@ -325,7 +328,7 @@ document.addEventListener('click', e => {
             toggleSwitch = e.target.firstElementChild
             toggleSwitchParent = e.target
         }
-        if (toggleSwitch !== null) {
+        if (toggleSwitch !== null && toggleSwitchParent !== null) {
             if (toggleSwitch.classList.contains('untoggle')) {
                 toggleSwitchParent.style.backgroundColor = '#FFF'
                 toggleSwitch.classList.replace('untoggle', 'toggle')
diff --git a/ProjetProgWeb/class/dump.php b/ProjetProgWeb/class/dump.php
index 4b43033..a6c4812 100644
--- a/ProjetProgWeb/class/dump.php
+++ b/ProjetProgWeb/class/dump.php
@@ -55,7 +55,7 @@ class dump {
         return $theses_array;
     }
 
-    public static function getSuggestions(string $search, string $option) : array {
+    public static function getSuggestions(string $search, string $option) : ?array {
         $array = [];
 
         $search = '%' . $search . '%';
@@ -63,7 +63,17 @@ class dump {
         $pdo_obj = new conf();
         $pdo = $pdo_obj->getPDO();
 
-        $stmt = $pdo->prepare("SELECT DISTINCT author FROM theses WHERE author LIKE :search LIMIT 10;");
+        if ($option == 'auto') {
+            return null;
+        }
+
+        $stmt = match ($option) {
+            'author' => $pdo->prepare("SELECT DISTINCT author FROM theses WHERE author LIKE :search LIMIT 10;"),
+            'title' => $pdo->prepare("SELECT DISTINCT title FROM theses WHERE title LIKE :search LIMIT 5;"),
+            'director' => $pdo->prepare("SELECT DISTINCT these_director FROM theses WHERE these_director LIKE :search LIMIT 10;"),
+            'establishment' => $pdo->prepare("SELECT DISTINCT soutenance_establishment FROM theses WHERE soutenance_establishment LIKE :search LIMIT 10;"),
+            default => "",
+        };
         $stmt->bindParam(':search', $search, PDO::PARAM_STR, 100);
         $stmt->execute();
 
diff --git a/ProjetProgWeb/navbar.php b/ProjetProgWeb/navbar.php
index e922daa..920e0ad 100644
--- a/ProjetProgWeb/navbar.php
+++ b/ProjetProgWeb/navbar.php
@@ -7,7 +7,7 @@
             <path id="crossSvg" class="spin-fade" d="M23.954 21.03l-9.184-9.095 9.092-9.174-2.832-2.807-9.09 9.179-9.176-9.088-2.81 2.81 9.186 9.105-9.095 9.184 2.81 2.81 9.112-9.192 9.18 9.1z"/>
         </svg>
 
-        <h1 id="title">theses.fr</h1>
+        <h1 id="title"><a href="/projet_programmation_web/ProjetProgWeb/">theses.fr</a></h1>
 
         <div class="research-section">
             <form class="navbar-form" method="GET" action="index.php">
@@ -28,6 +28,7 @@
             <h3>Filtres : </h3>
             <div class="filters">
                 <p id="f-auto">Auto</p>
+                <p id="f-title">Titre</p>
                 <p id="f-author">Auteur</p>
                 <p id="f-director">Directeur</p>
                 <p id="f-establishment">Etablissement</p>
diff --git a/ProjetProgWeb/stylesheet.css b/ProjetProgWeb/stylesheet.css
index 0d9a46f..405cfec 100644
--- a/ProjetProgWeb/stylesheet.css
+++ b/ProjetProgWeb/stylesheet.css
@@ -27,6 +27,13 @@ header {
     height: 75px;
 }
 
+#title a {
+    text-decoration: none;
+    color: inherit;
+    font-size: inherit;
+    font-family: inherit;
+}
+
 .navbar {
     position: relative;
     z-index: 50;