From f964beacda200ccd9ce2f1b763971ffe2396efcb Mon Sep 17 00:00:00 2001
From: Janani Manikandan <124059957+Janani-m17@users.noreply.github.com>
Date: Fri, 31 May 2024 23:18:24 +0530
Subject: [PATCH] Displayed No results found message (#1015)

---
 index.html |  4 ++++
 script.js  | 15 +++++++++++++--
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 63ce30a25..7bb695282 100644
--- a/index.html
+++ b/index.html
@@ -2500,6 +2500,10 @@ <h3>Calculates the linear density of the yarn from unit system to another.</h3>
                 </div>
             </div>
         </div>
+
+        <br><br><br><br><br>
+        <div id="noResults" style="color: white; font-weight: bold; font-size: 18px;"><p>No results found 🙃</p></div>
+
     </div>
 
     <!-- Calculator Section Ends Here  -->
diff --git a/script.js b/script.js
index 0c4cf0138..fdc3c1e70 100644
--- a/script.js
+++ b/script.js
@@ -111,8 +111,8 @@ function filterCalculators() {
     input = document.getElementById('calculatorSearch');
     filter = input.value.toUpperCase();
     calculators = document.querySelectorAll('.container .box');
-    console.log(filter)
-    console.log(calculators)
+    var noResults = document.getElementById('noResults');
+    var hasResults = false;
 
     for (i = 0; i < calculators.length; i++) {
         var calculator = calculators[i];
@@ -121,12 +121,23 @@ function filterCalculators() {
 
         if (calculatorName.toUpperCase().indexOf(filter) > -1) {
             calculator.style.display = "flex";
+            hasResults = true;
         } else {
             calculator.style.display = "none";
         }
     }
+
+    if (hasResults) {
+        noResults.style.display = 'none';
+    } else {
+        noResults.style.display = 'block';
+    }
 }
 
+document.addEventListener('DOMContentLoaded', function() {
+    document.getElementById('noResults').style.display = 'none';
+});
+
 // Voice command in search bar feature
 const searchBar = document.querySelector("#searchBar");
 const searchBarInput = searchBar.querySelector("input");