sidebar built from config, colvis defaults from sidebar

Netdisco/lib/App/Netdisco/Web.pm

@@ -84,6 +84,11 @@ hook 'before_template' => sub {
     $tokens->{$_} = $tokens->{$_}->path_query
       for qw/search_node search_device device_ports/;
 
+    # shorthand access to section and tabname
+    my @parts = split m{/}, request->path;
+    $tokens->{section} ||= $parts[-2];
+    $tokens->{tabname} ||= $parts[-1];
+
     # allow very long lists of ports
     $Template::Directive::WHILE_MAX = 10_000;
 

Netdisco/share/config.yml

@@ -88,31 +88,71 @@ table_showrecordsmenu:
 table_display:
   device:
     ports:
-      c_admin:      off
+      columns:
-      c_port:       on
+        - c_admin:
-      c_descr:      off
+            label:     'Port Controls'
-      c_type:       off
+            default:   false
-      c_duplex:     off
+            highlight: true
-      c_lastchange: off
+        - c_port:
-      c_name:       on
+            label:     'Port'
-      c_speed:      off
+            default:   true
-      c_mac:        off
+        - c_descr:
-      c_mtu:        off
+            label:     'Description'
-      c_pvid:       on
+            default:   false
-      c_vmember:    on
+        - c_type:
-      c_power:      off
+            label:     'Type'
-      c_ssid:       off
+            default:   false
-      c_nodes:      off
+        - c_duplex:
-      c_neighbors:  on
+            label:     'Duplex'
-      c_stp:        off
+            default:   false
-      c_up:         off
+        - c_lastchange:
-      n_age:        off
+            label:     'Last Change'
-      n_ip:         on
+            default:   false
-      n_netbios:    on
+        - c_name:
-      n_ssid:       on
+            label:     'Name'
-      n_vendor:     off
+            default:   true
-      n_archived:   off
+        - c_speed:
-      neigh_id:     off
+            label:     'Speed'
+            default:   false
+        - c_mac:
+            label:     'Port MAC'
+            default:   false
+        - c_mtu:
+            label:     'MTU'
+            default:   false
+        - c_pvid:
+            label:     'Native VLAN'
+            default:   true
+        - c_vmember:
+            label:     'VLAN Membership'
+            default:   true
+        - c_power:
+            label:     'PoE'
+            default:   false
+        - c_ssid:
+            label:     'SSID'
+            default:   false
+        - c_neighbors:
+            label:     'Connected Devices'
+            default:   true
+        - c_nodes:
+            label:     'Show Nodes'
+            default:   false
+        - c_stp:
+            label:     'Spanning Tree'
+            default:   false
+        - c_up:
+            label:     'Status'
+            default:   false
+      content:
+        c_nodes:      false
+        n_age:        false
+        n_ip:         true
+        n_netbios:    true
+        n_ssid:       true
+        n_vendor:     false
+        n_archived:   false
+        neigh_id:     false
 
 # -------------
 # NETDISCO CORE

Netdisco/share/public/javascripts/netdisco.js

@@ -50,6 +50,7 @@ function do_search (event, tab) {
         scrollingTop: 40
         ,useAbsolutePositioning: false
       });
+      global_inner_view_processing(tab);
       inner_view_processing(tab);
     }
   );
@@ -102,6 +103,38 @@ function update_content(from, to) {
   $(to_form).trigger("submit");
 }
 
+// called after every ajax, in case updating anything is required
+function global_inner_view_processing(tab) {
+  // find the current tab's datatables object
+  // then update sidebar checkboxes to hook the datatables colvis
+  var table   = $('#' + tab + '_pane').find('table').first();
+  var colvis  = new $.fn.dataTable.ColVis( table );
+  var columns = colvis.s.dt.aoColumns;
+
+  if ( $.inArray( 'all', colvis.s.exclude ) === -1 ) {
+      for ( var i=0, iLen=columns.length ; i<iLen ; i++ ) {
+          if ( $.inArray( i, colvis.s.exclude ) === -1 ) {
+              var button = colvis.dom.buttons.shift();
+
+              $(button).find('label').addClass('checkbox');
+              $(button).find('input').attr('id', columns[i]["name"]);
+              $(button).find('input').attr('name', columns[i]["name"]);
+
+              var target = $('#' + columns[i]["name"]);
+              $(button).find('span').text( target.closest('label').text() );
+              $(button).find('input').first().prop('checked', target.prop('checked'));
+
+              // need to re-activate tooltips on new content
+              $(button).click(function() {
+                $("[rel=tooltip]").tooltip({live: true});
+              });
+
+              target.closest('li').replaceWith( button );
+          }
+      }
+  }
+}
+
 // handler for ajax navigation
 if (window.History && window.History.enabled) {
   var History = window.History;

Netdisco/share/views/ajax/datatabledefaults.tt

@@ -11,23 +11,22 @@
     },
     "rowCallback": function (row, data) {
       // update in-cell content based on current sidebar settings
-      [% FOREACH key IN settings.table_display.device.ports.keys %]
+      $('.nd_dynamic-dp').each( function() {
-      if ($('#dp-data-table').DataTable().column('[% key %]:name').length === 0) {
+        $(row).find('span.' + $(this).attr('id')).toggle( $(this).prop('checked') );
-        $(row).find('span.[% key %]').toggle( $("input[id='[% key %]']").prop('checked') );
+      });
-      }
-      [% END %]
     },
