dashboard: clean up index template

- fix vm list height
- permanent vm list button
- mark %d more buttons for translation (fixes #133)

circle/dashboard/static/dashboard/dashboard.css

@@ -607,3 +607,7 @@ footer a, footer a:hover, footer a:visited {
 #notifications-button {
   margin: 0;
 }
+
+#dashboard-vm-list {
+  min-height: 204px;
+}

circle/dashboard/static/dashboard/dashboard.js

@@ -237,9 +237,10 @@ $(function () {
     for(var i=0; i<5 && i<search_result.length; i++)
       html += generateVmHTML(search_result[i].pk, search_result[i].name, 
                              search_result[i].host, search_result[i].icon,
-                             search_result[i].status, search_result[i].fav);
+                             search_result[i].status, search_result[i].fav,
+                             (search_result.length < 5));
     if(search_result.length == 0)
-      html += '<div class="list-group-item">No result</div>';
+      html += '<div class="list-group-item list-group-item-last">' + gettext("No result") + '</div>';
     $("#dashboard-vm-list").html(html);
     $('.title-favourite').tooltip({'placement': 'right'});
 
@@ -263,8 +264,9 @@ $(function () {
   });
 });
 
-function generateVmHTML(pk, name, host, icon, _status, fav) {
-  return '<a href="/dashboard/vm/' + pk + '/" class="list-group-item">' +      
+function generateVmHTML(pk, name, host, icon, _status, fav, is_last) {
+  return '<a href="/dashboard/vm/' + pk + '/" class="list-group-item' +
+         (is_last ? ' list-group-item-last' : '') + '">' +      
         '<span class="index-vm-list-name">' + 
           '<i class="' + icon + '" title="' + _status + '"></i> ' + name +
         '</span>' + 

circle/dashboard/templates/dashboard/index-groups.html

@@ -17,16 +17,19 @@
         <div class="col-sm-6 col-xs-6 input-group input-group-sm">
           <input type="text" class="form-control" placeholder="{% trans "Search..." %}" />
           <div class="input-group-btn">
-            <button type="submit" class="form-control btn btn-primary" title="search"><i class="icon-search"></i></button>
+            <button type="submit" class="form-control btn btn-primary"><i class="icon-search"></i></button>
           </div>
         </div>
         <div class="col-sm-6 text-right">
-	  {% if more_groups >= 0 %}
           <a class="btn btn-primary btn-xs" href="{% url "dashboard.views.group-list" %}">
-            <i class="icon-chevron-sign-right"></i> <strong>{{ more_groups }}</strong>  more  
+            <i class="icon-chevron-sign-right"></i> 
+	    {% if more_groups > 0 %}
+              {% blocktrans with more=more_groups %}<strong>{{ more }}</strong>  more{% endblocktrans %}
+            {% else %}
+              {% trans "list" %} 
+            {% endif %}
           </a>
-	  {% endif %}
-          <a class="btn btn-success btn-xs group-create" href="#"><i class="icon-upload-alt"></i> {% trans "new" %} </a>
+          <a class="btn btn-success btn-xs group-create" href="#"><i class="icon-upload-alt"></i> {% trans "new" %}</a>
         </div>
       </div>
     </div>

circle/dashboard/templates/dashboard/index-vm.html

@@ -15,7 +15,8 @@
   <div class="list-group" id="vm-list-view">
     <div id="dashboard-vm-list">
       {% for i in instances %}
-      <a href="{{ i.get_absolute_url }}" class="list-group-item">
+      <a href="{{ i.get_absolute_url }}" class="list-group-item
+        {% if forloop.last and instances|length < 5 %} list-group-item-last{% endif %}">
         <span class="index-vm-list-name">
           <i class="{{ i.get_status_icon }}" title="{{ i.get_status_display }}"></i>
           {{ i.name }}
@@ -32,27 +33,37 @@
       </a>
       {% endfor %}
     </div>
+    <style>
+      .list-group-item-last {
+        border-bottom: 1px solid #ddd !important;
+      }
+    </style>
     <div href="#" class="list-group-item list-group-footer">
       <div class="row">
         <div class="col-sm-6 col-xs-6 input-group input-group-sm">
           <input id="dashboard-vm-search-input" type="text" class="form-control" placeholder="{% trans "Search..." %}" />
           <div class="input-group-btn">
-            <button type="submit" class="form-control btn btn-primary" title="search"><i class="icon-search"></i></button>
+            <button type="submit" class="form-control btn btn-primary"><i class="icon-search"></i></button>
           </div>
         </div>
         <div class="col-sm-6 text-right">
-          {% if more_instances > 0 %}
           <a class="btn btn-primary btn-xs" href="{% url "dashboard.views.vm-list" %}">
-            <i class="icon-chevron-sign-right"></i> {% blocktrans with count=more_instances %}<strong>{{ count }}</strong>  more{% endblocktrans %}
+            <i class="icon-chevron-sign-right"></i>
+            {% if more_instances > 0 %}
+              {% blocktrans with count=more_instances %}<strong>{{ count }}</strong>  more{% endblocktrans %}
+            {% else %}
+              {% trans "list" %}
+            {% endif %}
           </a>
-          {% endif %}
           <a class="btn btn-success btn-xs vm-create" href="{% url "dashboard.views.vm-create" %}"><i class="icon-plus-sign"></i> {% trans "new" %}</a>
         </div>
       </div>
     </div>
   </div>
   <div class="panel-body" id="vm-graph-view" style="display: none">
-    <p class="pull-right">  <input class="knob" data-fgColor="chartreuse" data-thickness=".4" data-max="{{ request.user.profile.instance_limit }}" data-width="100" data-height="100" data-readOnly="true" value="{{ instances|length|add:more_instances }}"></p>
+    <p class="pull-right">
+    <input class="knob" data-fgColor="chartreuse" data-thickness=".4" data-max="{{ request.user.profile.instance_limit }}" data-width="100" data-height="100" data-readOnly="true" value="{{ instances|length|add:more_instances }}">
+    </p>
     <p><span class="bigbig">{% blocktrans with count=running_vm_num %}<big>{{ count }}</big> running{% endblocktrans %}</span>
       <ul class="list-inline" style="max-height: 95px; overflow: hidden;">
         {% for vm in running_vms %}
@@ -69,7 +80,7 @@
     <div>
       <a style="float: right; margin-top: 17px;" href="{% url "dashboard.views.vm-list" %}" class="btn btn-primary btn-xs">
         <i class="icon-chevron-sign-right"></i> 
-        <strong>{{ instances|length|add:more_instances }}</strong>  machines  total
+        {% blocktrans with count=instances|length|add:more_instances %}<strong>{{ count }}</strong> machines total{% endblocktrans %}
       </a> 
       <p class="big text-warning">{% blocktrans with count=stopped_vm_num %}<big>{{ count }}</big> stopped{% endblocktrans %}</p>
     </div>