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 2007/07/16 21:09:00 UTC

svn commit: r556737 - in /incubator/xap/trunk: codebase/src/xap/bridges/basic/ codebase/src/xap/bridges/xap/ codebase/src/xap/widgets/ codebase/src/xap/widgets/dojo/ samples/WebContent/examples/widgets/

Author: jmargaris
Date: Mon Jul 16 14:08:53 2007
New Revision: 556737

URL: http://svn.apache.org/viewvc?view=rev&rev=556737
Log:
sizing changes, width/height should be more accurate now

Added:
    incubator/xap/trunk/samples/WebContent/examples/widgets/sizing.xal   (with props)
Modified:
    incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js
    incubator/xap/trunk/codebase/src/xap/bridges/xap/ListBoxBridge.js
    incubator/xap/trunk/codebase/src/xap/bridges/xap/XapComboBoxBridge.js
    incubator/xap/trunk/codebase/src/xap/widgets/Label.js
    incubator/xap/trunk/codebase/src/xap/widgets/ListBox.js
    incubator/xap/trunk/codebase/src/xap/widgets/XapComboBox.js
    incubator/xap/trunk/codebase/src/xap/widgets/dojo/VerticalPanel.js
    incubator/xap/trunk/samples/WebContent/examples/widgets/index.html

Modified: incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js?view=diff&rev=556737&r1=556736&r2=556737
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js (original)
+++ incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js Mon Jul 16 14:08:53 2007
@@ -115,6 +115,8 @@
 	}
 	this.parseInitialAttributes( this.getElement() );
 	this.parseInitialChildren( this.getElement() );
+	this.resetSize();
+	
 	xap.taghandling.AbstractTagImpl.prototype.init.call( this );
 }
 
@@ -946,6 +948,9 @@
  * @private
  */
 xap.bridges.basic.AbstractWidgetBridge.prototype.resetSize = function(){
+	if (!this.getRootDomNode() || !this.getRootDomNode().parentNode){
+		return;
+	}
 	var size = this.getElement().getAttribute("width");
 	if (size){
 		this.setWidthAttribute(size);
@@ -1608,5 +1613,55 @@
 	if(node && attributeName && node.style && node.style[attributeName]){
 		node.style[attributeName] = "" ;
 	} 
+}
+
+
+
+
+//IMPORTANT DOJO DOJOBUG
+//I added the first part that checks for table, the dojo people have a fixme
+//the setOuterHeight stuff doesn't really work for table...this is just a hack for now...
+//This still hase some browser specific issues
+dojo.html.getBoxSizing = function(node){
+	if ( dojo.render.html.ie){
+		if (node.nodeName=='input' || node.nodeName=='INPUT' ||
+			node.nodeName=='textarea' || node.nodeName=='TEXTAREA') {
+			
+			//TODO in IE if you have a table with a thick border
+			//the width comes out right but the height comes out too tall
+			//for some reason.
+			return dojo.html.boxSizing.CONTENT_BOX;
+		}
+		else{
+			if (node.nodeName=='table' || node.nodeName=='TABLE' ||
+			 node.nodeName=='select' || node.nodeName=='SELECT'){
+				return dojo.html.boxSizing.BORDER_BOX;
+			}
+			
+		}
+		return dojo.html.boxSizing.CONTENT_BOX;
+	}
+	else{
+		if (node.nodeName=='input' || node.nodeName=='INPUT' ||
+			node.nodeName=='textarea' || node.nodeName=='TEXTAREA'){
+			return dojo.html.boxSizing.CONTENT_BOX;
+		}
+		else if (node.nodeName=='table' || node.nodeName=='TABLE') {
+			return dojo.html.boxSizing.BORDER_BOX;
+		}
+	}
+	if(( dojo.render.html.ie)||( dojo.render.html.opera)){ 
+		var cm = document["compatMode"];
+		if((cm == "BackCompat")||(cm == "QuirksMode")){ 
+			return dojo.html.boxSizing.BORDER_BOX; 
+		}else{
+			return dojo.html.boxSizing.CONTENT_BOX; 
+		}
+	}else{
+		if(arguments.length == 0){ node = document.documentElement; }
+		var sizing = dojo.html.getStyle(node, "-moz-box-sizing");
+		if(!sizing){ sizing = dojo.html.getStyle(node, "box-sizing"); }
+		return (sizing ? sizing : dojo.html.boxSizing.CONTENT_BOX);
+	}
 }
 

Modified: incubator/xap/trunk/codebase/src/xap/bridges/xap/ListBoxBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/bridges/xap/ListBoxBridge.js?view=diff&rev=556737&r1=556736&r2=556737
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/bridges/xap/ListBoxBridge.js (original)
+++ incubator/xap/trunk/codebase/src/xap/bridges/xap/ListBoxBridge.js Mon Jul 16 14:08:53 2007
@@ -239,12 +239,6 @@
 xap.bridges.xap.ListBoxBridge.prototype.setFontWeightAttribute = function(value){
 	this.getPeer().setFontWeight( value ) ;
 }
-xap.bridges.xap.ListBoxBridge.prototype.setHeightAttribute = function(value) {
-	this.getPeer().setHeight( value ) ;
-}
-xap.bridges.xap.ListBoxBridge.prototype.setWidthAttribute = function(value) {
-	this.getPeer().setWidth( value ) ;
-}
 
 xap.bridges.xap.ListBoxBridge.prototype.setXAttribute = function(value) {
 	this.getPeer().setX( value ) ;

Modified: incubator/xap/trunk/codebase/src/xap/bridges/xap/XapComboBoxBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/bridges/xap/XapComboBoxBridge.js?view=diff&rev=556737&r1=556736&r2=556737
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/bridges/xap/XapComboBoxBridge.js (original)
+++ incubator/xap/trunk/codebase/src/xap/bridges/xap/XapComboBoxBridge.js Mon Jul 16 14:08:53 2007
@@ -63,10 +63,12 @@
  * Doesn't really work for dropdown boxes.... 
 **/
 xap.bridges.xap.XapComboBoxBridge.prototype.setHeightAttribute = function(value) {
+	xap.bridges.dojo.DojoWidgetBridge.prototype.setHeightAttribute.call(this,value);
 	this.getPeer().setHeight( value ) ;
 }
 
-xap.bridges.xap.XapComboBoxBridge.prototype.setWidthAttribute = function(value) {	
+xap.bridges.xap.XapComboBoxBridge.prototype.setWidthAttribute = function(value) {
+	xap.bridges.dojo.DojoWidgetBridge.prototype.setWidthAttribute.call(this,value);	
 	this.getPeer().setWidth(value) ;
 }
 

Modified: incubator/xap/trunk/codebase/src/xap/widgets/Label.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/widgets/Label.js?view=diff&rev=556737&r1=556736&r2=556737
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/widgets/Label.js (original)
+++ incubator/xap/trunk/codebase/src/xap/widgets/Label.js Mon Jul 16 14:08:53 2007
@@ -33,17 +33,10 @@
 	this.table.cellSpacing = "0px";
 	this.td = document.createElement("td");
 	this.td.style.textAlign='left' ;
-	this.td.style.width="100%";
-	this.td.style.height="100%";
 	this.br = document.createElement("br");
 
 	var tbody = document.createElement("tbody");
-	tbody.style.width = "100%";
-	tbody.style.height = "100%";
-	tbody.style.position = "relative";
 	var tr = document.createElement("tr");
-	tr.style.width = "100%";
-	tr.style.height = "100%";
 
 	this.table.appendChild(tbody);
 	tbody.appendChild(tr);
@@ -61,7 +54,7 @@
 	this.div.appendChild(this.img);
 	this.div.appendChild(this.span);
 
-	xap.widgets.styleSet(this.td, {width:"100%", height: "100%"});
+	//xap.widgets.styleSet(this.td, {width:"100%", height: "100%"});
 
 	xap.widgets.styleSet(this._rootDomNode, {overflow:"hidden", position:"relative"});
 

Modified: incubator/xap/trunk/codebase/src/xap/widgets/ListBox.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/widgets/ListBox.js?view=diff&rev=556737&r1=556736&r2=556737
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/widgets/ListBox.js (original)
+++ incubator/xap/trunk/codebase/src/xap/widgets/ListBox.js Mon Jul 16 14:08:53 2007
@@ -42,8 +42,7 @@
 // If size==1, get a combo (dropdown, really) box, which we don't want, so
 // start with size 2, increment if necessary as we add children:
 
-		templateString: ''
-						+'<select dojoAttachPoint="select" '
+		templateString: '<select dojoAttachPoint="select" '
 							+ 'dojoAttachEvent="onchange;onkeydown;onmouseup"' 
 							+ 'style="margin:0px;padding:0px"'
 							+ 'size="2"></select>',
@@ -235,19 +234,10 @@
 //Avoid "puppetry"---that is, make this widget able to handle things for itself,
 //leaving the bridge class to call these methods---much better if we have to change
 // this class:
-
-xap.widgets.ListBox.prototype.setWidth = function(value) {
-	this.domNode.style.width = value ;	
-	this.select.style.width = value ;	
-}
-
 xap.widgets.ListBox.prototype.setVisible = function(value){
 	this.domNode.style.visibility = (value=="false")?"hidden":"visible"  ;
 }
 
-xap.widgets.ListBox.prototype.setHeight = function(value) {
-	this.domNode.style.height = value;
-}
 
 xap.widgets.ListBox.prototype.setX = function(value) {
 	this.domNode.style.left = value ;	
@@ -294,22 +284,4 @@
 	this.domNode.disabled = bValue ;
 	this.select.disabled = bValue ;			
 }
-
-
-
-
-
-
-
-
-// Maybe use this later:
-	// Move to next option beginning with this key's char, if it's a letter:
-//	var select = this.select ;
-//	for( var ii=select.selectedIndex+1; ii<select.options.length; ++ii){
-//		if (key == select.options[ii].text.charAt(0) ){
-//			select.selectedIndex = ii ;
-//			break ;
-//		}
-//	}	
-
 

Modified: incubator/xap/trunk/codebase/src/xap/widgets/XapComboBox.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/widgets/XapComboBox.js?view=diff&rev=556737&r1=556736&r2=556737
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/widgets/XapComboBox.js (original)
+++ incubator/xap/trunk/codebase/src/xap/widgets/XapComboBox.js Mon Jul 16 14:08:53 2007
@@ -84,27 +84,15 @@
 
 
 xap.widgets.XapComboBox.prototype.setWidth = function (value) {
-	this.domNode.style.width = value;
-	// Need to do this first to (in essence) figure
-	// out what border, padding, margin will be if 
-	// the "value" argument is a percentage:
-	dojo.style.setOuterWidth(this.domNode, this.domNode.clientWidth);
-	
 	if (this.child) {
-		this.child.setWidth("100%");
+		this.child.domNode.style.width ="100%";
 	}
 
 };
 xap.widgets.XapComboBox.prototype.setHeight = function (value) {
-
-	// Need to do this first to (in essence) figure
-	// out what border, padding, margin will be if 
-	// the "value" argument is a percentage:
-	this.domNode.style.height = value;
-	dojo.style.setOuterHeight(this.domNode, this.domNode.clientHeight);
-
 	if (this.child) {
-		this.child.setHeight("100%");
+		this.child.domNode.style.height = "100%";
+		
 		var newHeight = this.domNode.clientHeight ;
 		if( window.netscape ){
 			// For once, Mozilla handles something

Modified: incubator/xap/trunk/codebase/src/xap/widgets/dojo/VerticalPanel.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/widgets/dojo/VerticalPanel.js?view=diff&rev=556737&r1=556736&r2=556737
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/widgets/dojo/VerticalPanel.js (original)
+++ incubator/xap/trunk/codebase/src/xap/widgets/dojo/VerticalPanel.js Mon Jul 16 14:08:53 2007
@@ -190,36 +190,4 @@
 		xap.widgets.dojo.VerticalPanel.superclass.onResized.call(this);
 	}
 }
-); 
-
-
-//IMPORTANT DOJO DOJOBUG
-//I added the first part that checks for table, the dojo people have a fixme
-//the setOuterHeight stuff doesn't really work for table...this is just a hack for now...
-//This still hase some browser specific issues
-dojo.style.getBoxSizing = function(node){
-	if (node.nodeName=='table' || node.nodeName=='TABLE' ||
-		node.nodeName=='input' || node.nodeName=='INPUT' ||
-		node.nodeName=='textarea' || node.nodeName=='TEXTAREA'){
-		//do this in IE6 only???
-		if ( dojo.render.html.ie){
-			return dojo.style.boxSizing.CONTENT_BOX;
-		}
-		else{
-			return dojo.style.boxSizing.BORDER_BOX;
-		}
-	}
-	if(( dojo.render.html.ie)||( dojo.render.html.opera)){ 
-		var cm = document["compatMode"];
-		if((cm == "BackCompat")||(cm == "QuirksMode")){ 
-			return dojo.style.boxSizing.BORDER_BOX; 
-		}else{
-			return dojo.style.boxSizing.CONTENT_BOX; 
-		}
-	}else{
-		if(arguments.length == 0){ node = document.documentElement; }
-		var sizing = dojo.style.getStyle(node, "-moz-box-sizing");
-		if(!sizing){ sizing = dojo.style.getStyle(node, "box-sizing"); }
-		return (sizing ? sizing : dojo.style.boxSizing.CONTENT_BOX);
-	}
-}
\ No newline at end of file
+); 
\ No newline at end of file

Modified: incubator/xap/trunk/samples/WebContent/examples/widgets/index.html
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/samples/WebContent/examples/widgets/index.html?view=diff&rev=556737&r1=556736&r2=556737
==============================================================================
--- incubator/xap/trunk/samples/WebContent/examples/widgets/index.html (original)
+++ incubator/xap/trunk/samples/WebContent/examples/widgets/index.html Mon Jul 16 14:08:53 2007
@@ -100,6 +100,7 @@
 <li><a href="javascript:loadXalFile('widget_examples/splitPaneExample')">&lt;splitPane&gt;</a></li>
 <li><a href="javascript:loadXalFile('widget_examples/tabPaneExample')">&lt;splitPane&gt;</a></li>
 <li><a href="javascript:loadXalFile('widget_examples/verticalPanelExample')">&lt;verticalPanel&gt;</a></li>
+<li><a href="javascript:loadXalFile('sizing')">sizing tests</a></li>
 </ul>
 
 <br>

Added: incubator/xap/trunk/samples/WebContent/examples/widgets/sizing.xal
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/samples/WebContent/examples/widgets/sizing.xal?view=auto&rev=556737
==============================================================================
--- incubator/xap/trunk/samples/WebContent/examples/widgets/sizing.xal (added)
+++ incubator/xap/trunk/samples/WebContent/examples/widgets/sizing.xal Mon Jul 16 14:08:53 2007
@@ -0,0 +1,75 @@
+<xal xmlns="http://openxal.org/ui/html">
+<verticalBoxPane>
+
+<htmlView>
+The first row should all be 100 pixels wide and 125 tall. The second row should be 100 wide and 25 high.
+</htmlView>
+
+<horizontalBoxPane width="1024px" height="200px">
+
+<textField text="TextField"  width="100px" height="125px" borderColor="red" borderWidth="5px"/>
+<button text="Button" width="100px" height="125px" borderColor="green" borderWidth="15px"/>
+
+<comboBox text="TextField"  width="100px"  height="125px" borderColor="blue" borderWidth="5px" borderStyle="solid">
+<listBox text="TextField"  width="100px"  height="25px">
+	<listItem text="asdasd"/>
+</listBox>
+</comboBox>
+<listBox text="TextField"  width="100px"  height="125px" borderColor="green" borderWidth="5px" borderStyle="solid">
+	<listItem text="asdasd"/>
+</listBox>
+<checkBox text="TextField"  width="100px"  height="125px" borderColor="blue" borderWidth="5px" borderStyle="solid"/>
+
+<horizontalBoxPane text="TextField"  width="100px"  height="125px"  borderColor="red" borderWidth="5px" borderStyle="solid"/>
+
+<verticalBoxPane text="TextField"  width="100px"  height="125px"  borderColor="green" borderWidth="15px" borderStyle="solid"/>
+
+<table text="TextField"  width="100px"  height="125px"  borderColor="yellow" borderWidth="5px" borderStyle="solid"/>
+
+<verticalSplitPane text="TextField"  width="100px"  height="125px"  borderColor="green" borderWidth="5px" borderStyle="solid"/>
+
+<horizontalSplitPane text="TextField"  width="100px"  height="125px"  borderColor="blue" borderWidth="5px" borderStyle="solid"/>
+
+<tabPane text="TextField"  width="100px"  height="125px"  borderColor="red" borderWidth="5px" borderStyle="solid"/>
+
+
+</horizontalBoxPane >
+
+
+<horizontalBoxPane width="1024px" height="200px">
+
+<textField text="TextField"  width="100px" height="25px" borderColor="red" borderWidth="5px"/>
+<button text="Button" width="100px" height="25px" borderColor="red" borderWidth="5px"/>
+
+<comboBox text="TextField"  width="100px"  height="25px" borderColor="red" borderWidth="5px" borderStyle="solid">
+<listBox text="TextField">
+	<listItem text="asdasd"/>
+</listBox>
+</comboBox>
+<listBox text="TextField"  width="100px"  height="25px" borderColor="red" borderWidth="5px" borderStyle="solid">
+	<listItem text="asdasd"/>
+</listBox>
+<checkBox text="TextField"  width="100px"  height="25px" borderColor="red" borderWidth="5px" borderStyle="solid"/>
+
+<horizontalBoxPane text="TextField"  width="100px"  height="25px"  borderColor="red" borderWidth="5px" borderStyle="solid"/>
+
+<verticalBoxPane text="TextField"  width="100px"  height="25px"  borderColor="red" borderWidth="5px" borderStyle="solid"/>
+
+<table text="TextField"  width="100px"  height="25px"  borderColor="yellow" borderWidth="5px" borderStyle="solid"/>
+
+<verticalSplitPane text="TextField"  width="100px"  height="25px"  borderColor="green" borderWidth="5px" borderStyle="solid"/>
+
+<horizontalSplitPane text="TextField"  width="100px"  height="25px"  borderColor="blue" borderWidth="5px" borderStyle="solid"/>
+
+<tabPane text="TextField"  width="100px"  height="25px"  borderColor="red" borderWidth="5px" borderStyle="solid"/>
+
+
+</horizontalBoxPane >
+
+<freePane width="300px" height="300px">
+	<button width="100px" height="25px" text="asdasd" borderStyle="solid" borderColor="green" margin="0px" padding="0px"/>
+	<textField width="100px" x="100px" height="25px" text="asdasd" borderStyle="solid" borderColor="green" margin="0px" padding="0px"/>
+</freePane>
+
+</verticalBoxPane>
+</xal>

Propchange: incubator/xap/trunk/samples/WebContent/examples/widgets/sizing.xal
------------------------------------------------------------------------------
    svn:eol-style = native