[seam-commits] Seam SVN: r11428 - in sandbox/trunk/modules/xwidgets: src/main/javascript and 1 other directory.

seam-commits at lists.jboss.org seam-commits at lists.jboss.org
Wed Aug 26 04:05:51 EDT 2009


Author: shane.bryzak at jboss.com
Date: 2009-08-26 04:05:50 -0400 (Wed, 26 Aug 2009)
New Revision: 11428

Modified:
   sandbox/trunk/modules/xwidgets/examples/helloworld/index.html
   sandbox/trunk/modules/xwidgets/examples/helloworld/test.xw
   sandbox/trunk/modules/xwidgets/examples/helloworld/xw.Panel.js
   sandbox/trunk/modules/xwidgets/src/main/javascript/xw.js
Log:
layout manager functionality


Modified: sandbox/trunk/modules/xwidgets/examples/helloworld/index.html
===================================================================
--- sandbox/trunk/modules/xwidgets/examples/helloworld/index.html	2009-08-26 02:34:26 UTC (rev 11427)
+++ sandbox/trunk/modules/xwidgets/examples/helloworld/index.html	2009-08-26 08:05:50 UTC (rev 11428)
@@ -2,7 +2,7 @@
   <body style="background-color:#eeeeee">
     <h1>Hello World Example</h1>
   
-    <div id="container"></div>
+    <div id="container" style="border:1px solid black;width:50%;height:50%"></div>
     
     <script src="../../src/main/javascript/xw.js"></script>
       

Modified: sandbox/trunk/modules/xwidgets/examples/helloworld/test.xw
===================================================================
--- sandbox/trunk/modules/xwidgets/examples/helloworld/test.xw	2009-08-26 02:34:26 UTC (rev 11427)
+++ sandbox/trunk/modules/xwidgets/examples/helloworld/test.xw	2009-08-26 08:05:50 UTC (rev 11428)
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <view xmlns="http://jboss.com/products/xwidgets">
-  <panel>
+  <panel align="top" height="100">
     <label value="Hello World!"/>
     
     <button value="Click me!">
@@ -10,5 +10,24 @@
         </action>
       </event>
     </button>
+  </panel>
+  <panel align="right" width="100">
+    <label value="right"/>
+  </panel>
+  
+  <panel align="bottom" height="30">
+    <label value="bottom"/>
+  </panel>
+  
+  <panel align="left" width="40">
+    <label value="left"/>
+  </panel>
+  
+  <panel align="left" width="40">
+    <label value="left2"/>
+  </panel>  
+  
+  <panel align="client">
+    <label value="client"/>
   </panel>
-</view>
\ No newline at end of file
+</view>

Modified: sandbox/trunk/modules/xwidgets/examples/helloworld/xw.Panel.js
===================================================================
--- sandbox/trunk/modules/xwidgets/examples/helloworld/xw.Panel.js	2009-08-26 02:34:26 UTC (rev 11427)
+++ sandbox/trunk/modules/xwidgets/examples/helloworld/xw.Panel.js	2009-08-26 08:05:50 UTC (rev 11428)
@@ -5,29 +5,53 @@
   this.width = 200;
   this.height = 100; 
   this.parent = null;
-  this.control = null;
+  this.control = null;
+  this.align = null;
     
   xw.controls.Panel.prototype.setParent = function(parent)
   {
     this.parent = parent;
+  }
+  
+  xw.controls.Panel.prototype.setAlign = function(align)
+  {
+    this.align = align;
+  }
+  
+  xw.controls.Panel.prototype.setWidth = function(width)
+  {
+    this.width = width;
+  }
+  
+  xw.controls.Panel.prototype.setHeight = function(height)
+  {
+    this.height = height;
   }
   
