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 mt...@apache.org on 2006/11/10 21:28:37 UTC
svn commit: r473504 - in /incubator/xap/trunk: WebContent/examples/widgets/
src/xap/bridges/dojo/ src/xap/widgets/dojo/
Author: mturyn
Date: Fri Nov 10 13:28:36 2006
New Revision: 473504
URL: http://svn.apache.org/viewvc?view=rev&rev=473504
Log:
Many changes, most notably those for changing the following names:
freePanel --> freePane
hoizontalPanel --> horizontalBoxPane
verticalPanel --> verticalBoxPane
Fixes for attributes
borderPane: gap, horizontal, vertical
freePane: added example for new name
horizontalBoxPane,verticalBoxPane: align, pack, flex
flowPane: align
Added:
incubator/xap/trunk/WebContent/examples/widgets/borderPane.html
incubator/xap/trunk/WebContent/examples/widgets/borderPane.xal
incubator/xap/trunk/WebContent/examples/widgets/freePane.html
incubator/xap/trunk/WebContent/examples/widgets/freePane.xal
incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.html
incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.xal
incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.html
incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.xal
Modified:
incubator/xap/trunk/WebContent/examples/widgets/horizontalFlowPane.xal
incubator/xap/trunk/WebContent/examples/widgets/index.html
incubator/xap/trunk/src/xap/bridges/dojo/BorderPanelBridge.js
incubator/xap/trunk/src/xap/bridges/dojo/HorizontalFlowPaneBridge.js
incubator/xap/trunk/src/xap/bridges/dojo/HorizontalPanelBridge.js
incubator/xap/trunk/src/xap/bridges/dojo/VerticalPanelBridge.js
incubator/xap/trunk/src/xap/widgets/dojo/BorderPanel.js
incubator/xap/trunk/src/xap/widgets/dojo/HorizontalFlowPane.js
incubator/xap/trunk/src/xap/widgets/dojo/HorizontalPanel.js
incubator/xap/trunk/src/xap/widgets/dojo/VerticalPanel.js
Added: incubator/xap/trunk/WebContent/examples/widgets/borderPane.html
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/borderPane.html?view=auto&rev=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/borderPane.html (added)
+++ incubator/xap/trunk/WebContent/examples/widgets/borderPane.html Fri Nov 10 13:28:36 2006
@@ -0,0 +1,28 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <title>Simple XAP Widget Example</title>
+
+ <style type="text/css">
+ <!--
+ @import url(../../css/xapDefault.css);
+ -->
+ </style>
+
+ <!-- Keep dojo from trying to scan this whole page for dojoType'd tags: -->
+ <script type="text/javascript">
+ djConfig = {
+ parseWidgets: false
+ };
+ </script>
+
+ <script language="JavaScript" type="text/javascript" src="../../xapcore.js"></script>
+ <script language="JavaScript" type="text/javascript" src="AttributeTester.js"></script>
+ </head>
+
+ <body onload="Xap.createEmbeddedApplications();">
+ <div startPage="borderPane.xal"></div>
+ </body>
+</html>
Added: incubator/xap/trunk/WebContent/examples/widgets/borderPane.xal
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/borderPane.xal?view=auto&rev=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/borderPane.xal (added)
+++ incubator/xap/trunk/WebContent/examples/widgets/borderPane.xal Fri Nov 10 13:28:36 2006
@@ -0,0 +1,105 @@
+<xal xmlns="http://www.openxal.org/xal" xmlns:xal="http://www.openxal.org/xal">
+
+
+ <mco:mco
+ xmlns:mco="http://www.openxal.org/mco"
+ id="attributeSetter"
+ src="AttributeTester"
+ />
+
+
+
+ <xm:modifications xmlns:xm="http://www.openxal.org/xmodify">
+ <xm:append select="/xal">
+ <horizontalBoxPane>
+
+
+ <verticalBoxPane>
+ <xal:button width="200px" height="25px"
+ text="remove north"
+ onCommand="mco:attributeSetter.remove(north)"/>
+
+ <xal:button width="200px" height="25px"
+ text="remove south"
+ onCommand="mco:attributeSetter.remove(south)"/>
+
+ <xal:button width="200px" height="25px"
+ text="remove east"
+ onCommand="mco:attributeSetter.remove(east)"/>
+
+ <xal:button width="200px" height="25px"
+ text="remove west"
+ onCommand="mco:attributeSetter.remove(west)"/>
+
+ <xal:button width="200px" height="25px"
+ text="remove center"
+ onCommand="mco:attributeSetter.remove(center)"/>
+
+ <xal:button width="200px" height="25px"
+ text="add north"
+ onCommand="mco:attributeSetter.addBorderComponent(testComponent, 'north')"/>
+
+ <xal:button width="200px" height="25px"
+ text="add south"
+ onCommand="mco:attributeSetter.addBorderComponent(testComponent, 'south')"/>
+
+ <xal:button width="200px" height="25px"
+ text="add east"
+ onCommand="mco:attributeSetter.addBorderComponent(testComponent, 'east')"/>
+
+ <xal:button width="200px" height="25px"
+ text="add west"
+ onCommand="mco:attributeSetter.addBorderComponent(testComponent, 'west')"/>
+
+ <xal:button width="200px" height="25px"
+ text="add center"
+ onCommand="mco:attributeSetter.addBorderComponent(testComponent, 'center')"/>
+
+
+ <xal:button width="200px" height="25px"
+ text="gapHorizontal -> 6px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'gapHorizontal' ,'6px')"/>
+
+ <xal:button width="200px" height="25px"
+ text="gapVertical -> 2px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'gapVertical' ,'2px')"/>
+
+ <xal:button width="200px" height="25px"
+ text="width -> 30px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'width' ,'30px')"/>
+
+ <xal:button width="200px" height="25px"
+ text="height -> 30px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'height' ,'30px')"/>
+
+ </verticalBoxPane>
+ <!--standard test things -->
+ <verticalBoxPane>
+ <include href="standardButtons.xal" xmlns="http://www.openxal.org/xinclude"/>
+ </verticalBoxPane>
+ <xal:borderPane width="200px" height="200px" backgroundColor="black"
+ id="testComponent" orientation="horizontal">
+ <xal:freePane backgroundColor="red" width="20px" height="20px" id="north" borderPosition="north">
+ <label text="foo" x="0" y="0"/>
+ </xal:freePane>
+ <xal:freePane backgroundColor="green" width="20px" height="20px" id="south" borderPosition="south">
+ <label text="foo" x="0" y="0"/>
+ </xal:freePane>
+ <xal:freePane backgroundColor="blue" width="20px" height="20px" id="east" borderPosition="east">
+ <label text="foo" x="0" y="0"/>
+ </xal:freePane>
+ <xal:freePane backgroundColor="yellow" width="20px" height="20px" id="west" borderPosition="west">
+ <label text="foo" x="0" y="0"/>
+ </xal:freePane>
+ <xal:freePane backgroundColor="orange" width="20px" height="20px" id="center" borderPosition="center">
+ <label text="foo" x="0" y="0"/>
+ </xal:freePane>
+ </xal:borderPane>
+ </horizontalBoxPane>
+ </xm:append>
+ </xm:modifications>
+</xal>
Added: incubator/xap/trunk/WebContent/examples/widgets/freePane.html
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/freePane.html?view=auto&rev=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/freePane.html (added)
+++ incubator/xap/trunk/WebContent/examples/widgets/freePane.html Fri Nov 10 13:28:36 2006
@@ -0,0 +1,28 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <title>Simple XAP Widget Example</title>
+
+ <style type="text/css">
+ <!--
+ @import url(../../css/xapDefault.css);
+ -->
+ </style>
+
+ <!-- Keep dojo from trying to scan this whole page for dojoType'd tags: -->
+ <script type="text/javascript">
+ djConfig = {
+ parseWidgets: false
+ };
+ </script>
+
+ <script language="JavaScript" type="text/javascript" src="../../xapcore.js"></script>
+ <script language="JavaScript" type="text/javascript" src="AttributeTester.js"></script>
+ </head>
+
+ <body onload="Xap.createEmbeddedApplications();">
+ <div startPage="freePane.xal"></div>
+ </body>
+</html>
Added: incubator/xap/trunk/WebContent/examples/widgets/freePane.xal
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/freePane.xal?view=auto&rev=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/freePane.xal (added)
+++ incubator/xap/trunk/WebContent/examples/widgets/freePane.xal Fri Nov 10 13:28:36 2006
@@ -0,0 +1,31 @@
+<xal xmlns="http://www.openxal.org/xal" xmlns:xal="http://www.openxal.org/xal">
+
+
+ <mco:mco
+ xmlns:mco="http://www.openxal.org/mco"
+ id="attributeSetter"
+ src="AttributeTester"
+ />
+
+
+
+ <xm:modifications xmlns:xm="http://www.openxal.org/xmodify">
+ <xm:append select="/xal">
+
+ <horizontalBoxPane>
+ <verticalBoxPane>
+ <include href="standardButtons.xal" xmlns="http://www.openxal.org/xinclude"/>
+ </verticalBoxPane>
+ <xal:freePane width="200px" height="200px" backgroundColor="black"
+ id="testComponent" orientation="horizontal">
+ <xal:freePane width="100px" height="100px" backgroundColor="red"><label text="panel 1"/></xal:freePane>
+ <xal:freePane width="100px" height="100px" x="100px" backgroundColor="green"><button text="my Button"/></xal:freePane>
+ <xal:freePane y="100px" height="50%" width="100%" backgroundColor="blue"><checkBox text="my Checkbox"/></xal:freePane>
+ </xal:freePane>
+
+ </horizontalBoxPane>
+ <!--standard test things -->
+
+ </xm:append>
+ </xm:modifications>
+</xal>
Added: incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.html
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.html?view=auto&rev=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.html (added)
+++ incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.html Fri Nov 10 13:28:36 2006
@@ -0,0 +1,29 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <title>Simple XAP Widget Example</title>
+
+ <style type="text/css">
+ <!--
+ @import url(../../css/xapDefault.css);
+ -->
+ </style>
+
+ <!-- Keep dojo from trying to scan this whole page for dojoType'd tags: -->
+ <script type="text/javascript">
+ djConfig = {
+ parseWidgets: false
+ };
+ </script>
+
+ <script language="JavaScript" type="text/javascript" src="../../xapcore.js"></script>
+ <script language="JavaScript" type="text/javascript" src="AttributeTester.js"></script>
+ </head>
+
+ <body onload="Xap.createEmbeddedApplications();">
+ <div startPage="horizontalBoxPane.xal"></div>
+ </body>
+</html>
+
Added: incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.xal
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.xal?view=auto&rev=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.xal (added)
+++ incubator/xap/trunk/WebContent/examples/widgets/horizontalBoxPane.xal Fri Nov 10 13:28:36 2006
@@ -0,0 +1,99 @@
+<xal xmlns="http://www.openxal.org/xal" xmlns:xal="http://www.openxal.org/xal">
+
+
+ <mco:mco
+ xmlns:mco="http://www.openxal.org/mco"
+ id="attributeSetter"
+ src="AttributeTester"
+ />
+
+
+
+ <xm:modifications xmlns:xm="http://www.openxal.org/xmodify">
+ <xm:append select="/xal">
+ <horizontalBoxPane>
+
+ <verticalBoxPane>
+ <!-- container tests -->
+ <xal:button width="200px" height="25px"
+ text="pack -> end"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'pack' ,'end')"/>
+
+ <xal:button width="200px" height="25px"
+ text="pack -> start"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'pack' ,'start')"/>
+
+ <xal:button width="200px" height="25px"
+ text="pack -> center"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'pack' ,'center')"/>
+
+ <xal:button width="200px" height="25px"
+ text="align -> center"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align' ,'center')"/>
+
+ <xal:button width="200px" height="25px"
+ text="align -> start"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align' ,'start')"/>
+
+ <xal:button width="200px" height="25px"
+ text="align -> end"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align' ,'end')"/>
+
+ <xal:button width="200px" height="25px"
+ text="align -> stretch"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align' ,'stretch')"/>
+
+ <xal:button width="200px" height="25px"
+ text="height -> 30px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'height' ,'30px')"/>
+
+ <xal:button width="200px" height="25px"
+ text="width -> 30px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'width' ,'30px')"/>
+
+ <!-- container tests -->
+ <xal:button width="200px" height="25px"
+ text="insert before green"
+ onCommand="mco:attributeSetter.insertBefore(referenceComponent)"/>
+
+ <xal:button width="200px" height="25px"
+ text="remove green"
+ onCommand="mco:attributeSetter.remove(referenceComponent)"/>
+ </verticalBoxPane>
+
+
+ <!--standard test things -->
+
+ <verticalBoxPane>
+ <include href="standardButtons.xal" xmlns="http://www.openxal.org/xinclude"/>
+ </verticalBoxPane>
+
+ <xal:horizontalBoxPane width="200px" height="200px" backgroundColor="black"
+ id="testComponent">
+ <xal:freePane flex="2" width="20px" height="100px" backgroundColor="red">
+ <label text="f:2" x="0" y="0" />
+ </xal:freePane>
+ <xal:freePane flex="3" width="20px" height="160px" backgroundColor="green" id="referenceComponent">
+ <label text="f:3" x="0" y="0" />
+ </xal:freePane>
+ <xal:freePane width="20px" height="130px" backgroundColor="blue">
+ <label text="f:null" x="0" y="0" />
+ </xal:freePane>
+ </xal:horizontalBoxPane>
+
+
+
+ </horizontalBoxPane>
+
+ </xm:append>
+ </xm:modifications>
+</xal>
Modified: incubator/xap/trunk/WebContent/examples/widgets/horizontalFlowPane.xal
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/horizontalFlowPane.xal?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/horizontalFlowPane.xal (original)
+++ incubator/xap/trunk/WebContent/examples/widgets/horizontalFlowPane.xal Fri Nov 10 13:28:36 2006
@@ -6,95 +6,80 @@
<!-- Page title -->
- <xm:modifications document="html">
-
- <!--
- All of the below seem to to change the HTML DOM, but
- window doesn't seem to find out about it - a web search
- indicates that title setting just doesn't work using direct
- manipulation of the DOM...
- -->
-
- <!-- Don't use 'replace' in case there's no title to start-with: -->
- <!-- xm:remove-element select="//HTML/HEAD/TITLE"/ -->
- <!-- xm:append select="//HTML/HEAD">
- <title>Text area testt:</title>
- </xm:append -->
- <!-- xm:replace select="//HTML/HEAD/TITLE">
- <title>Text area testttt:</title>
- </xm:replace -->
-
- <xm:append select="//HTML/HEAD">
- <script> document.title="Text area tests:";</script>
- </xm:append>
- <!--
- Anybody know a way of forcing (in effect)
- an invalidation that would make the window
- look again to the DOM?
- -->
+ <xm:modifications document="html">
</xm:modifications>
<xm:modifications>
<xm:append select="/xal">
- <horizontalPanel>
- <verticalPanel>
+ <horizontalBoxPane>
+ <verticalBoxPane>
<!-- button specific properties -->
<xal:button width="200px" height="25px" text="text -> 'some new text'"
onCommand="mco:attributeSetter.setAttribute(testComponent,
'text','some new text')"/>
- <xal:button width="200px" height="25px" text="Limit to 8 chars."
+ <xal:button width="180px" height="25px" text="Limit to 8 chars."
onCommand="mco:attributeSetter.setAttribute(testComponent,
'maxLength','8')"/>
- <xal:button width="200px" height="25px" text="...255 chars."
+ <xal:button width="180px" height="25px" text="...255 chars."
onCommand="mco:attributeSetter.setAttribute(testComponent,
'maxLength','255')"/>
- <xal:button width="200px" height="25px" text="Selectability ON"
+ <xal:button width="180px" height="25px" text="Selectability ON"
onCommand="mco:attributeSetter.setAttribute(testComponent,
'selectable', 'true')"/>
- <xal:button width="200px" height="25px" text="Selectability OFF"
+ <xal:button width="180px" height="25px" text="Selectability OFF"
onCommand="mco:attributeSetter.setAttribute(testComponent,
'selectable','false')"/>
- <xal:button width="200px" height="25px" text="Toggle editability"
+ <xal:button width="180px" height="25px" text="Toggle editability"
onCommand="mco:attributeSetter.toggleBooleanAttribute(testComponent,
'editable')"/>
- <xal:button width="200px" height="25px" text="Editability ON"
+ <xal:button width="180px" height="25px" text="Editability ON"
onCommand="mco:attributeSetter.setAttribute(testComponent,
'editable', 'true')"/>
- <xal:button width="200px" height="25px" text="Editability OFF"
+ <xal:button width="180px" height="25px" text="Editability OFF"
onCommand="mco:attributeSetter.setAttribute(testComponent,
'editable','false')"/>
+
+ <xal:button width="180px" height="25px" text="gapHorizontal: 6px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'gapHorizontal','6px')"/>
+
+ <xal:button width="180px" height="25px" text="gapVertical: 2px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'gapVertical','2px')"/>
+
+ <xal:button width="180px" height="25px" text="align: start"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align','start')"/>
+
+
+ <xal:button width="180px" height="25px" text="align: end"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align','end')"/>
+
+
+ <xal:button width="180px" height="25px" text="align: center"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align','center')"/>
+
<!--standard test things -->
- </verticalPanel>
- <verticalPanel>
+ </verticalBoxPane>
+ <verticalBoxPane>
<include href="standardButtons.xal" xmlns="http://www.openxal.org/xinclude"/>
- </verticalPanel>
- <xal:textArea width="200px" text="This is some text" id="testComponent"
- onActiveGained="mco:attributeSetter.reportEvent(event)"
- onActiveLost="mco:attributeSetter.reportEvent(event)"
- onBeforeActiveLost="mco:attributeSetter.reportEvent(event)"
- onContextMenu="mco:attributeSetter.reportEvent(event)"
- onDoubleClick="mco:attributeSetter.reportEvent(event)"
- onDragDrop="mco:attributeSetter.reportEvent(event)"
- onDragEnd="mco:attributeSetter.reportEvent(event)"
- onDragStart="mco:attributeSetter.reportEvent(event)"
- onEdit="mco:attributeSetter.reportEvent(event)"
- onKeyChar="mco:attributeSetter.reportEvent(event)"
- onKeyDown="mco:attributeSetter.reportEvent(event)"
- onKeyUp="mco:attributeSetter.reportEvent(event)"
- onMouseDown="mco:attributeSetter.reportEvent(event)"
- onMouseDrag="mco:attributeSetter.reportEvent(event)"
- onMouseMove="mco:attributeSetter.reportEvent(event)"
- onMouseOut="mco:attributeSetter.reportEvent(event)"
- onMouseOver="mco:attributeSetter.reportEvent(event)"
- onMouseUp="mco:attributeSetter.reportEvent(event)"
- onTextChange="mco:attributeSetter.reportEvent(event)"/>
- </horizontalPanel>
+ </verticalBoxPane>
+
+ <horizontalFlowPane width="300px" height="300px" id="testComponent" backgroundColor="black">
+ <label text="width:150px" x="0" y="0" height="25px" width="150px" backgroundColor="red"
+ borderStyle="solid" borderWidth="1px" borderColor="blue" />
+ <label text="width:80px" x="0" y="0" height="25px" width="80px" backgroundColor="blue" />
+ <label text="width:250px" x="0" y="0" height="25px" width="250px" backgroundColor="yellow" />
+ </horizontalFlowPane>
+ </horizontalBoxPane>
</xm:append>
</xm:modifications>
</xal>
Modified: incubator/xap/trunk/WebContent/examples/widgets/index.html
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/index.html?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/index.html (original)
+++ incubator/xap/trunk/WebContent/examples/widgets/index.html Fri Nov 10 13:28:36 2006
@@ -13,10 +13,10 @@
<li><a href="passwordField.html"><passwordField></a></li>
<li><a href="tabPane.html"><tabPane></a></li>
<li><a href="splitPane.html"><splitPane></a></li>
-<li><a href="freePanel.html"><freePanel></a></li>
-<li><a href="verticalPanel.html"><verticalPanel></a></li>
-<li><a href="horizontalPanel.html"><horizontalPanel></a></li>
-<li><a href="borderPanel.html"><borderPanel></a></li>
+<li><a href="freePane.html"><freePane></a></li>
+<li><a href="verticalBoxPane.html"><verticalBoxPane></a></li>
+<li><a href="horizontalBoxPane.html"><horizontalBoxPane></a></li>
+<li><a href="borderPane.html"><borderPane></a></li>
<li><a href="table.html"><table></a></li>
<li><a href="tree.html"><tree></a></li>
<li><a href="treeTable.html"><treeTable></a></li>
Added: incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.html
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.html?view=auto&rev=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.html (added)
+++ incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.html Fri Nov 10 13:28:36 2006
@@ -0,0 +1,29 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <title>Simple XAP Widget Example</title>
+
+ <style type="text/css">
+ <!--
+ @import url(../../css/xapDefault.css);
+ -->
+ </style>
+
+ <!-- Keep dojo from trying to scan this whole page for dojoType'd tags: -->
+ <script type="text/javascript">
+ djConfig = {
+ parseWidgets: false
+ };
+ </script>
+
+ <script language="JavaScript" type="text/javascript" src="../../xapcore.js"></script>
+ <script language="JavaScript" type="text/javascript" src="AttributeTester.js"></script>
+ </head>
+
+ <body onload="Xap.createEmbeddedApplications();">
+ <div startPage="verticalBoxPane.xal"></div>
+ </body>
+</html>
+
Added: incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.xal
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.xal?view=auto&rev=473504
==============================================================================
--- incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.xal (added)
+++ incubator/xap/trunk/WebContent/examples/widgets/verticalBoxPane.xal Fri Nov 10 13:28:36 2006
@@ -0,0 +1,100 @@
+<xal xmlns="http://www.openxal.org/xal" xmlns:xal="http://www.openxal.org/xal">
+
+
+ <mco:mco
+ xmlns:mco="http://www.openxal.org/mco"
+ id="attributeSetter"
+ src="AttributeTester"
+ />
+
+
+
+ <xm:modifications xmlns:xm="http://www.openxal.org/xmodify">
+ <xm:append select="/xal">
+ <horizontalBoxPane>
+ <verticalBoxPane>
+ <!-- container tests -->
+ <xal:button width="200px" height="25px"
+ text="pack -> end"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'pack' ,'end')"/>
+
+ <xal:button width="200px" height="25px"
+ text="pack -> start"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'pack' ,'start')"/>
+
+ <xal:button width="200px" height="25px"
+ text="pack -> center"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'pack' ,'center')"/>
+
+
+ <xal:button width="200px" height="25px"
+ text="align -> center"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align' ,'center')"/>
+
+ <xal:button width="200px" height="25px"
+ text="align -> start"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align' ,'start')"/>
+
+ <xal:button width="200px" height="25px"
+ text="align -> end"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align' ,'end')"/>
+
+ <xal:button width="200px" height="25px"
+ text="align -> stretch"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'align' ,'stretch')"/>
+
+ <xal:button width="200px" height="25px"
+ text="height -> 30px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'height' ,'30px')"/>
+
+ <xal:button width="200px" height="25px"
+ text="width -> 30px"
+ onCommand="mco:attributeSetter.setAttribute(testComponent,
+ 'width' ,'30px')"/>
+
+ <!-- container tests -->
+ <xal:button width="200px" height="25px"
+ text="insert before"
+ onCommand="mco:attributeSetter.insertBefore(referenceComponent)"/>
+
+ <xal:button width="200px" height="25px"
+ text="remove"
+ onCommand="mco:attributeSetter.remove(referenceComponent)"/>
+</verticalBoxPane>
+
+
+
+ <!--standard test things -->
+
+ <verticalBoxPane>
+ <include href="standardButtons.xal" xmlns="http://www.openxal.org/xinclude"/>
+ </verticalBoxPane>
+
+ <xal:verticalBoxPane width="200px" height="500px" backgroundColor="black"
+ id="testComponent">
+
+ <xal:freePane flex="3" width="110px" height="20px" backgroundColor="red">
+ <label text="flex:3 width:110" x="0" y="0" />
+ </xal:freePane>
+ <xal:freePane flex="4" width="120px" height="20px" backgroundColor="green" id="referenceComponent">
+ <label text="flex:4 width:120" x="0" y="0" />
+ </xal:freePane>
+ <xal:freePane flex="1" width="150px" height="20px" backgroundColor="yellow">
+ <label text="flex:1 width:150 Debug-Mon Nov 06 2006 14:29:05 GMT-0500 (Eastern Standard Time) (xap.taghandling.PluginRegistryImpl): Add tag mapping:binding:xap.data.bridge.BindingBridge" x="0" y="0" />
+ </xal:freePane>
+ <xal:freePane width="140px" height="20px" backgroundColor="blue">
+ <label text="flex:null width:140" x="0" y="0" />
+ </xal:freePane>
+ </xal:verticalBoxPane>
+</horizontalBoxPane>
+ </xm:append>
+ </xm:modifications>
+</xal>
Modified: incubator/xap/trunk/src/xap/bridges/dojo/BorderPanelBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/bridges/dojo/BorderPanelBridge.js?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/src/xap/bridges/dojo/BorderPanelBridge.js (original)
+++ incubator/xap/trunk/src/xap/bridges/dojo/BorderPanelBridge.js Fri Nov 10 13:28:36 2006
@@ -76,7 +76,19 @@
* No new dynamic attributes
*/
xap.bridges.dojo.BorderPanelBridge.prototype.getNewAllowedAttributes = function(){
- return [];
+ return ["gapHorizontal", "gapVertical"];
}
+xap.bridges.dojo.BorderPanelBridge.prototype.setGapHorizontalAttribute = function(value) {
+ this.getPeer().setGapHorizontal(value);
+}
+
+xap.bridges.dojo.BorderPanelBridge.prototype.setGapVerticalAttribute = function(value) {
+ this.getPeer().setGapVertical(value);
+}
+
+xap.bridges.dojo.BorderPanelBridge.prototype.setBackgroundColorAttribute = function(value) {
+ this.getPeer().domNode.style.backgroundColor = value;
+ this.getPeer().showGaps();
+}
\ No newline at end of file
Modified: incubator/xap/trunk/src/xap/bridges/dojo/HorizontalFlowPaneBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/bridges/dojo/HorizontalFlowPaneBridge.js?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/src/xap/bridges/dojo/HorizontalFlowPaneBridge.js (original)
+++ incubator/xap/trunk/src/xap/bridges/dojo/HorizontalFlowPaneBridge.js Fri Nov 10 13:28:36 2006
@@ -62,7 +62,19 @@
* No new dynamic attributes
*/
xap.bridges.dojo.HorizontalFlowPaneBridge.prototype.getNewAllowedAttributes = function(){
- return [];
+ return ["gapHorizontal", "gapVertical", "align"];
}
+xap.bridges.dojo.HorizontalFlowPaneBridge.prototype.setGapHorizontalAttribute = function(value) {
+ this.getPeer().setGapHorizontal(value);
+}
+
+
+xap.bridges.dojo.HorizontalFlowPaneBridge.prototype.setGapVerticalAttribute = function(value) {
+ this.getPeer().setGapVertical(value);
+}
+
+xap.bridges.dojo.HorizontalFlowPaneBridge.prototype.setAlignAttribute = function(value) {
+ this.getPeer().setAlign(value);
+}
Modified: incubator/xap/trunk/src/xap/bridges/dojo/HorizontalPanelBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/bridges/dojo/HorizontalPanelBridge.js?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/src/xap/bridges/dojo/HorizontalPanelBridge.js (original)
+++ incubator/xap/trunk/src/xap/bridges/dojo/HorizontalPanelBridge.js Fri Nov 10 13:28:36 2006
@@ -73,3 +73,20 @@
this.getPeer().setPack(value);
}
+
+xap.bridges.dojo.HorizontalPanelBridge.prototype.addChild = function(childHandler, index) {
+ var element = childHandler.getElement();
+
+ var flex = element.getAttribute("flex");
+ var flexInt = 1;
+ if (flex) {
+ flexInt= parseInt(flex);
+ }
+
+ var insertIndex = index < 0 ? this.getPeer().children.length : index;
+ var childPeer = this.getDojoWidgetPeer(childHandler);
+ if (childPeer) {
+ this.getPeer().addChild(childPeer, null, 'insertAtIndex', null, insertIndex, flexInt);
+ }
+}
+
\ No newline at end of file
Modified: incubator/xap/trunk/src/xap/bridges/dojo/VerticalPanelBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/bridges/dojo/VerticalPanelBridge.js?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/src/xap/bridges/dojo/VerticalPanelBridge.js (original)
+++ incubator/xap/trunk/src/xap/bridges/dojo/VerticalPanelBridge.js Fri Nov 10 13:28:36 2006
@@ -25,7 +25,7 @@
Xap.require("xap.bridges.dojo.DojoWidgetBridge");
Xap.require("xap.widgets.dojo.VerticalPanel");
-
+Xap.require("dojo.style.*");
/**
@@ -34,7 +34,7 @@
* A bridge class with dojo toolkit box panel peer.
*/
-xap.bridges.dojo.VerticalPanelBridge= function() {
+xap.bridges.dojo.VerticalPanelBridge= function() {
xap.bridges.dojo.DojoWidgetBridge.call(this);
}
@@ -60,7 +60,7 @@
xap.bridges.dojo.VerticalPanelBridge.prototype.getNewAllowedAttributes = function(){
- return ["align","pack"];
+ return ["align", "pack"];
}
/** XML attribute set method for "align" */
@@ -68,11 +68,24 @@
this.getPeer().setAlign(value);
}
-/** XML attribute set method for "align" */
+/** XML attribute set method for "pack" */
xap.bridges.dojo.VerticalPanelBridge.prototype.setPackAttribute = function(value){
this.getPeer().setPack(value);
-}
-
-
+}
+xap.bridges.dojo.VerticalPanelBridge.prototype.addChild = function(childHandler, index) {
+ var element = childHandler.getElement();
+ var flex = element.getAttribute("flex");
+ var flexInt = 1;
+ if (flex) {
+ flexInt= parseInt(flex);
+ }
+
+ var insertIndex = index < 0 ? this.getPeer().children.length : index;
+ var childPeer = this.getDojoWidgetPeer(childHandler);
+ if (childPeer) {
+ this.getPeer().addChild(childPeer, null, 'insertAtIndex', null, insertIndex, flexInt);
+ }
+}
+
\ No newline at end of file
Modified: incubator/xap/trunk/src/xap/widgets/dojo/BorderPanel.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/widgets/dojo/BorderPanel.js?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/src/xap/widgets/dojo/BorderPanel.js (original)
+++ incubator/xap/trunk/src/xap/widgets/dojo/BorderPanel.js Fri Nov 10 13:28:36 2006
@@ -37,15 +37,17 @@
dojo.inherits(xap.widgets.dojo.BorderPanel,dojo.widget.HtmlWidget);
dojo.lang.extend(xap.widgets.dojo.BorderPanel, {
- templateString: '<table style="overflow:hidden"><tr align="center" valign="center">'+
+ templateString: '<table style="overflow:hidden" cellpadding="0" cellspacing="0" border="0"><tr align="center" valign="center">'+
'<td colspan="3" dojoAttachPoint="north" style="height:1px"></td></tr>' +
- '<tr align="center" valign="center"">'+
+ '<tr align="center" valign="center" style="height:99%">'+
'<td dojoAttachPoint="west" style="width:1px"></td><td dojoAttachPoint="center" style="height:99%;width:99%"></td><td style="width:1px" dojoAttachPoint="east"></td></tr>' +
'<tr align="center" valign="center"><td colspan="3" style="height:1px" dojoAttachPoint="south"></tr></td></table>',
templateCssPath: null ,
widgetType: "BorderPanel",
isContainer: true,
+ gapHorizontal: "0px",
+ gapVertical: "0px",
addChild: function(child, position){
@@ -87,6 +89,7 @@
if (adjustHeight){
child.domNode.style.height="100%";
}
+
xap.widgets.dojo.BorderPanel.superclass.addChild.call(this,child);
},
@@ -110,6 +113,42 @@
nodeStyle.width= "99%";
nodeStyle.height = "99%";
}
- }
+ },
+
+ setGapHorizontal: function(value) {
+ this.gapHorizontal = value;
+ this.showGaps();
+
+ },
+
+ setGapVertical: function(value) {
+ this.gapVertical = value;
+ this.showGaps();
+ },
+
+ showGaps: function() {
+ this.center.style.borderStyle = "solid";
+ this.center.style.borderColor = this.domNode.style.backgroundColor;
+
+ this.center.style.borderLeftWidth = this.gapVertical;
+ this.center.style.borderRightWidth = this.gapVertical;
+
+ this.center.style.borderTopWidth = this.gapHorizontal;
+ this.center.style.borderBottomWidth = this.gapHorizontal;
+
+ this.west.style.borderStyle = "solid";
+ this.west.style.borderColor = this.domNode.style.backgroundColor;
+ this.west.style.borderTopWidth = this.gapHorizontal;
+ this.west.style.borderBottomWidth = this.gapHorizontal;
+ this.west.style.borderLeftWidth = "0px";
+ this.west.style.borderRightWidth = "0px";
+
+ this.east.style.borderStyle = "solid";
+ this.east.style.borderColor = this.domNode.style.backgroundColor;
+ this.east.style.borderTopWidth = this.gapHorizontal;
+ this.east.style.borderBottomWidth = this.gapHorizontal;
+ this.east.style.borderLeftWidth = "0px";
+ this.east.style.borderRightWidth = "0px";
+ }
}
);
Modified: incubator/xap/trunk/src/xap/widgets/dojo/HorizontalFlowPane.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/widgets/dojo/HorizontalFlowPane.js?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/src/xap/widgets/dojo/HorizontalFlowPane.js (original)
+++ incubator/xap/trunk/src/xap/widgets/dojo/HorizontalFlowPane.js Fri Nov 10 13:28:36 2006
@@ -44,10 +44,16 @@
//TODO revisit this and see if it is really a problem,
//in theiry display:block should create a block that absolute children
//are relative to.
- templateString: '<table cellPadding="0" cellSpacing="0" style="overflow:hidden"><tbody><tr><td style="width:100%;height:100%"><div dojoAttachPoint="containerNode" style="width: 100%; height: 100%; position:relative"></td></tr></tbody></table>',
+ templateString: '<div style="overflow:hidden;"><table cellPadding="0" cellSpacing="0"><tbody>'
+ + '<tr><td style="width:100%;height:100%">'
+ + '<div dojoAttachPoint="containerNode" style="width: 100%; height: 100%; position:relative;"></div>'
+ + '</td></tr>'
+ + '</tbody></table></div>',
templateCssPath: null ,
widgetType: "HorizontalFlowPane",
isContainer: true,
+ gapVertical: "0px",
+ gapHorizontal: "0px",
addChild: function(child, overrideContainerNode, pos, ref, insertIndex){
@@ -55,15 +61,31 @@
//but neither moz nor IE supports that. IE seems to work fine
//with just "inline", moz doesn't like that but "-moz-inline-box"
//seems to work well
+
if (dojo.render.html.ie){
child.domNode.style.display = "inline";
}
else{ //TODO what about non mozilla non IE?
child.domNode.style.display = "-moz-inline-box";
}
+
xap.widgets.dojo.HorizontalFlowPane.superclass.addChild.call(this,child, overrideContainerNode, pos, ref, insertIndex);
+ },
+
+ setGapHorizontal: function(value) {
+ },
+
+ setGapVertical: function(value) {
+ },
+
+ setAlign: function(value) {
+ if (value == "start") {
+ this.containerNode.style.textAlign = "left";
+ } else if (value == "end") {
+ this.containerNode.style.textAlign = "right";
+ } else if (value == "center") {
+ this.containerNode.style.textAlign = "center";
+ }
}
}
-);
-
-
+);
\ No newline at end of file
Modified: incubator/xap/trunk/src/xap/widgets/dojo/HorizontalPanel.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/widgets/dojo/HorizontalPanel.js?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/src/xap/widgets/dojo/HorizontalPanel.js (original)
+++ incubator/xap/trunk/src/xap/widgets/dojo/HorizontalPanel.js Fri Nov 10 13:28:36 2006
@@ -37,40 +37,40 @@
dojo.inherits(xap.widgets.dojo.HorizontalPanel, dojo.widget.HtmlWidget);
dojo.lang.extend(xap.widgets.dojo.HorizontalPanel, {
- templateString: '<table cellPadding="0" cellSpacing="0"><tbody><tr><td dojoAttachPoint="startCell"></td>'
- +'<td dojoAttachPoint="endCell" style="width:99%"></td></tr></tbody></table>',
+ templateString: '<div style="height:100%;overflow:hidden;" dojoAttachPoint="div">'
+ + '<table cellPadding="0" cellSpacing="0" dojoAttachPoint="table" height="100%" width="100%"><tbody dojoAttachPoint="tbody">'
+ + '<tr dojoAttachPoint="centerRow" style="height:100%; width:100%">'
+ + '<td dojoAttachPoint="centerTd" valign="top" align="left" height="100%" width="100%">'
+ + '<table dojoAttachPoint="centerTable" border="0" cellspacing="0" cellpadding="0" height="100%">'
+ + '<tbody dojoAttachPoint="centerTbody"><tr dojoAttachPoint="row"></tr></tbody>'
+ + '</table></td></tr>'
+ + '</tbody></table></div>',
+
templateCssPath: null ,
widgetType: "HorizontalPanel",
isContainer: true,
+ align: "center",
- addChild: function(child, overrideContainerNode, pos, ref, insertIndex){
- var row = this.endCell.parentNode;
- var cell = document.createElement("td");
-
-
- if (this.align=="center"){
- cell.vAlign = "center";
- }
- else if (this.align=="start"){
- cell.vAlign = "top";
- }
- else if (this.align=="end"){
- cell.vAlign = "bottom";
- }
- else if (this.align=="stretch"){
- child.domNode.style.height="100%";
- }
+ addChild: function(child, overrideContainerNode, pos, ref, insertIndex, flex) {
+ var row = this.row;
+ var cell = document.createElement("td");
+ cell.style.height = "100%";
+
+ child.domNode.flex = flex;
- //if we are inserting in the middle, insert before some row
- //bumped up one to account for the start spacer row
- if (insertIndex && insertIndex>=0 && insertIndex<row.childNodes.length-2){
- row.insertBefore(cell,row.childNodes[insertIndex+1]);
+ if (insertIndex && insertIndex >= 0 && insertIndex < row.childNodes.length - 2) {
+ row.insertBefore(cell, row.childNodes[insertIndex + 1]);
}
else{
- row.insertBefore(cell, this.endCell);
+ row.appendChild(cell);
}
+
this.containerNode = cell;
+
xap.widgets.dojo.HorizontalPanel.superclass.addChild.call(this,child, overrideContainerNode, pos, ref, insertIndex);
+
+ this.setAlign(this.align);
+ this.flex();
},
removeChild: function(child) {
@@ -80,27 +80,79 @@
var containerCell= child.domNode.parentNode;
xap.widgets.dojo.HorizontalPanel.superclass.removeChild.call(this,child);
containerCell.parentNode.removeChild(containerCell);
+
+ this.flex();
},
- setAlign: function(align){
- this.align = align;
+ setAlign: function(align) {
+ var cells = this.row.childNodes;
+ this.align = align;
+
+ if (align == "stretch") {
+ for (var i = 0; i < cells.length; i++) {
+ if (cells[i].firstChild && cells[i].firstChild.style.height != "100%") {
+ cells[i].firstChild.originalHeight = cells[i].firstChild.style.height;
+ cells[i].firstChild.style.height = "100%";
+ cells[i].style.verticalAlign = "top";
+ }
+ }
+ } else {
+ for (var i = 0; i < cells.length; i++) {
+ if (cells[i].firstChild
+ && cells[i].firstChild.originalHeight) {
+ cells[i].firstChild.style.height = cells[i].firstChild.originalHeight;
+ }
+
+ if (align == "start") {
+ cells[i].style.verticalAlign = "top";
+ } else if (align == "end") {
+ cells[i].style.verticalAlign = "bottom";
+ } else if (align == "center") {
+ cells[i].style.verticalAlign = "middle";
+ }
+ }
+ }
},
setPack: function(pack){
- if (pack=="start"){
- this.startCell.style.width="0%";
- this.endCell.style.width="99%";
+ if (pack == "start"){
+ this.centerTd.align = "left";
}
- else if (pack=="end"){
- this.startCell.style.width="99%";
- this.endCell.style.width="0%";
+ else if (pack == "end"){
+ this.centerTd.align = "right";
}
- else if (pack=="center"){
- this.startCell.style.width="50%";
- this.endCell.style.width="50%";
- }
- }
-}
-);
-
+ else if (pack == "center") {
+ this.centerTd.align = "center";
+ }
+ },
+
+ flex: function() {
+ var children = this.children;
+ var maxFlex = -1;
+ var minFlex = 999999;
+ var minWidth = 999999;
+ for (var i = 0; i < children.length; i++) {
+ if (!children[i].domNode.flex) {
+ children[i].domNode.flex = 1;
+ }
+
+ var flexInt = parseInt(children[i].domNode.flex);
+
+ maxFlex = Math.max(flexInt, maxFlex);
+ minFlex = Math.min(flexInt, minFlex);
+
+ minWidth = Math.min(minWidth, parseInt(children[i].domNode.offsetWidth));
+ }
+
+ if (maxFlex != minFlex) {
+ for (var i = 0; i < children.length; i++) {
+ if (children[i].domNode.style.width) {
+ var ratio = parseInt(children[i].domNode.flex) / minFlex;
+ children[i].domNode.style.width = minWidth * ratio + "px";
+ }
+ }
+ }
+ }
+}
+);
\ No newline at end of file
Modified: incubator/xap/trunk/src/xap/widgets/dojo/VerticalPanel.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/src/xap/widgets/dojo/VerticalPanel.js?view=diff&rev=473504&r1=473503&r2=473504
==============================================================================
--- incubator/xap/trunk/src/xap/widgets/dojo/VerticalPanel.js (original)
+++ incubator/xap/trunk/src/xap/widgets/dojo/VerticalPanel.js Fri Nov 10 13:28:36 2006
@@ -30,86 +30,143 @@
dojo.widget.manager.registerWidgetPackage("xap.widgets.dojo");
dojo.widget.tags.addParseTreeHandler("dojo:VerticalPanel");
-xap.widgets.dojo.VerticalPanel = function(){
+xap.widgets.dojo.VerticalPanel = function() {
dojo.widget.HtmlWidget.call(this);
- this.align = "center";//start, center, end, stretch
+ this.align = "start";//start, center, end, stretch
}
dojo.inherits(xap.widgets.dojo.VerticalPanel, dojo.widget.HtmlWidget);
dojo.lang.extend(xap.widgets.dojo.VerticalPanel, {
- templateString: '<table cellPadding="0" cellSpacing="0"><tbody dojoAttachPoint="tbody">' +
- '<tr dojoAttachPoint="startRow"><td></td></tr>'
- +'<tr dojoAttachPoint="endRow" style="height:99%"><td></td></tr></tbody></table>',
+ templateString: '<div dojoAttachPoint="div" style="overflow:hidden;">'
+ + '<table cellPadding="0" cellSpacing="0" dojoAttachPoint="table" width="100%" height="100%"><tbody dojoAttachPoint="tbody">'
+ + '<tr dojoAttachPoint="centerRow" style="height:100%">'
+ + '<td dojoAttachPoint="centerTd" valign="top" align="left" height="100%" width="100%">'
+ + '<table dojoAttachPoint="centerTable" border="0" width="100%" cellspacing="0" cellpadding="0">'
+ + '<tbody dojoAttachPoint="centerTbody"></tbody>'
+ + '</table></td></tr>'
+ + '</tbody></table></div>',
templateCssPath: null ,
widgetType: "VerticalPanel",
isContainer: true,
- addChild: function(child, overrideContainerNode, pos, ref, insertIndex){
+ addChild: function(child, overrideContainerNode, pos, ref, insertIndex, flex) {
//TODO if they have something like height=50%
//we should set that on the table cell?
var row = document.createElement("tr");
- var cell = document.createElement("td");
- if (this.align=="center"){
- cell.align = "center";
- }
- else if (this.align=="start"){
- cell.align = "left";
- }
- else if (this.align=="end"){
- cell.align = "right";
- }
-
- //if they set the width again after this it won't really work
- //TODO this can happen now when they have width=x because
- //of the order of operations we add the child to the parent
- //BEFORE we go through the initial attributes
- else if (this.align=="stretch"){
- child.domNode.style.width="100%";
- }
+ var cell = document.createElement("td");
+ child.domNode.flex = flex;
+
row.appendChild(cell);
- var tBody = this.tbody;
+ var tBody = this.centerTbody;
- //if we are inserting in the middle, insert before some row
- //bumped up one to account for the start spacer row
- if (insertIndex && insertIndex>=0 && insertIndex<tBody.childNodes.length-2){
- tBody.insertBefore(row,tBody.childNodes[insertIndex+1]);
+ if (insertIndex && insertIndex >= 0 && insertIndex < tBody.childNodes.length - 2) {
+ tBody.insertBefore(row, tBody.childNodes[insertIndex + 1]);
}
else{
- tBody.insertBefore(row, this.endRow);
+ tBody.appendChild(row);
}
+
this.containerNode = cell;
- xap.widgets.dojo.VerticalPanel.superclass.addChild.call(this,child, overrideContainerNode, pos, ref, 0);
+ xap.widgets.dojo.VerticalPanel.superclass.addChild.call(this, child, overrideContainerNode, pos, ref, 0);
+
+
+ this.setAlign(this.align);
+ this.flex();
+ this.setPack("start");
},
- removeChild: function(child) {
+ removeChild: function(child) {
//when we remove the child we also have to remove the entire
//row it was in
var containerRow = child.domNode.parentNode.parentNode;
xap.widgets.dojo.VerticalPanel.superclass.removeChild.call(this,child);
containerRow.parentNode.removeChild(containerRow);
+
+ this.flex();
},
setAlign: function(align){
- this.align = align;
+ var children = this.centerTbody.childNodes;
+
+ this.align = align;
+
+ if (align == "stretch") {
+ this.centerTable.style.width = "100%";
+
+ for (var i = 0; i < children.length; i++) {
+ if (children[i].firstChild && children[i].firstChild.firstChild) {
+ if (children[i].firstChild.firstChild.style.width != "100%") {
+ children[i].firstChild.firstChild.originalWidth = children[i].firstChild.firstChild.style.width;
+ children[i].firstChild.firstChild.style.width = "100%";
+ }
+ }
+ }
+ } else {
+ for (var i = 0; i < children.length; i++) {
+ if (children[i].firstChild) {
+ if (align == "start") {
+ children[i].firstChild.align = "left";
+ } else if (align == "end") {
+ children[i].firstChild.align = "right";
+ } else if (align == "center") {
+ children[i].firstChild.align = "center";
+ }
+
+ if (children[i].firstChild.firstChild
+ && children[i].firstChild.firstChild.originalWidth) {
+ children[i].firstChild.firstChild.style.width = children[i].firstChild.firstChild.originalWidth;
+ }
+ }
+ }
+ }
},
- setPack: function(pack){
- if (pack=="start"){
- this.startRow.style.height="0%";
- this.endRow.style.height="99%";
+ setPack: function(pack) {
+ if (pack=="start"){
+ this.centerTd.style.verticalAlign = "top";
}
else if (pack=="end"){
- this.startRow.style.height="99%";
- this.endRow.style.height="0%";
+ this.centerTd.style.verticalAlign = "bottom";
}
- else if (pack=="center"){
- this.startRow.style.height="50%";
- this.endRow.style.height="50%";
- }
- }
-}
-);
-
+ else if (pack=="center") {
+ this.centerTd.style.verticalAlign = "middle";
+ }
+ },
+ show: function() {
+ this.isHidden = false;
+ this.flex();
+ },
+
+ flex: function() {
+ var children = this.children;
+
+ var maxFlex = -1;
+ var minFlex = 999999;
+ var minHeight = 999999;
+ for (var i = 0; i < children.length; i++) {
+ if (!children[i].domNode.flex) {
+ children[i].domNode.flex = 1;
+ }
+
+ var flexInt = parseInt(children[i].domNode.flex);
+
+ maxFlex = Math.max(flexInt, maxFlex);
+ minFlex = Math.min(flexInt, minFlex);
+
+ minHeight = Math.min(minHeight, parseInt(children[i].domNode.offsetHeight));
+ }
+
+ if (maxFlex != minFlex) {
+ for (var i = 0; i < children.length; i++) {
+ if (children[i].domNode.style.height) {
+ var ratio = parseInt(children[i].domNode.flex) / minFlex;
+ children[i].domNode.style.height = minHeight * ratio + "px";
+ }
+ }
+ }
+ }
+}
+);
\ No newline at end of file