Add device/node/vlan/port specific search from Navbar

Netdisco/Changes

@@ -3,6 +3,7 @@
   [NEW FEATURES]
 
   * Add IP Phones discovered through LLDP/CDP report
+  * Add device/node/vlan/port specific search from Navbar
 
   [ENHANCEMENTS]
 

Netdisco/share/public/css/netdisco.css

@@ -8,15 +8,31 @@ body {
 
 .navbar-inner .container {
   background: url(../images/navbar_disco.png) no-repeat;
+  background-position: 13px 0px;
 }
 
-/* magnifying glass icon for search box */
+/* used for icons in sidebar search buttons */
 .nd_navbar-icon {
   vertical-align: sub;
   margin-top: 4px;
   cursor: pointer;
 }
 
+/* careful align of navbar search button and menu */
+.nd_navbar-search-group {
+  margin-top: 0px !important;
+}
+.nd_navbar-search-icon {
+  color: #999;
+  padding-left: 5px;
+  padding-right: 5px;
+}
+.nd_navbar-search-caret {
+  padding-top: 10px !important;
+  padding-left: 5px !important;
+  padding-right: 5px !important;
+}
+
 /* for the "logged in as..." text */
 .nd_navbar-text {
   color: #666;

Netdisco/share/public/javascripts/netdisco.js

@@ -179,6 +179,15 @@ $(document).ready(function() {
   $('#navsearchgo').click(function() {
     $('#navsearchgo').parents('form').submit();
   });
+  $('.nd_navsearchgo-specific').click(function(event) {
+    event.preventDefault();
+    console.log($(this).data('tab'));
+    $(this).parents('form').append(
+      $(document.createElement('input')).attr('type', 'hidden')
+                                        .attr('name', 'tab')
+                                        .attr('value', $(this).data('tab'))
+    ).submit();
+  });
 
   // fix green background on search checkboxes
   // https://github.com/twitter/bootstrap/issues/742

Netdisco/share/views/layouts/main.tt

@@ -87,10 +87,23 @@
       <form class="navbar-search pull-left" method="get" action="[% uri_for('/search') %]">
         <input placeholder="Find Anything" class="search-query span3"
           id="nq" name="q" type="text" autocomplete="off"/>
-        <span style="font-size: 24px;">
+        <div class="btn-group nd_navbar-search-group">
-          <i id="navsearchgo" class="icon-search nd_navbar-icon"
+          <button class="btn btn-inverse nd_navbar-search-icon">
-            rel="tooltip" data-placement="bottom" data-offset="5" data-title="New Search" data-container="body"></i>
+            <span style="font-size: 18px;">
-        </span>
+              <i id="navsearchgo" class="icon-search"
+                rel="tooltip" data-placement="bottom" data-offset="5" data-title="New Search" data-container="body"></i>
+            </span>
+          </button>
+          <button class="btn btn-inverse dropdown-toggle nd_navbar-search-caret" data-toggle="dropdown">
+            <span class="caret" style="border-top-color: #999; border-bottom-color: #999"></span>
+          </button>
+          <ul class="dropdown-menu">
+            <li><a class="nd_navsearchgo-specific" href="" data-tab="device">Search Devices</a></li>
+            <li><a class="nd_navsearchgo-specific" href="" data-tab="node">Search Nodes</a></li>
+            <li><a class="nd_navsearchgo-specific" href="" data-tab="vlan">Search VLANs</a></li>
+            <li><a class="nd_navsearchgo-specific" href="" data-tab="port">Search Ports</a></li>
+          </ul>
+        </div>
       </form>
       [% IF user_has_role('admin') %]
       <ul class="nav">