rebaseline-server: sorting of columns (asc/desc) in frontend.

gm/rebaseline_server/static/loader.js

Index: gm/rebaseline_server/static/loader.js
diff --git a/gm/rebaseline_server/static/loader.js b/gm/rebaseline_server/static/loader.js
index 1ec7305dc6532fbe4d27d21b790352dd2caea61b..b1558c08c42891b3ac991cba32b661b922d8ccf6 100644
--- a/gm/rebaseline_server/static/loader.js
+++ b/gm/rebaseline_server/static/loader.js
@@ -130,6 +130,9 @@ Loader.controller(
     $scope.resultsToLoad = $location.search().resultsToLoad;
     $scope.loadingMessage = "please wait...";
 
+    var currSortAsc = true; 
+
+
     /**
      * On initial page load, load a full dictionary of results.
      * Once the dictionary is loaded, unhide the page elements so they can
@@ -167,8 +170,11 @@ Loader.controller(
           $scope.orderedColumnNames = data[constants.KEY__ROOT__EXTRACOLUMNORDER];
           $scope.imagePairs = data[constants.KEY__ROOT__IMAGEPAIRS];
           $scope.imageSets = data[constants.KEY__ROOT__IMAGESETS];
+
+          // set the default sort column and make it ascending.
           $scope.sortColumnSubdict = constants.KEY__IMAGEPAIRS__DIFFERENCES;
           $scope.sortColumnKey = constants.KEY__DIFFERENCES__PERCEPTUAL_DIFF;
+          currSortAsc = true;
 
           $scope.showSubmitAdvancedSettings = false;
           $scope.submitAdvancedSettings = {};
@@ -287,6 +293,8 @@ Loader.controller(
             }
           );
 
+
+          // show the table and sort it ascending by 
           $scope.readyToDisplay = true;
           $scope.updateResults();
           $scope.loadingMessage = "";
@@ -597,7 +605,6 @@ Loader.controller(
       // another copy of the array.  Is there a way we can filter out
       // the imagePairs as they are displayed, rather than storing multiple
       // array copies?  (For better performance.)
-
       if ($scope.viewingTab == $scope.defaultTab) {
 
         // TODO(epoger): Until we allow the user to reverse sort order,
@@ -608,6 +615,8 @@ Loader.controller(
             ($scope.sortColumnKey ==
              constants.KEY__DIFFERENCES__PERCEPTUAL_DIFF));
 
+        doReverse = !currSortAsc;
+
         $scope.filteredImagePairs =
             $filter("orderBy")(
                 $filter("removeHiddenImagePairs")(
@@ -616,7 +625,8 @@ Loader.controller(
                     $scope.showingColumnValues,
                     $scope.viewingTab
                 ),
-                [$scope.getSortColumnValue, $scope.getSecondOrderSortValue],
+                // [$scope.getSortColumnValue, $scope.getSecondOrderSortValue],
+                $scope.getSortColumnValue,
                 doReverse);
         $scope.limitedImagePairs = $filter("mergeAndLimit")(
             $scope.filteredImagePairs, $scope.displayLimit, $scope.mergeIdenticalRows);
@@ -628,7 +638,8 @@ Loader.controller(
                     {tab: $scope.viewingTab},
                     true
                 ),
-                [$scope.getSortColumnValue, $scope.getSecondOrderSortValue]);
+                // [$scope.getSortColumnValue, $scope.getSecondOrderSortValue]);
+                $scope.getSortColumnValue);
         $scope.limitedImagePairs = $filter("mergeAndLimit")(
             $scope.filteredImagePairs, -1, $scope.mergeIdenticalRows);
       }
@@ -645,7 +656,7 @@ Loader.controller(
     $scope.resultsUpdatedCallback = function() {
       $scope.renderEndTime = window.performance.now();
       $log.debug("renderEndTime: " + $scope.renderEndTime);
-    }
+    };
 
     /**
      * Re-sort the displayed results.
@@ -656,10 +667,32 @@ Loader.controller(
      * @param key (string): sort by value associated with this key in subdict
      */
     $scope.sortResultsBy = function(subdict, key) {
-      $scope.sortColumnSubdict = subdict;
-      $scope.sortColumnKey = key;
+      if ((subdict === $scope.sortColumnSubdict) && ($scope.sortColumnKey === key)) {

[epoger, 2014/08/07 13:58:29]

Maybe add comment, like...

// If we are already sorting by this column, toggle the sort order.

[stephana, 2014/08/07 15:52:22]

Done.

+        currSortAsc = !currSortAsc;
+      } else {
+        $scope.sortColumnSubdict = subdict;
+        $scope.sortColumnKey = key;
+        currSortAsc = true; 
+      }
       $scope.updateResults();
-    }
+    };
+
+    /**
+     * Returns ASC or DESC (from constants) if currently the data
+     * is sorted by the provided column. 
+     *
+     * @param colName: name of the column for which we need to get the class.
+     */
+
+    $scope.sortedByColumnsCls = function (colName) {
+      if ($scope.sortColumnKey !== colName) {
+        return '';
+      }
+
+      var result = (currSortAsc) ? constants.ASC : constants.DESC;
+      console.log("sort class:", result);
+      return result;
+    };
 
     /**
      * For a particular ImagePair, return the value of the column we are
@@ -676,7 +709,7 @@ Loader.controller(
       } else {
         return undefined;
       }
-    }
+    };

[epoger, 2014/08/07 13:58:29]

Nit: I see that we don't have semicolons at the end of other function
declarations.  Does it matter one way or the other?

[stephana, 2014/08/07 15:52:22]

Well they should be at the other functions as well. 
In this particular case you are actually making an assignment (versus declaring
a function). Assignments should end with a semicolon. 
(see
http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml#Semicolons)

 
     /**
      * For a particular ImagePair, return the value we use for the