Merge remote-tracking branch 'origin/issue-110-rebased' into issue-110-fixed

circle/dashboard/tables.py

@@ -96,12 +96,12 @@ class NodeListTable(Table):
 
     number_of_VMs = TemplateColumn(
         template_name='dashboard/node-list/column-vm.html',
-        attrs={'th': {'class': 'node-list-table-admin'}},
+        attrs={'th': {'class': 'node-list-table-thin'}},
     )
 
-    admin = TemplateColumn(
-        template_name='dashboard/node-list/column-admin.html',
-        attrs={'th': {'class': 'node-list-table-admin'}},
+    monitor = TemplateColumn(
+        template_name='dashboard/node-list/column-monitor.html',
+        attrs={'th': {'class': 'node-list-table-monitor'}},
     )
 
     details = TemplateColumn(

circle/dashboard/templates/dashboard/node-list.html

@@ -22,6 +22,11 @@
   </div>
 </div>
 <style>
+
+  .node-list-table tbody>tr>td {
+    vertical-align: middle;
+  }
+
   .popover {
     max-width: 600px;
   }
@@ -42,8 +47,8 @@
     width: 10px;
   }
 
-  .node-list-table-admin {
-    width: 130px;
+  .node-list-table-monitor {
+    width: 250px;
   }
 </style>
 {% endblock %}

circle/dashboard/templates/dashboard/node-list/column-monitor.html

+{% load sizefieldtags %}
+{% load i18n %}
+
+<i class="icon-gears"></i> {% trans "CPU" %}
+ <div class="progress pull-right">
+  <div class="progress-bar progress-bar-success" role="progressbar"
+    aria-valuenow="{{ record.cpu_usage|stringformat:"f" }}"
+    aria-valuemin="0" aria-valuemax="1"
+    style="width: {% widthratio record.cpu_usage 1 100 %}%;">
+    <span class="progress-bar-text">
+      {% if record.cpu_usage != None %}
+        {{ record.cpu_usage|floatformat:1 }} %
+      {% else %}
+        -
+      {% endif %}
+   </span>
+  </div>
+ </div>
+<br>
+<i class="icon-ticket"></i> {% trans "Memory" %}
+ <div class="progress pull-right">
+  <div class="progress-bar" role="progressbar"
+    aria-valuenow="{{ record.ram_usage|stringformat:"f" }}"
+    aria-valuemin="0" aria-valuemax="100"
+    style="width: {% widthratio record.ram_usage 1 100 %}%;">
+    <span class="progress-bar-text">
+      {% if record.byte_ram_usage != None %}
+        {% widthratio record.byte_ram_usage 1048576 1 %} MB
+      {% else %}
+        -
+      {% endif %}
+    </span>
+  </div>
+ </div>
+<style>
+  .progress {
+    position: relative;
+    width: 150px;
+    height: 16px;
+    margin-bottom: 4px;
+    margin-top: 0px;
+    background-image: linear-gradient(to bottom, #BBEBEB 0px, #F5F5F5 100%);
+  }
+  .progress-bar-text {
+    position: absolute;
+    display: block;
+    width: 100%;
+    color: white;
+    /* outline */
+    text-shadow:
+      -1px -1px 0 #000,
+      1px -1px 0 #000,
+      -1px 1px 0 #000,
+      1px 1px 0 #000;
+    font-size: 13px;
+  }
+</style>
+
+