include('../label.js');

uki.view.table.Header = uki.newClass(uki.view.Label, function(Base) {
    this._setup = function() {
        Base._setup.call(this);
        this._multiline = true;
    };
    
    this.typeName = function() { return 'uki.view.table.Header'; };
    
    this.columns = uki.newProp('_columns', function(v) {
        this._columns = v;
        this.html(this._createColumns());
        this._createResizers();
    });
    
    this._createColumns = function() {
        var html = [];
        for(var i = 0, offset = 0, columns = this._columns, l = columns.length; i < l; i++) {
            html[html.length] = columns[i].renderHeader(this.rect().height);
        }
        return html.join('')
    };
    
    this._createResizers = function() {
        for (var i=0, column, resizer, offset = 0; i < this._columns.length; i++) {
            column = this._columns[i];
            if (column.resizable()) {
                var resizer = column.appendResizer(this._label.childNodes[i], this.rect().height);
                this._bindResizerDrag(resizer, i);
            }
        };
    };
    
    this._bindResizerDrag = function(resizer, columnIndex) {
        uki.dom.bind(resizer, 'draggesture', uki.proxy(function(e) {
            var headerOffset = uki.dom.offset(this.dom()),
                offsetWithinHeader = e.pageX - headerOffset.x,
                columnOffset = 0, i, column = this._columns[columnIndex];
            for (i=0; i < columnIndex; i++) {
                columnOffset += this._columns[i].width();
            };
            column.width(offsetWithinHeader - columnOffset);
        }, this));
    };
});
@@ -183,16 +183,45 @@
 = true;%0A
+        this._resizers = %5B%5D;%0A
     %7D;%0A 
@@ -464,24 +464,388 @@
    %7D);%0A    %0A
+    this.redrawColumn = function(col) %7B%0A        if (this._resizers%5Bcol%5D) %7B%0A            uki.dom.unbind(this._resizers%5Bcol%5D);%0A        %7D%0A        var container = doc.createElement('div');%0A        container.innerHTML = this._columns%5Bcol%5D.renderHeader(this.rect().height);%0A        this._label.replaceChild(container.firstChild, this._label.childNodes%5Bcol%5D);%0A    %7D;%0A    %0A
     this._cr
@@ -1139,17 +1139,16 @@
 eResizer
-s
  = funct
@@ -1143,32 +1143,33 @@
 izer = function(
+i
 ) %7B%0A        for 
@@ -1167,96 +1167,12 @@
     
- 
-for (var i=0, column, resizer, offset = 0; i %3C this._columns.length; i++) %7B%0A           
+ var
  col
@@ -1199,28 +1199,24 @@
 i%5D;%0A        
-  
-  
 if (column.r
@@ -1225,28 +1225,24 @@
 izable()) %7B%0A
-    
             
@@ -1332,28 +1332,24 @@
             
-    
 this._bindRe
@@ -1371,24 +1371,61 @@
 er, i);%0A    
+        this._resizers%5Bi%5D = resizer;%0A
         %7D%0A  
@@ -1422,29 +1422,130 @@
       %7D%0A    
+%7D;%0A
     
-%7D
+%0A    this._createResizers = function() %7B%0A        uki.each(this._columns, this._createResizer, this)
 ;%0A    %7D;%0A   

support for table header column redraw (sorting is close)