Added feedback message when query returns no results.

diff --git a/src/_includes/icons/filter.html b/src/_includes/icons/filter.html
index c639c1d8fb8fe6432c51bb8e47aef54bf87e20c9..689f063ea825f45688ed997d096acf0846a697a6 100644 (file)
--- a/src/_includes/icons/filter.html
+++ b/src/_includes/icons/filter.html
@@ -20,5 +20,9 @@
     </div>
     {% endfor %}
   </div>
+  <div id="no-search-results">
+    <div class="alert alert-danger" role="alert"><i class="fa fa-ban"></i> No icons with the tag <strong>'<span></span>'</strong> were found.</div>
+    <div class="alert alert-info" role="alert"><i class="fa fa-exclamation-circle"></i> Tags are added by the community. Do you think your search query should return an icon? Send a pull request on <a href="https://github.com/FortAwesome/Font-Awesome">GitHub</a>!</div>
+  </div>
 
 </{% if page.navbar_active == "icons" %}div{% else %}section{% endif %}>

diff --git a/src/assets/js/site.js b/src/assets/js/site.js
index de23d25ae2dd74afafb4c85b48c8b11089898d11..4e0a9be388faf24e1d6ecd5245304c1d9f69273c 100644 (file)
--- a/src/assets/js/site.js
+++ b/src/assets/js/site.js
@@ -10,6 +10,7 @@ $(function() {
     var $filter = $('#filter');
     var $other = $('#new, #web-application, #form-control, #medical, #currency, #text-editor, #directional, #video-player, #brand, #file-type, #spinner, #payment, #chart');
     var $clear = $('#filter-clear');
+    var $no_results = $('#no-search-results');
 
     var $icons = $('.filter-icon', $filter);
 
@@ -29,10 +30,21 @@ $(function() {
 
       if(!val) return;
 
+      var resultsCount = 0;
       $icons.each(function() {
         var show = $(this).attr('data-filter').match(' '+val);
+        if( show ) resultsCount++;
         $(this).toggle(!!show);
       });
+
+      console.log(resultsCount);
+
+      if( resultsCount == 0 && val.length != 0 ) {
+        $no_results.find('span').text(val);
+        $no_results.show();
+      } else {
+        $no_results.hide();
+      }
     }).trigger('keyup');
   }
 

diff --git a/src/assets/less/site/lazy.less b/src/assets/less/site/lazy.less
index fb5a9745ac495fe53d798ba713ecce51301e4bd5..02d7ba30654fead7d58cf6606a9249923526a245 100644 (file)
--- a/src/assets/less/site/lazy.less
+++ b/src/assets/less/site/lazy.less
@@ -84,3 +84,7 @@
 .text-strike { text-decoration: line-through; }
 .text-upper { text-transform: uppercase; }
 .text-lower { text-transform: lowercase; }
+
+#no-search-results {
+  display: none;
+}