Allow device port searching with preference for port/name/vlan

Netdisco/Changes

@@ -19,6 +19,9 @@
   * Port MAC query now only returns distinct MAC's
   * Keep a hint to SNMP community if new style snmp_auth config is in use
   * [#43] Add doc note about PostgreSQL MD5 authN
+  * [#49] Allow device port searching with preference for port/name/vlan.
+    This is to support some devices (HP?) which have plain numbers for port names
+    and Netdisco defaults to assuming this is a VLAN number (R. Kerr)
 
   [BUG FIXES]
 

Netdisco/lib/App/Netdisco/Web/Device.pm

@@ -146,6 +146,7 @@ hook 'before_template' => sub {
   my $self_uri = uri_for(request->path, scalar params);
   $self_uri->query_param_delete('q');
   $self_uri->query_param_delete('f');
+  $self_uri->query_param_delete('prefer');
   $tokens->{self_options} = $self_uri->query_form_hash;
 };
 

Netdisco/lib/App/Netdisco/Web/Plugin/Device/Ports.pm

@@ -12,6 +12,9 @@ register_device_tab({ tag => 'ports', label => 'Ports', provides_csv => 1 });
 # device ports with a description (er, name) matching
 get '/ajax/content/device/ports' => require_login sub {
     my $q = param('q');
+    my $prefer = param('prefer');
+    $prefer = ''
+      unless defined $prefer and $prefer =~ m/^(?:port|name|vlan)$/;
 
     my $device = schema('netdisco')->resultset('Device')
       ->search_for_device($q) or send_error('Bad device', 400);
@@ -20,7 +23,7 @@ get '/ajax/content/device/ports' => require_login sub {
     # refine by ports if requested
     my $f = param('f');
     if ($f) {
-        if ($f =~ m/^\d+$/) {
+        if (($prefer eq 'vlan') or not $prefer and $f =~ m/^\d+$/) {
             if (param('invert')) {
                 $set = $set->search({
                   'me.vlan' => { '!=' => $f },
@@ -57,7 +60,9 @@ get '/ajax/content/device/ports' => require_login sub {
                 $f = { '!=' => $f };
             }
 
-            if ($set->search({'me.port' => $f})->count) {
+            if (($prefer eq 'port') or not $prefer and
+                $set->search({'me.port' => $f})->count) {
+
                 $set = $set->search({'me.port' => $f});
             }
             else {

Netdisco/share/public/css/netdisco.css

@@ -526,12 +526,23 @@ td > form.nd_inline-form {
 }
 
 /* sidebar submit button width and spacing */
-.nd_sidebar button {
+
+/* when the sidebar submit button DOES NOT HAVE a dropdown */
+.nd_sidebar button:not(.nd_sidebar-btn-drop, .nd_sidebar-btn-drop-drop ) {
   margin-top: 9px;
   margin-left: -3px;
   width: 165px;
 }
 
+/* when the sidebar submit button HAS a dropdown */
+.nd_sidebar-btn-drop {
+  width: 138px;
+}
+.nd_sidebar-btn-drop-drop {
+  height: 28px;
+  width: 28px;
+}
+
 /* little icon inside of search input fields */
 .nd_field-clear-icon, .nd_field-copy-icon {
   position: absolute;

Netdisco/share/views/ajax/device/ports.tt

@@ -67,7 +67,7 @@
       <td nowrap>
       [% END %]
         <a class="nd_linkcell nd_this-port-only" href="[% uri_for('/device',
-            self_options) %]&q=[% params.q | uri %]&f=[% row.port | uri %]">
+            self_options) %]&q=[% params.q | uri %]&f=[% row.port | uri %]&prefer=port">
         [% row.port | html_entity %]
       </a></td>
       [% END %]

Netdisco/share/views/js/device.js

@@ -29,6 +29,7 @@
   $(document).ready(function() {
     var tab = '[% tab.tag %]'
     var target = '#' + tab + '_pane';
+    var portfilter = $('#ports_form').find("input[name=f]");
 
     // sidebar form fields should change colour and have trash/copy icon
     form_inputs.each(function() {device_form_state($(this))});
@@ -45,14 +46,25 @@
         .toggleClass('icon-chevron-up icon-chevron-down');
     });
 
+    // if the user edits the filter box, revert to automagical search
+    $('#ports_form').on('input', "input[name=f]", function() {
+      $('#nd_ports-form-prefer-field').attr('value', '');
+    });
+
     // handler for trashcan icon in port filter box
-    var portfilter = $('#ports_form').find("input[name=f]");
     $('.nd_field-clear-icon').click(function() {
       portfilter.val('');
       $('#ports_form').trigger('submit');
       device_form_state(portfilter); // will hide copy icons
     });
 
+    // allow port filter to have a preference for port/name/vlan
+    $('#ports_form').on('click', '.nd_device-port-submit-prefer', function() {
+      event.preventDefault();
+      $('#nd_ports-form-prefer-field').attr('value', $(this).data('prefer'));
+      $(this).parents('form').submit();
+    });
+
     // clickable device port names can simply resubmit AJAX rather than
     // fetch the whole page again.
     $('#ports_pane').on('click', '.nd_this-port-only', function(event) {
@@ -61,8 +73,11 @@
       var port = $(this).text();
       port = $.trim(port);
       portfilter.val(port);
-
       $('.nd_field-clear-icon').show();
+
+      // make sure we're preferring a port filter
+      $('#nd_ports-form-prefer-field').attr('value', 'port');
+
       $('#ports_form').trigger('submit');
       device_form_state(portfilter); // will hide copy icons
     });

Netdisco/share/views/sidebar/device/ports.tt

@@ -1,5 +1,6 @@
 
             <input name="q" value="[% params.q | html_entity %]" type="hidden"/>
+            <input id="nd_ports-form-prefer-field" name="prefer" value="[% params.prefer | html_entity %]" type="hidden"/>
             <div class="clearfix">
               <i class="nd_field-clear-icon icon-trash icon-large"
                  rel="tooltip" data-placement="bottom" data-offset="3" data-title="Show all Ports"
@@ -133,5 +134,17 @@
                 </ul>
               </div>
             </div>
-            <button id="[% tab.tag %]_submit" type="submit" class="btn btn-info">
+            <div class="btn-group">
-              <i class="icon-search icon-large pull-left nd_navbar-icon"></i> Update View</button>
+              <button id="[% tab.tag %]_submit" type="submit" class="btn btn-info nd_sidebar-btn-drop">
+                <i class="icon-search icon-large pull-left nd_navbar-icon"></i> Update View</button>
+              <button class="btn btn-info dropdown-toggle nd_sidebar-btn-drop-drop" data-toggle="dropdown">
+                <span class="caret"></span>
+              </button>
+              <ul class="dropdown-menu">
+                <li><a class="nd_device-port-submit-prefer" href="" data-prefer="">Default Search</a></li>
+                <li><a class="nd_device-port-submit-prefer" href="" data-prefer="port">Filter by Port</a></li>
+                <li><a class="nd_device-port-submit-prefer" href="" data-prefer="name">Filter by Name</a></li>
+                <li><a class="nd_device-port-submit-prefer" href="" data-prefer="vlan">Filter by VLAN</a></li>
+              </ul>
+            </div>
+