{% extends "layout.html" %}
{% block title %}{{title}}{% endblock %}
{% block content %}
<h1>{{title}}</h1>

<div class="table-responsive">
  <table class="table table-striped">
    <thead>
      <tr>
	<th>Property</th>
	<th>Value</th>
      </tr>
    </thead>
    <tbody>
      <tr>
	<td>SSH host</td>
	<td><tt>{{store.ssh_host}}</tt></td>
      </tr>
      <tr>
	<td>Path prefix</td>
	<td><tt>{{store.path_prefix}}</tt></td>
      </tr>
      <tr>
	<td>Capacity</td>
	<td>
	  {% if store.available %}
	    {{store.capacity|filesizeformat}}
	  {% else %}
	    ?
	  {% endif %}
	</td>
      </tr>
      <tr>
	<td>Space Left</td>
	<td>
	  {% if store.available %}
	    {{store.space_left|filesizeformat}}
	  {% else %}
	    ?
	  {% endif %}
	</td>
      </tr>
      <tr>
	<td>Usage</td>
	<td>
	  {% if store.available %}
	    {{macros.progress_bar(store.usage_percentage)}}
	  {% else %}
	    ?
	  {% endif %}
	</td>
      </tr>
      <tr>
	<td>Available?</td>
	<td>{{macros.true_good_boolean(store.available)}}</td>
      </tr>
      <tr>
        <td>Number of instances</td>
        <td>{{num_instances}}</td>
      </tr>
    </tbody>
  </table>
</div>

<h2>Control</h2>

<form role="form" action="/" method="post">
  <input type="hidden" name="id" value="{{store.id}}">

  <button type="submit" class="btn btn-danger" name="toggle"
          formaction="/stores/{{store.name}}/{{toggle_action}}">{{toggle_description}}</button>
</form>

{% endblock %}