diff --git a/examples/sorting.html b/examples/sorting.html
index 6e27cbc..8ea3678 100644
--- a/examples/sorting.html
+++ b/examples/sorting.html
@@ -152,22 +152,30 @@ docReady( function() {
var iso = window.iso = new Isotope( container, {
layoutMode: 'fitRows',
getSortData: {
- number: function( itemElem ) {
- return parseInt( getText( itemElem.querySelector('.number') ), 10 );
- },
- symbol: function( itemElem ) {
- return getText( itemElem.querySelector('.symbol') );
- },
- name: function( itemElem ) {
- return getText( itemElem.querySelector('.name') );
- },
+ // number: function( itemElem ) {
+ // return parseInt( getText( itemElem.querySelector('.number') ), 10 );
+ // },
+ // symbol: function( itemElem ) {
+ // return getText( itemElem.querySelector('.symbol') );
+ // },
+ // name: function( itemElem ) {
+ // return getText( itemElem.querySelector('.name') );
+ // },
+ // category: function( itemElem ) {
+ // return itemElem.getAttribute('data-category');
+ // },
+
+ number: '.number parseInt',
+ symbol: '.symbol',
+ name: '.name',
+ category: '[data-category]',
+
weight: function( itemElem ) {
// remove parenthesis
return parseFloat( getText( itemElem.querySelector('.weight') ).replace( /[\(\)]/g, '') );
- },
- category: function( itemElem ) {
- return itemElem.getAttribute('data-category');
}
+
+
}
});
diff --git a/item.js b/item.js
index b521d2f..4a2fe36 100644
--- a/item.js
+++ b/item.js
@@ -6,6 +6,30 @@
'use strict';
+// -------------------------- helpers -------------------------- //
+
+// trim
+
+var trim = String.prototype.trim ?
+ function( str ) {
+ return str.trim();
+ } :
+ function( str ) {
+ return str.replace( /^\s+|\s+$/g, '' );
+ };
+
+
+var docElem = document.documentElement;
+
+var getText = docElem.textContent ?
+ function( elem ) {
+ return elem.textContent;
+ } :
+ function( elem ) {
+ return elem.innerText;
+ };
+
+
// -------------------------- Item -------------------------- //
function itemDefinition( Outlayer ) {
@@ -34,10 +58,69 @@ Item.prototype.updateSortData = function() {
var getSortData = this.layout.options.getSortData;
for ( var key in getSortData ) {
var sorter = getSortData[ key ];
+ sorter = mungeSorter( sorter );
this.sortData[ key ] = sorter( this.element, this );
}
};
+// add a magic layer to sorters
+// for convienent shorthands
+// .foo-bar will use the text of .foo-bar querySelector
+// [foo-bar] will use attribute
+// you can also add parser
+// `.foo-bar parseInt` will parse that as a number
+function mungeSorter( sorter ) {
+ if ( typeof sorter !== 'string' ) {
+ return sorter;
+ }
+
+ var args = trim( sorter ).split(' ');
+ var parser;
+
+ // use second argument as a parser
+ switch ( args[1] ) {
+ case 'parseInt' :
+ parser = function( val ) {
+ return parseInt( val, 10 );
+ };
+ break;
+ case 'parseFloat' :
+ parser = function( val ) {
+ return parseFloat( val );
+ };
+ }
+
+ var query = args[0];
+ var attrMatch = query.match( /^\[(.+)\]$/ );
+ var attr = attrMatch && attrMatch[1];
+
+
+ var getValue;
+
+ // if query looks like [foo-bar], get attribute
+ if ( attr ) {
+ getValue = function( elem ) {
+ return elem.getAttribute( attr );
+ };
+ } else {
+ // otherwise, assume its a querySelector, and get its text
+ getValue = function( elem ) {
+ return getText( elem.querySelector( query ) );
+ };
+ }
+
+ // parse the value, if there was a parser
+ sorter = parser ? function( elem ) {
+ return parser( getValue( elem ) );
+ } :
+ // otherwise just return value
+ function( elem ) {
+ return getValue( elem );
+ };
+
+ return sorter;
+}
+
return Item;
}