{% comment %}
One cable. Carries both device ids so that selecting either end highlights this row, and its
own cable id so that clicking the row highlights the line and both devices in the drawing.
{% endcomment %}
<div class="lens-cable" data-cable-id="{{ run.cable.pk }}"
     data-lens-filterable="cables" data-band="{{ run.colour }}"
     data-device-id="{{ run.local_device.pk }}"
     data-termination="{{ run.termination_type }}/{{ run.termination_id }}"
     {% if run.peer_device %}data-peer-device-id="{{ run.peer_device.pk }}"{% endif %}
     tabindex="0">
  <span class="lens-cable__dot" style="background: {{ run.colour }};"></span>
  <span class="lens-cable__local">{{ run.local_device }} &middot; {{ run.local_name }}</span>
  <i class="mdi mdi-arrow-right text-muted"></i>
  <span class="lens-cable__peer">
    {% if run.peer_device %}{{ run.peer_device }}{% else %}{{ run.peer_name }}{% endif %}
    {% if show_rack and run.peer_rack %}
      <span class="badge text-bg-secondary">{{ run.peer_rack }}</span>
    {% elif show_rack and not run.peer_device %}
      <span class="badge text-bg-secondary">off-site</span>
    {% endif %}
  </span>
</div>