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

@@ -258,14 +258,22 @@ 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;
 			if(!target){
 				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 = " ";
-				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();
 

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

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){

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>