<!DOCTYPE html>
<html>
<!-- esto se reemplazo por la pagina tap -->

<head>
  <title></title>

  <%include ../../partials/head%>
</head>

<body>
  <header>
    <%include ../../partials/header%>
  </header>

  <div id="main">
    <h2>Manage Tap</h2>
    <p>Aqui se pueden configurar los taps(puertos), para que puedan ser
      desactivados a efectos de la red, ya que no pueden ser eliminados una vez que han
      sido creados</p>

    <form class="form">
      <fieldset>
        <div>
          <label>Switch DPID</label>
          <br>
          <select id="switch" onchange="updatePorts()">
          </select>
        </div>

        <div>
          <label>Source port(s)</label>
          <br>
          <select id="src-ports" multiple>
          </select>
        </div>

        <div>
          <label>Sink port(s)</label>
          <br>
          <select id="sink-ports" multiple>
          </select>
        </div>

        <div>
          <label>MAC address</label>
          <br>
          <select id="mac-class">
            <option>--Ignore--</option>
            <option>Source</option>
            <option>Destination</option>
            <option>Src or Dest</option>
          </select>
          <input id="mac-addr" type="text" placeholder="12:34:56:78:9A:BC">
        </div>

        <div>
          <label>IP address</label>
          <br>
          <select id="ip-class">
            <option>--Ignore--</option>
            <option>Source</option>
            <option>Destination</option>
            <option>Src or Dest</option>
          </select>
          <input id="ip-addr" type="text" placeholder="12.34.56.78/24">
        </div>

        <div>
          <!--<div class="pure-u-1 pure-u-md-1-3">-->
          <label>Common traffic types</label>
          <br>
          <select id="traffic-type">
            <option>--Ignore--</option>
            <option>HTTP</option>
            <option>HTTPS</option>
            <option>UDP</option>
            <option>DHCP</option>
            <option>ICMP</option>
          </select>
        </div>
      </fieldset>
    </form>


    <div>
      <button href="#" class="pure-button pure-button-primary" onclick="setTap()">Set</button>
      <button href="#" class="pure-button pure-button-primary" onclick="clearTap()">Clear</button>
    </div>
    <div id="post-status">
    </div>
  </div><!-- main -->
  </div>
  <!--layout -->


  <script src="/js/jquery.min.js"></script>
  <script src="/js/utils.js"></script>
  <script src="/js/tap.js"></script>
</body>

<footer>
  <%include ../../partials/footer%>
</footer>


</html>