flex-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From aha...@apache.org
Subject [05/13] git commit: [flex-asjs] [refs/heads/core_js_to_as] - add createElement calls and get a clean compile again
Date Fri, 30 Oct 2015 20:16:48 GMT
add createElement calls and get a clean compile again


Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/d69b0aa0
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/d69b0aa0
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/d69b0aa0

Branch: refs/heads/core_js_to_as
Commit: d69b0aa0d86f2d5eb050b875b55541910b28ca93
Parents: ea436b0
Author: Alex Harui <aharui@apache.org>
Authored: Wed Oct 28 16:40:19 2015 -0700
Committer: Alex Harui <aharui@apache.org>
Committed: Wed Oct 28 16:40:19 2015 -0700

----------------------------------------------------------------------
 .../HTML/as/src/org/apache/flex/html/Alert.as   |  94 ++++++++++-
 .../as/src/org/apache/flex/html/ButtonBar.as    |  24 +++
 .../as/src/org/apache/flex/html/CheckBox.as     |  50 +++++-
 .../as/src/org/apache/flex/html/CloseButton.as  |  21 +++
 .../as/src/org/apache/flex/html/ComboBox.as     | 161 ++++++++++++++++++-
 .../as/src/org/apache/flex/html/Container.as    |  28 ++++
 .../as/src/org/apache/flex/html/ControlBar.as   |  23 +++
 .../as/src/org/apache/flex/html/DropDownList.as |  48 ++++++
 .../HTML/as/src/org/apache/flex/html/HRule.as   |  22 ++-
 .../HTML/as/src/org/apache/flex/html/Image.as   |  28 ++++
 .../org/apache/flex/html/ImageAndTextButton.as  |  20 +++
 .../HTML/as/src/org/apache/flex/html/Label.as   |  18 ++-
 .../HTML/as/src/org/apache/flex/html/List.as    |  35 +++-
 .../src/org/apache/flex/html/MultilineLabel.as  |  15 ++
 .../src/org/apache/flex/html/NumericStepper.as  |  64 +++++++-
 .../as/src/org/apache/flex/html/RadioButton.as  | 139 +++++++++++++++-
 .../as/src/org/apache/flex/html/SimpleAlert.as  |  14 +-
 .../as/src/org/apache/flex/html/SimpleList.as   |  23 +++
 .../HTML/as/src/org/apache/flex/html/Slider.as  |  34 +++-
 .../HTML/as/src/org/apache/flex/html/Spacer.as  |  21 ++-
 .../HTML/as/src/org/apache/flex/html/Spinner.as |  31 ++++
 .../as/src/org/apache/flex/html/TextArea.as     |  19 +++
 .../as/src/org/apache/flex/html/TextInput.as    |  27 ++++
 .../as/src/org/apache/flex/html/TitleBar.as     |  21 +++
 .../HTML/as/src/org/apache/flex/html/VRule.as   |  24 ++-
 25 files changed, 976 insertions(+), 28 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/Alert.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/Alert.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/Alert.as
index 62c7ec6..b7f50dc 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/Alert.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/Alert.as
@@ -21,6 +21,13 @@ package org.apache.flex.html
 	import org.apache.flex.core.IAlertModel;
 	import org.apache.flex.core.IPopUp;
 	import org.apache.flex.core.UIBase;
