implement user settable layer-three service for pseudo devices

lib/App/Netdisco/Web/Plugin/AdminTask/PseudoDevice.pm

@@ -36,7 +36,7 @@ ajax '/ajax/control/admin/pseudodevice/add' => require_role admin => sub {
           ip => param('ip'),
           dns => param('dns'),
           vendor => 'netdisco',
-          layers => '00000100',
+          layers => param('layers'),
           last_discover => \'now()',
         });
       return unless $device;
@@ -87,6 +87,9 @@ ajax '/ajax/control/admin/pseudodevice/update' => require_role admin => sub {
               })->delete;
           }
       }
+
+      # also set layers
+      $device->update({layers => param('layers')});
     });
 };
 

share/public/css/netdisco.css

@@ -245,6 +245,13 @@ td > form.nd_inline-form {
   text-decoration: none;
 }
 
+/* badge for pseudo devices layer three toggle */
+.nd_layer-three-link {
+  text-decoration: none !important;
+  display: inline-block;
+  margin-left: -4px;
+}
+
 /* for the job control admin page play/pause links */
 #nd_countdown-refresh:hover, #nd_countdown-control:hover {
   text-decoration: none;

share/views/ajax/admintask/pseudodevice.tt

@@ -4,6 +4,7 @@
       <th class="nd_center-cell">Device Name</th>
       <th class="nd_center-cell">Device IP</th>
       <th class="nd_center-cell">Number of Ports</th>
+      <th class="nd_center-cell">Services</th>
       <th class="nd_center-cell">Action</th>
     </tr>
   </thead>
@@ -12,6 +13,11 @@
       <td class="nd_center-cell"><input data-form="add" name="dns" type="text"></td>
       <td class="nd_center-cell"><input data-form="add" name="ip" type="text"></td>
       <td class="nd_center-cell"><input data-form="add" name="ports" type="number"></td>
+      <td class="nd_center-cell">
+        <span class="badge">&nbsp;</span><span class="badge">&nbsp;</span>
+        <a class="nd_layer-three-link" href="#"><span class="badge">3</span></a><span class="badge">&nbsp;</span><span class="badge">&nbsp;</span><span class="badge">&nbsp;</span><span class="badge">&nbsp;</span>
+        <input data-form="add" name="layers" type="hidden" value="00000000">
+      </td>
       <td class="nd_center-cell">
         <button class="btn btn-small nd_adminbutton" name="add" type="submit"><i class="icon-plus-sign"></i> Add</button>
       </td>
@@ -26,6 +32,16 @@
       <td class="nd_center-cell">
         <input data-form="update" name="ports" type="number" value="[% row.port_count | html_entity %]">
       </td>
+      <td class="nd_center-cell">
+        [% d.layers.substr(7,1) ? '<span class="badge badge-success">1</span>' : '<span class="badge">&nbsp;</span>' %]
+        [% d.layers.substr(6,1) ? '<span class="badge badge-success">2</span>' : '<span class="badge">&nbsp;</span>' %]
+        <a class="nd_layer-three-link" href="#"><span class="badge[% ' badge-success' IF row.layers.substr(5,1) %]">3</span></a>
+        [% d.layers.substr(4,1) ? '<span class="badge badge-success">4</span>' : '<span class="badge">&nbsp;</span>' %]
+        [% d.layers.substr(3,1) ? '<span class="badge badge-success">5</span>' : '<span class="badge">&nbsp;</span>' %]
+        [% d.layers.substr(2,1) ? '<span class="badge badge-success">6</span>' : '<span class="badge">&nbsp;</span>' %]
+        [% d.layers.substr(1,1) ? '<span class="badge badge-success">7</span>' : '<span class="badge">&nbsp;</span>' %]
+        <input data-form="update" name="layers" type="hidden" value="[% row.layers | html_entity %]">
+      </td>
       <td class="nd_center-cell">
         <input data-form="update" name="dns" type="hidden" value="[% row.dns | html_entity %]">
         <input data-form="update" name="ip" type="hidden" value="[% row.ip | html_entity %]">
@@ -68,6 +84,17 @@ $(document).ready(function() {
       } ],
 [% INCLUDE 'ajax/datatabledefaults.tt' -%]
   } );
+  $('.nd_layer-three-link').click(function() {
+    var badge = $(this).children('span').first();
+    var layers = $(this).parent().children('input').first();
+    $(badge).toggleClass('badge-success');
+    if ($(badge).hasClass('badge-success')) {
+      $(layers).attr('value', '00000100');
+    }
+    else {
+      $(layers).attr('value', '00000000');
+    }
+  });
 } );
 </script>