svn commit: r446784 - /incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js

[jm...@apache.org]

Author: jmargaris
Date: Fri Sep 15 16:35:19 2006
New Revision: 446784

URL: http://svn.apache.org/viewvc?view=rev&rev=446784
Log:
more work, table part sort of working now

Modified:
    incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js

Modified: incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js?view=diff&rev=446784&r1=446783&r2=446784
==============================================================================
--- incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js (original)
+++ incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js Fri Sep 15 16:35:19 2006
@@ -28,8 +28,9 @@
 dojo.inherits(xap.widgets.dojo.TreeTable,xap.widgets.dojo.ScrollPane);
 
 dojo.lang.extend(xap.widgets.dojo.TreeTable, {
-	templateString: '<div>' +
-		'<table dojoAttachPoint="headerTable" style="width:100%;table-layout:fixed"><tbody dojoAttachPoint="headerTbody"><tr dojoAttachPoint="headerRow"></tr></tbody></table>'+
+	//TODO calc padding after laying out headers?
+	templateString: '<div style="padding:0px 0px 40px 0px;overflow:hidden;position:relative">' +
+		'<table dojoAttachPoint="headerTable" style="position:relative;width:100%;table-layout:fixed"><tbody dojoAttachPoint="headerTbody"><tr dojoAttachPoint="headerRow"></tr></tbody></table>'+
 		'<div dojoAttachPoint="scrollDiv" style="overflow:auto;width:100%;height:100%">' +
 		'<table dojoAttachPoint="table"><tbody dojoAttachPoint="tbody"></tbody></table></div></div>',
 	templateCssPath: null ,
@@ -55,13 +56,23 @@
 	},
 	
 	_resizeTable: function(){
-//		for (var i=0; i<this.columns.length;i++){
-//			var headerWidth = this.headerRow.childNodes[i].offsetWidth;
-//			alert("Inner width of header  = " + this.headerRow.childNodes[i] + "=" + headerWidth);	
-//			//set the cell on the first row to that width
-//			this.tbody.childNodes[0].childNodes[i].style.width = headerWidth;
-//			this.headerRow.childNodes[i].style.width = headerWidth;
-//		}
+		var finalWidths = [];
+		finalWidths[this.columns.length-1] = "";
+		
+		for (var i=0; i<this.columns.length-1;i++){
+			var headerWidth = this.headerRow.childNodes[i].offsetWidth;
+			var columnWidth = this.tbody.childNodes[0].childNodes[i].offsetWidth;
+			alert("Header width and main column width = " + headerWidth + "/" + columnWidth);
+			var finalWidth = headerWidth>columnWidth ? headerWidth:columnWidth;
+			finalWidths[i] = finalWidth + "px";
+			//set the columns to have that calculated with
+			
+		}
+		
+		for (var i=0; i<this.columns.length;i++){
+			this.headerTable.childNodes[i].style.width = finalWidths[i];
+			this.table.childNodes[i].style.width = finalWidths[i];
+		}
 		this.sizeAdjustmentPending = false;
 	},
 	
@@ -74,25 +85,25 @@
 	_rebuildTable: function(){
 		this.domNode.removeChild(this.headerTable);
 		this.domNode.removeChild(this.scrollDiv);
-		
+
 		this.headerTable = document.createElement("table");
 		this.domNode.appendChild(this.headerTable);
 		
-		
-		this.headerTable.style.width = "100%";
 		this.headerTable.style.tableLayout="fixed";
+		this.headerTable.style.width="500px";
+		this.headerTable.style.position="relative";
 		
 		this.scrollDiv = document.createElement("div");
 		this.domNode.appendChild(this.scrollDiv);
 		
 		this.scrollDiv.style.width="100%";
 		this.scrollDiv.style.height="100%";
-		this.scrollDiv.style.margin.bottom = "-30px";
 		this.scrollDiv.style.overflow="auto";
+		dojo.event.connect(this.scrollDiv, "onscroll", this, "onscroll");
 		
 		this.table = document.createElement("table");
 		this.scrollDiv.appendChild(this.table);
-		this.table.style.tableLayout="fixed";
+	//	this.table.style.tableLayout="fixed";
 		
 		//populate cols under both tables
 		for (var i = 0; i<this.columns.length; i++){
@@ -120,15 +131,21 @@
 			}
 		}
 		
-		this.bodyBody = document.createElement("tbody");
-		this.table.appendChild(this.bodyBody);
+		this.tbody = document.createElement("tbody");
+		this.table.appendChild(this.tbody);
 		//now populate the body rows
 		for (var i =0; i<this.rows.length; i++){
-			this.bodyBody.appendChild(this.rows[i].domNode);
+			this.tbody.appendChild(this.rows[i].domNode);
 		}
 		
 		
 		
+	},
+	
+	onscroll : function(event){
+		if (this.scrollDiv){
+			this.headerTable.style.left = -this.scrollDiv.scrollLeft + "px";
+		}
 	},