563146be9664746e041d2629fbae46f86283ac6a
kate
  Mon Jan 25 15:37:03 2016 -0800
Persist ordering in tissue table (using sortOrder cart var)

diff --git src/hg/js/utils.js src/hg/js/utils.js
index 65e7f48..19fb730 100644
--- src/hg/js/utils.js
+++ src/hg/js/utils.js
@@ -1744,31 +1744,36 @@
         if (sortTable.loadingId)
             hideLoadingImage(sortTable.loadingId);
     },
 
     sortByColumns: function (tbody,sortColumns)
     {   // Will sort the table based on the abbr values on a set of <TH> colIds
         // Expects tbody to not sort thead, but could take table
 
         // Used to use 'sorting' class, but showLoadingImage results in much less screen redrawing
         // For IE especially this was difference between dead/timedout scripts and working sorts!
         var id = $(tbody).attr('id');
         if (!id || id.length === 0) {
             $(tbody).attr('id',"tbodySort"); // Must have some id!
             id = $(tbody).attr('id');
         }
+        if ($(tbody).css('display') === 'none') {
+            // suppress loading image if element is hidden (and consequently has no position)
+            sortTable.loadingId = null;
+        } else {
             sortTable.loadingId = showLoadingImage(id);
+        }
         sortTable.tbody=tbody;
         sortTable.columns=sortColumns;
         // This allows hiding the rows while sorting!
         setTimeout(function() { 
                         sortTable.sort(sortTable.tbody,sortTable.columns); 
                     },50); 
     },
 
     trAlternateColors: function (tbody,rowGroup,cellIx)
     {   // Will alternate colors for visible table rows.
         // If cellIx(s) provided then color changes when the column(s) abbr or els innerHtml changes
         // If no cellIx is provided then alternates on rowGroup (5= change color 5,10,15,...)
         // Expects tbody to not color thead, but could take table
         var darker   = false; // === false will trigger first row to be change color = darker
 
@@ -2150,30 +2155,32 @@
     //          NOTE: If no sup is found but addSuperscript is requested, then they will be added.
     // TBODY.sortable: (NOTE: created if not found) The TBODY class='sortable' contains the
     //                 table rows that get sorted:
     //                 TBODY->TR & ->TD: Each row contains a TD for each sortable column.
     //                 The innerHTML (entire contents) of the cell will be used for sorting.
     //   TRICK: You can use the 'abbr' field to subtly alter the sortable contents.
     //          Otherwise sorts on td contents ($(td).text()).  Use the abbr field to make
     //          case-insensitive sorts or force exceptions to alpha-text order 
     //          (such as ZCTRL vs Control forcing controls to bottom). e.g.:
     //             <TD id='wgEncodeBroadHist...' nowrap abbr='ZCTRL' align='left'>Control</TD>
     //          IMPORTANT: You must add abbr='use' to the TH.sortable definitions.
     // Finally if you want the tableSort to alternate the table row colors
     // (using #FFFEE8 and #FFF9D2) then TBODY.sortable should also have class 'altColors'
     // NOTE: This class can be added by using the altColors option to this function
     // To override, specify <TBODY class='sortable noAltColors'>
+    // NOTE: Add class 'initBySortOrder' to have an sort by column performed at document initialization time, using
+    // the saved sortOrder cart variable 
     
         if (altColors === undefined || altColors === null) // explicitly default this boolean
             altColors = false;
 
         if ($(table).hasClass('sortable') === false) {
             warn('Table is not sortable');
             return;
         }
         var tr = $(table).find('tr.sortable')[0];
         if (!tr) {
             tr = $(table).find('tr')[0];
             if (!tr) {
                 warn('Sortable table has no rows');
                 return;
             }
@@ -2242,34 +2249,38 @@
                     function () { $(this).css( { backgroundColor: '#FCECC0', cursor: '' } ); }
                 );
             }
             if ( $(this).attr('title').length === 0) {
                 var title = $(this).text().replace(/[^a-z0-9 ]/ig,'');
                 if (title.length > 0 && $(this).find('sup'))
                     title = title.replace(/[0-9]$/g,'');
                 if (title.length > 0)
                     $(this).attr('title',"Sort list on '" + title + "'." );
                 else
                     $(this).attr('title',"Sort list on column." );
             }
         });
         // Now update all of those cells
         sortTable.orderUpdate(table,sortColumns,addSuperscript);
+        if ($(tbody).hasClass('initBySortOrder')) {
+            sortTable.sortByColumns(tbody,sortColumns);
+        }
 
         // Alternate colors if requested
-        if (altColors)
+        if (altColors) {
             sortTable.alternateColors(tbody);
+        }
 
         // Highlight rows?  But on subtrack list, this will mess up "metadata dropdown" coloring.
         // So just exclude tables with drag and drop
         if ($(table).hasClass('tableWithDragAndDrop') === false) {
             $('tbody.sortable').find('tr').hover(
                 function(){ $(this).addClass('bgLevel3');
                             $(this).find('table').addClass('bgLevel3'); },
                 function(){ $(this).removeClass('bgLevel3');
                             $(this).find('table').removeClass('bgLevel3'); }
             );
         }
 
         // Finally, make visible
         $(tbody).removeClass('sorting');
         $(tbody).show();