4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>The source code</title>
6 <link href="../prettify/prettify.css" type="text/css" rel="stylesheet" />
7 <script type="text/javascript" src="../prettify/prettify.js"></script>
8 <style type="text/css">
9 .highlight { display: block; background-color: #ddd; }
11 <script type="text/javascript">
12 function highlight() {
13 document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
17 <body onload="prettyPrint(); highlight();">
18 <pre class="prettyprint lang-js"><span id='Ext-util-Sorter'>/**
19 </span> * @class Ext.util.Sorter
22 Represents a single sorter that can be applied to a Store. The sorter is used
23 to compare two values against each other for the purpose of ordering them. Ordering
24 is achieved by specifying either:
25 - {@link #property A sorting property}
26 - {@link #sorterFn A sorting function}
28 As a contrived example, we can specify a custom sorter that sorts by rank:
30 Ext.define('Person', {
31 extend: 'Ext.data.Model',
32 fields: ['name', 'rank']
35 Ext.create('Ext.data.Store', {
39 sorterFn: function(o1, o2){
40 var getRank = function(o){
41 var name = o.get('rank');
42 if (name === 'first') {
44 } else if (name === 'second') {
53 if (rank1 === rank2) {
57 return rank1 < rank2 ? -1 : 1;
74 Ext.define('Ext.util.Sorter', {
76 <span id='Ext-util-Sorter-cfg-property'> /**
77 </span> * @cfg {String} property The property to sort by. Required unless {@link #sorterFn} is provided.
78 * The property is extracted from the object directly and compared for sorting using the built in
79 * comparison operators.
82 <span id='Ext-util-Sorter-cfg-sorterFn'> /**
83 </span> * @cfg {Function} sorterFn A specific sorter function to execute. Can be passed instead of {@link #property}.
84 * This sorter function allows for any kind of custom/complex comparisons.
85 * The sorterFn receives two arguments, the objects being compared. The function should return:
87 * <li>-1 if o1 is "less than" o2</li>
88 * <li>0 if o1 is "equal" to o2</li>
89 * <li>1 if o1 is "greater than" o2</li>
93 <span id='Ext-util-Sorter-cfg-root'> /**
94 </span> * @cfg {String} root Optional root property. This is mostly useful when sorting a Store, in which case we set the
95 * root to 'data' to make the filter pull the {@link #property} out of the data object of each item
98 <span id='Ext-util-Sorter-cfg-transform'> /**
99 </span> * @cfg {Function} transform A function that will be run on each value before
100 * it is compared in the sorter. The function will receive a single argument,
104 <span id='Ext-util-Sorter-cfg-direction'> /**
105 </span> * @cfg {String} direction The direction to sort by. Defaults to ASC
107 direction: "ASC",
109 constructor: function(config) {
112 Ext.apply(me, config);
115 if (me.property === undefined && me.sorterFn === undefined) {
116 Ext.Error.raise("A Sorter requires either a property or a sorter function");
120 me.updateSortFunction();
123 <span id='Ext-util-Sorter-method-createSortFunction'> /**
125 * Creates and returns a function which sorts an array by the given property and direction
126 * @return {Function} A function which sorts by the property/direction combination provided
128 createSortFunction: function(sorterFn) {
130 property = me.property,
131 direction = me.direction || "ASC",
132 modifier = direction.toUpperCase() == "DESC" ? -1 : 1;
134 //create a comparison function. Takes 2 objects, returns 1 if object 1 is greater,
135 //-1 if object 2 is greater or 0 if they are equal
136 return function(o1, o2) {
137 return modifier * sorterFn.call(me, o1, o2);
141 <span id='Ext-util-Sorter-method-defaultSorterFn'> /**
143 * Basic default sorter function that just compares the defined property of each object
145 defaultSorterFn: function(o1, o2) {
147 transform = me.transform,
148 v1 = me.getRoot(o1)[me.property],
149 v2 = me.getRoot(o2)[me.property];
156 return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
159 <span id='Ext-util-Sorter-method-getRoot'> /**
161 * Returns the root property of the given item, based on the configured {@link #root} property
162 * @param {Object} item The item
163 * @return {Object} The root property of the object
165 getRoot: function(item) {
166 return this.root === undefined ? item : item[this.root];
169 <span id='Ext-util-Sorter-method-setDirection'> /**
170 </span> * Set the sorting direction for this sorter.
171 * @param {String} direction The direction to sort in. Should be either 'ASC' or 'DESC'.
173 setDirection: function(direction) {
175 me.direction = direction;
176 me.updateSortFunction();
179 <span id='Ext-util-Sorter-method-toggle'> /**
180 </span> * Toggles the sorting direction for this sorter.
184 me.direction = Ext.String.toggle(me.direction, "ASC", "DESC");
185 me.updateSortFunction();
188 <span id='Ext-util-Sorter-method-updateSortFunction'> /**
189 </span> * Update the sort function for this sorter.
190 * @param {Function} fn (Optional) A new sorter function for this sorter. If not specified it will use the
191 * default sorting function.
193 updateSortFunction: function(fn) {
195 fn = fn || me.sorterFn || me.defaultSorterFn;
196 me.sort = me.createSortFunction(fn);