http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as
new file mode 100644
index 0000000..77af305
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/OneFlexibleChildVerticalLayout.as
@@ -0,0 +1,459 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.layouts
+{
+       import org.apache.flex.core.IBeadLayout;
+       import org.apache.flex.core.IDocument;
+       import org.apache.flex.core.ILayoutChild;
+       import org.apache.flex.core.ILayoutHost;
+       import org.apache.flex.core.IParentIUIBase;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.core.IUIBase;
+       import org.apache.flex.core.UIBase;
+       import org.apache.flex.core.ValuesManager;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.IEventDispatcher;
+       import org.apache.flex.geom.Rectangle;
+    import org.apache.flex.utils.CSSContainerUtils;
+
+    /**
+     *  The OneFlexibleChildVerticalLayout class is a simple layout
+     *  bead.  It takes the set of children and lays them out
+     *  vertically in one column, separating them according to
+     *  CSS layout rules for margin and padding styles. But it
+     *  will size the one child to take up as much or little
+     *  room as possible.
+     *  
+     *  @langversion 3.0
+     *  @playerversion Flash 10.2
+     *  @playerversion AIR 2.6
+     *  @productversion FlexJS 0.0
+     */
+       public class OneFlexibleChildVerticalLayout implements IBeadLayout, 
IDocument
+       {
+        /**
+         *  Constructor.
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function OneFlexibleChildVerticalLayout()
+               {
+               }
+               
+        
+        /**
+         *  The id of the flexible child
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+        public var flexibleChild:String;
+        
+        private var actualChild:ILayoutChild;
+        
+        // the strand/host container is also an ILayoutChild because
+        // can have its size dictated by the host's parent which is
+        // important to know for layout optimization
+        private var host:ILayoutChild;
+               
+        /**
+         *  @private
+         *  The document.
+         */
+        private var document:Object;
+        
+        /**
+         *  @copy org.apache.flex.core.IBead#strand
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function set strand(value:IStrand):void
+               {
+            host = value as ILayoutChild;
+               }
+              
+        private var _maxWidth:Number;
+        
+        /**
+         *  @copy org.apache.flex.core.IBead#maxWidth
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+        public function get maxWidth():Number
+        {
+            return _maxWidth;
+        }
+        
+        /**
+         *  @private 
+         */
+        public function set maxWidth(value:Number):void
+        {
+            _maxWidth = value;
+        }
+        
+        private var _maxHeight:Number;
+        
+        /**
+         *  @copy org.apache.flex.core.IBead#maxHeight
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+        public function get maxHeight():Number
+        {
+            return _maxHeight;
+        }
+        
+        /**
+         *  @private 
+         */
+        public function set maxHeight(value:Number):void
+        {
+            _maxHeight = value;
+        }
+        
+        /**
+         * @copy org.apache.flex.core.IBeadLayout#layout
+         */
+               public function layout():Boolean
+               {
+            var layoutParent:ILayoutHost = host.getBeadByType(ILayoutHost) as 
ILayoutHost;
+            var contentView:IParentIUIBase = layoutParent ? 
layoutParent.contentView : IParentIUIBase(host);
+            var padding:Rectangle = CSSContainerUtils.getPaddingMetrics(host);
+                       actualChild = document[flexibleChild];
+            
+            var ilc:ILayoutChild;
+                       var n:int = contentView.numElements;
+                       var marginLeft:Object;
+                       var marginRight:Object;
+                       var marginTop:Object;
+                       var marginBottom:Object;
+                       var margin:Object;
+                       maxWidth = 0;
+            
+            var w:Number = contentView.width;                  
+            var hh:Number = contentView.height - padding.bottom;
+            var yy:int = padding.top;
+            var flexChildIndex:int;
+            var ml:Number;
+            var mr:Number;
+            var mt:Number;
+            var mb:Number;
+            var lastmb:Number;
+            var lastmt:Number;
+            var halign:Object;
+            var left:Number;
+            var right:Number;
+            
+            for (var i:int = 0; i < n; i++)
+            {
+                var child:IUIBase = contentView.getElementAt(i) as IUIBase;
+                ilc = child as ILayoutChild;
+                left = ValuesManager.valuesImpl.getValue(child, "left");
+                right = ValuesManager.valuesImpl.getValue(child, "right");
+                if (child == actualChild)
+                {
+                    flexChildIndex = i;
+                    break;
+                }
+                margin = ValuesManager.valuesImpl.getValue(child, "margin");
+                if (margin is Array)
+                {
+                    if (margin.length == 1)
+                        marginLeft = marginTop = marginRight = marginBottom = 
margin[0];
+                    else if (margin.length <= 3)
+                    {
+                        marginLeft = marginRight = margin[1];
+                        marginTop = marginBottom = margin[0];
+                    }
+                    else if (margin.length == 4)
+                    {
+                        marginLeft = margin[3];
+                        marginBottom = margin[2];
+                        marginRight = margin[1];
+                        marginTop = margin[0];                                 
+                    }
+                }
+                else if (margin == null)
+                {
+                    marginLeft = ValuesManager.valuesImpl.getValue(child, 
"margin-left");
+                    marginTop = ValuesManager.valuesImpl.getValue(child, 
"margin-top");
+                    marginRight = ValuesManager.valuesImpl.getValue(child, 
"margin-right");
+                    marginBottom = ValuesManager.valuesImpl.getValue(child, 
"margin-bottom");
+                }
+                else
+                {
+                    marginLeft = marginTop = marginBottom = marginRight = 
margin;
+                }
+                mt = Number(marginTop);
+                if (isNaN(mt))
+                    mt = 0;
+                mb = Number(marginBottom);
+                if (isNaN(mb))
+                    mb = 0;
+                if (ilc)
+                {
+                    if (!isNaN(ilc.percentHeight))
+                        ilc.setHeight(contentView.height * ilc.percentHeight / 
100, !isNaN(ilc.percentWidth));
+                }
+                if (marginLeft == "auto")
+                    ml = 0;
+                else
+                {
+                    ml = Number(marginLeft);
+                    if (isNaN(ml))
+                        ml = 0;
+                }
+                if (marginRight == "auto")
+                    mr = 0;
+                else
+                {
+                    mr = Number(marginRight);
+                    if (isNaN(mr))
+                        mr = 0;
+                }
+                if (child is ILayoutChild)
+                {
+                    ilc = child as ILayoutChild;
+                    if (!isNaN(ilc.percentWidth))
+                        ilc.setWidth(contentView.width * ilc.percentWidth / 
100, !isNaN(ilc.percentHeight));
+                }
+                maxWidth = Math.max(maxWidth, ml + child.width + mr);
+                setPositionAndWidth(child, left, ml, padding.left, right, mr, 
padding.right, w);
+                child.y = yy + mt;
+                yy += child.height + mt + mb;
+                lastmb = mb;
+            }
+
+            if (n > 0 && n > flexChildIndex)
+            {
+                for (i = n - 1; i > flexChildIndex; i--)
+                       {
+                               child = contentView.getElementAt(i) as IUIBase;
+                    ilc = child as ILayoutChild;
+                    left = ValuesManager.valuesImpl.getValue(child, "left");
+                    right = ValuesManager.valuesImpl.getValue(child, "right");
+                               margin = 
ValuesManager.valuesImpl.getValue(child, "margin");
+                               if (margin is Array)
+                               {
+                                       if (margin.length == 1)
+                                               marginLeft = marginTop = 
marginRight = marginBottom = margin[0];
+                                       else if (margin.length <= 3)
+                                       {
+                                               marginLeft = marginRight = 
margin[1];
+                                               marginTop = marginBottom = 
margin[0];
+                                       }
+                                       else if (margin.length == 4)
+                                       {
+                                               marginLeft = margin[3];
+                                               marginBottom = margin[2];
+                                               marginRight = margin[1];
+                                               marginTop = margin[0];          
                        
+                                       }
+                               }
+                               else if (margin == null)
+                               {
+                                       marginLeft = 
ValuesManager.valuesImpl.getValue(child, "margin-left");
+                                       marginTop = 
ValuesManager.valuesImpl.getValue(child, "margin-top");
+                                       marginRight = 
ValuesManager.valuesImpl.getValue(child, "margin-right");
+                                       marginBottom = 
ValuesManager.valuesImpl.getValue(child, "margin-bottom");
+                               }
+                               else
+                               {
+                                       marginLeft = marginTop = marginBottom = 
marginRight = margin;
+                               }
+                               mt = Number(marginTop);
+                               if (isNaN(mt))
+                                       mt = 0;
+                               mb = Number(marginBottom);
+                               if (isNaN(mb))
+                                       mb = 0;
+                    if (ilc)
+                    {
+                        if (!isNaN(ilc.percentHeight))
+                            ilc.setHeight(contentView.height * 
ilc.percentHeight / 100, !isNaN(ilc.percentWidth));
+                    }
+                               if (marginLeft == "auto")
+                                       ml = 0;
+                               else
+                               {
+                                       ml = Number(marginLeft);
+                                       if (isNaN(ml))
+                                               ml = 0;
+                               }
+                               if (marginRight == "auto")
+                                       mr = 0;
+                               else
+                               {
+                                       mr = Number(marginRight);
+                                       if (isNaN(mr))
+                                               mr = 0;
+                               }
+                    if (child is ILayoutChild)
+                    {
+                        ilc = child as ILayoutChild;
+                        if (!isNaN(ilc.percentWidth))
+                            ilc.setWidth(contentView.width * ilc.percentWidth 
/ 100, !isNaN(ilc.percentHeight));
+                    }
+                    setPositionAndWidth(child, left, ml, padding.left, right, 
mr, padding.right, w);
+                    maxWidth = Math.max(maxWidth, ml + child.width + mr);
+                    child.y = hh - child.height - mb;
+                               hh -= child.height + mt + mb;
+                               lastmt = mt;
+                       }
+            } 
+            
+            child = contentView.getElementAt(flexChildIndex) as IUIBase;
+            ilc = child as ILayoutChild;
+            left = ValuesManager.valuesImpl.getValue(child, "left");
+            right = ValuesManager.valuesImpl.getValue(child, "right");
+            margin = ValuesManager.valuesImpl.getValue(child, "margin");
+            if (margin is Array)
+            {
+                if (margin.length == 1)
+                    marginLeft = marginTop = marginRight = marginBottom = 
margin[0];
+                else if (margin.length <= 3)
+                {
+                    marginLeft = marginRight = margin[1];
+                    marginTop = marginBottom = margin[0];
+                }
+                else if (margin.length == 4)
+                {
+                    marginLeft = margin[3];
+                    marginBottom = margin[2];
+                    marginRight = margin[1];
+                    marginTop = margin[0];                                     
+                }
+            }
+            else if (margin == null)
+            {
+                marginLeft = ValuesManager.valuesImpl.getValue(child, 
"margin-left");
+                marginTop = ValuesManager.valuesImpl.getValue(child, 
"margin-top");
+                marginRight = ValuesManager.valuesImpl.getValue(child, 
"margin-right");
+                marginBottom = ValuesManager.valuesImpl.getValue(child, 
"margin-bottom");
+            }
+            else
+            {
+                marginLeft = marginTop = marginBottom = marginRight = margin;
+            }
+            mt = Number(marginTop);
+            if (isNaN(mt))
+                mt = 0;
+            mb = Number(marginBottom);
+            if (isNaN(mb))
+                mb = 0;
+            if (ilc)
+            {
+                if (!isNaN(ilc.percentHeight))
+                    ilc.setHeight(contentView.height * ilc.percentHeight / 
100, !isNaN(ilc.percentWidth));
+            }
+            if (marginLeft == "auto")
+                ml = 0;
+            else
+            {
+                ml = Number(marginLeft);
+                if (isNaN(ml))
+                    ml = 0;
+            }
+            if (marginRight == "auto")
+                mr = 0;
+            else
+            {
+                mr = Number(marginRight);
+                if (isNaN(mr))
+                    mr = 0;
+            }
+            if (child is ILayoutChild)
+            {
+                ilc = child as ILayoutChild;
+                if (!isNaN(ilc.percentWidth))
+                    ilc.setWidth(contentView.width * ilc.percentWidth / 100, 
!isNaN(ilc.percentHeight));
+            }
+            setPositionAndWidth(child, left, ml, padding.left, right, mr, 
padding.right, w);
+            maxWidth = Math.max(maxWidth, ml + child.width + mr);
+            child.y = yy + mt;
+            child.height = hh - mb - child.y;
+            
+            return true;
+               }
+
+        private function setPositionAndWidth(child:IUIBase, left:Number, 
ml:Number, pl:Number,
+                                             right:Number, mr:Number, 
pr:Number, w:Number):void
+        {
+            var widthSet:Boolean = false;
+            
+            var ww:Number = w;
+            var ilc:ILayoutChild = child as ILayoutChild;
+            if (!isNaN(left))
+            {
+                child.x = left + ml;
+                ww -= left + ml;
+            }
+            else 
+            {
+                if (isNaN(right))
+                    child.x = ml + pl;
+                ww -= ml;
+            }
+            if (!isNaN(right))
+            {
+                if (!isNaN(left))
+                {
+                    if (ilc)
+                        ilc.setWidth(ww - right - mr, true);
+                    else
+                    {
+                        child.width = ww - right - mr;
+                        widthSet = true;
+                    }
+                }
+                else
+                    child.x = w - right - mr - child.width - 1; // some 
browsers don't like going all the way to the edge
+            }
+            if (ilc)
+            {
+                if (!isNaN(ilc.percentWidth))
+                    ilc.setWidth(w * ilc.percentWidth / 100, true);
+            }
+            if (!widthSet)
+                child.dispatchEvent(new Event("sizeChanged"));
+        }
+        
+        public function setDocument(document:Object, id:String = null):void
+        {
+            this.document = document;  
+        }
+        
+    }
+        
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/TileLayout.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/TileLayout.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/TileLayout.as
new file mode 100644
index 0000000..a7917ff
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/TileLayout.as
@@ -0,0 +1,248 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.layouts
+{
+       import org.apache.flex.core.IBeadLayout;
+       import org.apache.flex.core.ILayoutHost;
+       import org.apache.flex.core.IParentIUIBase;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.core.IUIBase;
+       import org.apache.flex.core.UIBase;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.IEventDispatcher;
+
+       /**
+        *  The TileLayout class bead sizes and positions the elements it 
manages into rows and columns.
+        *  The size of each element is determined either by setting 
TileLayout's columnWidth and rowHeight
+        *  properties, or having the tile size determined by factoring the 
numColumns into the area assigned
+        *  for the layout.
+        *
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class TileLayout implements IBeadLayout
+       {
+               /**
+                *  constructor.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function TileLayout()
+               {
+               }
+
+               private var _strand:IStrand;
+
+               /**
+                *  @copy org.apache.flex.core.IBead#strand
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+               }
+
+               private var _numColumns:Number = 4;
+               private var _columnWidth:Number = Number.NaN;
+               private var _rowHeight:Number = Number.NaN;
+
+               /**
+                *  The number of tiles to fit horizontally into the layout.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get numColumns():Number
+               {
+                       return _numColumns;
+               }
+               public function set numColumns(value:Number):void
+               {
+                       _numColumns = value;
+               }
+
+               /**
+                *  The width of each column, in pixels. If left unspecified, 
the
+                *  columnWidth is determined by dividing the numColumns into 
the
+                *  strand's bounding box width.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get columnWidth():Number
+               {
+                       return _columnWidth;
+               }
+               public function set columnWidth(value:Number):void
+               {
+                       _columnWidth = value;
+               }
+
+               /**
+                *  The height of each row, in pixels. If left unspecified, the
+                *  rowHeight is determine by dividing the possible number of 
rows
+                *  into the strand's bounding box height.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get rowHeight():Number
+               {
+                       return _rowHeight;
+               }
+               public function set rowHeight(value:Number):void
+               {
+                       _rowHeight = value;
+               }
+
+        /**
+         * @copy org.apache.flex.core.IBeadLayout#layout
+         */
+               public function layout():Boolean
+               {
+                       COMPILE::SWF
+                       {
+                               // this is where the layout is calculated
+                               var host:UIBase = _strand as UIBase;
+                               var p:ILayoutHost = 
_strand.getBeadByType(ILayoutHost) as ILayoutHost;
+                               var area:UIBase = p.contentView as UIBase;
+
+                               var xpos:Number = 0;
+                               var ypos:Number = 0;
+                               var useWidth:Number = columnWidth;
+                               var useHeight:Number = rowHeight;
+                               var n:Number = area.numElements;
+                               if (n == 0) return false;
+
+                               var realN:Number = n;
+                               for(var j:int=0; j < n; j++)
+                               {
+                                       var testChild:IUIBase = 
area.getElementAt(i) as IUIBase;
+                                       if (testChild && !testChild.visible) 
realN--;
+                               }
+
+                               if (isNaN(useWidth)) useWidth = 
Math.floor(host.width / numColumns); // + gap
+                               if (isNaN(useHeight)) {
+                                       // given the width and total number of 
items, how many rows?
+                                       var numRows:Number = 
Math.floor(realN/numColumns);
+                                       useHeight = Math.floor(host.height / 
numRows);
+                               }
+
+                               var maxWidth:Number = useWidth;
+                               var maxHeight:Number = useHeight;
+
+                               for(var i:int=0; i < n; i++)
+                               {
+                                       var child:IUIBase = 
area.getElementAt(i) as IUIBase;
+                                       if (child && !child.visible) continue;
+                                       child.width = useWidth;
+                                       child.height = useHeight;
+                                       child.x = xpos;
+                                       child.y = ypos;
+
+                                       xpos += useWidth;
+                                       maxWidth = Math.max(maxWidth,xpos);
+
+                                       var test:Number = (i+1)%numColumns;
+
+                                       if (test == 0) {
+                                               xpos = 0;
+                                               ypos += useHeight;
+                                               maxHeight = 
Math.max(maxHeight,ypos);
+                                       }
+                               }
+
+                               maxWidth = Math.max(maxWidth, 
numColumns*useWidth);
+                               maxHeight = Math.max(maxHeight, 
numRows*useHeight);
+
+                               // Only return true if the contentView needs to 
be larger; that new
+                               // size is stored in the model.
+                               var sizeChanged:Boolean = true;
+
+                               IEventDispatcher(_strand).dispatchEvent( new 
Event("layoutComplete") );
+
+                               return sizeChanged;
+                       }
+                       COMPILE::JS
+                       {
+                               var children:Array;
+                               var i:int;
+                               var n:int;
+                               var child:UIBase;
+                               var xpos:Number;
+                               var ypos:Number;
+                               var useWidth:Number;
+                               var useHeight:Number;
+
+                               var host:UIBase = _strand as UIBase;
+                               var viewBead:ILayoutHost = 
_strand.getBeadByType(ILayoutHost) as ILayoutHost;
+                               var contentView:IParentIUIBase = 
viewBead.contentView;
+                               children = contentView.internalChildren();
+                               n = children.length;
+                               if (n === 0) return false;
+
+                               viewBead.contentView.width = host.width;
+
+                               var realN:int = n;
+                               for (i = 0; i < n; i++)
+                               {
+                                       child = children[i].flexjs_wrapper;
+                                       if (!child.visible) realN--;
+                               }
+
+                               xpos = 0;
+                               ypos = 0;
+                               useWidth = columnWidth;
+                               useHeight = rowHeight;
+
+                               if (isNaN(useWidth)) useWidth = 
Math.floor(host.width / numColumns); // + gap
+                               if (isNaN(useHeight)) {
+                                       // given the width and total number of 
items, how many rows?
+                                       var numRows:Number = Math.floor(realN / 
numColumns);
+                                       useHeight = Math.floor(host.height / 
numRows);
+                               }
+
+                               for (i = 0; i < n; i++)
+                               {
+                                       child = children[i].flexjs_wrapper;
+                                       if (!child.visible) continue;
+                                       
child.setDisplayStyleForLayout('inline-block');
+                                       child.width = useWidth;
+                                       child.height = useHeight;
+                               }
+                               return true;
+                       }
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VScrollBarLayout.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VScrollBarLayout.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VScrollBarLayout.as
new file mode 100644
index 0000000..612519a
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VScrollBarLayout.as
@@ -0,0 +1,122 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.layouts
+{
+       import flash.display.DisplayObject;
+       
+       import org.apache.flex.core.IBeadLayout;
+       import org.apache.flex.core.IScrollBarModel;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.IEventDispatcher;
+    import org.apache.flex.geom.Rectangle;
+       import org.apache.flex.html.beads.IScrollBarView;
+       import org.apache.flex.html.beads.ScrollBarView;
+       import org.apache.flex.utils.CSSContainerUtils;
+
+    /**
+     *  The VScrollBarLayout class is a layout
+     *  bead that displays lays out the pieces of a
+     *  vertical ScrollBar like the thumb, track
+     *  and arrow buttons.
+     *  
+     *  @langversion 3.0
+     *  @playerversion Flash 10.2
+     *  @playerversion AIR 2.6
+     *  @productversion FlexJS 0.0
+     */
+       public class VScrollBarLayout implements IBeadLayout
+       {
+        /**
+         *  Constructor.
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function VScrollBarLayout()
+               {
+               }
+               
+               private var sbModel:IScrollBarModel;
+               private var sbView:IScrollBarView;
+               
+               private var _strand:IStrand;
+               
+        /**
+         *  @copy org.apache.flex.core.IBead#strand
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+                       sbView = _strand.getBeadByType(IScrollBarView) as 
IScrollBarView;
+               }
+                       
+        /**
+         * @copy org.apache.flex.core.IBeadLayout#layout
+         */
+               public function layout():Boolean
+               {
+            if (!sbModel)
+                sbModel = _strand.getBeadByType(IScrollBarModel) as 
IScrollBarModel
+                                       
+                       var metrics:Rectangle = 
CSSContainerUtils.getBorderAndPaddingMetrics(_strand);
+                    
+                       var h:Number = DisplayObject(_strand).height + 
metrics.top + metrics.bottom;
+                       var increment:DisplayObject = sbView.increment;
+                       var decrement:DisplayObject = sbView.decrement;
+                       var track:DisplayObject = sbView.track;
+                       var thumb:DisplayObject = sbView.thumb;
+                       
+                       decrement.x = 0;
+                       decrement.y = 0;
+                       
+                       increment.x = 0;
+                       increment.y = h - increment.height - 1;
+
+            if (track.width < thumb.width)
+                track.x = (thumb.width - track.width) / 2;
+            else if (track.width > thumb.width)
+                thumb.x = (track.width - thumb.width) / 2;
+            else
+                track.x = 0;
+                       track.y = decrement.height;
+                       track.height = increment.y - decrement.height;
+            thumb.height = sbModel.pageSize / (sbModel.maximum - 
sbModel.minimum) * track.height;
+                       if (track.height > thumb.height)
+                       {
+                               thumb.visible = true;
+                               thumb.y = (sbModel.value / (sbModel.maximum - 
sbModel.minimum - sbModel.pageSize) * (track.height - thumb.height)) + track.y;
+                       }
+                       else
+                       {
+                               thumb.visible = false;
+                       }
+                       
+            return true;
+               }
+                                               
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VerticalColumnLayout.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VerticalColumnLayout.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VerticalColumnLayout.as
new file mode 100644
index 0000000..6eaa30a
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VerticalColumnLayout.as
@@ -0,0 +1,199 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.layouts
+{      
+       import org.apache.flex.core.IBeadLayout;
+       import org.apache.flex.core.IContainer;
+       import org.apache.flex.core.ILayoutHost;
+       import org.apache.flex.core.IMeasurementBead;
+       import org.apache.flex.core.IParent;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.core.IUIBase;
+       import org.apache.flex.core.UIBase;
+       import org.apache.flex.core.ValuesManager;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.IEventDispatcher;
+       import org.apache.flex.geom.Rectangle;
+       import org.apache.flex.utils.CSSUtils;
+    import org.apache.flex.utils.CSSContainerUtils;    
+       
+       /**
+        * ColumnLayout is a class that organizes the positioning of children
+        * of a container into a set of columns where each column's width is 
set to
+        * the maximum size of all of the children in that column.
+        *  
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class VerticalColumnLayout implements IBeadLayout
+       {
+               /**
+                *  constructor
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function VerticalColumnLayout()
+               {
+               }
+               
+               private var _strand:IStrand;
+               
+               /**
+                *  @copy org.apache.flex.core.IBead#strand
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+               }
+               
+               
+               private var _numColumns:int;
+               
+               /**
+                * The number of columns.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get numColumns():int
+               {
+                       return _numColumns;
+               }
+               public function set numColumns(value:int):void
+               {
+                       _numColumns = value;
+               }
+               
+        /**
+         * @copy org.apache.flex.core.IBeadLayout#layout
+         */
+               public function layout():Boolean
+               {                       
+            var host:UIBase = UIBase(_strand);
+            var layoutParent:ILayoutHost = host.getBeadByType(ILayoutHost) as 
ILayoutHost;
+            var contentView:IParent = layoutParent.contentView;
+            var padding:Rectangle = CSSContainerUtils.getPaddingMetrics(host);
+                       var sw:Number = host.width;
+                       var sh:Number = host.height;
+                       
+            var hasWidth:Boolean = !host.isWidthSizedToContent();
+            var hasHeight:Boolean = !host.isHeightSizedToContent();
+                       var e:IUIBase;
+                       var i:int;
+                       var col:int = 0;
+                       var columns:Array = [];
+            var rows:Array = [];
+            var data:Array = [];
+                       for (i = 0; i < numColumns; i++)
+                               columns[i] = 0;
+
+            var marginLeft:Object;
+            var marginRight:Object;
+            var marginTop:Object;
+            var marginBottom:Object;
+            var margin:Object;
+            var ml:Number;
+            var mr:Number;
+            var mt:Number;
+            var mb:Number;
+                       var n:int = contentView.numElements;
+            var rowData:Object = { rowHeight: 0 };
+                       
+                       // determine max widths of columns
+                       for (i = 0; i < n; i++) {
+                               e = contentView.getElementAt(i) as IUIBase;
+                margin = ValuesManager.valuesImpl.getValue(e, "margin");
+                marginLeft = ValuesManager.valuesImpl.getValue(e, 
"margin-left");
+                marginTop = ValuesManager.valuesImpl.getValue(e, "margin-top");
+                marginRight = ValuesManager.valuesImpl.getValue(e, 
"margin-right");
+                marginBottom = ValuesManager.valuesImpl.getValue(e, 
"margin-bottom");
+                mt = CSSUtils.getTopValue(marginTop, margin, sh);
+                mb = CSSUtils.getBottomValue(marginBottom, margin, sh);
+                mr = CSSUtils.getRightValue(marginRight, margin, sw);
+                ml = CSSUtils.getLeftValue(marginLeft, margin, sw);
+                data.push({ mt: mt, mb: mb, mr: mr, ml: ml});
+                               var thisPrefWidth:int = 0;
+                               if (e is IStrand)
+                               {
+                                       var measure:IMeasurementBead = 
e.getBeadByType(IMeasurementBead) as IMeasurementBead;
+                                       if (measure)
+                                               thisPrefWidth = 
measure.measuredWidth + ml + mr;
+                                       else
+                                               thisPrefWidth = e.width + ml + 
mr;                                              
+                               }
+                               else
+                                       thisPrefWidth = e.width + ml + mr;
+                               
+                rowData.rowHeight = Math.max(rowData.rowHeight, e.height + mt 
+ mb);
+                               columns[col] = Math.max(columns[col], 
thisPrefWidth);
+                col = col + 1;
+                if (col == numColumns)
+                {
+                    rows.push(rowData);
+                    rowData = {rowHeight: 0};
+                    col = 0;
+                }
+                       }
+                       
+            var lastmb:Number = 0;
+                       var curx:int = padding.left;
+                       var cury:int = padding.top;
+                       var maxHeight:int = 0;
+            var maxWidth:int = 0;
+                       col = 0;
+                       for (i = 0; i < n; i++) 
+            {
+                               e = contentView.getElementAt(i) as IUIBase;
+                               e.x = curx + ml;
+                               e.y = cury + data[i].mt;
+                               curx += columns[col++];
+                maxHeight = Math.max(maxHeight, e.y + e.height + data[i].mb);
+                maxWidth = Math.max(maxWidth, e.x + e.width + data[i].mr);
+                               if (col == numColumns)
+                               {
+                                       cury += rows[0].rowHeight;
+                    rows.shift();
+                                       col = 0;
+                                       curx = padding.left;
+                               }
+                       }
+                       if (!hasWidth && n > 0 && !isNaN(maxWidth))
+            {
+                UIBase(contentView).setWidth(maxWidth, true);
+            }
+            if (!hasHeight && n > 0 && !isNaN(maxHeight))
+            {
+                UIBase(contentView).setHeight(maxHeight, true);
+            }
+                       return true;
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VerticalLayout.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VerticalLayout.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VerticalLayout.as
new file mode 100644
index 0000000..dd02989
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/layouts/VerticalLayout.as
@@ -0,0 +1,362 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.layouts
+{
+       import org.apache.flex.core.IBeadLayout;
+       import org.apache.flex.core.IBeadModel;
+       import org.apache.flex.core.ILayoutChild;
+       import org.apache.flex.core.ILayoutHost;
+       import org.apache.flex.core.IParentIUIBase;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.core.IUIBase;
+       import org.apache.flex.core.ValuesManager;
+       COMPILE::JS
+       {
+               import org.apache.flex.core.WrappedHTMLElement;                 
+       }
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.IEventDispatcher;
+       import org.apache.flex.geom.Rectangle;
+       import org.apache.flex.utils.CSSContainerUtils;
+       import org.apache.flex.utils.CSSUtils;
+       
+       /**
+        *  The VerticalLayout class is a simple layout
+        *  bead.  It takes the set of children and lays them out
+        *  vertically in one column, separating them according to
+        *  CSS layout rules for margin and horizontal-align styles.
+        *  
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class VerticalLayout implements IBeadLayout
+       {
+               /**
+                *  Constructor.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function VerticalLayout()
+               {
+               }
+               
+               // the strand/host container is also an ILayoutChild because
+               // can have its size dictated by the host's parent which is
+               // important to know for layout optimization
+               private var host:ILayoutChild;
+               
+               /**
+                *  @copy org.apache.flex.core.IBead#strand
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function set strand(value:IStrand):void
+               {
+                       host = value as ILayoutChild; 
+               }
+               
+               /**
+                *  Layout children vertically
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                *  @flexjsignorecoercion org.apache.flex.core.ILayoutHost
+                */
+               public function layout():Boolean
+               {
+                       COMPILE::SWF
+                       {
+                               var layoutParent:ILayoutHost = 
host.getBeadByType(ILayoutHost) as ILayoutHost;
+                               var contentView:IParentIUIBase = layoutParent ? 
layoutParent.contentView : IParentIUIBase(host);
+                               var padding:Rectangle = 
CSSContainerUtils.getPaddingMetrics(host);
+                               
+                               var n:int = contentView.numElements;
+                               var hasHorizontalFlex:Boolean;
+                               var hostSizedToContent:Boolean = 
host.isWidthSizedToContent();
+                               var flexibleHorizontalMargins:Array = [];
+                               var ilc:ILayoutChild;
+                               var marginLeft:Object;
+                               var marginRight:Object;
+                               var marginTop:Object;
+                               var marginBottom:Object;
+                               var margin:Object;
+                               var maxWidth:Number = 0;
+                               var cssValue:*;
+                               // asking for contentView.width can result in 
infinite loop if host isn't sized already
+                               var w:Number = hostSizedToContent ? 0 : 
contentView.width;
+                               var h:Number = contentView.height;
+                               
+                               for (var i:int = 0; i < n; i++)
+                               {
+                                       var child:IUIBase = 
contentView.getElementAt(i) as IUIBase;
+                                       if (child == null || !child.visible) 
continue;
+                                       ilc = child as ILayoutChild;
+                                       var left:Number = NaN;
+                                       cssValue = 
ValuesManager.valuesImpl.getValue(child, "left");
+                                       if (cssValue !== undefined)
+                                               left = 
CSSUtils.toNumber(cssValue);
+                                       var right:Number = NaN;
+                                       cssValue = 
ValuesManager.valuesImpl.getValue(child, "right");
+                                       if (cssValue !== undefined)
+                                               right = 
CSSUtils.toNumber(cssValue);
+                                       margin = 
ValuesManager.valuesImpl.getValue(child, "margin");
+                                       marginLeft = 
ValuesManager.valuesImpl.getValue(child, "margin-left");
+                                       marginTop = 
ValuesManager.valuesImpl.getValue(child, "margin-top");
+                                       marginRight = 
ValuesManager.valuesImpl.getValue(child, "margin-right");
+                                       marginBottom = 
ValuesManager.valuesImpl.getValue(child, "margin-bottom");
+                                       var ml:Number = 
CSSUtils.getLeftValue(marginLeft, margin, w);
+                                       var mr:Number = 
CSSUtils.getRightValue(marginRight, margin, w);
+                                       var mt:Number = 
CSSUtils.getTopValue(marginTop, margin, h);
+                                       var mb:Number = 
CSSUtils.getBottomValue(marginBottom, margin, h);
+                                       var lastmb:Number;
+                                       var yy:Number;
+                                       if (i == 0)
+                                       {
+                                               if (ilc)
+                                                       ilc.setY(mt + 
padding.top);
+                                               else
+                                                       child.y = mt + 
padding.top;
+                                       }
+                                       else
+                                       {
+                                               if (ilc)
+                                                       ilc.setY(yy + 
Math.max(mt, lastmb));
+                                               else
+                                                       child.y = yy + 
Math.max(mt, lastmb);
+                                       }
+                                       if (ilc)
+                                       {
+                                               if (!isNaN(ilc.percentHeight))
+                                                       
ilc.setHeight(contentView.height * ilc.percentHeight / 100, 
!isNaN(ilc.percentWidth));
+                                       }
+                                       lastmb = mb;
+                                       var marginObject:Object = {};
+                                       flexibleHorizontalMargins[i] = 
marginObject;
+                                       if (marginLeft == "auto")
+                                       {
+                                               ml = 0;
+                                               marginObject.marginLeft = 
marginLeft;
+                                               hasHorizontalFlex = true;
+                                       }
+                                       else
+                                       {
+                                               ml = Number(marginLeft);
+                                               if (isNaN(ml))
+                                               {
+                                                       ml = 0;
+                                                       marginObject.marginLeft 
= marginLeft;
+                                               }
+                                               else
+                                                       marginObject.marginLeft 
= ml;
+                                       }
+                                       if (marginRight == "auto")
+                                       {
+                                               mr = 0;
+                                               marginObject.marginRight = 
marginRight;
+                                               hasHorizontalFlex = true;
+                                       }
+                                       else
+                                       {
+                                               mr = Number(marginRight);
+                                               if (isNaN(mr))
+                                               {
+                                                       mr = 0;
+                                                       
marginObject.marginRight = marginRight;
+                                               }
+                                               else
+                                                       
marginObject.marginRight = mr;
+                                       }
+                                       if (!hostSizedToContent)
+                                       {
+                                               // if host is sized by parent,
+                                               // we can position and size 
children horizontally now
+                                               setPositionAndWidth(child, 
left, ml, padding.left, 
+                                                       right, mr, 
padding.right, w);
+                                       }
+                                       else
+                                       {
+                                               if (!isNaN(left))
+                                               {
+                                                       ml = left;
+                                                       marginObject.left = ml;
+                                               }
+                                               if (!isNaN(right))
+                                               {
+                                                       mr = right;
+                                                       marginObject.right = mr;
+                                               }
+                                               maxWidth = Math.max(maxWidth, 
ml + child.width + mr);                    
+                                       }
+                                       yy = child.y + child.height;
+                               }
+                               if (hostSizedToContent)
+                               {
+                                       for (i = 0; i < n; i++)
+                                       {
+                                               child = 
contentView.getElementAt(i) as IUIBase;
+                                               if (child == null || 
!child.visible) continue;
+                                               var obj:Object = 
flexibleHorizontalMargins[i];
+                                               setPositionAndWidth(child, 
obj.left, obj.marginLeft, padding.left,
+                                                       obj.right, 
obj.marginRight, padding.right, maxWidth);
+                                       }
+                               }
+                               if (hasHorizontalFlex)
+                               {
+                                       for (i = 0; i < n; i++)
+                                       {
+                                               child = 
contentView.getElementAt(i) as IUIBase;
+                                               if (child == null || 
!child.visible) continue;
+                                               ilc = child as ILayoutChild;
+                                               obj = 
flexibleHorizontalMargins[i];
+                                               if (hasHorizontalFlex)
+                                               {
+                                                       if (ilc)
+                                                       {
+                                                               if 
(obj.marginLeft == "auto" && obj.marginRight == "auto")
+                                                                       
ilc.setX(maxWidth - child.width / 2);
+                                                               else if 
(obj.marginLeft == "auto")
+                                                                       
ilc.setX(maxWidth - child.width - obj.marginRight - padding.right);             
               
+                                                       }
+                                                       else
+                                                       {
+                                                               if 
(obj.marginLeft == "auto" && obj.marginRight == "auto")
+                                                                       child.x 
= maxWidth - child.width / 2;
+                                                               else if 
(obj.marginLeft == "auto")
+                                                                       child.x 
= maxWidth - child.width - obj.marginRight - padding.right;
+                                                       }
+                                               }
+                                       }
+                               }
+                               
+                               // Only return true if the contentView needs to 
be larger; that new
+                               // size is stored in the model.
+                               var sizeChanged:Boolean = true;
+                               
+                               host.dispatchEvent( new Event("layoutComplete") 
);
+                               
+                               return sizeChanged;
+                               
+                       }
+                       COMPILE::JS
+                       {
+                               var children:Array;
+                               var i:int;
+                               var n:int;
+                               
+                               var viewBead:ILayoutHost = 
host.getBeadByType(ILayoutHost) as ILayoutHost;
+                               var contentView:IParentIUIBase = 
viewBead.contentView;
+                               children = contentView.internalChildren();
+                               var scv:Object = 
getComputedStyle(host.positioner);
+                               var hasWidth:Boolean = 
!host.isWidthSizedToContent();
+                               var maxWidth:Number = 0;
+                               n = children.length;
+                               for (i = 0; i < n; i++)
+                               {
+                                       var child:WrappedHTMLElement = 
children[i];
+                                       
child.flexjs_wrapper.setDisplayStyleForLayout('block');
+                                       if (child.style.display === 'none') 
+                                       {
+                                               
child.flexjs_wrapper.setDisplayStyleForLayout('block');
+                                       } 
+                                       else 
+                                       {
+                                               // block elements don't measure 
width correctly so set to inline for a second
+                                               child.style.display = 
'inline-block';
+                                               maxWidth = Math.max(maxWidth, 
child.offsetLeft + child.offsetWidth);
+                                               child.style.display = 'block';
+                                       }
+                                       
child.flexjs_wrapper.dispatchEvent('sizeChanged');
+                               }
+                               if (!hasWidth && n > 0 && !isNaN(maxWidth)) {
+                                       var pl:String = scv['padding-left'];
+                                       var pr:String = scv['padding-right'];
+                                       var npl:int = parseInt(pl.substring(0, 
pl.length - 2), 10);
+                                       var npr:int = parseInt(pr.substring(0, 
pr.length - 2), 10);
+                                       maxWidth += npl + npr;
+                                       contentView.width = maxWidth;
+                               }
+                               return true;
+                       }
+               }
+               
+               COMPILE::SWF
+               private function setPositionAndWidth(child:IUIBase, 
left:Number, ml:Number, pl:Number,
+                                                                               
         right:Number, mr:Number, pr:Number, w:Number):void
+               {
+                       var widthSet:Boolean = false;
+                       
+                       var ww:Number = w;
+                       var ilc:ILayoutChild = child as ILayoutChild;
+                       if (!isNaN(left))
+                       {
+                if (ilc)
+                    ilc.setX(left + ml);
+                else
+                               child.x = left + ml;
+                               ww -= left + ml;
+                       }
+                       else 
+                       {
+                if (ilc)
+                    ilc.setX(ml + pl);
+                else
+                               child.x = ml + pl;
+                               ww -= ml + pl;
+                       }
+                       if (!isNaN(right))
+                       {
+                               if (!isNaN(left))
+                               {
+                                       if (ilc)
+                                               ilc.setWidth(ww - right - mr, 
true);
+                                       else
+                                       {
+                                               child.width = ww - right - mr;
+                                               widthSet = true;
+                                       }
+                               }
+                               else
+                {
+                    if (ilc)
+                        ilc.setX(w - right - mr - child.width);
+                    else
+                                       child.x = w - right - mr - child.width;
+                }
+                       }
+                       if (ilc)
+                       {
+                               if (!isNaN(ilc.percentWidth))
+                                       ilc.setWidth(w * ilc.percentWidth / 
100, true);
+                       }
+                       if (!widthSet)
+                               child.dispatchEvent(new Event("sizeChanged"));
+               }
+               
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/AlertModel.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/AlertModel.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/AlertModel.as
new file mode 100644
index 0000000..caa6215
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/AlertModel.as
@@ -0,0 +1,288 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.models
+{
+       import org.apache.flex.core.IAlertModel;
+       import org.apache.flex.core.IBead;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.EventDispatcher;
+       
+       /**
+        *  The AlertModel class bead implements the 
org.apache.flex.core.IAlertModel and holds the properties
+        *  for an org.apache.flex.html.Alert such the buttons to use and 
message to display.
+        *  
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class AlertModel extends EventDispatcher implements IAlertModel, 
IBead
+       {
+               /**
+                *  constructor.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function AlertModel()
+               {
+                       super();
+               }
+               
+               private var _strand:IStrand;
+               
+               /**
+                *  @copy org.apache.flex.core.IBead#strand
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+               }
+               
+               private var _title:String;
+               
+               /**
+                *  The title for the Alert.
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#title
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get title():String
+               {
+                       return _title;
+               }
+               public function set title(value:String):void
+               {
+                       if( value != _title ) {
+                               _title = value;
+                               dispatchEvent( new Event("titleChange") );
+                       }
+               }
+
+               private var _htmlTitle:String;
+               
+               /**
+                *  The HTML title for the Alert.
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#htmlTitle
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get htmlTitle():String
+               {
+                       return _htmlTitle;
+               }
+               public function set htmlTitle(value:String):void
+               {
+                       if( value != _htmlTitle ) {
+                               _htmlTitle = value;
+                               dispatchEvent( new Event("htmlTitleChange") );
+                       }
+               }
+               
+               private var _message:String;
+               
+               /**
+                *  The message to display.
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#message
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get message():String
+               {
+                       return _message;
+               }
+               public function set message(value:String):void
+               {
+                       if( value != _message ) {
+                               _message = value;
+                               dispatchEvent( new Event("messageChange") );
+                       }
+               }
+               
+               private var _htmlMessage:String;
+               
+               /**
+                *  The HTML message to display.
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#htmlMessage
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get htmlMessage():String
+               {
+                       return _htmlMessage;
+               }
+               public function set htmlMessage(value:String):void
+               {
+                       if( value != _htmlMessage )
+                       {
+                               _htmlMessage = value;
+                               dispatchEvent( new Event("htmlMessageChange") );
+                       }
+               }
+               
+               private var _flags:uint;
+               
+               /**
+                *  Which buttons to display (see Alert for details).
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#flags
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get flags():uint
+               {
+                       return _flags;
+               }
+               public function set flags(value:uint):void
+               {
+                       if( value != _flags )
+                       {
+                               _flags = value;
+                               dispatchEvent( new Event("flagsChange") );
+                       }
+               }
+               
+               private var _okLabel:String = "OK";
+               
+               /**
+                *  The label to use for the OK button.
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#okLabel
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get okLabel():String
+               {
+                       return _okLabel;
+               }
+               public function set okLabel(value:String):void
+               {
+                       if( value != _okLabel )
+                       {
+                               _okLabel = value;
+                               dispatchEvent( new Event("okLabelChange") );
+                       }
+               }
+               
+               private var _cancelLabel:String = "Cancel";
+               
+               /**
+                *  The label to use for the Cancel button.
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#cancelLabel
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get cancelLabel():String
+               {
+                       return _cancelLabel;
+               }
+               public function set cancelLabel(value:String):void
+               {
+                       if( value != _cancelLabel )
+                       {
+                               _cancelLabel = value;
+                               dispatchEvent( new Event("cancelLabelChange") );
+                       }
+               }
+               
+               private var _yesLabel:String = "YES";
+               
+               /**
+                *  The label to use for the Yes button.
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#yesLabel
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get yesLabel():String
+               {
+                       return _yesLabel;
+               }
+               public function set yesLabel(value:String):void
+               {
+                       if( value != _yesLabel )
+                       {
+                               _yesLabel = value;
+                               dispatchEvent( new Event("yesLabelChange") );
+                       }
+               }
+               
+               private var _noLabel:String = "NO";
+               
+               /**
+                *  The label to use for the NO button.
+                * 
+                *  @copy org.apache.flex.core.IAlertModel#noLabel
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get noLabel():String
+               {
+                       return _noLabel;
+               }
+               public function set noLabel(value:String):void
+               {
+                       if( value != _noLabel )
+                       {
+                               _noLabel = value;
+                               dispatchEvent( new Event("noLabelChange") );
+                       }
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ArrayListSelectionModel.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ArrayListSelectionModel.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ArrayListSelectionModel.as
new file mode 100644
index 0000000..5c8a188
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ArrayListSelectionModel.as
@@ -0,0 +1,244 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.models
+{
+       import org.apache.flex.collections.IArrayList;
+       import org.apache.flex.core.IRollOverModel;
+       import org.apache.flex.core.ISelectionModel;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.EventDispatcher;
+
+    /**
+     *  The ArrayListSelectionModel class is a selection model for
+     *  a dataProvider that is an ArrayList. It assumes that items
+     *  can be fetched from the dataProvider using 
dataProvider.getItemAt(index).
+     *
+     *  @langversion 3.0
+     *  @playerversion Flash 10.2
+     *  @playerversion AIR 2.6
+     *  @productversion FlexJS 0.0
+     */
+       public class ArrayListSelectionModel extends EventDispatcher implements 
ISelectionModel, IRollOverModel
+       {
+        /**
+         *  Constructor.
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function ArrayListSelectionModel()
+               {
+               }
+
+               private var _strand:IStrand;
+
+        /**
+         *  @copy org.apache.flex.core.IBead#strand
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+               }
+
+               private var _dataProvider:IArrayList;
+
+        /**
+         *  @copy org.apache.flex.core.ISelectionModel#dataProvider
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get dataProvider():Object
+               {
+                       return _dataProvider;
+               }
+
+        /**
+         *  @private
+         */
+               public function set dataProvider(value:Object):void
+               {
+            if (value === _dataProvider) return;
+
+            _dataProvider = value as IArrayList;
+            if (_selectedIndex != -1)
+                _selectedItem = (_dataProvider == null || _selectedIndex >= 
_dataProvider.length) ? null :
+                    _dataProvider.getItemAt(_selectedIndex);
+                       dispatchEvent(new Event("dataProviderChanged"));
+               }
+
+               private var _selectedIndex:int = -1;
+               private var _rollOverIndex:int = -1;
+               private var _labelField:String = null;
+
+        /**
+         *  @copy org.apache.flex.core.ISelectionModel#labelField
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get labelField():String
+               {
+                       return _labelField;
+               }
+
+        /**
+         *  @private
+         */
+               public function set labelField(value:String):void
+               {
+                       if (value != _labelField) {
+                               _labelField = value;
+                               dispatchEvent(new Event("labelFieldChanged"));
+                       }
+               }
+
+        /**
+         *  @copy org.apache.flex.core.ISelectionModel#selectedIndex
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get selectedIndex():int
+               {
+                       return _selectedIndex;
+               }
+
+        /**
+         *  @private
+         */
+               public function set selectedIndex(value:int):void
+               {
+            if (value === _selectedIndex) return;
+
+                       _selectedIndex = value;
+                       _selectedItem = (value == -1 || _dataProvider == null) 
? null : (value < _dataProvider.length) ? _dataProvider.getItemAt(value) : null;
+                       dispatchEvent(new Event("selectedIndexChanged"));
+               }
+
+        /**
+         *  @copy org.apache.flex.core.IRollOverModel#rollOverIndex
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get rollOverIndex():int
+               {
+                       return _rollOverIndex;
+               }
+
+        /**
+         *  @private
+         */
+               public function set rollOverIndex(value:int):void
+               {
+                       if (value != _rollOverIndex) {
+                               _rollOverIndex = value;
+                               dispatchEvent(new 
Event("rollOverIndexChanged"));
+                       }
+               }
+
+               private var _selectedItem:Object;
+
+        /**
+         *  @copy org.apache.flex.core.ISelectionModel#selectedItem
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get selectedItem():Object
+               {
+                       return _selectedItem;
+               }
+
+        /**
+         *  @private
+         */
+               public function set selectedItem(value:Object):void
+               {
+            if (value === _selectedItem) return;
+
+                       _selectedItem = value;
+                       var n:int = _dataProvider.length;
+                       for (var i:int = 0; i < n; i++)
+                       {
+                               if (_dataProvider.getItemAt(i) == value)
+                               {
+                                       _selectedIndex = i;
+                                       break;
+                               }
+                       }
+                       dispatchEvent(new Event("selectedItemChanged"));
+                       dispatchEvent(new Event("selectedIndexChanged"));
+               }
+
+               private var _selectedString:String;
+
+        /**
+         *  An alternative to selectedItem for strongly typing the
+         *  the selectedItem if the Array is an Array of Strings.
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get selectedString():String
+               {
+                       return String(_selectedItem);
+               }
+
+        /**
+         *  @private
+         */
+               public function set selectedString(value:String):void
+               {
+                       _selectedString = value;
+                       var n:int = _dataProvider.length;
+                       for (var i:int = 0; i < n; i++)
+                       {
+                               if (String(_dataProvider.getItemAt(i)) == value)
+                               {
+                                       _selectedIndex = i;
+                                       break;
+                               }
+                       }
+                       dispatchEvent(new Event("selectedItemChanged"));
+                       dispatchEvent(new Event("selectedIndexChanged"));
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ArraySelectionModel.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ArraySelectionModel.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ArraySelectionModel.as
new file mode 100644
index 0000000..a6c0a31
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ArraySelectionModel.as
@@ -0,0 +1,243 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.models
+{
+       import org.apache.flex.core.IRollOverModel;
+       import org.apache.flex.core.ISelectionModel;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.EventDispatcher;
+                       
+    /**
+     *  The ArraySelectionModel class is a selection model for
+     *  a dataProvider that is an array. It assumes that items
+     *  can be fetched from the dataProvider
+     *  dataProvider[index].  Other selection models
+     *  would support other kinds of data providers.
+     *  
+     *  @langversion 3.0
+     *  @playerversion Flash 10.2
+     *  @playerversion AIR 2.6
+     *  @productversion FlexJS 0.0
+     */
+       public class ArraySelectionModel extends EventDispatcher implements 
ISelectionModel, IRollOverModel
+       {
+        /**
+         *  Constructor.
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function ArraySelectionModel()
+               {
+               }
+
+               private var _strand:IStrand;
+               
+        /**
+         *  @copy org.apache.flex.core.IBead#strand
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+               }
+               
+               private var _dataProvider:Object;
+        
+        /**
+         *  @copy org.apache.flex.core.ISelectionModel#dataProvider
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get dataProvider():Object
+               {
+                       return _dataProvider;
+               }
+
+        /**
+         *  @private
+         */
+               public function set dataProvider(value:Object):void
+               {
+            if (value === _dataProvider) return;
+            
+            _dataProvider = value;
+            if (_selectedIndex != -1)
+                _selectedItem = (_dataProvider == null || _selectedIndex >= 
_dataProvider.length) ? null : 
+                    _dataProvider[_selectedIndex];
+                       dispatchEvent(new Event("dataProviderChanged"));
+               }
+
+               private var _selectedIndex:int = -1;
+               private var _rollOverIndex:int = -1;
+               private var _labelField:String = null;
+               
+        /**
+         *  @copy org.apache.flex.core.ISelectionModel#labelField
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get labelField():String
+               {
+                       return _labelField;
+               }
+
+        /**
+         *  @private
+         */
+               public function set labelField(value:String):void
+               {
+                       if (value != _labelField) {
+                               _labelField = value;
+                               dispatchEvent(new Event("labelFieldChanged"));
+                       }
+               }
+               
+        /**
+         *  @copy org.apache.flex.core.ISelectionModel#selectedIndex
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get selectedIndex():int
+               {
+                       return _selectedIndex;
+               }
+
+        /**
+         *  @private
+         */
+               public function set selectedIndex(value:int):void
+               {
+            if (value === _selectedIndex) return;
+            
+                       _selectedIndex = value;
+                       _selectedItem = (value == -1 || _dataProvider == null) 
? null : (value < _dataProvider.length) ? _dataProvider[value] : null;
+                       dispatchEvent(new Event("selectedIndexChanged"));       
                
+               }
+               
+        /**
+         *  @copy org.apache.flex.core.IRollOverModel#rollOverIndex
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get rollOverIndex():int
+               {
+                       return _rollOverIndex;
+               }
+
+        /**
+         *  @private
+         */
+               public function set rollOverIndex(value:int):void
+               {
+                       _rollOverIndex = value;
+                       dispatchEvent(new Event("rollOverIndexChanged"));       
                
+               }
+               
+               private var _selectedItem:Object;
+               
+        /**
+         *  @copy org.apache.flex.core.ISelectionModel#selectedItem
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get selectedItem():Object
+               {
+                       return _selectedItem;
+               }
+
+        /**
+         *  @private
+         */
+               public function set selectedItem(value:Object):void
+               {
+            if (value === _selectedItem) return;
+            
+                       _selectedItem = value;  
+                       var n:int = _dataProvider.length;
+                       for (var i:int = 0; i < n; i++)
+                       {
+                               if (_dataProvider[i] == value)
+                               {
+                                       _selectedIndex = i;
+                                       break;
+                               }
+                       }
+                       dispatchEvent(new Event("selectedItemChanged"));        
                
+                       dispatchEvent(new Event("selectedIndexChanged"));
+               }
+               
+               private var _selectedString:String;
+               
+        /**
+         *  An alternative to selectedItem for strongly typing the
+         *  the selectedItem if the Array is an Array of Strings.
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+               public function get selectedString():String
+               {
+                       return String(_selectedItem);
+               }
+
+        /**
+         *  @private
+         */
+               public function set selectedString(value:String):void
+               {
+                       _selectedString = value;
+                       var n:int = _dataProvider.length;
+                       for (var i:int = 0; i < n; i++)
+                       {
+                               if (String(_dataProvider[i]) == value)
+                               {
+                                       _selectedIndex = i;
+                                       break;
+                               }
+                       }
+                       dispatchEvent(new Event("selectedItemChanged"));        
                
+                       dispatchEvent(new Event("selectedIndexChanged"));       
                
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ComboBoxModel.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ComboBoxModel.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ComboBoxModel.as
new file mode 100644
index 0000000..35a60a8
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/ComboBoxModel.as
@@ -0,0 +1,100 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.models
+{
+       import org.apache.flex.core.IBead;
+       import org.apache.flex.core.IComboBoxModel;
+       import org.apache.flex.events.Event;
+                       
+       /**
+        *  The ComboBoxModel class bead extends 
org.apache.flex.html.beads.models.ArraySelectionModel 
+        *  and adds the text being displayed by the 
org.apache.flex.html.ComboBox's input field.
+        *  
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class ComboBoxModel extends ArraySelectionModel implements 
IBead, IComboBoxModel
+       {
+               /**
+                *  constructor.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function ComboBoxModel()
+               {
+               }
+
+               private var _text:String;
+               
+               /**
+                *  The string to display in the org.apache.flex.html.ComboBox 
input field.
+                * 
+                *  @copy org.apache.flex.core.IComboBoxModel#text
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get text():String
+               {
+                       return _text;
+               }
+               
+               public function set text(value:String):void
+               {
+                       if (value != _text)
+                       {
+                               _text = value;
+                               dispatchEvent(new Event("textChange"));
+                       }
+               }
+               
+               private var _html:String;
+               
+               /**
+                *  The HTML string to display in the 
org.apache.flex.html.ComboBox input field.
+                * 
+                *  @copy org.apache.flex.core.IComboBoxModel#html
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get html():String
+               {
+                       return _html;
+               }
+               
+               public function set html(value:String):void
+               {
+                       if (value != _html)
+                       {
+                               _html = value;
+                               dispatchEvent(new Event("htmlChange"));
+                       }
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DataGridModel.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DataGridModel.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DataGridModel.as
new file mode 100644
index 0000000..531edac
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DataGridModel.as
@@ -0,0 +1,71 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.models
+{
+       import org.apache.flex.core.IDataGridModel;
+       import org.apache.flex.events.Event;
+       
+       /**
+        *  The DataGridModel class bead extends 
org.apache.flex.html.beads.models.ArrayListSelectionModel 
+        *  to facilitate using an ArrayList as the dataProvider for the 
DataGrid.
+        *  
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class DataGridModel extends ArrayListSelectionModel implements 
IDataGridModel
+       {
+               /**
+                *  constructor.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function DataGridModel()
+               {
+                       super();
+               }
+               
+               private var _columns:Array;
+               
+               /**
+                *  The array of 
org.apache.flex.html.supportClasses.DataGridColumns used to 
+                *  define each column of the org.apache.flex.html.DataGrid.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get columns():Array
+               {
+                       return _columns;
+               }
+               public function set columns(value:Array):void
+               {
+                       if (_columns != value) {
+                               _columns = value;
+                               dispatchEvent( new Event("columnsChanged"));
+                       }
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DataGridPresentationModel.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DataGridPresentationModel.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DataGridPresentationModel.as
new file mode 100644
index 0000000..0a00edb
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DataGridPresentationModel.as
@@ -0,0 +1,88 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.models
+{
+       import org.apache.flex.core.IDataGridPresentationModel;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.events.Event;
+       
+       /**
+        *  The DataGridPresentationModel class contains the data to label the 
columns
+        *  of the org.apache.flex.html.DataGrid along with the height of the 
rows. 
+        *  
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class DataGridPresentationModel extends ListPresentationModel 
implements IDataGridPresentationModel
+       {
+               /**
+                *  constructor.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function DataGridPresentationModel()
+               {
+                       super();
+                       
+                       separatorThickness = 1;
+               }
+               
+               private var _columnLabels:Array;
+               
+               /**
+                *  The labels for each column.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get columnLabels():Array
+               {
+                       return _columnLabels;
+               }
+               public function set columnLabels(value:Array):void
+               {
+                       if (value != _columnLabels) {
+                               _columnLabels = value;
+                               dispatchEvent(new Event("columnsChanged"));
+                       }
+               }
+               
+               private var _strand:IStrand;
+               
+               /**
+                *  @copy org.apache.flex.core.IBead#strand
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               override public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d8221452/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DateChooserModel.as
----------------------------------------------------------------------
diff --git 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DateChooserModel.as
 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DateChooserModel.as
new file mode 100644
index 0000000..4b6fc18
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/models/DateChooserModel.as
@@ -0,0 +1,189 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.flex.html.beads.models
+{      
+       import org.apache.flex.core.IDateChooserModel;
+       import org.apache.flex.core.IStrand;
+       import org.apache.flex.events.Event;
+       import org.apache.flex.events.EventDispatcher;
+       
+       /**
+        *  The DateChooserModel is a bead class that manages the data for a 
DataChooser. 
+        *  This includes arrays of names for the months and days of the week 
as well the
+        *  currently selected date.
+        *  
+        *  @langversion 3.0
+        *  @playerversion Flash 10.2
+        *  @playerversion AIR 2.6
+        *  @productversion FlexJS 0.0
+        */
+       public class DateChooserModel extends EventDispatcher implements 
IDateChooserModel
+       {
+               public function DateChooserModel()
+               {
+                       // default displayed year and month to "today"
+                       var today:Date = new Date();
+                       displayedYear = today.getFullYear();
+                       displayedMonth = today.getMonth();
+               }
+               
+               private var _strand:IStrand;
+               
+               /**
+                *  @copy org.apache.flex.core.IBead#strand
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function set strand(value:IStrand):void
+               {
+                       _strand = value;
+               }
+               
+               private var _dayNames:Array   = 
["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];
+               private var _monthNames:Array = 
["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
+               private var _displayedYear:Number;
+               private var _displayedMonth:Number;
+               private var _firstDayOfWeek:Number = 0;
+               private var _selectedDate:Date;
+               
+               /**
+                *  An array of strings used to name the days of the week with 
Sunday being the
+                *  first element of the array.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get dayNames():Array
+               {
+                       return _dayNames;
+               }
+               public function set dayNames(value:Array):void
+               {
+                       _dayNames = value;
+                       dispatchEvent( new Event("dayNamesChanged") );
+               }
+               
+               /**
+                *  An array of strings used to name the months of the year 
with January being
+                *  the first element of the array.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get monthNames():Array
+               {
+                       return _monthNames;
+               }
+               public function set monthNames(value:Array):void
+               {
+                       _monthNames = value;
+                       dispatchEvent( new Event("monthNames") );
+               }
+               
+               /**
+                *  The year currently displayed by the DateChooser.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get displayedYear():Number
+               {
+                       return _displayedYear;
+               }
+               public function set displayedYear(value:Number):void
+               {
+                       if (value != _displayedYear) {
+                               _displayedYear = value;
+                               dispatchEvent( new 
Event("displayedYearChanged") );
+                       }
+               }
+               
+               /**
+                *  The month currently displayed by the DateChooser.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get displayedMonth():Number
+               {
+                       return _displayedMonth;
+               }
+               public function set displayedMonth(value:Number):void
+               {
+                       if (_displayedMonth != value) {
+                               _displayedMonth = value;
+                               dispatchEvent( new 
Event("displayedMonthChanged") );
+                       }
+               }
+               
+               /**
+                *  The index of the first day of the week, Sunday = 0.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get firstDayOfWeek():Number
+               {
+                       return _firstDayOfWeek;
+               }
+               public function set firstDayOfWeek(value:Number):void
+               {
+                       if (value != _firstDayOfWeek) {
+                               _firstDayOfWeek = value;
+                               dispatchEvent( new 
Event("firstDayOfWeekChanged") );
+                       }
+               }
+               
+               /**
+                *  The currently selected date or null if no date has been 
selected.
+                *  
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion FlexJS 0.0
+                */
+               public function get selectedDate():Date
+               {
+                       return _selectedDate;
+               }
+               public function set selectedDate(value:Date):void
+               {
+                       if (value != _selectedDate) {
+                               _selectedDate = value;
+                               dispatchEvent( new Event("selectedDateChanged") 
);
+                               
+                               displayedMonth = value.getMonth();
+                               displayedYear  = value.getFullYear();
+                       }
+               }
+       }
+}

Reply via email to