-<html>\r
-<head>\r
- <title>The source code</title>\r
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body onload="prettyPrint();">\r
- <pre class="prettyprint lang-js"><div id="cls-Ext.ListView.Sorter"></div>/**\r
- * @class Ext.ListView.Sorter\r
- * @extends Ext.util.Observable\r
- * <p>Supporting Class for Ext.ListView.</p>\r
- * @constructor\r
- * @param {Object} config\r
- */\r
-Ext.ListView.Sorter = Ext.extend(Ext.util.Observable, {\r
- <div id="cfg-Ext.ListView.Sorter-sortClasses"></div>/**\r
- * @cfg {Array} sortClasses\r
- * The CSS classes applied to a header when it is sorted. (defaults to <tt>["sort-asc", "sort-desc"]</tt>)\r
- */\r
- sortClasses : ["sort-asc", "sort-desc"],\r
-\r
- constructor: function(config){\r
- Ext.apply(this, config);\r
- Ext.ListView.Sorter.superclass.constructor.call(this);\r
- },\r
-\r
- init : function(listView){\r
- this.view = listView;\r
- listView.on('render', this.initEvents, this);\r
- },\r
-\r
- initEvents : function(view){\r
- view.mon(view.innerHd, 'click', this.onHdClick, this);\r
- view.innerHd.setStyle('cursor', 'pointer');\r
- view.mon(view.store, 'datachanged', this.updateSortState, this);\r
- this.updateSortState.defer(10, this, [view.store]);\r
- },\r
-\r
- updateSortState : function(store){\r
- var state = store.getSortState();\r
- if(!state){\r
- return;\r
- }\r
- this.sortState = state;\r
- var cs = this.view.columns, sortColumn = -1;\r
- for(var i = 0, len = cs.length; i < len; i++){\r
- if(cs[i].dataIndex == state.field){\r
- sortColumn = i;\r
- break;\r
- }\r
- }\r
- if(sortColumn != -1){\r
- var sortDir = state.direction;\r
- this.updateSortIcon(sortColumn, sortDir);\r
- }\r
- },\r
-\r
- updateSortIcon : function(col, dir){\r
- var sc = this.sortClasses;\r
- var hds = this.view.innerHd.select('em').removeClass(sc);\r
- hds.item(col).addClass(sc[dir == "DESC" ? 1 : 0]);\r
- },\r
-\r
- onHdClick : function(e){\r
- var hd = e.getTarget('em', 3);\r
- if(hd && !this.view.disableHeaders){\r
- var index = this.view.findHeaderIndex(hd);\r
- this.view.store.sort(this.view.columns[index].dataIndex);\r
- }\r
- }\r
-});</pre> \r
-</body>\r
-</html>
\ No newline at end of file
+<!DOCTYPE html>
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>The source code</title>
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+ <style type="text/css">
+ .highlight { display: block; background-color: #ddd; }
+ </style>
+ <script type="text/javascript">
+ function highlight() {
+ document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+ }
+ </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+ <pre class="prettyprint lang-js"><span id='Ext-util-Sorter'>/**
+</span> * Represents a single sorter that can be applied to a Store. The sorter is used
+ * to compare two values against each other for the purpose of ordering them. Ordering
+ * is achieved by specifying either:
+ *
+ * - {@link #property A sorting property}
+ * - {@link #sorterFn A sorting function}
+ *
+ * As a contrived example, we can specify a custom sorter that sorts by rank:
+ *
+ * Ext.define('Person', {
+ * extend: 'Ext.data.Model',
+ * fields: ['name', 'rank']
+ * });
+ *
+ * Ext.create('Ext.data.Store', {
+ * model: 'Person',
+ * proxy: 'memory',
+ * sorters: [{
+ * sorterFn: function(o1, o2){
+ * var getRank = function(o){
+ * var name = o.get('rank');
+ * if (name === 'first') {
+ * return 1;
+ * } else if (name === 'second') {
+ * return 2;
+ * } else {
+ * return 3;
+ * }
+ * },
+ * rank1 = getRank(o1),
+ * rank2 = getRank(o2);
+ *
+ * if (rank1 === rank2) {
+ * return 0;
+ * }
+ *
+ * return rank1 < rank2 ? -1 : 1;
+ * }
+ * }],
+ * data: [{
+ * name: 'Person1',
+ * rank: 'second'
+ * }, {
+ * name: 'Person2',
+ * rank: 'third'
+ * }, {
+ * name: 'Person3',
+ * rank: 'first'
+ * }]
+ * });
+ */
+Ext.define('Ext.util.Sorter', {
+
+<span id='Ext-util-Sorter-cfg-property'> /**
+</span> * @cfg {String} property
+ * The property to sort by. Required unless {@link #sorterFn} is provided. The property is extracted from the object
+ * directly and compared for sorting using the built in comparison operators.
+ */
+
+<span id='Ext-util-Sorter-cfg-sorterFn'> /**
+</span> * @cfg {Function} sorterFn
+ * A specific sorter function to execute. Can be passed instead of {@link #property}. This sorter function allows
+ * for any kind of custom/complex comparisons. The sorterFn receives two arguments, the objects being compared. The
+ * function should return:
+ *
+ * - -1 if o1 is "less than" o2
+ * - 0 if o1 is "equal" to o2
+ * - 1 if o1 is "greater than" o2
+ */
+
+<span id='Ext-util-Sorter-cfg-root'> /**
+</span> * @cfg {String} root
+ * Optional root property. This is mostly useful when sorting a Store, in which case we set the root to 'data' to
+ * make the filter pull the {@link #property} out of the data object of each item
+ */
+
+<span id='Ext-util-Sorter-cfg-transform'> /**
+</span> * @cfg {Function} transform
+ * A function that will be run on each value before it is compared in the sorter. The function will receive a single
+ * argument, the value.
+ */
+
+<span id='Ext-util-Sorter-cfg-direction'> /**
+</span> * @cfg {String} direction
+ * The direction to sort by.
+ */
+ direction: "ASC",
+
+ constructor: function(config) {
+ var me = this;
+
+ Ext.apply(me, config);
+
+ //<debug>
+ if (me.property === undefined && me.sorterFn === undefined) {
+ Ext.Error.raise("A Sorter requires either a property or a sorter function");
+ }
+ //</debug>
+
+ me.updateSortFunction();
+ },
+
+<span id='Ext-util-Sorter-method-createSortFunction'> /**
+</span> * @private
+ * Creates and returns a function which sorts an array by the given property and direction
+ * @return {Function} A function which sorts by the property/direction combination provided
+ */
+ createSortFunction: function(sorterFn) {
+ var me = this,
+ property = me.property,
+ direction = me.direction || "ASC",
+ modifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+ //create a comparison function. Takes 2 objects, returns 1 if object 1 is greater,
+ //-1 if object 2 is greater or 0 if they are equal
+ return function(o1, o2) {
+ return modifier * sorterFn.call(me, o1, o2);
+ };
+ },
+
+<span id='Ext-util-Sorter-method-defaultSorterFn'> /**
+</span> * @private
+ * Basic default sorter function that just compares the defined property of each object
+ */
+ defaultSorterFn: function(o1, o2) {
+ var me = this,
+ transform = me.transform,
+ v1 = me.getRoot(o1)[me.property],
+ v2 = me.getRoot(o2)[me.property];
+
+ if (transform) {
+ v1 = transform(v1);
+ v2 = transform(v2);
+ }
+
+ return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
+ },
+
+<span id='Ext-util-Sorter-method-getRoot'> /**
+</span> * @private
+ * Returns the root property of the given item, based on the configured {@link #root} property
+ * @param {Object} item The item
+ * @return {Object} The root property of the object
+ */
+ getRoot: function(item) {
+ return this.root === undefined ? item : item[this.root];
+ },
+
+<span id='Ext-util-Sorter-method-setDirection'> /**
+</span> * Set the sorting direction for this sorter.
+ * @param {String} direction The direction to sort in. Should be either 'ASC' or 'DESC'.
+ */
+ setDirection: function(direction) {
+ var me = this;
+ me.direction = direction;
+ me.updateSortFunction();
+ },
+
+<span id='Ext-util-Sorter-method-toggle'> /**
+</span> * Toggles the sorting direction for this sorter.
+ */
+ toggle: function() {
+ var me = this;
+ me.direction = Ext.String.toggle(me.direction, "ASC", "DESC");
+ me.updateSortFunction();
+ },
+
+<span id='Ext-util-Sorter-method-updateSortFunction'> /**
+</span> * Update the sort function for this sorter.
+ * @param {Function} [fn] A new sorter function for this sorter. If not specified it will use the default
+ * sorting function.
+ */
+ updateSortFunction: function(fn) {
+ var me = this;
+ fn = fn || me.sorterFn || me.defaultSorterFn;
+ me.sort = me.createSortFunction(fn);
+ }
+});</pre>
+</body>
+</html>