column.js in uki-1.1.2

- old
+ new

@@ -1,30 +1,49 @@
+/**
+ * @class
+ * @extends uki.view.Observable
+ */
 uki.view.table.Column = uki.newClass(uki.view.Observable, new function() {
     this._width = 100;
     this._offset = 0;
     this._position = 0;
     this._minWidth = 0;
     this._maxWidth = 0;
     this._css = 'float:left;white-space:nowrap;text-overflow:ellipsis;';
     this._inset = new Inset(3, 5);
+    this._templatePrefix = 'table-';
 
     this.init = function() {};
     
-    uki.addProps(this, ['position', 'css', 'formatter', 'label', 'resizable', 'maxWidth', 'minWidth', 'maxWidth', 'key']);
+    uki.addProps(this, ['position', 'css', 'formatter', 'label', 'resizable', 'maxWidth', 'minWidth', 'maxWidth', 'key', 'sort']);
     
-    this.template = function(v) {
-        if (v === undefined) return this._template = this._template || uki.theme.template('table-cell');
-        this._template = v;
-        return this;
+    this.template = function() {
+        // cache
+        return this._template || (this._template = uki.theme.template(this._templatePrefix + 'cell'));
     };
     
-    this.headerTemplate = function(v) {
-        if (v === undefined) return this._headerTemplate = this._headerTemplate || uki.theme.template('table-header-cell');
-        this._headerTemplate = v;
-        return this;
+    this.headerTemplate = function() {
+        var suffix = '';
+        if (this.sort() == 'ASC') suffix = '-asc';
+        if (this.sort() == 'DESC') suffix = '-desc';
+        return uki.theme.template(this._templatePrefix + 'header-cell' + suffix);
     };
     
+    this.sortData = function(data) {
+        var _this = this;
+        return data.sort(function(a, b) {
+            return _this._key ? 
+                _this.compare(uki.attr(a, _this._key), uki.attr(b, _this._key)) : 
+                _this.compare(a[_this._position], b[_this._position]);
+        });
+        
+    };
+    
+    this.compare = function(a, b) {
+        return (a >= b ? 1 : a == b ? 0 : -1) * (this._sort == 'DESC' ? -1 : 1);
+    };
+    
     /**
      * @fires event:beforeResize
      * @fires event:resize
      */
     this.width = uki.newProp('_width', function(w) {
@@ -68,36 +87,39 @@
     };
     
     this.renderHeader = function(height) {
         this._className || this._initStylesheet();
         var x = this.headerTemplate().render({
-            data: '<div style="overflow:hidden;text-overflow:ellipsis;*width:100%;height:100%;">' + this.label() + '</div>',
-            style: '*overflow-y:hidden;' + this._cellStyle(uki.dom.offset.boxModel ? height - 1 : height),
+            data: '<div style="overflow:hidden;text-overflow:ellipsis;*width:100%;height:100%;padding-top:' + this._inset.top + 'px">' + this.label() + '</div>',
+            style: '*overflow-y:hidden;' + this._cellStyle(true, height),
             className: this._className
         });
         return x;
     };
     
     this._prerenderTemplate = function(rect) {
         this._className || this._initStylesheet();
         this._prerenderedTemplate = this.template().render({
             data: '\u0001\u0001',
-            style: 'overflow:hidden;' + this._cellStyle(rect.height),
+            style: 'overflow:hidden;' + this._cellStyle(false, rect.height),
             className: this._className
         }).split('\u0001');
     };
     
-    this._cellPadding = function() {
+    this._cellPadding = function(skipVertical) {
         var inset = this._inset;
-        return ['padding:', inset.top, 'px ', inset.right, 'px ', inset.bottom, 'px ', inset.left, 'px;'].join('');
+        return ['padding:', (skipVertical ? '0' : inset.top), 'px ', inset.right, 'px ', (skipVertical ? '0' : inset.bottom), 'px ', inset.left, 'px;'].join('');
     };
     
-    this._cellStyle = function(height) {
-        var h = 'height:' + (height - (uki.dom.offset.boxModel ? this._inset.height() : 0)) + 'px;';
-        return this._css + this._cellPadding() + ';' + h;
+    this._cellHeight = function(skipVertical, height) {
+        return 'height:' + (height - (uki.dom.offset.boxModel && !skipVertical ? this._inset.height() : 0)) + 'px;';
     };
     
+    this._cellStyle = function(skipVertical, height) {
+        return this._css + this._cellPadding(skipVertical) + ';' + this._cellHeight(skipVertical, height);
+    };
+    
     this._clientWidth = function() {
         return this._width - (uki.dom.offset.boxModel ? this._inset.width() + 1 : 0);
     };
     
     this._initStylesheet = function() {
@@ -112,8 +134,14 @@
 
 uki.view.table.NumberColumn = uki.newClass(uki.view.table.Column, new function() {
     var Base = uki.view.table.Column.prototype;
 
     this._css = Base._css + 'text-align:right;';
+    
+    this.compare = function(a, b) {
+        a*=1;
+        b*=1;
+        return (a >= b ? 1 : a == b ? 0 : -1) * (this._sort == 'DESC' ? -1 : 1);
+    };
 });
 
 uki.view.table.CustomColumn = uki.view.table.Column;
\ No newline at end of file