-    "stateLoadParams": function (settings, data) {
+    "stateSaveParams": function (settings, data) {
-      // enforce config defaults for columns
+      var datatable = $('#[% tabname %]_pane').find('table').first().DataTable();
-      // TODO: allow state loading
+      // if no existing state, all columns default to visible.
-      [% FOREACH key IN settings.table_display.device.ports.keys %]
+      // on table load, state is saved... we can find out whether there was
-      if (data.columns[$('#dp-data-table').DataTable().column('[% key %]:name').index()]) {
+      // loaded state, and if not, use this hook to set initial column
-        data.columns[$('#dp-data-table').DataTable().column('[% key %]:name').index()].visible
+      // visibility.
-          = [% (settings.table_display.device.ports.$key == 'on') ? 'true' : 'false' %];
+      if (datatable.state.loaded() === null) {
+        $('#[% tabname %]_form').find('input[type="checkbox"]').each( function() {
+          var id = $(this).attr('id');
+          if (datatable.column( id + ':name' ).length === 1) {
+            datatable.column( id + ':name' ).visible( $(this).prop('checked') );
+          }
+        });
       }
-      else {
-        $("input[id='[% key %]']").prop('checked',
-          [% (settings.table_display.device.ports.$key == 'on') ? 'true' : 'false' %]);
-      }
-      [% END %]
     }

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

@@ -30,7 +30,7 @@
 
 $(document).ready(function() {
   var freeDate = moment().subtract( [% params.age_num %], '[% params.age_unit %]' );
-  var table = $('#dp-data-table').dataTable({
+  $('#dp-data-table').dataTable({
     "deferRender": true,
     "order": [[ 1, "asc" ]],
     "colVis": {
@@ -569,40 +569,6 @@ $(document).ready(function() {
 [% INCLUDE 'ajax/datatabledefaults.tt' -%]
   });
 
-  // display the column show/hide buttons in the sidebar
-  var colvis = new $.fn.dataTable.ColVis( table );
-  var columns = colvis.s.dt.aoColumns;
-
-  // first remove existing controls, in case indexes have changed
-  $('#nd_column-controls').find('.nd_colvis-checkbox').remove();
-
-  if ( $.inArray( 'all', colvis.s.exclude ) === -1 ) {
-      for ( var i=0, iLen=columns.length ; i<iLen ; i++ ) {
-          if ( $.inArray( i, colvis.s.exclude ) === -1 ) {
-              var button = colvis.dom.buttons.shift();
-              if (columns[i]["name"] == "icon") {
-                continue;
-              }
-
-              $(button).addClass('nd_colvis-checkbox');
-              $(button).find('label').addClass('checkbox');
-              $(button).find('input').attr('id', columns[i]["name"]);
-              $(button).find('input').attr('name', columns[i]["name"]);
-
-              if (columns[i]["name"] == "c_neighbors") {
-                $(button).find('span').text('Connected Devices');
-              }
-
-              // need to re-activate tooltips on new content
-              $(button).click(function() {
-                $("[rel=tooltip]").tooltip({live: true});
-              });
-
-              $('#nd_column-controls').append( button );
-          }
-      }
-  }
-
 });
 //]]>
 </script>

Netdisco/share/views/device.tt

@@ -18,7 +18,7 @@
               method="get" action="[% uri_for("/device/${tab.tag}") %]">
             [% TRY %]
             <script type="text/javascript">has_sidebar["[% tab.tag %]"] = 1;</script>
-            [% INCLUDE "sidebar/device/${tab.tag}.tt" %]
+            [% PROCESS "sidebar/device/${tab.tag}.tt" %]
             [% CATCH %]
             <!-- no "[% tab.tag %]" search options -->
             <input name="q" value="[% params.q | html_entity %]" type="hidden"/>

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

@@ -57,22 +57,22 @@
                 </label></span>
               <div id="nd_columns" class="collapse in">
                 <ul id="nd_column-controls" class="nd_inputs-list unstyled">
-                  [% FOREACH item IN vars.port_columns %]
+                  [% FOREACH entry IN settings.table_display.$section.${tab.tag}.columns %]
-                  [% NEXT IF item.name == 'c_admin' AND NOT user_has_role('port_control') %]
+                  [% NEXT IF entry.keys.first == 'c_admin' AND NOT user_has_role('port_control') %]
-                  [% IF item.name == 'c_admin' OR item.name == 'c_nodes' %]
                   <li>
                     <label class="checkbox">
-                      <input type="checkbox" class="nd_dynamic-dp" id="[% item.name | html_entity %]"
+                      <!-- FIXME look at param not default -->
-                        name="[% item.name | html_entity %]"[% ' checked="checked"' IF params.${item.name} %] />
+                      <input type="checkbox" class="nd_dynamic-dp"
-                      [% IF item.name == 'c_admin' %]
+                        [% ' checked="checked"' IF entry.item(entry.keys.first).default %]
-                        <span class="label label-info">[% item.label | html_entity %]</span>
+                        id="[% entry.keys.first | html_entity %]" name="[% entry.keys.first | html_entity %]" />
+                      [% IF entry.item(entry.keys.first).highlight %]
+                        <span class="label label-info">[% entry.item(entry.keys.first).label | html_entity %]</span>
                       [% ELSE %]
-                        [% item.label | html_entity %]
+                        [% entry.item(entry.keys.first).label | html_entity %]
                       [% END %]
                     </label>
                   </li>
                   [% END %]
-                  [% END %]
                 </ul>
               </div>
             </div>
@@ -132,15 +132,48 @@
                       [% END %]
                     </select>
                   </li>
-                  [% FOREACH item IN vars.connected_properties %]
                   <li>
                     <label class="checkbox">
-                      <input type="checkbox" class="nd_dynamic-dp" id="[% item.name | html_entity %]"
+                      <input type="checkbox" class="nd_dynamic-dp" id="n_age"
-                        name="[% item.name | html_entity %]"[% ' checked="checked"' IF params.${item.name} %] />
+                        name="n_age"[% ' checked="checked"' IF settings.table_display.$section.${tab.tag}.content.n_age %] />
-                      [% item.label | html_entity %]
+                      Age Stamp
+                    </label>
+                  </li>
+                  <li>
+                    <label class="checkbox">
+                      <input type="checkbox" class="nd_dynamic-dp" id="n_ip"
+                        name="n_ip"[% ' checked="checked"' IF settings.table_display.$section.${tab.tag}.content.n_ip %] />
+                      IP Address
+                    </label>
+                  </li>
+                  <li>
+                    <label class="checkbox">
+                      <input type="checkbox" class="nd_dynamic-dp" id="n_netbios"
+                        name="n_netbios"[% ' checked="checked"' IF settings.table_display.$section.${tab.tag}.content.n_netbios %] />
+                      NetBIOS
+                    </label>
+                  </li>
+                  <li>
+                    <label class="checkbox">
+                      <input type="checkbox" class="nd_dynamic-dp" id="n_ssid"
+                        name="n_ssid"[% ' checked="checked"' IF settings.table_display.$section.${tab.tag}.content.n_ssid %] />
+                      SSID
+                    </label>
+                  </li>
+                  <li>
+                    <label class="checkbox">
+                      <input type="checkbox" class="nd_dynamic-dp" id="n_vendor"
+                        name="n_vendor"[% ' checked="checked"' IF settings.table_display.$section.${tab.tag}.content.n_vendor %] />
+                      Vendor
+                    </label>
+                  </li>
+                  <li>
+                    <label class="checkbox">
+                      <input type="checkbox" class="nd_dynamic-dp" id="n_archived"
+                        name="n_archived"[% ' checked="checked"' IF settings.table_display.$section.${tab.tag}.content.n_archived %] />
+                      Archived Data
                     </label>
                   </li>
-                  [% END %]
                 </ul>
               </div>
             </div>