Moved populate call for local data into datasource. Added some more

TODOs. Extended data extraction to include field metadata and store that
on the resulting dataitem prototype. Use that for sortablegrid impl.

Author: jzaefferer

tests/visual/grid/data.html

@@ -56,8 +56,6 @@
 		type: "developer",
 		source: data
 	});
-	// TODO when will be a need for a non-main datastore?
-	$.ui.datastore.main.populate( "developer" );
 
 	$(function() {
 		$( "#developers" ).grid({

tests/visual/grid/datasort.html

@@ -35,20 +35,16 @@
 				});
 			},
 			_sort: function( header ) {
-				var type = header.data( "type" ),
-					culture = header.data( "culture" ),
-					format = header.data( "format" ),
-					order = header.data("sort-order") || 1;
+				var fieldname = this.options.columns[ header[0].cellIndex ];
+				// TODO access shouldn't happen through the prototype
+				var field = $.ui.dataitem.types[ this.options.type ].prototype.fields[ fieldname ];
 
-				// TODO map this.cellIndex to field name instead
-				var field = header.text().toLowerCase().replace( /\s|[^a-z0-9]/g, "_" );
-				
 				function extract( row ) {
-					var text = row.options.data[ field ];
-					if ( type == "currency" ) {
-						return $.global.parseFloat( text, culture );
-					} else if (type == "date") {
-						return $.global.parseDate( text, format, culture );
+					var text = row.options.data[ fieldname ];
+					if ( field.type == "currency" ) {
+						return $.global.parseFloat( text, field.culture );
+					} else if (field.type == "date") {
+						return $.global.parseDate( text, field.format, field.culture );
 					} else {
 						return text;
 					}
@@ -61,10 +57,9 @@
 				// a better implementation would seperate data extraction from sorting
 				// that isn't possible here, as methods like .map() produce a new array
 				items.sort(function( a, b ) {
-					return ( extract( a ) < extract( b ) ? -1 : 1 ) * order;
+					return ( extract( a ) < extract( b ) ? -1 : 1 ) * field.sortOrder;
 				});
-				order *= -1;
-				header.data( "sort-order", order );
+				field.sortOrder *= -1;
 				this.refresh();
 			}
 		});

tests/visual/grid/datasource.js

@@ -14,6 +14,11 @@
 		_create: function() {
 			$.ui.datasource.types[ this.options.type ] = this;
 			$.ui.datastore.main.items[ this.options.type ] = [];
+			// populate store with static data directly
+			if ($.isArray(this.options.source)) {
+				// TODO pass this (as the datasource instance) instead of type?
+				$.ui.datastore.main.populate( this.options.type );
+			}
 		},
 		create: function( props ) {
 			this.options.source.push( props );

tests/visual/grid/datastore.js

@@ -9,9 +9,9 @@
 (function( $ ) {
 
 	$.widget( "ui.datastore", {
-		// TODO hackity hack to get the same dataitems instance back for calls to datastore.get(type)
-		dataitems: {},
 		_create: function() {
+			// TODO hackity hack to get the same dataitems instance back for calls to datastore.get(type)
+			this.dataitems = {};
 			this.items = {};
 		},
 		create: function( type, props ) {
@@ -44,10 +44,12 @@
 			}
 			return this.dataitems[type] = $.ui.dataitems({ items: this.items[ type ] });
 		},
+		// TODO rename this
 		populate: function( type ) {
-			// TODO datasource.get is calling datastore._populate - inline that?
+			// TODO or rename datasource.get
 			$.ui.datasource.types[ type ].get( this );
 		},
+		// TODO or rename this
 		_populate: function( type, items ) {
 			// TODO just assign items to this.items[type]?
 			var local = this.items[ type ];

tests/visual/grid/grid.js

@@ -40,12 +40,22 @@
 			var type = "generated" + $.now();
 			this.options.type = type;
 
-			var fields = this.element.find( "th" ).map(function() {
-				var field = $( this ).data( "field" );
+			var fieldDescriptions = {};
+			var fields = this.options.columns = this.element.find( "th" ).map(function() {
+				var th = $( this ),
+					field = $( this ).data( "field" );
 				if ( !field ) {
 					// generate field name if missing
 					field = $( this ).text().toLowerCase().replace(/\s|[^a-z0-9]/g, "_");
 				}
+
+				fieldDescriptions[field] = {
+					type: th.data( "type" ),
+					culture: th.data( "culture" ),
+					format: th.data( "format" ),
+					sortOrder: th.data( "sort-order" ) || 1
+				};
+
 				return field;
 			}).get();
 
@@ -62,18 +72,20 @@
 				return item;
 			}).get();
 
+			// TODO seperate template generation from data extraction
 			var template = $.map( fields, function( field ) {
 				return "<td>${" + field + "}</td>";
 			}).join( "" );
 			template = "<tr>" + template + "</tr>";
 			this.options.rowTemplate = template;
 
+			$.ui.dataitem.extend( type, {
+				fields: fieldDescriptions
+			} );
 			$.ui.datasource({
 				type: type,
 				source: items
 			});
-			$.ui.dataitem.extend( type, {} );
-			$.ui.datastore.main.populate( type );
 		}
 	});