Added new page(Choice ssh key generate/upload), changed design of generate ssh form

This commit is contained in:
Siarhei Puhach 2017-07-05 16:57:49 +03:00
commit 7cc70a95ac
7 changed files with 249 additions and 22 deletions

View file

@ -0,0 +1,70 @@
{% extends "hosting/base_short.html" %}
{% load staticfiles bootstrap3 i18n %}
{% block content %}
<div>
<div class="container virtual-machine-container dashboard-container ">
<div class="row">
<div class="col-md-12">
<div class="col-sm-12">
<h2><i class="fa fa-key" aria-hidden="true"></i>{% trans " SSH Key"%} </h2>
<h4>Choose a key option in order to access your VMs.</h4>
{% if messages %}
<div class="alert alert-warning">
{% for message in messages %}
<span>{{ message }}</span>
{% endfor %}
</div>
{% endif %}
<div class="choice-container">
<div class="left-choice-container">
<h3>I want to generate a new key pair.
<sup><sup><img src="{% static 'hosting/img/g222.png' %}"/></sup></sup>
</h3>
<button type="button" class="btn btn-success choice-button generate-btn">
<a href="#">{% trans "Generate"%}</a>
</button>
</div>
<div class="right-choice-container">
<h3>I want to use my existing public key.
<sup><sup><img src="{% static 'hosting/img/g222.png' %}"/></sup></sup>
</h3>
<button type="button" class="btn btn-primary choice-button upload-btn">
<a href="{% url 'hosting:create_ssh_key' %}">{% trans "Upload"%}</a>
</button>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</div>
</div>
{% if next_url %}
<script type="text/javascript">
window.location.href = '{{next_url}}';
</script>
{% endif %}
<script type="text/javascript">
window.onload = function () {
{% for user_key in keys %}
// var locale_date = new Date(document.getElementById("ssh-created_at-{{user_key.id}}").textContent).toISOString();
var locale_date = moment.utc(document.getElementById("ssh-created_at-{{user_key.id}}").textContent,'YYYY-MM-DD HH:mm').toDate();
locale_date = moment(locale_date).format("YYYY-MM-DD h:mm:ss a");
document.getElementById('ssh-created_at-{{user_key.id}}').innerHTML = locale_date;
{% endfor %}
};
</script>
{%endblock%}

View file

@ -1,6 +1,6 @@
{% extends "hosting/base_short.html" %}
{% load staticfiles bootstrap3 i18n %}
{% block content %}
{% block content %}
<div>
<div class="virtual-machine-container dashboard-container ">
<div class="row">
@ -8,7 +8,7 @@
<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>
<h3><i class="fa fa-key fa-separate" aria-hidden="true"></i>{% trans "Add you public SSH key"%} </h3>
{% if messages %}
<div class="alert alert-warning">
{% for message in messages %}
@ -20,28 +20,29 @@
{% bootstrap_field field %}
{% endfor %}
{% buttons %}
<div class="underform-contaner">
<h4> {% trans "Use your created key to access to the machine." %} </h4>
<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>
{% trans "Add SSH key"%}
</button>
</div>
<div class="underform-contaner">
<h4>{% trans "Or you can generate a new key pair."%}</h4>
<button class="btn btn-success">{% trans "Generate"%}
</button>
</div>
{% endbuttons %}
{% 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"%}
<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>
@ -54,7 +55,7 @@
{% if private_key %}
<!-- Force to download ssh key on page load -->
<script type="text/javascript">
<script type="text/javascript">
var key = window.document.getElementById('ssh_key');
@ -75,7 +76,7 @@
{%endif%}
{% if next_url %}
<script type="text/javascript">
<script type="text/javascript">
window.location.href = '{{next_url}}';
</script>
{% endif %}

View file

@ -16,7 +16,7 @@
{% endif %}
<div class="ssh-header-container">
<p>
<a class="btn btn-primary btn-custom-download" href="{% url 'hosting:create_ssh_key' %}" >
<a class="btn btn-primary btn-custom-download" href="{% url 'hosting:choice_ssh_keys' %}" >
<span class="button-plus"></span> {% trans "Add Key"%}
</a>
</p>