{% extends "apps/base.html" %}
{% load staticfiles %}
{% load math %}

{% block navbar %}
{% include "apps/navbar.html" with active="settings" %}
{% endblock %}

{% block app-content %}
<div class="row">
  <div class="col-md-12">
    <h3>Info</h3>
    <div class="content">
      <p><strong>Git URL:</strong> {{ app.repository }}</p>
      <p><strong>Platform:</strong> {{ app.platform }}</p>
      <p><strong>Pool:</strong> {{ app.pool }}</p>
      <p><strong>Tags:</strong> {{ app.tags }}</p>
    </div>
    {% if app.lock.Locked %}
    <h3>App locked</h3>
    <div class="content">
      <p><strong>Reason:</strong> {{ app.lock.Reason }}</p>
      <p><strong>Acquire date:</strong> {{ app.lock.AcquireDate }}</p>
      <a class="btn unlock" href="#unlock" data-toggle="modal">
        Unlock app
      </a>
    </div>
    {% endif %}
  </div>
</div>
<div class="row">
  <div class="col-md-12">
    <h3>Plan</h3>
    <div class="content">
      <p><strong>Name:</strong> {{ app.plan.name }}</p>

      <p>
        <strong>CPU:</strong>
        {% if app.plan.override.cpumilli %}
          {{ app.plan.override.cpumilli |divide:10 }}% (override)
        {% elif app.plan.cpumilli %}
          {{ app.plan.cpumilli |divide:10 }}%
        {% else %}
          {{ app.plan.cpushare }} (CPU share)
        {% endif %}
      </p>

      <p>
        <strong>Memory:</strong>
        {% if app.plan.override.memory %}
          {{ app.plan.override.memory|filesizeformat }} (override)
        {% else %}
          {{ app.plan.memory|filesizeformat }}
        {% endif %}
      </p>

      {% if app.plan.swap > 0 %}
        <p><strong>Swap:</strong> {{ app.plan.swap|filesizeformat }}</p>
      {% endif %}
    </div>
  </div>
</div>
<div class="row">
  <div class="col-md-12">
    <div class="content">
      <h3>Environment variables</h3>
      <p><span class="settings-toggle toggle-arrow"></span> {{ app.envs|length }} enviroment variables</p>
      <table class="table hide settings-content">
        <thead>
          <tr>
            <th>Name</th>
            <th>Value</th>
          </tr>
        </thead>
        <tbody>
          {% for env in app.envs %}
          {% if env.public %}
          <tr>
            <td>{{ env.name }}</td>
            <td>{{ env.value }}</td>
          </tr>
          {% endif %}
          {% endfor %}
          {% for env in app.envs %}
          {% if not env.public %}
          <tr>
            <td>{{ env.name }}</td>
            <td>******</td>
          </tr>
          {% endif %}
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
</div>
<div class="row">
  <div class="col-md-12">
    <h3>Domains</h3>
    <div class="content">
      <p>
        {% if app.cname or app.ip %}
          <strong>App url:</strong>
          <span class="app-urls">
            <a href="http://{{ app.ip }}" target="_blank">http://{{ app.ip }}</a>
            {% for cname in app.cname %}
              <a href="http://{{ cname }}" target="_blank">http://{{ cname }}</a>
            {% endfor %}
          </span>
        {% endif %}
      </p>
    </div>
  </div>
</div>
<div class="row">
  <div class="col-md-12">
    <h3>Ownership</h3>
    <div class="content">
      <p><strong>Owner:</strong> {{ app.owner }}</p>
      <p><strong>Team owner:</strong> {{ app.teamowner }}</p>
      <p><strong>Teams:</strong> {{ app.teams|join:", " }}</p>
    </div>
  </div>
</div>

<div class="row">
  <div class="col-md-12" id="app-remove"></div>
</div>

  <div id="unlock" 
  class="modal fade" 
  tabindex="-1" 
  role="dialog" 
  aria-labelledby="myModalLabel" 
  aria-hidden="true">
  </div>
  {% endblock %}

  {% block extra_js %}
  <script src="{% static "js/pages/app-settings.js" %}"></script>
  <script type="text/javascript">
    $(".settings-toggle").on("click", function() {
      $(".settings-content").toggleClass("hide");
      $(".toggle-arrow").toggleClass("toggle-arrow-open");
    });
  </script>
  {% endblock %}
