From 8b9883ba3da4954aad1abc80bec6a20ba8348f7f Mon Sep 17 00:00:00 2001
From: "Kenneth G. Franqueiro" <kfranqueiro@sitepen.com>
Date: Thu, 20 Oct 2011 11:56:33 -0400
Subject: [PATCH] Refactor sort to additionally support passing a sort options
 array

This enables us to run criteria passed via queryOptions to OnDemandList
through the sort function of the list/grid, which in the case of Grid,
also updates the sort arrow in the UI.

It might also enable us to consider supporting nested sort via a
plugin in the future.  Haven't thought too hard about that yet.
---
 Grid.js                 | 12 ++++++++++--
 List.js                 | 18 +++++++++++++++++-
 OnDemandList.js         | 13 ++++++++-----
 test/test_OnDemand.html | 11 +++++++----
 4 files changed, 42 insertions(+), 12 deletions(-)

diff --git a/Grid.js b/Grid.js
index 52e256773..697b81aa7 100644
--- a/Grid.js
+++ b/Grid.js
@@ -258,6 +258,14 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "./Edit
 			// summary:
 			//		Extension of List.js sort to update sort arrow in UI
 			
+			var prop = property, desc = descending;
+			
+			// If a full-on sort array was passed, only handle the first criteria
+			if(typeof property != "string"){
+				prop = property[0].attribute;
+				desc = property[0].descending;
+			}
+			
 			// if we were invoked from a header cell click handler, grab
 			// stashed target node; otherwise (e.g. direct sort call) need to look up
 			var target = this._sortNode, columns, column, i;
@@ -265,7 +273,7 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "./Edit
 				columns = this.columns;
 				for(i in columns){
 					column = columns[i];
-					if(column.field == property){
+					if(column.field == prop){
 						target = column.headerNode;
 					}
 				}
@@ -282,7 +290,7 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "./Edit
 				// place sort arrow under clicked node, and add up/down sort class
 				this._lastSortedArrow = put(target.firstChild, "-div.dgrid-sort-arrow.ui-icon[role=presentation]");
 				this._lastSortedArrow.innerHTML = "&nbsp;";
-				put(target, descending ? ".dgrid-sort-down" : ".dgrid-sort-up");
+				put(target, desc ? ".dgrid-sort-down" : ".dgrid-sort-up");
 				// call resize in case relocation of sort arrow caused any height changes
 				this.resize();
 				
diff --git a/List.js b/List.js
index 647365ca0..e4b3e920c 100644
--- a/List.js
+++ b/List.js
@@ -400,9 +400,25 @@ function(put, declare, listen, aspect, has, TouchScroll, hasClass){
 		sort: function(property, descending){
 			// summary:
 			//		Sort the content
-			this.sortOrder = [{attribute: property, descending: descending}];
+			// property: String|Array
+			//		String specifying field to sort by, or actual array of objects
+			//		with attribute and descending properties
+			// descending: boolean
+			//		In the case where property is a string, this argument
+			//		specifies whether to sort ascending (false) or descending (true)
+			
+			this.sortOrder = typeof property != "string" ? property :
+				[{attribute: property, descending: descending}];
 			this.refresh();
+			
 			if(this.lastCollection){
+				// if an array was passed in, flatten to just first sort attribute
+				// for default array sort logic
+				if(typeof property != "string"){
+					descending = property[0].descending;
+					property = property[0].attribute;
+				}
+				
 				this.lastCollection.sort(function(a,b){
 					var aVal = a[property], bVal = b[property];
 					// fall back undefined values to "" for more consistent behavior
diff --git a/OnDemandList.js b/OnDemandList.js
index 3377f005e..d7631615f 100644
--- a/OnDemandList.js
+++ b/OnDemandList.js
@@ -47,13 +47,16 @@ return declare([List], {
 		// summary:
 		//		Assigns a new query (and optionally queryOptions) to the list,
 		//		and tells it to refresh.
+		
+		var sort = queryOptions && queryOptions.sort;
+		
 		this.query = query !== undefined ? query : this.query;
 		this.queryOptions = queryOptions || this.queryOptions;
-		// stash sort details if the queryOptions included them
-		if(queryOptions && queryOptions.sort){
-			this.sortOrder = queryOptions.sort;
-		}
-		this.refresh();
+		
+		// If we have new sort criteria, pass them through sort
+		// (which will update sortOrder and call refresh in itself).
+		// Otherwise, just refresh.
+		sort ? this.sort(sort) : this.refresh();
 	},
 	
 	renderQuery: function(query, preloadNode){
diff --git a/test/test_OnDemand.html b/test/test_OnDemand.html
index 6aab86d27..b2f0819a9 100644
--- a/test/test_OnDemand.html
+++ b/test/test_OnDemand.html
@@ -202,12 +202,14 @@
 						}
 						sortByCol1.descending = sortDescending;
 						grid.setQuery(grid.query, { sort: [sortByCol1] });
+						
+						console.log("sortOrder after setQuery: ", grid.sortOrder, grid.queryOptions);
 					});
 					on(document.getElementById("sort"), "click", function(){
-						console.log("sortOrder: ", grid.sortOrder);
-						
 						sortDescending ^= 1; // toggle true/false
 						grid.sort("col1", sortDescending);
+						
+						console.log("sortOrder after sort: ", grid.sortOrder);
 					});
 
 
@@ -290,12 +292,13 @@
 	<body class="claro">
 		<h2>Simple test to show setting a new store and query to dgrid</h2>
 		<div id="grid"></div>
-		<button id="setstore">Set Color Store</button>
-		<button id="restore">Set Original Store</button>
 		<button id="colorQuery">Set color store and query</button>
 		<button id="resetQuery">Reset query</button>
 		<button id="setQueryWithOptions">Set query with queryOptions</button>
 		<button id="sort">sort</button>
+		<br>
+		<button id="setstore">Set Color Store</button>
+		<button id="restore">Set Original Store</button>
 		<button id="empty">Set to empty store</button>
 		<button id="error">Set to error store</button>
 		<button id="error2">Set to error store (def)</button>