-  xw.controls.Panel.prototype.paint = function()
+  xw.controls.Panel.prototype.paint = function(layout)
   {
      if (this.control == null)
      {
        this.control = document.createElement("div");
-       this.control.widget = this;
-       this.parent.control.appendChild(this.control);
-       
-       this.control.style.width = "400";
-       this.control.style.height = "200";
-       
+       this.control.widget = this;              
        this.control.style.backgroundColor = "#ece9d6";
        this.control.style.borderTop = "1px solid white";
        this.control.style.borderLeft = "1px solid white";
        this.control.style.borderBottom = "1px solid #555555";
-       this.control.style.borderRight = "1px solid #555555";
+       this.control.style.borderRight = "1px solid #555555";
+       
+       if (layout != null)
+       {
+         layout.setBounds(this);
+       }
+       else
+       {
+         this.control.style.width = this.width;
+         this.control.style.height = this.height;         
+         this.control.style.display = "inline";
+       }
+
+       this.parent.control.appendChild(this.control);
      }    
      
      for (var i = 0; i < this.children.length; i++)

Modified: sandbox/trunk/modules/xwidgets/src/main/javascript/xw.js
===================================================================
--- sandbox/trunk/modules/xwidgets/src/main/javascript/xw.js	2009-08-26 02:34:26 UTC (rev 11427)
+++ sandbox/trunk/modules/xwidgets/src/main/javascript/xw.js	2009-08-26 08:05:50 UTC (rev 11428)
@@ -114,6 +114,82 @@
     // really old browsers
     // alert("your browser doesn't support adding event listeners");
   }
