{% extends "hosting/base_short.html" %}
{% load staticfiles bootstrap3 i18n %}
{% block content %} 
<div>
	<div class="virtual-machine-container dashboard-container ">
		<div class="row">
			<div class="container-table col-md-9 col-md-offset-2">
				 <div  class="col-sm-12">
                    <form method="POST" action="" novalidate class="form-ssh">
                        {% csrf_token %}
				        <h3><i class="fa fa-key fa-separate" aria-hidden="true"></i>{% trans "Access Key"%} </h3>
                        {% if messages %}
                        <div class="alert alert-warning">
                            {% for message in messages %}
                            <span>{{ message }}</span>
                            {% endfor %}
                        </div>
						{% endif %}
                        {% for field in form %}
                            {% bootstrap_field field %}
                        {% endfor %}
                        {% buttons %}
                            <button type="submit" class="btn btn-success">
                                {% trans "Upload your own key. "%} 
                            </button>
<br />
<br />
							{% trans "Or generate a new key pair."%} <br />
<br />
                                <button class="btn btn-success">{% trans "Generate Key Pair"%} </a>
                            </button>

                        {% endbuttons %} 
                        </form>
                        <h5> Use your created key to access to the machine. If you lost it, contact us. </h5>

				        {% if private_key %}
				 		<div class="alert alert-warning">
				 			 
  							<strong>{% trans "Warning!"%}</strong>{% trans "You can download your SSH  private key once. Don't lost your key"%}  
						</div>
						<div class="form-group">
						  <textarea class="form-control" rows="6" id="ssh_key" type="hidden" style="display:none">{{private_key}}</textarea>

						</div>
						{% endif %}
						<div class="clearfix"></div>
				</div>
			</div>

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

{% if private_key %}
<!-- Force to download ssh key on page load -->
<script type="text/javascript"> 

        var key = window.document.getElementById('ssh_key');

		var a = window.document.createElement('a');

		a.href = window.URL.createObjectURL(new Blob([key.value], {type: 'text'}));
		a.download = '{{key_name}}.pem';

		// Append anchor to body.
		document.body.appendChild(a);
		a.click();

		// Remove anchor from body
		document.body.removeChild(a);


</script>
{%endif%}

{% if next_url %}
    <script type="text/javascript"> 
        window.location.href = '{{next_url}}';
    </script>
{% endif %}

{%endblock%}