Added a moving dot gif to response to indicate ongoing activity

[flowspy] / templates / user_routes.html

diff --git a/templates/user_routes.html b/templates/user_routes.html
index cd1fa49..d25460c 100644 (file)
--- a/templates/user_routes.html
+++ b/templates/user_routes.html
@@ -32,8 +32,6 @@ $(document).ready(function(){
             Cancel: function(){
                 $('#dialog').dialog('close');
             },
-        
-        
         },
         close: function(){
             update_val = $("#hid_mid").val();
@@ -48,6 +46,7 @@ $(document).ready(function(){
         width: 800,
         modal: true,
         autoOpen: false,
+               overlay: { opacity: 0.5, background: 'black'},
         close: function(){
             update_val = $("#hid_mid").val();
             if (update_val == 'UPDATED') {
@@ -56,7 +55,39 @@ $(document).ready(function(){
             }
         }
     });
-    
+    $('#console').parent().css('opacity', 0.9);
+       $('#console').parent().css('filter', 'alpha(opacity=90)');
+       $(".button_place #routebutton").button({
+        icons: {
+            primary: "ui-icon-circle-plus"
+        },
+    });
+    $(".edit_button").button({
+        icons: {
+            primary: "ui-icon-wrench"
+        },
+    }).css('width','100px');;
+    $(" .del_button").button({
+        icons: {
+            primary: "ui-icon-circle-close"
+        },
+    }).click(function(){
+        $('#dialog').dialog('open');
+        return false;
+    }).css('width','100px');
+    $("#consolebutton").button({
+        icons: {
+            primary: "ui-icon-image"
+        },
+    }).click(function(){
+        $("#consolebutton").stop().stop();
+        $("#consolebutton").css('color', '#555555');
+        $('#console').dialog('open');
+        return false;
+    });
+       $(".statustootipclass").tooltip();
+    $(".expiresclass").tooltip();
+       $(".commentclass").tooltip();
     var oTable = $('#routes_table').dataTable({
         "bJQueryUI": true,
         "aoColumns": [{
@@ -95,47 +126,13 @@ $(document).ready(function(){
         },
         "iDisplayLength": 25,
     });
-    
     oTable.fnDraw();
-    
     $('input[name="status_filter"]').click(function(){
-    
         //slice off the last '|' or it doesn't work
         //also be sure to use the third parameter
     });
     
-    $(".button_place #routebutton").button({
-        icons: {
-            primary: "ui-icon-circle-plus"
-        },
-    });
-    $(".edit_button").button({
-        icons: {
-            primary: "ui-icon-wrench"
-        },
-    }).css('width','100px');;
-    $(" .del_button").button({
-        icons: {
-            primary: "ui-icon-circle-close"
-        },
-    }).click(function(){
-        $('#dialog').dialog('open');
-        return false;
-    }).css('width','100px');
-    $("#consolebutton").button({
-        icons: {
-            primary: "ui-icon-image"
-        },
-    }).click(function(){
-        $("#consolebutton").stop().stop();
-        $("#consolebutton").css('color', '#555555');
-        $('#console').dialog('open');
-        return false;
-    });
     
-       $(".statustootipclass").tooltip();
-    $(".expiresclass").tooltip();
-       $(".commentclass").tooltip();
     var reg_exp = '';
     var checkboxs = document.getElementsByName('status_filter');
     for (var i = 0, inp; inp = checkboxs[i]; i++) {
@@ -213,6 +210,7 @@ function delete_route(route){
 {% endblock %}
 {% block title %}{% trans "My rules" %}{% endblock %}
 {% block content %}
+{% csrf_token %}
 <div style="float:left">
        <h3 style="margin-top: 0px;">{% trans "My rules" %}</h3>
 </div>
@@ -225,7 +223,7 @@ function delete_route(route){
 <table cellpadding="0" cellspacing="0" border="0" class="display" style='width:200px;'>
                                <tbody>
                                        <tr>
-                                       <th>ACTIVE</th><th>SUSPENDED</th><th>OUTOFSYNC</th><th>ERROR</th><th>PENDING</th>
+                                       <th>ACTIVE</th><th>SUSPENDED</th><th>ERROR</th><th>PENDING</th>
                                        </tr>
                                        <tr class="on_off">
                                        <td>
@@ -234,12 +232,7 @@ function delete_route(route){
                                    
                                        <td>
                                            <input type="checkbox" class="onoff" name="status_filter" value="SUSPENDED" id="show_inactive"/>
-                                       </td>
-                                  
-                                       <td>
-                                           <input type="checkbox" class="onoff" name="status_filter" value="OUTOFSYNC" id="show_outofsync"/>
-                                       </td>
-                                   
+                                       </td>                               
                                        <td>
                                            <input type="checkbox" class="onoff" name="status_filter" value="ERROR" id="show_error"/>
                                        </td>
@@ -251,7 +244,6 @@ function delete_route(route){
                                </tbody>
                        </table>
                        </div>
-       <table class="display" width="100%" id="nodes_table">
 <table class="display" width="100%" id="routes_table">
 <thead>
 <tr>
@@ -273,26 +265,19 @@ function delete_route(route){
 
 <tr class="GradeC" >
        <td>{{ route.pk }}</td>
-       <td><span {% if route.comments %}
-       class="commentclass" 
-               style="border-bottom:1px dotted red;" 
-        title="{{route.comments}}"
-               {% endif %}>{{ route.name }}</span></td>
+       <td><span {% if route.comments %} class="commentclass" style="border-bottom:1px dotted red;" title="{{route.comments}}" {% endif %}>{{ route.name }}</span></td>
        <td>{{ route.get_match|safe|escape }}</td>
        <td style="text-align: center;">{{route.get_then|safe|escape}}</td>
-       <td style="text-align: center; "><span 
-               {% if route.status == 'EXPIRED' or route.status == 'ADMININACTIVE' or route.status == 'INACTIVE' %}
-           class="statustootipclass" 
-               style="border-bottom:1px dotted red;" 
-               title = "{% ifequal route.status 'INACTIVE' %}Suspended by user{% else %}{% ifequal route.status 'ADMININACTIVE' %}Suspended by administrator{% else %}{% ifequal route.status 'EXPIRED' %}Suspended due to expiration{% endifequal %}{% endifequal %}{% endifequal %}"{% endif %}>{% if route.status == 'EXPIRED' or route.status == 'ADMININACTIVE' or route.status == 'INACTIVE' %}SUSPENDED{% else %}{{route.status}}{% endif %}</span></td>
+       <td style="text-align: center; "><span {% if route.status == 'EXPIRED' or route.status == 'ADMININACTIVE' or route.status == 'INACTIVE' or route.status == 'OUTOFSYNC'%} class="statustootipclass" style="border-bottom:1px dotted red;" 
+               title = "{% ifequal route.status 'INACTIVE' %}Suspended by user{% else %}{% ifequal route.status 'ADMININACTIVE' %}Suspended by administrator{% else %}{% ifequal route.status 'EXPIRED' %}Suspended due to expiration{% else %}{% ifequal route.status 'OUTOFSYNC' %}Syncronization error. Configuration in device deffers from rule{% endifequal %}{% endifequal %}{% endifequal %}{% endifequal %}"{% endif %}>{% if route.status == 'EXPIRED' or route.status == 'ADMININACTIVE' or route.status == 'INACTIVE' %}SUSPENDED{% else %}{% if route.status == 'OUTOFSYNC' %}ERROR{% else %}{{route.status}}{% endif %}{% endif %}</span></td>
        {% comment %}<td style="text-align: center;">{{ route.response }}</td>{% endcomment %}
        <td style="text-align: center;">{{ route.applier }}</td>
-       <td style="text-align: center;"><span {% if route.days_to_expire %}
+       <td style="text-align: center;"><span {% if route.status == 'EXPIRED' or route.status == 'ADMININACTIVE' or route.status == 'INACTIVE' or route.status == 'OUTOFSYNC'%}{% else %}{% if route.days_to_expire %}
                class="expiresclass" 
                style="border-bottom:2px dashed red;" 
         title="Expires {% ifequal route.days_to_expire '0' %}today{% else%}in {{route.days_to_expire}} day{{ route.days_to_expire|pluralize }}{% endifequal %}"
-               {% endif %}>{{ route.expires }}</span></td>
-       <td style="text-align: center;">{{ route.response }}</td>
+               {% endif %}{% endif %}>{{ route.expires }}</span></td>
+       <td style="text-align: center;">{% if route.status == 'EXPIRED' %}Rule expired{% else %}{% if route.status == 'ADMININACTIVE' %}Suspended by administrator{% else %}{% if route.status == 'INACTIVE' %}Suspended by user{% else %}{{ route.response }}{% if route.status == 'PENDING' %}<img src="/static/dots.gif">{% endif %}{% endif %}{% endif %}{% endif %}</td>
        <td style="text-align: center; width:180px;">
                {% ifequal route.status 'ACTIVE' %}
                <a href="{% url edit-route route.name %}" class="edit_button" id="edit_button_{{route.pk}}">Edit</a>