{% extends "base.html" %}

{% block head %}
{{ super() }}
<script type="text/javascript">
function getPricePerMonth()
{
    var period = 0;
    var periodselect = document.getElementById('period');
    period = periodselect.value;
    return period;
}

function calculateTotal()
{
    var period = getPricePerMonth();
    var ppm = {{ ppm }};
    var total = 0;
    total = period * ppm;
    var divobj = document.getElementById('totalPrice');
    divobj.innerHTML = "Total Price: "+total+" {{ currency }}";
}
</script>
{% endblock %}

{% block title %}Activate deployment{% endblock %}

{% block page_content %}

<div class="row">

<div class="col-md-12">
<div class="panel panel-info">
<div class="panel-heading">Activate deployment {{ deploy.machine_alias }}</div>
<div class="panel-body">

<form method="POST" action"{{ url_for('vmanager.activate', itemid=deploy.machine_id) }}">
<h3>
CPU: {{ deploy.machine_cpu }} cores<br />
Memory: {{ deploy.machine_mem }} MB<br />
Storage: {{ deploy.machine_hdd }} GB<br />
{{ form.period.label }} {{ form.period(**{"onchange":"calculateTotal()"}) }}<br />
   {% for error in form.period.errors %}
       {{ error }}<br />
   {% endfor %}
---<br />
<div id="totalPrice">Previous Period: {{ total }} {{ currency }}</div>
</h3>

<p>
    {{ form.csrf_token() }}
    {{ form.submit }}
</p>

</div>
</div>
</div>

{% endblock %}