[% USE Number.Format %]
[% IF opt %]
  <table id="data-table" class="table table-striped table-bordered" width="100%" cellspacing="0">
    <thead>
      <tr>
        <th>Device (Port)</th>
        <th>Broadcast</th>
        <th>Model</th>
        <th>SSID</th>
        <th>Vendor</th>
      </tr>
    </thead>
  </table>
[% ELSE %]
  <table id="data-table" class="table table-striped table-bordered" width="100%" cellspacing="0">
    <thead>
      <tr>
      <th class="nd_center-cell">SSID</th>
      <th class="nd_center-cell">Broadcast</th>
      <th class="nd_center-cell">Count</th>
      </tr>
    </thead>
  </table>
[% END %]

<script type="text/javascript">
$(document).ready(function() {
  var table = $('#data-table').dataTable({
    "deferRender": true,
    "data": [% results %],
    [% IF opt %]
    "columns": [
      {
      "data": 'ip',
      "render": function(data, type, row, meta) {
        return '<a href="[% device_ports %]&q=' + encodeURIComponent(data) + '&f=' + encodeURIComponent(row.port.port) + '&c_nodes=on&n_ssid=on">' + he.encode(row.device.dns || row.device.name || row.ip) + '(' + he.encode(row.port.port) + ')</a>';
        }
      }, {
        "data": 'broadcast',
        "render": function(data, type, row, meta) {
          return (data ? 'Yes' : 'No');
        }
      }, {
        "data": 'device.model',
        "render": function(data, type, row, meta) {
          return he.encode(data || '');
        }
      }, {
        "data": 'ssid',
        "searchable": false,
        "orderable": false,
        "render": function(data, type, row, meta) {
          return he.encode(data || '');
        }
      }, {
        "data": 'device.vendor',
        "render": function(data, type, row, meta) {
          return he.encode(data || '');
        }
      }
    ],
    [% ELSE %]
    "columns": [
      {
        "data": 'ssid',
        "render": function(data, type, row, meta) {
          return '<a href="[% uri_for('/report/portssid') %]?ssid=' + encodeURIComponent(data) + '">' + he.encode(data || '') + '</a>';
        }
      }, {
        "data": 'broadcast',
        "render": function(data, type, row, meta) {
          return (data ? 'Yes' : 'No');
        }
      }, {
        "data": 'count',
        "searchable": false,
        "render": function(data, type, row, meta) {
          return data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        }
      },
    ],
    "order": [[ 2, "desc" ]],
  [% END %]  
[% INCLUDE 'ajax/datatabledefaults.tt' -%]
  });
});
</script>