You are viewing a plain text version of this content. The canonical link for it is here.
Posted to xap-commits@incubator.apache.org by jm...@apache.org on 2006/09/18 04:24:37 UTC

svn commit: r447230 - in /incubator/xap/trunk: WebContent/examples/widgets/table.xal css/xapDefault.css src/xap/bridges/dojo/RowBridge.js src/xap/widgets/dojo/TreeTable.js

Author: jmargaris
Date: Sun Sep 17 21:24:36 2006
New Revision: 447230

URL: http://svn.apache.org/viewvc?view=rev&rev=447230
Log:
more work on treetable trying to get it to display nested

Modified:
    incubator/xap/trunk/WebContent/examples/widgets/table.xal
    incubator/xap/trunk/css/xapDefault.css
    incubator/xap/trunk/src/xap/bridges/dojo/RowBridge.js
    incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js

Modified: incubator/xap/trunk/WebContent/examples/widgets/table.xal
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/table.xal?view=diff&rev=447230&r1=447229&r2=447230
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/table.xal (original)
+++ incubator/xap/trunk/WebContent/examples/widgets/table.xal Sun Sep 17 21:24:36 2006
@@ -21,12 +21,18 @@
 		<column><header text="Column 3"/></column>
 		<row>
 			<cell text="a"/><cell text="b"/><cell text="c"/>
+			<row>
+				<cell text="depth 2 a"/><cell text="depth 2 b"/><cell text="depth 2 c"/>
+					<row>
+						<cell text="depth 3 a"/><cell text="depth 3 b"/><cell text="depth 3 c"/>
+					</row>
+			</row>
 		</row>
 		<row>
 			<cell text="a"/><cell text="b"/><cell text="c"/>
 		</row>
 		<row>
-			<cell text="a"/><cell text="b"/><cell text="c"/>
+			<cell text="aaaaaaaaaaaaaaaaaa"/><cell text="bbbbbb"/><cell text="ccccc"/>
 		</row>
 	</table>
 
@@ -64,68 +70,6 @@
 		<include href="standardButtons.xal" xmlns="http://www.openxal.org/xinclude"/>
 		 
 		 
-		 
-		
-		<!--
-	  <label width="400px" height="100px" alignHorizontal="center" alignVertical="top" text="HCenterVTop" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="400px" height="100px" alignHorizontal="center" alignVertical="top" text="HCenterVTop" textPlacementHorizontal="left" textPlacementVertical="top" />		
-	  <label width="400px" height="100px" alignHorizontal="center" alignVertical="top" text="HCenterVTop" textPlacementHorizontal="left" textPlacementVertical="bottom" />		
-		
-		
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="bottom" text="HCenter VBottom" />
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="bottom" text="HCenter VBottom" textPlacementHorizontal="right" textPlacementVertical="top" />
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="bottom" text="HCenter VBottom" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="bottom" text="HCenter VBottom" textPlacementHorizontal="left" textPlacementVertical="top" />
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="bottom" text="HCenter VBottom" textPlacementHorizontal="left" textPlacementVertical="bottom" />		
-	
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="center" text="HCenter VCenter" />	  
-		<label width="700px" height="100px" alignHorizontal="center" alignVertical="center" text="HCenter VCenter" textPlacementHorizontal="right" textPlacementVertical="top" />
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="center" text="HCenter VCenter" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="center" text="HCenter VCenter" textPlacementHorizontal="left" textPlacementVertical="top" />
-	  <label width="700px" height="100px" alignHorizontal="center" alignVertical="center" text="HCenter VCenter" textPlacementHorizontal="left" textPlacementVertical="bottom" />		
-		
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="top" text="HRight VTop" />		
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="top" text="HRight VTop" textPlacementHorizontal="right" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="top" text="HRight VTop" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="top" text="HRight VTop" textPlacementHorizontal="left" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="top" text="HRight VTop" textPlacementHorizontal="left" textPlacementVertical="bottom" />
-		
-		
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="bottom" text="HRight VBottom" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="bottom" text="HRight VBottom" textPlacementHorizontal="right" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="bottom" text="HRight VBottom" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="bottom" text="HRight VBottom" textPlacementHorizontal="left" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="bottom" text="HRight VBottom" textPlacementHorizontal="left" textPlacementVertical="bottom" />		
-
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="center" text="HRight VCenter" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="center" text="HRight VCenter" textPlacementHorizontal="right" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="center" text="HRight VCenter" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="center" text="HRight VCenter" textPlacementHorizontal="left" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="right" alignVertical="center" text="HRight VCenter" textPlacementHorizontal="left" textPlacementVertical="bottom" />		
-		
-		
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="top" text="HLeft VTop" />	
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="top" text="HLeft VTop" textPlacementHorizontal="right" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="top" text="HLeft VTop" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="top" text="HLeft VTop" textPlacementHorizontal="left" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="top" text="HLeft VTop" textPlacementHorizontal="left" textPlacementVertical="bottom" />		
-
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="bottom" text="HLeft VBottom" />		
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="bottom" text="HLeft VBottom" textPlacementHorizontal="right" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="bottom" text="HLeft VBottom" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="bottom" text="HLeft VBottom" textPlacementHorizontal="left" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="bottom" text="HLeft VBottom" textPlacementHorizontal="left" textPlacementVertical="bottom" />		
-
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="center" text="HLeft VCenter"/>		
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="center" text="HLeft VCenter" textPlacementHorizontal="right" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="center" text="HLeft VCenter" textPlacementHorizontal="right" textPlacementVertical="bottom" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="center" text="HLeft VCenter" textPlacementHorizontal="left" textPlacementVertical="top" />
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="center" text="HLeft VCenter" textPlacementHorizontal="left" textPlacementVertical="bottom" />		
-
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="center" text="HLeft VCenter" textPlacementHorizontal="right"/>
-	  <label width="400px" height="100px" alignHorizontal="left" alignVertical="center" text="HLeft VCenter" textPlacementHorizontal="left"/>	
-		
-		-->
 		
 	</xm:append> 	  		
   	</xm:modifications>

