resources.html

{% load i18n %}
{% load sizefieldtags %}
{% load crispy_forms_tags %} 

<form id="vm-details-resources-form" method="POST" action="">
  {% csrf_token %}
<p class="row">
    <div class="col-sm-3">
      <label for="vm-cpu-priority-slider"><i class="icon-trophy"></i> {% trans "CPU priority" %}</label>
    </div>
    <div class="col-sm-9">
      <input name="cpu-priority" type="text" id="vm-cpu-priority-slider" class="vm-slider" value="{{ instance.priority }}" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="{{ instance.priority }}" data-slider-orientation="horizontal" data-slider-handle="square" data-slider-tooltip="hide"/>         
    </div>
</p>


<p class="row">
    <div class="col-sm-3">
      <label for="cpu-count-slider"><i class="icon-cogs"></i> {% trans "CPU count" %}</label>
    </div>
    <div class="col-sm-9">
      <input name="cpu-count" type="text" id="vm-cpu-count-slider" class="vm-slider" value=" {{ instance.num_cores }}" data-slider-min="0" data-slider-max="8" data-slider-step="1" data-slider-value="{{ instance.num_cores }}" data-slider-orientation="horizontal" data-slider-handle="square" data-slider-tooltip="hide"/>         
    </div>
</p>


<p class="row">
    <div class="col-sm-3">
      <label for="ram-slider"><i class="icon-ticket"></i> {% trans "RAM amount" %}</label>
    </div>
    <div class="col-sm-9"> 
      <input name="ram-size" type="text" id="vm-ram-size-slider" class="vm-slider" value="{{ instance.ram_size }}" data-slider-min="128" data-slider-max="4096" data-slider-step="128" data-slider-value="{{ instance.ram_size }}" data-slider-orientation="horizontal" data-slider-handle="square" data-slider-tooltip="hide"/>         MiB  
  </div>
</p>

<p class="row">
  <div class="col-sm-12">
    <button type="submit" class="btn btn-success btn-sm" id="vm-details-resources-save"><i class="icon-save"></i> {% trans "Save resources" %}</button>
  </div>
</p>
</form>

<hr />

<div class="row">
  <div class="col-sm-11">
    <h3>
      {% trans "Disks" %}
      <div class="pull-right">
        <a href="#" id="vm-details-disk-add" class="btn btn-success btn-xs">
          <i class="icon-plus"></i> {% trans "Add new disk" %}
        </a>
      </div>
    </h3>
    <div class="row" id="vm-details-disk-add-for-form">

    </div>
    {% for d in instance.disks.all %}
      <h4 class="list-group-item-heading dashboard-vm-details-network-h3">
        <i class="icon-file"></i> {{ d.name }} - {{ d.size|filesize }}
      </h4>
    {% endfor %}
  </div>
</div>

<div class="js-hidden row" id="vm-details-disk-add-form">
  <div class="col-md-12">
    <div>
      <hr />
      <form method="POST" action="" style="max-width: 300px;">
        {% crispy forms.disk_add_form %}
      </form>
      <hr />
    </div> 
  </div>
</div>

{% block extra_js %}
  <style>
    label {padding-top: 6px;}
    .form-group {margin-bottom: 8px;}
  </style>
{% endblock %}