Commit 0016478b by tarokkk

webgui: Colored template and actual VM

parent ce8ca35e
...@@ -122,9 +122,9 @@ ...@@ -122,9 +122,9 @@
background-repeat: no-repeat; background-repeat: no-repeat;
} }
&.selected-summary{ &.selected-summary{
background-color: rgb(241, 241, 157); background-color: rgb(142, 219, 128);
&:hover{ &:hover{
background-color: #FFFF66; background-color: rgb(100, 223, 78);
} }
} }
&:hover{ &:hover{
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
{% if instances %} {% if instances %}
{% for i in instances %} {% for i in instances %}
<li class="wm"> <li class="wm">
<div class="summary {% if id == i.id %}selected-summary{% endif %}"> <div class="summary {% if id == i.id %}selected-summary{% elif i.template.state == "NEW" %}unfinished{% endif %}">
<!--<div class="id"></div>--> <!--<div class="id"></div>-->
<div class="name {% if i.state == 'ACTIVE' %}wm-on{% else %}wm-off{% endif %}"> <div class="name {% if i.state == 'ACTIVE' %}wm-on{% else %}wm-off{% endif %}">
{{i.name|truncatechars:20}} {{i.name|truncatechars:20}}
...@@ -16,8 +16,8 @@ ...@@ -16,8 +16,8 @@
<a href="{{i.get_connect_uri}}" title="{% trans "Connect" %}"> <a href="{{i.get_connect_uri}}" title="{% trans "Connect" %}">
<img src="/static/icons/plug.png" alt="{% trans "Connect" %}" /> <img src="/static/icons/plug.png" alt="{% trans "Connect" %}" />
</a> </a>
<a href="#" class="stop-vm-button" data-name="{{ i.name}}" data-id="{{ i.id }}" title="{% trans "Stop" %}"> <a href="#" class="stop-vm-button" data-name="{{ i.name}}" data-id="{{ i.id }}" title="{% trans "Pause" %}">
<img src="/static/icons/control-pause.png" alt="{% trans "Suspend" %}" /> <img src="/static/icons/control-pause.png" alt="{% trans "Pause" %}" />
</span> </span>
<a href="#" class="delete-vm-button" data-name="{{ i.name}}" data-id="{{ i.id }}" title="{% trans "Delete" %}"> <a href="#" class="delete-vm-button" data-name="{{ i.name}}" data-id="{{ i.id }}" title="{% trans "Delete" %}">
<img src="/static/icons/minus-circle.png" alt="{% trans "Delete" %}" /> <img src="/static/icons/minus-circle.png" alt="{% trans "Delete" %}" />
......
...@@ -45,89 +45,49 @@ ...@@ -45,89 +45,49 @@
<div class="boxes"> <div class="boxes">
<div class="contentblock" id="state"> <div class="contentblock wm" id="state">
<h2>{{name}}</h2> <h2>{{name}}</h2>
<div class="content"> <div class="content">
{% if state == "PENDING" or state == "ACTIVE" and booting %} {% if state == "PENDING" or state == "ACTIVE" and booting %}
<p style="font-size:25px; line-height:2em;text-align:center;"> <p style="font-size:25px; line-height:2em;text-align:center;">
<img src="/static/load-2.gif" /> <img src="/static/load-2.gif" />
{% trans "The machine is starting..." %} {% trans "Starting..." %}
</p>
<p style="font-size:25px; line-height:2em;text-align:center;">
<form action="{% url vm_delete id %}" method="post" onsubmit="return confirm('Biztosan törli a gépet?')">
{% csrf_token %}
<input type="submit" class="icon-delete" value="Törlés" />
</form>
<a href="/">
<img src="/static/icons/Go-home.png" alt="&lt;-" />
</a>
</p> </p>
{% elif state == "ACTIVE" and not booting %} {% elif state == "ACTIVE" and not booting %}
<p id="connect" style="display:block; font-size:25px; line-height:2em;text-align:center;"> <p id="connect" style="display:block; font-size:25px; line-height:2em;text-align:center;">
<a href="{{uri}}" class="button" onclick="return connectbutton();"> <a href="{{uri}}" class="button" onclick="return connectbutton();">
<img src="/static/load-1.gif" id="connecting" style="display:none;" /> <img src="/static/load-1.gif" id="connecting" style="display:none;" />
{% trans "Connect" %} {% trans "Running" %}
</a>
</p>
<p style="font-size:25px; line-height:2em;text-align:center;">
<form action="{% url vm_delete id %}" method="post" onsubmit="return confirm('Biztosan törli a gépet?')">
{% csrf_token %}
<input type="submit" class="icon-delete" value="Törlés" />
</form>
<a href="/">
<img src="/static/icons/Go-home.png" alt="&lt;-" />
</a> </a>
</p> </p>
{% elif state == "STOPPED" %} {% elif state == "STOPPED" %}
<p style="font-size:25px; line-height:2em;text-align:center;"> <p style="font-size:25px; line-height:2em;text-align:center;">
{% trans "The machine is stopped" %} {% trans "Stopped" %}
</p>
<p style="font-size:25px; line-height:2em;text-align:center;">
<form action="{% url vm_delete id %}" method="post" onsubmit="return confirm('Biztosan törli a gépet?')">
{% csrf_token %}
<input type="submit" class="icon-delete" value="Törlés" />
</form>
<a href="/">
<img src="/static/icons/Go-home.png" alt="&lt;-" />
</a>
</p> </p>
{% endif %} {% endif %}
{% if state == "DONE" %} {% if state == "DONE" %}
<p style="font-size:25px; line-height:2em;text-align:center;"> <p style="font-size:25px; line-height:2em;text-align:center;">
{% trans "The machine deleted" %} {% trans "Deletedeleted" %}
</p>
<p style="font-size:25px; line-height:2em;text-align:center;">
<a href="/">
<img src="/static/icons/Go-home.png" alt="⌫" />
</a>
</p> </p>
{% endif %} {% endif %}
{% if state == "FAILED" %} {% if state == "FAILED" %}
<p style="font-size:25px; line-height:2em;text-align:center;"> <p style="font-size:25px; line-height:2em;text-align:center;">
{% trans "Unexpected error occured" %} {% trans "Unexpected error occured" %}
</p> </p>
<p style="font-size:25px; line-height:2em;text-align:center;">
<form action="{% url vm_delete id %}" method="post" onsubmit="return confirm('Biztosan törli a gépet?')">
{% csrf_token %}
<input type="submit" class="icon-delete" value="Törlés" />
</form>
<a href="/">
<img src="/static/icons/Go-home.png" alt="⌫" />
</a>
</p>
{% endif %}
{% if state == "STOPPPED" %}
<p style="font-size:25px; line-height:2em;text-align:center;">
<a href="/vm/suspend/{{i.id}}/">
<img src="/static/icons/Media-playback-start.png" alt="&gt;" />
</a>
<a href="/">
<img src="/static/icons/Go-home.png" alt="⌫" />
</a>
</p>
{% endif %} {% endif %}
</div> </div>
<div class="details" style="display: block;">
<div class="details-container">
<ul>
<li class="name">{% trans "Hostname" %}: <span class="value">{{i.name}}</span></li>
<li class="os-linux">{% trans "System" %}: <span class="value">{{i.template.disk.name}}</span></li>
<li class="type">{% trans "Size" %}: <span class="value">{{i.template.instance_type.name}}</span></li>
<li class="date">{% trans "Created at" %}: <span class="value">{{i.created_at}}</span></li>
<li class="date">{% trans "Expiration" %}: <span class="value"><abbr title="1 nap, 5 óra, 34 perc">1 nap</abbr></span></li>
</ul>
</div>
</div>
</div> </div>
<div class="contentblock" id="vm-credentials"> <div class="contentblock" id="vm-credentials">
<h2>{% trans "Login credentials" %}</h2> <h2>{% trans "Login credentials" %}</h2>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment