[galaxy-dev] [hg] galaxy 2827: Improved paging UI for history grid and added ...

Greg Von Kuster greg at bx.psu.edu
Tue Oct 6 16:16:50 EDT 2009


details:   http://www.bx.psu.edu/hg/galaxy/rev/f648d6dec544
changeset: 2827:f648d6dec544
user:      jeremy goecks <jeremy.goecks at emory.edu>
date:      Mon Oct 05 15:07:20 2009 -0400
description:
Improved paging UI for history grid and added keyword 'all' for page varible. Specifying 'page=all' in URL string shows all items on single page.

3 file(s) affected in this change:

lib/galaxy/web/controllers/history.py
lib/galaxy/web/framework/helpers/grids.py
templates/history/grid.mako

diffs (148 lines):

diff -r e93da066b847 -r f648d6dec544 lib/galaxy/web/controllers/history.py
--- a/lib/galaxy/web/controllers/history.py	Mon Oct 05 10:35:39 2009 -0400
+++ b/lib/galaxy/web/controllers/history.py	Mon Oct 05 15:07:20 2009 -0400
@@ -125,6 +125,7 @@
         grids.GridColumnFilter( "All", args=dict( deleted='All' ) ),
     ]
     default_filter = dict( deleted="False", tags="All" )
+    num_rows_per_page = 50
     preserve_state = False
     use_paging = True
     def get_current_item( self, trans ):
diff -r e93da066b847 -r f648d6dec544 lib/galaxy/web/framework/helpers/grids.py
--- a/lib/galaxy/web/framework/helpers/grids.py	Mon Oct 05 10:35:39 2009 -0400
+++ b/lib/galaxy/web/framework/helpers/grids.py	Mon Oct 05 15:07:20 2009 -0400
@@ -25,7 +25,7 @@
     preserve_state = False
     
     use_paging = False
-    num_rows_per_page = 10
+    num_rows_per_page = 25
     
     # Set preference names.
     cur_filter_pref_name = ".filter"
@@ -123,15 +123,23 @@
         # Process page number.
         if self.use_paging:
             if 'page' in kwargs:
-                page_num = int( kwargs['page'] )
+                if kwargs['page'] == 'all':
+                    page_num = 0 
+                else:
+                    page_num = int( kwargs['page'] )
             else:
                 page_num = 1
                 
-            # Before modifying query, get the total number of rows that query returns so that the total number of pages can
-            # be computed.
-            total_num_rows = query.count()
-            query = query.limit( self.num_rows_per_page ).offset( ( page_num-1 ) * self.num_rows_per_page )
-            num_pages = int ( math.ceil( float( total_num_rows ) / self.num_rows_per_page ) )
+            if page_num == 0:
+                # Show all rows in page.
+                total_num_rows = query.count()
+                num_pages = 1
+            else:
+                # Show a limited number of rows. Before modifying query, get the total number of rows that query 
+                # returns so that the total number of pages can be computed.
+                total_num_rows = query.count()
+                query = query.limit( self.num_rows_per_page ).offset( ( page_num-1 ) * self.num_rows_per_page )
+                num_pages = int ( math.ceil( float( total_num_rows ) / self.num_rows_per_page ) )
         else:
             # Defaults.
             page_num = 1
diff -r e93da066b847 -r f648d6dec544 templates/history/grid.mako
--- a/templates/history/grid.mako	Mon Oct 05 10:35:39 2009 -0400
+++ b/templates/history/grid.mako	Mon Oct 05 15:07:20 2009 -0400
@@ -92,9 +92,8 @@
 
             t.autocomplete("${h.url_for( controller='tag', action='tag_autocomplete_data', item_class='History' )}", autocomplete_options);
 
-            //t.addClass("tag-input");
-
-            return t;
+            
+            $("#page-select").change(navigate_to_page);
         });
         ## Can this be moved into base.mako?
         %if refresh_frames:
@@ -141,6 +140,18 @@
             %>
             var url_base = "${url( url_args )}";
             var url = url_base.replace("TAGNAME", tag_name);
+            self.location = url;
+        }
+        
+        //
+        // Initiate navigation when user selects a page to view.
+        //
+        function navigate_to_page()
+        {
+            page_num = $(this).val();
+            <% url_args = {"page" : "PAGE"} %>
+            var url_base = "${url( url_args )}";
+            var url = url_base.replace("PAGE", page_num);
             self.location = url;
         }
         
@@ -207,6 +218,7 @@
     </form>
 </div>
 <form name="history_actions" action="${url()}" method="post" >
+    <input type="hidden" name="page" value="${cur_page_num}">
     <table class="grid">
         <thead>
             <tr>
@@ -300,19 +312,42 @@
             %endfor
         </tbody>
         <tfoot>
+            ## Row for navigating among pages.
             %if num_pages > 1:
                 <tr>
                     <td></td>
-                    <td colspan="100" style="text-align: right">
-                        Page: 
-                        %for page_index in range(1, num_pages + 1):
-                            %if page_index == cur_page_num:
-                                <span style="font-style: italic">${page_index}</span>
-                            %else:
-                                <% args = { "page" : page_index } %>
-                                <span><a href="${url( args )}">${page_index}</a></span>
-                            %endif
-                        %endfor
+                    <td colspan="100">
+                        Page ${cur_page_num} of ${num_pages} 
+                        &nbsp;&nbsp;&nbsp;&nbsp;Go to: 
+                        ## Next page link.
+                        %if cur_page_num != num_pages:
+                            <% args = { "page" : cur_page_num+1 } %>
+                            <span><a href="${url( args )}">Next</a></span>
+                        %endif
+                        ## Previous page link.
+                        %if cur_page_num != 1:
+                            <span>|</span>
+                            <% args = { "page" : cur_page_num-1 } %>
+                            <span><a href="${url( args )}">Previous</a></span>
+                        %endif
+                        ## Go to page select box.
+                        <span>| Select:</span>
+                        <select id="page-select" onchange="navigate_to_page()">
+                            <option value=""></option>
+                            %for page_index in range(1, num_pages + 1):
+                                %if page_index == cur_page_num:
+                                    continue
+                                %else:
+                                    <% args = { "page" : page_index } %>
+                                    <option value='${page_index}'>Page ${page_index}</option>
+                                %endif
+                            %endfor
+                        </select>
+                        ## Show all link.
+                        <% args = { "page" : "all" } %>
+                        <span>| <a href="${url( args )}">Show all histories on one page</a></span>
+                        
+                            
                     </td>
                 </tr>    
             %endif



More information about the galaxy-dev mailing list