{% extends "base.html" %} {% block title %}Subir Circuito{% endblock %} {% block head %} {{ super() }} {% endblock %} {% block content %} <div class="row"> {% for row in range(16) %} <div class="ips-row"> {% for col in range(16) -%} {% set ip = row*16 + col %} {% set unusable = ip == 0 or ip == 255 %} {% set usable = not unusable %} <a {% if usable %}href="ip/{{ ip }}"{% endif %}> <div class="ips-cell {%- if row == 0 %} ips-top{% endif %} {%- if col == 0 %} ips-left{% endif %} {%- if row == 15 %} ips-bottom{% endif %} {%- if col == 15 %} ips-right{% endif %} {%- if col == 7 %} ips-ver-half{% endif %} {%- if row == 7 %} ips-hor-half{% endif %} {% if unusable %} unusable{% endif %} {%- if ipmap[ip].dhcp_pool %} dhcp-pool{% endif -%} "> <div style="display: inline-block; max-height: 52px;"> <div class="name"> {% if ipmap[ip].dhcp_pool %} DHCP {% else %} {{ ipmap[ip].reserved_by }} {% endif %} </div> <div style="height: 10px;"></div> </div> {% if usable %} {% if ipmap[ip].locked %} <span class="lock"><i class="fa fa-lock"></i></span> {% endif %} <span class="ip">.{{ row*16 + col }}</span> {% endif %} </div> </a> {%- endfor %} </div> {% endfor %} </div> <script> $(function() { $(".ips-cell:not(.unusable)").hover( function() { $(this).addClass("hover"); }, function() { $(this).removeClass("hover"); } ); }) </script> {% endblock %}