bitbake: toaster: use cookies for count and sorting in templates tables

Until now cookies were used to save which columns were shown and which
were hidden in toaster tables. The tables from the templates also have
functionalities like sorting the entries on a certain column and
limiting the number of entries displayed on a page. The later however
were not saved using cookies. This patch brings this new feature.

The cookies are not saved only in the front-end. They are saved both
in the frontend in case the user uses the inputs/buttons to change
a parameter and also in the backend in case the user specifies manually
using GET variables the value of the parameters.

When no GET parameters are given the views will redirect the url to one
containg the parameters saved as cookies. When no cookies exist, default
values will be used.

[YOCTO #6126]

(Bitbake rev: 880b58c845e3a501fa90d24e1bd89c87ca84b709)

Signed-off-by: Marius Avram <marius.avram@intel.com>
Signed-off-by: Richard Purdie <richard.purdie@linuxfoundation.org>

2 files changed, 21 insertions, 5 deletions

diff --git a/bitbake/lib/toaster/toastergui/templates/basetable_bottom.html b/bitbake/lib/toaster/toastergui/templates/basetable_bottom.html
index ac14363798..cbdc164273 100644
--- a/bitbake/lib/toaster/toastergui/templates/basetable_bottom.html
+++ b/bitbake/lib/toaster/toastergui/templates/basetable_bottom.html
@@ -26,7 +26,7 @@
                             <span class="help-inline" style="padding-top:5px;">Show rows:</span>
                             <select style="margin-top:5px;margin-bottom:0px;" class="pagesize">
   {% with "2 5 10 25 50 100" as list%}
-    {% for i in list.split %}<option{%if i == request.GET.count %} selected{%endif%}>{{i}}</option>
+    {% for i in list.split %}<option value="{{i}}">{{i}}</option>
     {% endfor %}
   {% endwith %}
                             </select>
@@ -56,6 +56,14 @@
     }
     }
 
+    // load cookie for number of entries to be displayed on page
+    pagesize = $.cookie('count');
+    if (!pagesize)
+        pagesize = 10;
+    $('.pagesize option').prop('selected', false)
+                         .filter('[value="' + pagesize + '"]')
+                         .attr('selected', true);
+
     $('.chbxtoggle').each(function () {
         showhideTableColumn($(this).attr('id'), $(this).is(':checked'))
     });
@@ -72,8 +80,9 @@
     $('.progress, .lead span').tooltip({container:'table', placement:'top'});
 
     $(".pagesize").change(function () {
-        console.log("page size change");
-        reload_params({"count":$(this).val()}); ;
+        reload_params({"count":$(this).val()});
+        // save cookie with pagesize
+        $.cookie("count", $(this).val(), { path : $(location).attr('pathname') });
     });
 });
 </script>
diff --git a/bitbake/lib/toaster/toastergui/templates/basetable_top.html b/bitbake/lib/toaster/toastergui/templates/basetable_top.html
index 1231e1f924..037554b627 100644
--- a/bitbake/lib/toaster/toastergui/templates/basetable_top.html
+++ b/bitbake/lib/toaster/toastergui/templates/basetable_top.html
@@ -156,6 +156,13 @@
         showhideImmediateTableAction( clname, sh, orderkey );
     }
 
+    //
+    // saves a cookie with selected order field
+    //
+    function saveOrderCookie( orderfield ) {
+        $.cookie("orderby", orderfield, { path: $(location).attr('pathname') });
+    }
+
     </script>
 
 <!-- control header -->
@@ -205,7 +212,7 @@
                 <span class="help-inline" style="padding-top:5px;">Show rows:</span>
                 <select style="margin-top:5px;margin-bottom:0px;" class="pagesize">
   {% with "2 5 10 25 50 100" as list%}
-{% for i in list.split %}                    <option{%if i == request.GET.count %} selected{%endif%}>{{i}}</option>
+{% for i in list.split %}                    <option value="{{i}}">{{i}}</option>
     {% endfor %}
   {% endwith %}
                 </select>
@@ -221,7 +228,7 @@
         <tr>
             {% for tc in tablecols %}<th class="{{tc.dclass}} {{tc.clclass}}">
                 {%if tc.qhelp%}<i class="icon-question-sign get-help" title="{{tc.qhelp}}"></i>{%endif%}
-                {%if tc.orderfield%}<a {%if tc.ordericon%} class="sorted" {%endif%}href="javascript:reload_params({'page': 1, 'orderby' : '{{tc.orderfield}}' })" >{{tc.name}}</a>{%else%}<span class="muted">{{tc.name}}</span>{%endif%}
+                {%if tc.orderfield%}<a {%if tc.ordericon%} class="sorted" {%endif%}href="javascript:reload_params({'page': 1, 'orderby' : '{{tc.orderfield}}' })" onclick="saveOrderCookie('{{tc.orderfield}}')">{{tc.name}}</a>{%else%}<span class="muted">{{tc.name}}</span>{%endif%}
                 {%if tc.ordericon%} <i class="icon-caret-{{tc.ordericon}}"></i>{%endif%}
                 {%if tc.filter%}<div class="btn-group pull-right">
                     <a href="#filter_{{tc.filter.class}}" role="button" class="btn btn-mini {%if request.GET.filter%}{{tc.filter.options|filtered_icon:request.GET.filter}} {%endif%}" {%if request.GET.filter and tc.filter.options|filtered_tooltip:request.GET.filter %} title="<p>{{tc.filter.options|filtered_tooltip:request.GET.filter}}</p><p><a class='btn btn-small btn-primary' href=javascript:reload_params({'filter':''})>Show all {% if filter_search_display %}{{filter_search_display}}{% else %}{{objectname}}{% endif %}</a></p>" {%endif%} data-toggle="modal"> <i class="icon-filter filtered"></i> </a>