Modified: incubator/xap/trunk/css/xapDefault.css
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/css/xapDefault.css?view=diff&rev=447230&r1=447229&r2=447230
==============================================================================
--- incubator/xap/trunk/css/xapDefault.css (original)
+++ incubator/xap/trunk/css/xapDefault.css Sun Sep 17 21:24:36 2006
@@ -140,8 +140,8 @@
 .ImgNodeExpanded { 
 	background-image: url(tree_folderopen.gif);
 	background-repeat: no-repeat;
-	width: 12px;
-	height: 12px;
+	width: 16px;
+	height: 16px;
 }
 
 .ImgNodeCollapsed { 

Modified: incubator/xap/trunk/src/xap/bridges/dojo/RowBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/bridges/dojo/RowBridge.js?view=diff&rev=447230&r1=447229&r2=447230
==============================================================================
--- incubator/xap/trunk/src/xap/bridges/dojo/RowBridge.js (original)
+++ incubator/xap/trunk/src/xap/bridges/dojo/RowBridge.js Sun Sep 17 21:24:36 2006
@@ -59,7 +59,12 @@
 }	
 
 xap.bridges.dojo.RowBridge.prototype.addChild = function(childHandler, index){
-	this.getPeer().addCell(childHandler.getRootDomNode());
+	if (childHandler.getPeer() instanceof xap.widgets.dojo.TableRow){
+		this.getPeer().insertRow(childHandler.getPeer(),index);
+	}
+	else{
+		this.getPeer().addCell(childHandler.getRootDomNode());
+	}
 }
 
 

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=447230&r1=447229&r2=447230
==============================================================================
--- incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js (original)
+++ incubator/xap/trunk/src/xap/widgets/dojo/TreeTable.js Sun Sep 17 21:24:36 2006
@@ -20,7 +20,13 @@
 dojo.widget.tags.addParseTreeHandler("dojo:TableRow");
 
 xap.widgets.dojo.TreeTable = function(){
-	alert("create a tree table");
+	this.columns = [];
+	
+	//top level rows only
+	this.rows = [];
+	this.validatePending = false;
+	this.sizeAdjustmentPending = false;
+		
 	dojo.widget.HtmlWidget.call(this);
 	this._revalidate();
 }
@@ -36,22 +42,19 @@
 	templateCssPath: null ,
 	widgetType: "TreeTable",
 	isContainer: false,
