{% extends 'layouts/master-page' %}
{% block title %}CPE browser{% endblock %}
{% block head %}
  <script type="text/javascript" src="/static/js/custom/list.js"></script>
  <script type="text/javascript" src="/static/js/custom/listmanagement.js"></script>
{% endblock %}
{% block content %}
  <!-- breadcrumb -->
  <ol class="breadcrumb">
    <li><a href="/admin">Admin</a></li>
    {% if version != None%}
      <li> <a href="/admin/listmanagement">Vendors</a></li>
      <li> <a href="/admin/listmanagement/{{vendor}}">{{vendor|htmlDecode}}</a></li>
      <li class="active">{{product|htmlDecode}}</li>
    {% elif product != None%}
      <li> <a href="/admin/listmanagement">Vendors</a></li>
      <li class="active">{{vendor|htmlDecode}}</li>
    {% elif product == None %}
      <li class="active"> Vendors</li>
    {% endif %}
  </ol>
  <!-- Status -->
  <div id="status" class="hidden">
    <span id="status_icon"></span>
    <div id="status_message"></div>
  </div>
  <!-- vendor/product/version -->
  <table class="table table-hover table-striped">
    <tbody>
      <tr class="warning">
        <td class="col-md-8">
          {% if version != None%}
            Versions for {{ vendor }} {{ product|htmlDecode }}
          {% elif product != None %}
            Products for {{ vendor|htmlDecode }}
          {% elif product == None %}
            Vendors
          {% endif %}
        </td>
        <td class="col-md-1"></td>
        <td class="col-md-1"></td>
      </tr>
      {% if version != None %}
        {% for v in version %}
          <tr>
            <td>{{ product|htmlDecode }} {{ v|htmlDecode }}</td>
            <!-- explanation of double "encoding": javascript likes to decode our encoded string, so this way, we still have an encoded string -->
            <td><a href="javascript:addCPE('whitelist','{{vendor|htmlEncode}}:{{ product|htmlEncode|htmlEncode }}:{{ v }}')"><span class="glyphicon glyphicon-eye-open"></span> whitelist</a></td>
            <td><a href="javascript:addCPE('blacklist','{{vendor|htmlEncode}}:{{ product|htmlEncode|htmlEncode }}:{{ v }}')"><span class="glyphicon glyphicon-eye-close"></span> blacklist</a></td> 
          </tr>
        {% endfor %}
      {% elif product != None %}
        {% for p in product %}
          <tr>
            <td><a href="/admin/listmanagement/{{ vendor }}/{{ p}}">{{ p|htmlDecode }}</a> </td>
            <td><a href="javascript:addCPE('whitelist','{{vendor|htmlEncode}}:{{ p|htmlEncode }}')"><span class="glyphicon glyphicon-eye-open"></span> whitelist</a></td>
            <td><a href="javascript:addCPE('blacklist','{{vendor|htmlEncode}}:{{ p|htmlEncode }}')"><span class="glyphicon glyphicon-eye-close"></span> blacklist</a></td>
          </tr>
        {% endfor %}
      {% else  %}
        {% for v in vendor %}
          <tr>
            <td><a href="/admin/listmanagement/{{ v}}">{{ v|htmlDecode }}</a></td>
            <td><a href="javascript:addCPE('whitelist','{{ v|htmlEncode }}')"><span class="glyphicon glyphicon-eye-open"></span> whitelist</a></td>
            <td><a href="javascript:addCPE('blacklist','{{ v|htmlEncode }}')"><span class="glyphicon glyphicon-eye-close"></span> blacklist</a></td>
          </tr>
        {% endfor %}
      {% endif %}
    </tbody>
  </table>
{% endblock %}