+
+    COMPILE::JS
+    {
+        import goog.events;
+        import org.apache.flex.core.WrappedHTMLElement;
+        import org.apache.flex.events.Event;
+    }
 	
 	/**
 	 *  The Alert class is a component that displays a message and one or more buttons
@@ -96,6 +103,42 @@ package org.apache.flex.html
 			
 			className = "Alert";
 		}
+
+        COMPILE::JS
+        private var titleBar:TitleBar;
+        
+        COMPILE::JS
+        private var label:Label;
+        
+        COMPILE::JS
+        private var buttonArea:Container;
+        
+        /**
+         * @override
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            super.createElement();
+            
+            element.className = 'Alert';
+            
+            // add in a title bar
+            titleBar = new TitleBar();
+            addElement(titleBar);
+            titleBar.element.id = 'titleBar';
+            
+            label = new Label();
+            addElement(label);
+            label.element.id = 'message';
+            
+            // add a place for the buttons
+            buttonArea = new Container();
+            addElement(buttonArea);
+            buttonArea.element.id = 'buttonArea';
+            
+            return element;
+        };
 		
 		// note: only passing parent to this function as I don't see a way to identify
 		// the 'application' or top level view without supplying a place to start to
@@ -122,6 +165,14 @@ package org.apache.flex.html
 			alert.flags = flags;
 			
 			alert.show(parent);
+            
+            COMPILE::JS
+            {
+                alert.positioner.style.position = 'relative';
+                alert.positioner.style.width = '200px';
+                alert.positioner.style.margin = 'auto';
+                alert.positioner.style.top = '100px';
+            }
 		}
 		
 		/**
@@ -189,7 +240,48 @@ package org.apache.flex.html
 		public function set flags(value:uint):void
 		{
 			IAlertModel(model).flags = value;
+            
+            COMPILE::JS
+            {
+                // add buttons based on flags
+                if (flags & Alert.OK) {
+                    var ok:TextButton = new TextButton();
+                    buttonArea.addElement(ok);
+                    ok.text = 'OK';
+                    goog.events.listen(ok.element, 'click', dismissAlert);
+                }
+                if (flags & Alert.CANCEL) {
+                    var cancel:TextButton = new TextButton();
+                    buttonArea.addElement(cancel);
+                    cancel.text = 'Cancel';
+                    goog.events.listen(cancel.element, 'click', dismissAlert);
+                }
+                if (flags & Alert.YES) {
+                    var yes:TextButton = new TextButton();
+                    buttonArea.addElement(yes);
+                    yes.text = 'YES';
+                    goog.events.listen(yes.element, 'click', dismissAlert);
+                }
+                if (flags & Alert.NO) {
+                    var nob:TextButton = new TextButton();
+                    buttonArea.addElement(nob);
+                    nob.text = 'NO';
+                    goog.events.listen(nob.element, 'click', dismissAlert);
+                }
+                
+            }
 		}
-		
+        
+        /**
+         * @param event The event object.
+         * @flexjsignorecoercion HTMLElement
+         */
+        COMPILE::JS
+        private function dismissAlert(event:Event):void
+        {
+            var htmlElement:HTMLElement = element as HTMLElement;
+            htmlElement.parentElement.removeChild(element);
+        };
+	
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/ButtonBar.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/ButtonBar.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/ButtonBar.as
index 4b3c7a9..1920fb3 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/ButtonBar.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/ButtonBar.as
@@ -18,6 +18,11 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
 {
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
+
 	/**
 	 *  The ButtonBar class is a component that displays a set of Buttons. The ButtonBar
 	 *  is actually a List with a default horizontal layout and an itemRenderer that 
@@ -49,5 +54,24 @@ package org.apache.flex.html
 		{
 			super();
 		}
+        
+        /**
+         * @override
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            element.style.overflow = 'auto';
+            positioner = element;
+            positioner.style.position = 'relative';
+            
+            className = 'ButtonBar';
+            
+            element.flexjs_wrapper = this;
+            
+            return element;
+        }
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/CheckBox.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/CheckBox.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/CheckBox.as
index b718a95..4a69ead 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/CheckBox.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/CheckBox.as
@@ -18,11 +18,23 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
 {
-    import flash.events.MouseEvent;
+    COMPILE::AS3
+    {
+        import flash.events.MouseEvent;            
+    }
 	
-	import org.apache.flex.core.IToggleButtonModel;
 	import org.apache.flex.core.IStrand;
-	import org.apache.flex.core.UIButtonBase;
+	import org.apache.flex.core.IToggleButtonModel;
+	import org.apache.flex.core.IUIBase;
+    COMPILE::AS3
+    {
+        import org.apache.flex.core.UIButtonBase;            
+    }
+    COMPILE::JS
+    {
+        import org.apache.flex.core.UIBase;        
+        import org.apache.flex.core.WrappedHTMLElement;        
+    }
 	import org.apache.flex.events.Event;
 	
     //--------------------------------------
@@ -48,6 +60,7 @@ package org.apache.flex.html
      *  @playerversion AIR 2.6
      *  @productversion FlexJS 0.0
      */
+    COMPILE::AS3
 	public class CheckBox extends UIButtonBase implements IStrand
 	{
         /**
@@ -114,4 +127,35 @@ package org.apache.flex.html
 			dispatchEvent(new Event("change"));
 		}
 	}
+    
+    COMPILE::JS
+    public class CheckBox extends UIBase implements IStrand, IEventDispatcher, IUIBase
+    {
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        override protected function createElement():WrappedHTMLElement
+        {
+            var cb:WrappedHTMLElement;
+            
+            element = document.createElement('label') as WrappedHTMLElement;
+            
+            cb = document.createElement('input');
+            cb.type = 'checkbox';
+            element.appendChild(cb);
+            element.appendChild(document.createTextNode(''));
+            
+            element.className = 'CheckBox';
+            typeNames = 'CheckBox';
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            cb.flexjs_wrapper = this;
+            element.flexjs_wrapper = this;
+            
+            return element;
+        }        
+        
+    }        
+
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/CloseButton.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/CloseButton.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/CloseButton.as
index dbad921..8306915 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/CloseButton.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/CloseButton.as
@@ -18,6 +18,11 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
 {
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
+
     /**
      *  The CloseButton class is Button that displays an X
      *  and is commonly used in a Panel's TitleBar.
@@ -41,5 +46,21 @@ package org.apache.flex.html
 		{
 			super();
 		}
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            super.createElement();
+            element.innerHTML = 'x';
+            
+            element.style.padding = 0;
+            height = 11;
+            width = 11;
+            return element;
+        }        
+
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/ComboBox.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/ComboBox.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/ComboBox.as
index 2b2919d..ecf65e9 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/ComboBox.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/ComboBox.as
@@ -20,6 +20,12 @@ package org.apache.flex.html
 {
 	import org.apache.flex.core.IComboBoxModel;
 	import org.apache.flex.core.UIBase;
+	import org.apache.flex.events.Event;
+
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
 	[Event(name="change", type="org.apache.flex.events.Event")]
 	
@@ -109,6 +115,159 @@ package org.apache.flex.html
 		{
 			IComboBoxModel(model).selectedItem = value;
 		}
-				
+		
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            var button:WrappedHTMLElement;
+            var input:WrappedHTMLElement;
+            
+            element = document.createElement('div') as WrappedHTMLElement;
+            
+            input = document.createElement('input') as WrappedHTMLElement;
+            input.style.position = 'absolute';
+            input.style.width = '80px';
+            element.appendChild(input);
+            
+            button = document.createElement('div') as WrappedHTMLElement;
+            button.style.position = 'absolute';
+            button.style.top = '0px';
+            button.style.right = '0px';
+            button.style.background = '#bbb';
+            button.style.width = '16px';
+            button.style.height = '20px';
+            button.style.margin = '0';
+            button.style.border = 'solid #609 1px';
+            goog.events.listen(button, 'click', goog.bind(buttonClicked, this));
+            element.appendChild(button);
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            
+            // add a click handler so that a click outside of the combo box can
+            // dismiss the pop-up should it be visible.
+            goog.events.listen(document, 'click',
+                goog.bind(dismissPopup, this));
+            
+            input.flexjs_wrapper = this;
+            
+            return element;
+        }        
+
+        COMPILE::JS
+        private var popup:HTMLElement;
+        
+        /**
+         * @param event The event.
+         * @flexjsignorecoercion HTMLSelectElement
+         */
+        COMPILE::JS
+        private function selectChanged(event:Event):void
+        {
+            var select:HTMLSelectElement;
+            
+            select = event.currentTarget as HTMLSelectElement;
+            
+            selectedItem = select.options[select.selectedIndex].value;
+            
+            popup.parentNode.removeChild(popup);
+            popup = null;
+            
+            dispatchEvent(event);
+        }
+        
+        
+        /**
+         * @param event The event.
+         */
+        COMPILE::JS
+        private function dismissPopup(event:Event):void
+        {
+            // remove the popup if it already exists
+            if (popup) {
+                popup.parentNode.removeChild(popup);
+                popup = null;
+            }
+        }
+        
+        
+        /**
+         * @export
+         * @param {Object} event The event.
+         */
+        COMPILE::JS
+        private function buttonClicked(event:Event):void
+        {
+            var dp:Array;
+            var i:int;
+            var input:HTMLInputElement;
+            var left:Number;
+            var n:int;
+            var opt:HTMLOptionElement;
+            var opts:Array;
+            var pn:HTMLElement;
+            var popup:HTMLElement;
+            var select:HTMLSelectElement;
+            var si:int;
+            var top:Number;
+            var width:Number;
+            
+            event.stopPropagation();
+            
+            if (popup) {
+                dismissPopup();
+                
+                return;
+            }
+            
+            input = element.childNodes.item(0);
+            
+            pn = element;
+            top = pn.offsetTop + input.offsetHeight;
+            left = pn.offsetLeft;
+            width = pn.offsetWidth;
+            
+            popup = document.createElement('div');
+            popup.className = 'popup';
+            popup.id = 'test';
+            popup.style.position = 'absolute';
+            popup.style.top = top.toString() + 'px';
+            popup.style.left = left.toString() + 'px';
+            popup.style.width = width.toString() + 'px';
+            popup.style.margin = '0px auto';
+            popup.style.padding = '0px';
+            popup.style.zIndex = '10000';
+            
+            select = document.createElement('select');
+            select.style.width = width.toString() + 'px';
+            goog.events.listen(select, 'change', goog.bind(selectChanged, this));
+            opts = select.options;
+            
+            dp = dataProvider;
+            n = dp.length;
+            for (i = 0; i < n; i++) {
+                opt = document.createElement('option');
+                opt.text = dp[i];
+                opts.add(opt);
+            }
+            
+            select.size = n;
+            
+            si = selectedIndex;
+            if (si < 0) {
+                select.value = null;
+            } else {
+                select.value = dp[si];
+            }
+            
+            this.popup = popup;
+            
+            popup.appendChild(select);
+            document.body.appendChild(popup);
+        }
+
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/Container.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/Container.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/Container.as
index b91d51b..82316bf 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/Container.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/Container.as
@@ -22,6 +22,10 @@ package org.apache.flex.html
 	import org.apache.flex.core.IChrome;
 	import org.apache.flex.core.IContainer;
 	import org.apache.flex.core.IUIBase;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	import org.apache.flex.events.Event;
 	
 	[DefaultProperty("mxmlContent")]
@@ -70,5 +74,29 @@ package org.apache.flex.html
 			super();
 		}
 
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            
+            positioner = element;
+            
+            // absolute positioned children need a non-null
+            // position value in the parent.  It might
+            // get set to 'absolute' if the container is
+            // also absolutely positioned
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            
+            /*addEventListener('childrenAdded',
+            goog.bind(runLayoutHandler, this));
+            addEventListener('elementRemoved',
+            goog.bind(runLayoutHandler, this));*/
+            
+            return element;
+        }        
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/ControlBar.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/ControlBar.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/ControlBar.as
index 1ba9f37..da65539 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/ControlBar.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/ControlBar.as
@@ -23,6 +23,10 @@ package org.apache.flex.html
 	import org.apache.flex.core.IChrome;
 	import org.apache.flex.core.IContainer;
 	import org.apache.flex.core.ValuesManager;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 
 	/**
 	 *  The ControlBar class is used within a Panel as a place to position
@@ -72,5 +76,24 @@ package org.apache.flex.html
 				addBead(layout);
 			}
 		}
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            element.className = 'ControlBar';
+            element.style.display = 'inline';
+            typeNames = 'ControlBar';
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            
+            return element;
+        }        
+
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/DropDownList.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/DropDownList.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/DropDownList.as
index 25dcfc7..820a721 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/DropDownList.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/DropDownList.as
@@ -19,6 +19,10 @@
 package org.apache.flex.html
 {
     import org.apache.flex.core.ISelectionModel;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
     
     //--------------------------------------
     //  Events
@@ -88,6 +92,32 @@ package org.apache.flex.html
         public function set dataProvider(value:Object):void
         {
             ISelectionModel(model).dataProvider = value;
+            COMPILE::JS
+            {
+                var dp:Array;
+                var i:int;
+                var n:int;
+                var opt:HTMLOptionElement;
+                
+                model.dataProvider = value;
+                dp = element.options;
+                n = dp.length;
+                for (i = 0; i < n; i++) {
+                    dp.remove(0);
+                }
+                
+                var lf:String = labelField;
+                n = value.length;
+                for (i = 0; i < n; i++) {
+                    opt = document.createElement('option');
+                    if (lf)
+                        opt.text = value[i][lf];
+                    else
+                        opt.text = value[i];
+                    dp.add(opt);
+                }
+
+            }
         }
         
         [Bindable("change")]
@@ -153,5 +183,23 @@ package org.apache.flex.html
             ISelectionModel(model).labelField = value;
         }
         
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('select') as WrappedHTMLElement;
+            element.size = 1;
+            goog.events.listen(element, 'change',
+                goog.bind(changeHandler, this));
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            
+            element.flexjs_wrapper = this;
+            
+            return element;
+        }        
     }
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/HRule.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/HRule.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/HRule.as
index de32749..32da5a2 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/HRule.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/HRule.as
@@ -17,11 +17,12 @@
 //
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
-{
-	import flash.display.DisplayObject;
-	import flash.display.DisplayObjectContainer;
-	
+{	
 	import org.apache.flex.core.UIBase;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
     /**
      *  The HRule class displays a horizontal line
@@ -45,5 +46,18 @@ package org.apache.flex.html
 		{
 			super();
         }
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('hr');
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            return element;
+        }        
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/Image.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/Image.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/Image.as
index 8bf2f98..81b59bf 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/Image.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/Image.as
@@ -20,6 +20,10 @@ package org.apache.flex.html
 {
 	import org.apache.flex.core.IImageModel;
 	import org.apache.flex.core.UIBase;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
 	/**
 	 *  The Image class is a component that displays a bitmap. The Image uses
@@ -64,5 +68,29 @@ package org.apache.flex.html
 		{
 			IImageModel(model).source = value;
 		}
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('img') as WrappedHTMLElement;
+            element.className = 'Image';
+            typeNames = 'Image';
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            
+            model = new
+                ImageModel();
+            
+            addBead(new
+                ImageView());
+            
+            return element;
+        }        
+
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/ImageAndTextButton.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/ImageAndTextButton.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/ImageAndTextButton.as
index c2d5999..2c6b5ec 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/ImageAndTextButton.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/ImageAndTextButton.as
@@ -20,6 +20,10 @@ package org.apache.flex.html
 {
 	import org.apache.flex.events.Event;
     import org.apache.flex.html.beads.models.ImageAndTextModel;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
     /**
      *  The ImageTextButton class implements a basic button that
@@ -65,6 +69,22 @@ package org.apache.flex.html
         {
             ImageAndTextModel(model).image = value;
         }
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('button') as WrappedHTMLElement;
+            element.setAttribute('type', 'button');
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            
+            return element;
+        }        
 
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/Label.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/Label.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/Label.as
index c47d8b9..1c9ef72 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/Label.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/Label.as
@@ -23,7 +23,11 @@ package org.apache.flex.html
 	import org.apache.flex.core.ValuesManager;
 	import org.apache.flex.events.Event;
 	import org.apache.flex.events.IEventDispatcher;
-	
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
+
 	/*
 	 *  Label probably should extend TextField directly,
 	 *  but the player's APIs for TextLine do not allow
@@ -110,6 +114,18 @@ package org.apache.flex.html
             model.addEventListener("textChange", repeaterListener);
             model.addEventListener("htmlChange", repeaterListener);
         }
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('span') as WrappedHTMLElement;
+            positioner = element;
+            element.flexjs_wrapper = this;
+            return element;
+        }        
 
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/List.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/List.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/List.as
index 10a2304..77994d6 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/List.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/List.as
@@ -18,11 +18,10 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
 {
-	import org.apache.flex.core.IFactory;
-	
 	import org.apache.flex.core.ContainerBaseStrandChildren;
 	import org.apache.flex.core.IContentViewHost;
 	import org.apache.flex.core.IDataProviderItemRendererMapper;
+	import org.apache.flex.core.IFactory;
 	import org.apache.flex.core.IItemRendererClassFactory;
 	import org.apache.flex.core.IListPresentationModel;
 	import org.apache.flex.core.IRollOverModel;
@@ -30,6 +29,12 @@ package org.apache.flex.html
 	import org.apache.flex.core.ListBase;
 	import org.apache.flex.core.UIBase;
 	import org.apache.flex.core.ValuesManager;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;
+        import org.apache.flex.html.beads.ListView;
+        import org.apache.flex.html.supportClasses.DataGroup;
+    }
 	import org.apache.flex.events.Event;
 	import org.apache.flex.events.IEventDispatcher;
 	import org.apache.flex.html.beads.models.ListPresentationModel;
@@ -250,5 +255,29 @@ package org.apache.flex.html
 			dispatchEvent(new Event("initComplete"));
 		}
         
-	}
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            super.createElement();
+            className = 'List';
+            
+            return element;
+        }        
+
+        /**
+         * @flexjsignorecoercion org.apache.flex.html.beads.ListView 
+         * @flexjsignorecoercion org.apache.flex.html.supportClasses.DataGroup 
+         */
+        COMPILE::JS
+        override public function internalChildren():Array
+        {
+            var listView:ListView = getBeadByType(ListView) as ListView;
+            var dg:DataGroup = listView.dataGroup as DataGroup;
+            var renderers:Array = dg.internalChildren();
+            return renderers;
+        };
+   	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/MultilineLabel.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/MultilineLabel.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/MultilineLabel.as
index 909bf5e..388d800 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/MultilineLabel.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/MultilineLabel.as
@@ -23,6 +23,10 @@ package org.apache.flex.html
 	import org.apache.flex.core.ValuesManager;
 	import org.apache.flex.events.Event;
 	import org.apache.flex.events.IEventDispatcher;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
 	/*
 	 *  Label probably should extend TextField directly,
@@ -55,6 +59,17 @@ package org.apache.flex.html
 		{
 			super();
 		}
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            positioner = element;
+            element.flexjs_wrapper = this;
+        }        
 						
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/NumericStepper.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/NumericStepper.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/NumericStepper.as
index 66b8407..8d50c20 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/NumericStepper.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/NumericStepper.as
@@ -20,6 +20,10 @@ package org.apache.flex.html
 {
 	import org.apache.flex.core.IRangeModel;
 	import org.apache.flex.core.UIBase;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 
 	[Event(name="valueChange", type="org.apache.flex.events.Event")]
 	
@@ -140,6 +144,64 @@ package org.apache.flex.html
 		{
 			IRangeModel(model).snapInterval = value;
 		}
-		
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            positioner = element;
+            positioner.style.position = 'relative';
+            
+            input = new TextInput();
+            addElement(input);
+            input.positioner.style.display = 'inline-block';
+            input.positioner.style.width = '100px';
+            
+            spinner = new Spinner();
+            spinner.positioner.style.display = 'inline-block';
+            spinner.positioner.style.height = '24px';
+            spinner.positioner.style.marginLeft = '-1px';
+            spinner.positioner.style.marginTop = '-1px';
+            addElement(spinner);
+            
+            /* TODO: ajh move to view and css */
+            spinner.incrementButton.positioner.style.display = 'block';
+            spinner.incrementButton.positioner.style.marginBottom = '-1px';
+            spinner.incrementButton.positioner.style.paddingTop = '1.5px';
+            spinner.incrementButton.positioner.style.paddingBottom = '2px';
+            spinner.incrementButton.positioner.style.fontSize = '7px';
+            spinner.decrementButton.positioner.style.marginTop = '0px';
+            spinner.decrementButton.positioner.style.display = 'block';
+            spinner.decrementButton.positioner.style.paddingTop = '2px';
+            spinner.decrementButton.positioner.style.paddingBottom = '1.5px';
+            spinner.decrementButton.positioner.style.fontSize = '7px';
+            spinner.positioner.style.display = 'inline-block';
+            goog.events.listen(spinner, 'valueChange',
+                goog.bind(spinnerChange, this));
+            
+            element.flexjs_wrapper = this;
+            className = 'NumericStepper';
+            
+            input.text = String(spinner.value);
+            
+            return element;
+        }        
+
+        /**
+         * @param event The input event.
+         */
+        COMPILE::JS
+        private function spinnerChange(event:Event):void
+        {
+            var newValue = spinner.value;
+            value = newValue;
+            input.text = String(spinner.value);
+            dispatchEvent(new Event('valueChange'));
+        };
+        
+        
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/RadioButton.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/RadioButton.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/RadioButton.as
index 8b53bac..a8d812a 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/RadioButton.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/RadioButton.as
@@ -18,14 +18,26 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
 {
-	import flash.display.DisplayObject;
-	import flash.events.MouseEvent;
-	import flash.utils.Dictionary;
+    COMPILE::AS3
+    {
+        import flash.display.DisplayObject;
+        import flash.events.MouseEvent;
+        import flash.utils.Dictionary;            
+    }
 	
 	import org.apache.flex.core.IStrand;
 	import org.apache.flex.core.IValueToggleButtonModel;
-	import org.apache.flex.core.UIButtonBase;
+    COMPILE::AS3
+    {
+        import org.apache.flex.core.UIButtonBase;            
+    }
+    COMPILE::JS
+    {
+        import org.apache.flex.core.UIBase;
+        import org.apache.flex.core.WrappedHTMLElement;
+    }
 	import org.apache.flex.events.Event;
+	import org.apache.flex.core.IUIBase;
 	
 	[Event(name="change", type="org.apache.flex.events.Event")]
 
@@ -42,6 +54,7 @@ package org.apache.flex.html
 	 *  @playerversion AIR 2.6
 	 *  @productversion FlexJS 0.0
 	 */
+    COMPILE::AS3
 	public class RadioButton extends UIButtonBase implements IStrand
 	{
 		/**
@@ -205,4 +218,122 @@ package org.apache.flex.html
 			}
 		}
 	}
+    
+    COMPILE::JS
+    public class Button extends UIBase implements IStrand, IEventDispatcher, IUIBase
+    {
+        private var input:HTMLInputElement;
+        private var labelFor:HTMLLabelElement;
+        private var textNode:HTMLTextElement;
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        override protected function createElement():WrappedHTMLElement
+        {            
+            input = document.createElement('input');
+            input.type = 'radio';
+            input.id = '_radio_' + RadioButton.radioCounter++;
+            
+            textNode = document.createTextNode('radio button');
+            
+            labelFor = document.createElement('label');
+            labelFor.appendChild(input);
+            labelFor.appendChild(textNode);
+            
+            element = labelFor;
+            element.className = 'RadioButton';
+            typeNames = 'RadioButton';
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            
+            (input as WrappedHTMLElement).flexjs_wrapper = this;
+            (element as WrappedHTMLElement).flexjs_wrapper = this;
+            (textNode as WrappedHTMLElement).flexjs_wrapper = this;
+            
+            return element;
+        }        
+        
+        override public function set id(value:String):void 
+        {
+            super.id = value;
+            labelFor.id = value;
+            input.id = value;
+        }
+        
+        public function get groupName():String
+        {
+            return input.name;
+        }
+        public function set groupName(value:String):void
+        {
+            input.name = value;
+        }
+        
+        public function get text():String
+        {
+            return textNode.nodeValue;
+        }
+        public function set text(value:String):void
+        {
+            textNode.nodeValue = value;
+        }
+        
+        /** @export */
+        public function get selected():Boolean
+        {
+            return input.checked;
+        }
+        public function set selected(value:Boolean):void
+        {
+            input.checked = value;            
+        }
+        
+        public function get value():Object
+        {
+            return input.value;
+        }
+        public function set value(v:Object):void
+        {
+            input.value = v;
+        }
+        
+        public function get selectedValue():Object
+        {
+            var buttons:Array;
+            var groupName:String;
+            var i:int;
+            var n:int;
+            
+            groupName = input.name;
+            buttons = document.getElementsByName(groupName);
+            n = buttons.length;
+            
+            for (i = 0; i < n; i++) {
+                if (buttons[i].checked) {
+                    return buttons[i].value;
+                }
+            }
+            return null;
+        }
+        
+        public function set selectedValue(value:Object):void
+        {
+            var buttons:Array;
+            var groupName:String;
+            var i:int;
+            var n:int;
+            
+            groupName = input.name;
+            buttons = document.getElementsByName(groupName);
+            n = buttons.length;
+            for (i = 0; i < n; i++) {
+                if (buttons[i].value === value) {
+                    buttons[i].checked = true;
+                    break;
+                }
+            }
+        }
+    }        
+
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleAlert.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleAlert.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleAlert.as
index c368b11..f4faba4 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleAlert.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleAlert.as
@@ -121,9 +121,17 @@ package org.apache.flex.html
 		 */
 		static public function show(message:String, parent:Object):SimpleAlert
 		{
-			var alert:SimpleAlert = new SimpleAlert();
-			alert.message = message;
-			alert.show(parent);
+            COMPILE::AS3
+            {
+                var alert:SimpleAlert = new SimpleAlert();
+                alert.message = message;
+                alert.show(parent);                    
+            }
+            COMPILE::JS
+            {
+                alert(message);
+                return null;
+            }
 			
 			return alert;
 		}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleList.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleList.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleList.as
index 4c6fc90..1feb9f4 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleList.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/SimpleList.as
@@ -18,6 +18,11 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
 {
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
+        
 	/**
 	 *  The SimpleList class is a component that displays data in a vertical column. This
 	 *  component differs from org.apache.flex.html.List in that it displays 
@@ -42,5 +47,23 @@ package org.apache.flex.html
 		{
 			super();
 		}
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('select') as WrappedHTMLElement;
+            element.size = 5;
+            goog.events.listen(element, 'change',
+                goog.bind(changeHandler, this));
+            positioner = element;
+            positioner.style.position = 'relative';
+            className = 'SimpleList';
+            
+            return element;
+        }        
+
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/Slider.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/Slider.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/Slider.as
index 2d4ee84..92e0917 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/Slider.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/Slider.as
@@ -20,7 +20,11 @@ package org.apache.flex.html
 {
 	import org.apache.flex.core.IRangeModel;
 	import org.apache.flex.core.UIBase;
-	
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
+
 	[Event(name="valueChange", type="org.apache.flex.events.Event")]
 	
 	/**
@@ -148,5 +152,33 @@ package org.apache.flex.html
             IRangeModel(model).stepSize = value;
         }
 
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            element.style.width = '200px';
+            element.style.height = '30px';
+            
+            track = new org.apache.flex.html.beads.SliderTrackView();
+            addBead(track);
+            
+            thumb = new org.apache.flex.html.beads.SliderThumbView();
+            addBead(thumb);
+            
+            controller = new org.apache.flex.html.beads.controllers.SliderMouseController();
+            addBead(controller);
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            
+            className = 'Slider';
+            
+            return element;
+        }        
+
     }
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/Spacer.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/Spacer.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/Spacer.as
index 3023378..d7ab050 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/Spacer.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/Spacer.as
@@ -18,10 +18,11 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
 {
-	import flash.display.DisplayObject;
-	import flash.display.DisplayObjectContainer;
-	
 	import org.apache.flex.core.UIBase;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
     /**
      *  The Spacer class takes up space in the UI layout.
@@ -45,5 +46,19 @@ package org.apache.flex.html
 		{
 			super();
         }
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            this.element = document.createElement('div') as WrappedHTMLElement;
+            this.positioner = this.element;
+            this.element.flexjs_wrapper = this;
+            
+            return element;
+        }        
+
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/Spinner.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/Spinner.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/Spinner.as
index c1be57e..1e73384 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/Spinner.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/Spinner.as
@@ -20,6 +20,10 @@ package org.apache.flex.html
 {
 	import org.apache.flex.core.IRangeModel;
 	import org.apache.flex.core.UIBase;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
 	[Event(name="valueChange", type="org.apache.flex.events.Event")]
 	
@@ -142,5 +146,32 @@ package org.apache.flex.html
 			IRangeModel(model).stepSize = value;
 		}
 		
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            positioner = element;
+            positioner.style.position = 'relative';
+            
+            element.style.verticalAlign = 'middle';
+            
+            incrementButton = new TextButton();
+            incrementButton.text = '\u25B2';
+            addElement(incrementButton);
+            
+            decrementButton = new TextButton();
+            decrementButton.text = '\u25BC';
+            addElement(decrementButton);
+            
+            controller = new SpinnerMouseController();
+            addBead(controller);
+            
+            element.flexjs_wrapper = this;
+            
+            return element;
+        }        
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/TextArea.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/TextArea.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/TextArea.as
index c3c8fcb..79ed2d5 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/TextArea.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/TextArea.as
@@ -20,6 +20,10 @@ package org.apache.flex.html
 {
 	import org.apache.flex.core.ITextModel;
 	import org.apache.flex.core.UIBase;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
     /**
      *  The TextArea class implements the basic control for
@@ -87,5 +91,20 @@ package org.apache.flex.html
 			ITextModel(model).html = value;
 		}
 		
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('textarea') as WrappedHTMLElement;
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            element.className = 'TextArea';
+            typeNames = 'TextArea';
+            
+            return element;
+        }        
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/TextInput.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/TextInput.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/TextInput.as
index dd1fc50..fa904c1 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/TextInput.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/TextInput.as
@@ -20,6 +20,10 @@ package org.apache.flex.html
 	import org.apache.flex.core.ITextModel;
 	import org.apache.flex.core.UIBase;
 	import org.apache.flex.events.Event;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 
 	/**
      *  Dispatched when the user changes the text.
@@ -116,5 +120,28 @@ package org.apache.flex.html
             if (!inSetter)
                 dispatchEvent(new Event(Event.CHANGE));
 		}
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('input') as WrappedHTMLElement;
+            element.setAttribute('type', 'input');
+            element.className = 'TextInput';
+            typeNames = 'TextInput';
+            
+            //attach input handler to dispatch flexjs change event when user write in textinput
+            //goog.events.listen(element, 'change', goog.bind(killChangeHandler, this));
+            goog.events.listen(element, 'input', goog.bind(inputChangeHandler_, this));
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            
+            return element;
+        }        
+        
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/TitleBar.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/TitleBar.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/TitleBar.as
index 31e20cc..3902330 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/TitleBar.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/TitleBar.as
@@ -23,6 +23,10 @@ package org.apache.flex.html
 	import org.apache.flex.core.IChrome;
 	import org.apache.flex.core.ITitleBarModel;
 	import org.apache.flex.core.ValuesManager;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	import org.apache.flex.events.Event;
 	import org.apache.flex.html.Label;
 	
@@ -121,5 +125,22 @@ package org.apache.flex.html
 			if( getBeadByType(IBeadLayout) == null )
 				addBead(new (ValuesManager.valuesImpl.getValue(this, "iBeadLayout")) as IBead);
 		}
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+            
+            className = 'TitleBar';
+            
+            return element;
+        }        
 	}
 }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d69b0aa0/frameworks/projects/HTML/as/src/org/apache/flex/html/VRule.as
----------------------------------------------------------------------
diff --git a/frameworks/projects/HTML/as/src/org/apache/flex/html/VRule.as b/frameworks/projects/HTML/as/src/org/apache/flex/html/VRule.as
index 2418364..dd46723 100644
--- a/frameworks/projects/HTML/as/src/org/apache/flex/html/VRule.as
+++ b/frameworks/projects/HTML/as/src/org/apache/flex/html/VRule.as
@@ -18,10 +18,11 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.flex.html
 {
-	import flash.display.DisplayObject;
-	import flash.display.DisplayObjectContainer;
-	
 	import org.apache.flex.core.UIBase;
+    COMPILE::JS
+    {
+        import org.apache.flex.core.WrappedHTMLElement;            
+    }
 	
     /**
      *  The VRule class displays a vertical line
@@ -45,5 +46,22 @@ package org.apache.flex.html
 		{
 			super();
         }
+        
+        /**
+         * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            element = document.createElement('div') as WrappedHTMLElement;
+            element.style.borderLeftStyle = 'solid';
+            element.style.borderLeftWidth = '1px';
+            element.style.borderTop = 'none';
+            element.style.borderBottom = 'none';
+            element.style.borderRight = 'none';
+            positioner = element;
+            positioner.style.position = 'relative';
+            element.flexjs_wrapper = this;
+        }        
 	}
 }


Mime
View raw message