-	columns : [],
-	rows : [],
-	validatePending : false,
-	sizeAdjustmentPending : false,
 	
 	_revalidate: function(){
 		if (!this.validatePending){
-			dojo.lang.setTimeout(this, this._createTable, 0);
 			this.validatePending = true;
+			dojo.lang.setTimeout(this, this._createTable, 0);
+			
 		}
 	},
 	
 	_adjustSizes: function(){
 		if (!this.sizeAdjustmentPending){
-			dojo.lang.setTimeout(this, this._resizeTable, 0);
 			this.sizeAdjustmentPending = true;
+			dojo.lang.setTimeout(this, this._resizeTable, 0);
 		}
 	},
 	
@@ -77,6 +80,7 @@
 	},
 	
 	_createTable: function(){
+		alert("create table");
 		this._rebuildTable();
 		this.validatePending = false;
 		this._adjustSizes();
@@ -103,7 +107,7 @@
 		
 		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++){
@@ -135,11 +139,16 @@
 		this.table.appendChild(this.tbody);
 		//now populate the body rows
 		for (var i =0; i<this.rows.length; i++){
-			this.tbody.appendChild(this.rows[i].domNode);
+			this._rebuildRow(this.rows[i], 0);
+		}
+	},
+	
+	_rebuildRow: function( row, depth ){
+		this.tbody.appendChild(row.domNode);
+		row.setDepth(depth);
+		for (var i = 0; i<row._rows.length; i++){
+			this._rebuildRow(row._rows[i], depth+1);
 		}
-		
-		
-		
 	},
 	
 	onscroll : function(event){
@@ -159,15 +168,25 @@
 		this._revalidate();
 	},
 	
+	//index here is relative to parent row?
 	insertRow: function(row, index){
+		row.setTable(this);
 		if (index&&index>=0){
 			this.rows.splice(index,0, row);
 		}
 		else{
 			this.rows.push(row);
 		}
+		this._rowAdded(row);
+	},
+	
+	_rowAdded: function(row){
+		row.setTable(this);
+		for (var i = 0; i<row._rows.length;i++){
+			this._rowAdded(row._rows[i]);
+		}
 		this._revalidate();
-	}	
+	}
 	
 }
 );
@@ -191,7 +210,7 @@
 	templateCssPath: null ,
 	widgetType: "TableColumn",
 	isContainer: true,
-	_header : null,
+	
 	
 	//we need this because setting the template string to
 	//<col></col> doesn't work for whatever reason,
@@ -218,6 +237,7 @@
  
 xap.widgets.dojo.TableRow = function(){
 	dojo.widget.HtmlWidget.call(this);
+	this._rows = [];
 }
 
 
@@ -230,15 +250,55 @@
 	widgetType: "TableRow",
 	isContainer: false,
 	
+	setTable: function(table){
+		this._table = table;
+	},
+	
 	addCell : function( cell ){
 		var td = document.createElement("td");
+		if (this.domNode.childNodes.length==0){
+			this._indentSpan = document.createElement("span");
+			td.appendChild(this._indentSpan);
+		}
 		this.domNode.appendChild(td);
 		td.appendChild(cell);
 		cell._td = td;
 	},
 	
+	setDepth : function( depth ){
+		this._depth = depth;
+		if (this._indentSpan){
+			var spacerText = "";
+			for (var i = 0; i<depth; i++){
+				spacerText +="x"
+			}
+			var text  = document.createTextNode(spacerText);
+			this._indentSpan.appendChild(text);
+			var image = document.createElement("span");
+			this._indentSpan.appendChild(image);
+			dojo.html.addClass(image, "ImgNodeExpanded");
+			image.style.width="16px";
+			image.style.height="16px";
+			image.innerHTML = "&nbsp;&nbsp;&nbsp;";
+		}
+	},
+	
 	removeCell : function( cell ){
 		this.domNode.removeChild(cell._td);
-	}
+	},
+	
+	insertRow: function(row, index){
+		if (index&&index>=0){
+			this._rows.splice(index,0, row);
+		}
+		else{
+			this._rows.push(row);
+		}
+		if (this._table){
+			this._table._rowAdded(row);
+		}
+		//after inserting a row we need to add the row to the parent table
+		
+	}	
 	
 });