From 9e9d40885701cc6e38e490e1551f29a01a5794e2 Mon Sep 17 00:00:00 2001
From: Oliver Gorwits <oliver@cpan.org>
Date: Mon, 9 Jan 2012 10:58:28 +0000
Subject: [PATCH] highlight active search filters in green

---
 Netdisco/public/css/style.css       |  9 ++++++++
 Netdisco/views/inc/js/search.js     | 32 +++++++++++++++++++++++++++++
 Netdisco/views/inc/search/device.tt | 10 ++++-----
 3 files changed, 46 insertions(+), 5 deletions(-)

diff --git a/Netdisco/public/css/style.css b/Netdisco/public/css/style.css
index fa34c431..9aed99a5 100644
--- a/Netdisco/public/css/style.css
+++ b/Netdisco/public/css/style.css
@@ -3,6 +3,15 @@ body {
   padding-top: 50px;
 }
 
+/* the bootstrap style is only set for input */
+/* also make the green a little more bold */
+form .clearfix.success select {
+  border-color: green;
+}
+form .clearfix.success input {
+  border-color: green;
+}
+
 .well {
   margin-right: 15px;
 }
diff --git a/Netdisco/views/inc/js/search.js b/Netdisco/views/inc/js/search.js
index c87ada15..8a274ca7 100644
--- a/Netdisco/views/inc/js/search.js
+++ b/Netdisco/views/inc/js/search.js
@@ -72,4 +72,36 @@
       $(this).parents('.add-on').toggleClass('active', $(this).is(':checked'));
     };
     $('.add-on :checkbox').each(syncCheckBox).click(syncCheckBox);
+
+    // highlight active search filters in green
+    // there must be a way to factor this out to a func but my JS is weak :-/
+
+    $("form .clearfix input").not("[name=q]").each(function() {
+      if ($(this).val() === "") {
+        $(this).parent(".clearfix").removeClass('success');
+      } else {
+        $(this).parent(".clearfix").addClass('success');
+      }
+    });
+    $("form .clearfix input").not("[name=q]").change(function() {
+      if ($(this).val() === "") {
+        $(this).parent(".clearfix").removeClass('success');
+      } else {
+        $(this).parent(".clearfix").addClass('success');
+      }
+    });
+    $("form .clearfix select").each(function() {
+      if ($(this).find(":selected").length === 0) {
+        $(this).parent(".clearfix").removeClass('success');
+      } else {
+        $(this).parent(".clearfix").addClass('success');
+      }
+    });
+    $("form .clearfix select").change(function() {
+      if ($(this).find(":selected").length === 0) {
+        $(this).parent(".clearfix").removeClass('success');
+      } else {
+        $(this).parent(".clearfix").addClass('success');
+      }
+    });
   });
diff --git a/Netdisco/views/inc/search/device.tt b/Netdisco/views/inc/search/device.tt
index e8bab501..a40137e6 100644
--- a/Netdisco/views/inc/search/device.tt
+++ b/Netdisco/views/inc/search/device.tt
@@ -2,27 +2,27 @@
             <p><em>Device Search Options</em></p>
             <div class="clearfix">
               <input class="span3" placeholder="System Name"
-                type="text" id="name" name="name"
+                type="text" id="name" name="name" value="[% params.name %]"
                 rel="twipsy" data-placement="right" data-offset="5" title="System Name"/>
             </div>
             <div class="clearfix">
               <input class="span3" placeholder="Location"
-                type="text" id="location" name="location"
+                type="text" id="location" name="location" value="[% params.location %]"
                 rel="twipsy" data-placement="right" data-offset="5" title="Location"/>
             </div>
             <div class="clearfix">
               <input class="span3" placeholder="DNS"
-                type="text" id="dns" name="dns"
+                type="text" id="dns" name="dns" value="[% params.dns %]"
                 rel="twipsy" data-placement="right" data-offset="5" title="DNS"/>
             </div>
             <div class="clearfix">
               <input class="span3" placeholder="IP Address"
-                type="text" id="ip" name="ip"
+                type="text" id="ip" name="ip" value="[% params.ip %]"
                 rel="twipsy" data-placement="right" data-offset="5" title="IP Address"/>
             </div>
             <div class="clearfix">
               <input class="span3" placeholder="Description"
-                type="text" id="description" name="description"
+                type="text" id="description" name="description" value="[% params.description %]"
                 rel="twipsy" data-placement="right" data-offset="5" title="Description"/>
             </div>
             <div class="clearfix">