Let the user know when there are no matches.

2 files changed, 17 insertions, 0 deletions

diff --git a/pydis_site/static/css/resources/resources.css b/pydis_site/static/css/resources/resources.css
index c6347eab..218d9a59 100644
--- a/pydis_site/static/css/resources/resources.css
+++ b/pydis_site/static/css/resources/resources.css
@@ -15,6 +15,12 @@
     padding:0
 }
 
+/* Hide the no resources h2 by default */
+h2.no-resources-found {
+    display: none;
+    margin-top: 1em;
+}
+
 /* Disable clicking on the checkbox itself. */
 /* Instead, we want to let the anchor tag handle clicks. */
 .filter-checkbox {
diff --git a/pydis_site/static/js/resources.js b/pydis_site/static/js/resources.js
index c9ce408b..89b8ae06 100644
--- a/pydis_site/static/js/resources.js
+++ b/pydis_site/static/js/resources.js
@@ -112,6 +112,8 @@ function updateUI() {
     }
 
     // Otherwise, hide everything and then filter the resources to decide what to show.
+    let hasMatches = false;
+    console.log(hasMatches);
     resources.hide();
     resources.filter(function() {
         let validation = {
@@ -140,11 +142,20 @@ function updateUI() {
 
         // If validation passes, show the resource.
         if (Object.values(validation).every(Boolean)) {
+            hasMatches = true;
             return true;
         } else {
             return false;
         }
     }).show();
+
+    // If there are no matches, show the no matches message
+    console.log(hasMatches);
+    if (!hasMatches) {
+        $(".no-resources-found").show();
+    } else {
+        $(".no-resources-found").hide();
+    }
 }
 
 // Executed when the page has finished loading.