dashboard: show only first 10 activity

0fc357cf · Kálmán Viktor · 8b3c49e3 · 0fc357cf · 0fc357cf · 0fc357cf
Commit 0fc357cf authored Jul 24, 2014 by Kálmán Viktor
6 changed files
--- a/circle/dashboard/static/dashboard/dashboard.css
+++ b/circle/dashboard/static/dashboard/dashboard.css
@@ -751,3 +751,7 @@ textarea[name="list-new-namelist"] {
 #group-detail-permissions input[type="submit"]{
  margin-top: -6px;
 }
+#show-all-activities-container {
+  margin: 20px 0 0 10px;
+}
--- a/circle/dashboard/static/dashboard/vm-details.js
+++ b/circle/dashboard/static/dashboard/vm-details.js
+var show_all = false;
+var in_progress = false;
 $(function() {
  /* do we need to check for new activities */
  if(decideActivityRefresh()) {
-    checkNewActivity(false, 1);
+    if(!in_progress) {
+      checkNewActivity(1);
+      in_progress = true;
+    }
  }
  $('a[href="#activity"]').click(function(){
    $('a[href="#activity"] i').addClass('fa-spin');
-    checkNewActivity(false, 1);
+    if(!in_progress) {
+      checkNewActivity(1);
+      in_progress = true;
+    }
+  });
+  $("#activity-refresh").on("click", "#show-all-activities", function() {
+    show_all = !show_all;
+    $('a[href="#activity"]').trigger("click");
+    return false;
  });
  /* save resources */
@@ -134,11 +150,6 @@ $(function() {
    return false;
  });
-  /* show help */
-  $(".vm-details-help-button").click(function() {
-    $(".vm-details-help").stop().slideToggle();
-  });
  /* for interface remove buttons */
  $('.interface-remove').click(function() {
    var interface_pk = $(this).data('interface-pk');
@@ -320,7 +331,7 @@ function removePort(data) {
 function decideActivityRefresh() {
  var check = false;
  /* if something is still spinning */
-  if($('.timeline .activity:first i:first').hasClass('fa-spin'))
+  if($('.timeline .activity i').hasClass('fa-spin'))
    check = true;
  /* if there is only one activity */
  if($('#activity-timeline div[class="activity"]').length < 2)
@@ -340,25 +351,21 @@ function changeHTML(html) {
  return html.replace(/data-original-title/g, "title").replace(/title=""/g, "").replace(/\//g, '').replace(/ /g, '');
 }
-function checkNewActivity(only_status, runs) {
+function checkNewActivity(runs) {
-  // set default only_status to false
-  only_status = typeof only_status !== 'undefined' ? only_status : false;
  var instance = location.href.split('/'); instance = instance[instance.length - 2];
  $.ajax({
    type: 'GET',
    url: '/dashboard/vm/' + instance + '/activity/',
-    data: {'only_status': only_status},
+    data: {'show_all': show_all},
    success: function(data) {
-      if(!only_status) {
      a = unescapeHTML(data['activities']);
-        b = changeHTML($("#activity-timeline").html());
+      b = changeHTML($("#activity-refresh").html());
      if(a != b)
-          $("#activity-timeline").html(data['activities']);
+        $("#activity-refresh").html(data['activities']);
      $("#ops").html(data['ops']);
      $("#disk-ops").html(data['disk_ops']);
      $("[title]").tooltip();
-      }
      $("#vm-details-state i").prop("class", "fa " + data['icon']);
      $("#vm-details-state span").html(data['human_readable_status'].toUpperCase());
@@ -378,14 +385,16 @@ function checkNewActivity(only_status, runs) {
      if(runs > 0 && decideActivityRefresh()) {
        setTimeout(
-          function() {checkNewActivity(only_status, runs + 1)}, 
+          function() {checkNewActivity(runs + 1)}, 
          1000 + Math.exp(runs * 0.05)
        );
+      } else {
+        in_progress = false;
      }
      $('a[href="#activity"] i').removeClass('fa-spin');
    },
    error: function() {
+      in_progress = false;
    }
  });
 }
--- a/circle/dashboard/templates/dashboard/instanceactivity_detail.html
+++ b/circle/dashboard/templates/dashboard/instanceactivity_detail.html
@@ -20,9 +20,9 @@
          <span>{{ object.get_status_id|upper }}</span>
        </span>
      </div>
-      <div id="vm-activity-context" class="timeline">
      {% include "dashboard/vm-detail/_activity-timeline.html" with active=object %}
-      </div>
    </div>
    <div class="col-md-8">
      <div class="panel panel-default">

--- a/circle/dashboard/templates/dashboard/vm-detail/_activity-timeline.html
+++ b/circle/dashboard/templates/dashboard/vm-detail/_activity-timeline.html
 {% load i18n %}
+<div id="activity-timeline" class="timeline">
 {% for a in activities %}
 <div class="activity{% if a.pk == active.pk %} activity-active{%endif%}" data-activity-id="{{ a.pk }}">
  <span class="timeline-icon{% if a.has_failed %} timeline-icon-failed{% endif %}">
@@ -7,7 +10,7 @@
 <strong{% if a.result %} title="{{ a.result.get_user_text }}"{% endif %}>
  <a href="{{ a.get_absolute_url }}">
    {% if a.times > 1 %}({{ a.times }}x){% endif %}
-    {{ a.readable_name.get_user_text }}</a>
+    {{ a.readable_name.get_user_text|capfirst }}</a>
 {% if a.has_percent %}
  - {{ a.percentage }}%
@@ -32,7 +35,7 @@
      <div data-activity-id="{{ s.pk }}" class="sub-activity{% if s.has_failed %} sub-activity-failed{% endif %}{% if s.pk == active.pk %} sub-activity-active{% endif %}">
        <span{% if s.result %} title="{{ s.result.get_user_text }}"{% endif %}>
          <a href="{{ s.get_absolute_url }}">
-              {{ s.readable_name.get_user_text }}</a></span> &ndash;
+              {{ s.readable_name.get_user_text|capfirst }}</a></span> &ndash;
        {% if s.finished %}
          {{ s.finished|time:"H:i:s" }}
        {% else %}
@@ -47,3 +50,16 @@
  {% endif %}
 </div>
 {% endfor %}
+</div>
+{% if show_show_all %}
+<div id="show-all-activities-container">
+  <a id="show-all-activities" href="#">
+    {% if activities|length > 10 %}
+      <span>{% trans "Show less activities" %}</span>
+    {% else %}
+      <span>{% trans "Show all activities" %}</span>
+    {% endif %}
+  </a>
+</div>
+{% endif %}
--- a/circle/dashboard/templates/dashboard/vm-detail/activity.html
+++ b/circle/dashboard/templates/dashboard/vm-detail/activity.html
@@ -2,6 +2,6 @@
 <h3>{% trans "Activity" %}</h3>
-<div id="activity-timeline" class="timeline">
+<div id="activity-refresh">
  {% include "dashboard/vm-detail/_activity-timeline.html" %}
 </div>
--- a/circle/dashboard/views.py
+++ b/circle/dashboard/views.py
@@ -272,8 +272,11 @@ class VmDetailView(CheckedDetailView):
        })
        # activity data
-        context['activities'] = self.object.get_merged_activities(
+        activities = instance.get_merged_activities(self.request.user)
-            self.request.user)
+        show_show_all = len(activities) > 10
+        activities = activities[:10]
+        context['activities'] = activities
+        context['show_show_all'] = show_show_all
        context['vlans'] = Vlan.get_objects_with_level(
            'user', self.request.user
@@ -2386,15 +2389,20 @@ def vm_activity(request, pk):
        raise PermissionDenied()
    response = {}
-    only_status = request.GET.get("only_status", "false")
+    show_all = request.GET.get("show_all", "false") == "true"
+    activities = instance.get_merged_activities(request.user)
+    show_show_all = len(activities) > 10
+    if not show_all:
+        activities = activities[:10]
    response['human_readable_status'] = instance.get_status_display()
    response['status'] = instance.status
    response['icon'] = instance.get_status_icon()
-    if only_status == "false":  # instance activity
    context = {
        'instance': instance,
-            'activities': instance.get_merged_activities(request.user),
+        'activities': activities,
+        'show_show_all': show_show_all,
        'ops': get_operations(instance, request.user),
    }