+}
+
+/**
+ * A Map implementation
+ */
+xw.Map = function()
+{
+  this.elements = new Array();
+
+  xw.Map.prototype.size = function()
+  {
+    return this.elements.length;
+  }
+
+  xw.Map.prototype.isEmpty = function()
+  {
+    return this.elements.length == 0;
+  }
+
+  xw.Map.prototype.keySet = function()
+  {
+    var keySet = new Array();
+    for (var i = 0; i < this.elements.length; i++)
+      keySet[keySet.length] = this.elements[i].key;
+    return keySet;
+  }
+
+  xw.Map.prototype.values = function()
+  {
+    var values = new Array();
+    for (var i = 0; i < this.elements.length; i++)
+      values[values.length] = this.elements[i].value;
+    return values;
+  }
+
+  xw.Map.prototype.get = function(key)
+  {
+    for (var i = 0; i < this.elements.length; i++)
+    {
+      if (this.elements[i].key == key)
+        return this.elements[i].value;
+    }
+    return null;
+  }
+
+  xw.Map.prototype.put = function(key, value)
+  {
+    for (var i = 0; i < this.elements.length; i++)
+    {
+      if (this.elements[i].key == key)
+      {
+        this.elements[i].value = value;
+        return;
+      }
+    }
+    this.elements.push({key:key,value:value});
+  }
+
+  xw.Map.prototype.remove = function(key)
+  {
+    for (var i = 0; i < this.elements.length; i++)
+    {
+      if (this.elements[i].key == key)
+        this.elements.splice(i, 1);
+    }
+  }
+
+  xw.Map.prototype.contains = function(key)
+  {
+    for (var i = 0; i < this.elements.length; i++)
+    {
+      if (this.elements[i].key == key)
+        return true;
+    }
+    return false;
+  }
 }
 
 /**
@@ -389,20 +465,152 @@
   }
 }
 
+/**
+ * Defines the physical bounds of a control
+ */
+xw.Bounds = function(top, left, height, width)
+{
+  this.top = top;
+  this.left = left;
+  this.height = height;
+  this.width = width;
+  this.style = new Object();
+  
+  xw.Bounds.prototype.getTop = function()
+  {
+    return this.top;
+  }
+  
+  xw.Bounds.prototype.getLeft = function()
+  {
+    return this.left;
+  }
+  
+  xw.Bounds.prototype.getHeight = function()
+  {
+    return this.height;
+  }
+  
+  xw.Bounds.prototype.getWidth = function()
+  {
+    return this.width;
+  }    
+  
+  xw.Bounds.prototype.addStyleProperty = function(property, value)
+  {
+    this.style[property] = value;
+    return this;
+  }
+  
+  xw.Bounds.prototype.applyToControl = function(control)
+  {
+    if (this.height != null) control.style.height = this.height;
+    if (this.width != null) control.style.width = this.width;
+    if (this.height != null) control.style.height = this.height;
+    if (this.width != null) control.style.width = this.width;
+    for (var i in this.style) control.style[i] = this.style[i];
+  }
+}
+
 /** LAYOUT MANAGERS **/
 
 xw.BorderLayout = function(container)
 {
   this.container = container;
+  this.bounds = new xw.Map();
   
   xw.BorderLayout.prototype.layout = function()
-  {      
-    for (var i = 0; i < container.children.length; i++)
+  {      
+    this.container.control.style.position = "relative";
+    var topControls = new Array();
+    var bottomControls = new Array();
+    var leftControls = new Array();
+    var rightControls = new Array();
+    var clientControls = new Array();       
+
+    for (var i = 0; i < this.container.children.length; i++)
+    {
+      var child = this.container.children[i];
+      if ("top" == child.align) topControls.push(child);
+      else if ("bottom" == child.align) bottomControls.push(child);
+      else if ("left" == child.align) leftControls.push(child);
+      else if ("right" == child.align) rightControls.push(child);
+      else if ("client" == child.align) clientControls.push(child);
+    }
+  
+    var topSpace = 0;
+    var bottomSpace = 0;
+    var leftSpace = 0;
+    var rightSpace = 0;
+  
+    // TODO - take border widths into account so we don't need all the +2's everywhere
+  
+    for (var i = 0; i < topControls.length; i++)
+    {
+      this.bounds.put(topControls[i], new xw.Bounds(null, null, topControls[i].height, null)
+        .addStyleProperty("position", "absolute")
+        .addStyleProperty("top", topSpace)
+        .addStyleProperty("left", "0")
+        .addStyleProperty("right", "0")
+      );
+      topSpace += 1.0 * topControls[i].height;
+    }
+    
+    for (var i = 0; i < bottomControls.length; i++)
+    {
+      this.bounds.put(bottomControls[i], new xw.Bounds(null, null, bottomControls[i].height, null)
+        .addStyleProperty("position","absolute")
+        .addStyleProperty("bottom", bottomSpace)
+        .addStyleProperty("left", "0")
+        .addStyleProperty("right", "0")
+      );    
+      bottomSpace += 1.0 * bottomControls[i].height;          
+    }
+    
+    for (var i = 0; i < leftControls.length; i++)
+    {
+      this.bounds.put(leftControls[i], new xw.Bounds(null, null, null, leftControls[i].width)
+        .addStyleProperty("position", "absolute")
+        .addStyleProperty("left", leftSpace + (leftSpace > 0 ? 2 : 0))
+        .addStyleProperty("top", topSpace + 2)
+        .addStyleProperty("bottom", bottomSpace + 2)
+      );
+      leftSpace += 1.0 * leftControls[i].width;        
+    }
+    
+    for (var i = 0; i < rightControls.length; i++)
+    {
+      this.bounds.put(rightControls[i], new xw.Bounds(null, null, null, rightControls[i].width)
+        .addStyleProperty("position", "absolute")
+        .addStyleProperty("right", rightSpace)
+        .addStyleProperty("top", topSpace + 2)
+        .addStyleProperty("bottom", bottomSpace + 2)
+      );
+      rightSpace += 1.0 * rightControls[i].width;
+    }
+    
+    for (var i = 0; i < clientControls.length; i++)
+    {
+      this.bounds.put(clientControls[i], new xw.Bounds(null, null, null, null)
+        .addStyleProperty("position", "absolute")
+        .addStyleProperty("left", leftSpace + 4)
+        .addStyleProperty("right", rightSpace + 2)
+        .addStyleProperty("top", topSpace + 2)
+        .addStyleProperty("bottom", bottomSpace + 2)
+      );    
+    }
+  
+    for (var i = 0; i < this.container.children.length; i++)
     {
-      container.children[i].paint(); 
+      this.container.children[i].paint(this); 
     }
   }
   
+  xw.BorderLayout.prototype.setBounds = function(ctl)
+  {
+    var bounds = this.bounds.get(ctl);
+    if (bounds != null) bounds.applyToControl(ctl.control);
+  }  
 }
 
 xw.layoutManagers = new Object();



More information about the seam-commits mailing list