This is an automated email from the ASF dual-hosted git repository.

carlosrovira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git


The following commit(s) were added to refs/heads/develop by this push:
     new 5b16892  Jewel DropDownList refactor to get Collection works and 
introduce ItemRenderers
5b16892 is described below

commit 5b16892548944d8d0de494f0dd818e0b80e0f88b
Author: Carlos Rovira <[email protected]>
AuthorDate: Fri Aug 24 18:08:05 2018 +0200

    Jewel DropDownList refactor to get Collection works and introduce 
ItemRenderers
---
 .../src/main/royale/DropDownListPlayGround.mxml    |   9 +-
 .../src/main/royale/models/ListsModel.as           |   7 +-
 .../projects/Jewel/src/main/resources/defaults.css |  11 +-
 .../Jewel/src/main/resources/jewel-manifest.xml    |   1 +
 .../projects/Jewel/src/main/royale/JewelClasses.as |   5 +-
 .../royale/org/apache/royale/jewel/DropDownList.as | 225 ++++++++-----
 .../royale/jewel/beads/views/DropDownListView.as   | 351 ++++++---------------
 .../itemRenderers/DropDownListItemRenderer.as      | 104 ++++++
 .../src/main/sass/components/_dropdownlist.sass    |  14 +-
 9 files changed, 380 insertions(+), 347 deletions(-)

diff --git 
a/examples/royale/JewelExample/src/main/royale/DropDownListPlayGround.mxml 
b/examples/royale/JewelExample/src/main/royale/DropDownListPlayGround.mxml
index 4dbdeac..a0c219b 100644
--- a/examples/royale/JewelExample/src/main/royale/DropDownListPlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/DropDownListPlayGround.mxml
@@ -20,7 +20,8 @@ limitations under the License.
 <j:SectionContent xmlns:fx="http://ns.adobe.com/mxml/2009";
                                xmlns:j="library://ns.apache.org/royale/jewel"
                                xmlns:js="library://ns.apache.org/royale/basic"
-                               
xmlns:html="library://ns.apache.org/royale/html">
+                               xmlns:html="library://ns.apache.org/royale/html"
+                               xmlns:models="models.*">
     
        <fx:Script>
                <![CDATA[      
@@ -42,12 +43,16 @@ limitations under the License.
        <j:beads>
                <js:ContainerDataBinding/>
        </j:beads>
+
+       <j:model>
+        <models:ListsModel id="listModel"/>
+       </j:model>
        
        <j:Card width="350">
                
                <html:H3 text="Jewel DropDownList"/>
                
-               <j:DropDownList dataProvider="{strings}"/>
+               <j:DropDownList dataProvider="{listModel.watchmen}" 
change="changeHandler(event)"/>
 
                <!-- <j:DropDownList change="changeHandler(event)">
                        <j:dataProvider>
diff --git a/examples/royale/JewelExample/src/main/royale/models/ListsModel.as 
b/examples/royale/JewelExample/src/main/royale/models/ListsModel.as
index c25ab93..9f3e468 100644
--- a/examples/royale/JewelExample/src/main/royale/models/ListsModel.as
+++ b/examples/royale/JewelExample/src/main/royale/models/ListsModel.as
@@ -21,21 +21,22 @@ package models
        import vos.IconListVO;
        import org.apache.royale.collections.ArrayList;
 
+       [Bindable]
        public class ListsModel 
        {
                /**
                 * Used in the List example.
                 */
-               private var _watchmen:Array = [
+               private var _watchmen:ArrayList = new ArrayList([
                        "The Comedian", 
                        "Doctor Manhattan", 
                        "Nite Owl",
                        "Ozymandias",
             "Rorschach",
             "Silk Spectre"
-               ];
+               ]);
                
-               public function get watchmen():Array
+               public function get watchmen():ArrayList
                {
                        return _watchmen;
                }
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css 
b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 05c6649..77e4ec2 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -472,10 +472,17 @@ j|DateField {
   touch-action: pan-y;
 }
 
+j|DropDownList {
+  IBeadView: 
ClassReference("org.apache.royale.jewel.beads.views.DropDownListView");
+  IBeadModel: 
ClassReference("org.apache.royale.jewel.beads.models.ArrayListSelectionModel");
+  IDataProviderItemRendererMapper: 
ClassReference("org.apache.royale.jewel.beads.itemRenderers.DataItemRendererFactoryForCollectionView");
+  IItemRendererClassFactory: 
ClassReference("org.apache.royale.core.ItemRendererClassFactory");
+  IItemRenderer: 
ClassReference("org.apache.royale.jewel.itemRenderers.DropDownListItemRenderer");
+}
+
 @media -royale-swf {
   j|DropDownList {
-    IBeadModel: 
ClassReference("org.apache.royale.html.beads.models.ArraySelectionModel");
-    IBeadView: 
ClassReference("org.apache.royale.jewel.beads.views.DropDownListView");
+    IBeadModel: 
ClassReference("org.apache.royale.jewel.beads.models.ArrayListSelectionModel");
     IBeadController: 
ClassReference("org.apache.royale.jewel.beads.controllers.DropDownListController");
     IPopUp: 
ClassReference("org.apache.royale.jewel.supportClasses.dropdownlist.DropDownListList");
   }
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml 
b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index e5691b9..471cd89 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -112,6 +112,7 @@
     <component id="ListItemRenderer" 
class="org.apache.royale.jewel.itemRenderers.ListItemRenderer"/>
     <component id="TableItemRenderer" 
class="org.apache.royale.jewel.itemRenderers.TableItemRenderer"/>
     <component id="DateItemRenderer" 
class="org.apache.royale.jewel.itemRenderers.DateItemRenderer"/>
+    <component id="DropDownListItemRenderer" 
class="org.apache.royale.jewel.itemRenderers.DropDownListItemRenderer"/>
     
     <component id="ScrollingViewport" 
class="org.apache.royale.jewel.supportClasses.scrollbar.ScrollingViewport"/>
 
diff --git a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as 
b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
index bf716a9..d9882ce 100644
--- a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
+++ b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
@@ -50,10 +50,11 @@ package
         import org.apache.royale.jewel.beads.views.TitleBarView; TitleBarView;
         import org.apache.royale.jewel.beads.views.AlertTitleBarView; 
AlertTitleBarView;
         import org.apache.royale.jewel.beads.views.ListView; ListView;
+        import org.apache.royale.jewel.beads.views.DropDownListView; 
DropDownListView;
         import org.apache.royale.jewel.beads.views.DateChooserView; 
DateChooserView;
-        import 
org.apache.royale.jewel.supportClasses.datechooser.DateChooserTable; 
DateChooserTable;
         import org.apache.royale.jewel.beads.views.TableView; TableView;
 
+        import 
org.apache.royale.jewel.supportClasses.datechooser.DateChooserTable; 
DateChooserTable;
         import 
org.apache.royale.jewel.supportClasses.scrollbar.ScrollingViewport; 
ScrollingViewport;
         
         COMPILE::SWF
@@ -66,7 +67,7 @@ package
             import org.apache.royale.jewel.beads.views.RadioButtonView; 
RadioButtonView;
                    import org.apache.royale.jewel.beads.views.CheckBoxView; 
CheckBoxView;
 
-            import org.apache.royale.jewel.beads.views.DropDownListView; 
DropDownListView;
+            // import org.apache.royale.jewel.beads.views.DropDownListView; 
DropDownListView;
             import 
org.apache.royale.jewel.beads.controllers.DropDownListController; 
DropDownListController;
         }
 
diff --git 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropDownList.as
 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropDownList.as
index e529c6e..ff7e499 100644
--- 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropDownList.as
+++ 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropDownList.as
@@ -19,12 +19,16 @@
 package org.apache.royale.jewel
 {
     import org.apache.royale.core.ISelectionModel;
+    import org.apache.royale.core.IDataProviderModel;
+    import org.apache.royale.core.DataContainerBase;
+    import org.apache.royale.core.IListPresentationModel;
+    import org.apache.royale.jewel.beads.models.ListPresentationModel;
+    import org.apache.royale.html.elements.Select;
 
     COMPILE::JS
     {
         import goog.events;
         import org.apache.royale.core.WrappedHTMLElement;
-        import org.apache.royale.html.beads.models.ArraySelectionModel;
         import org.apache.royale.html.util.addElementToWrapper;
     }
 
@@ -62,7 +66,7 @@ package org.apache.royale.jewel
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.3
      */
-       public class DropDownList extends Button
+       public class DropDownList extends DataContainerBase
        {
         /**
          *  Constructor.
@@ -74,28 +78,83 @@ package org.apache.royale.jewel
          */
                public function DropDownList()
                {
+            super();
             typeNames = "jewel dropdownlist";
-
-            COMPILE::JS
-            {
-                model = new ArraySelectionModel();
-            }
                }
 
+        private var _prompt:String = "";
+
         /**
-         *  The data set to be displayed.  Usually a simple
-         *  array of strings.  A more complex component
-         *  would allow more complex data and data sets.
+         *  The prompt for the DropDownList control.
          *
          *  @langversion 3.0
          *  @playerversion Flash 10.2
          *  @playerversion AIR 2.6
-         *  @productversion Royale 0.9.3
-         *  @royaleignorecoercion org.apache.royale.core.ISelectionModel
+         *  @productversion Royale 0.9
          */
+        public function get prompt():String
+        {
+            return _prompt;
+        }
+
+        public function set prompt(value:String):void
+        {
+            _prompt = value;
+        }
+
+        protected var _dropDown:Select;
+
+        public function get dropDown():Select
+        {
+            return _dropDown;
+        }
+
+        public function set dropDown(value:Select):void
+        {
+            _dropDown = value;
+        }
+
+        /**
+                *  The name of field within the data used for display. Each 
item of the
+                *  data should have a property with this name.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion Royale 0.9.3
+                *  @royaleignorecoercion 
org.apache.royale.core.IDataProviderModel
+                */
+               public function get labelField():String
+               {
+                       return IDataProviderModel(model).labelField;
+               }
+               /**
+                * @royaleignorecoercion 
org.apache.royale.core.IDataProviderModel
+                */
+               public function set labelField(value:String):void
+               {
+            IDataProviderModel(model).labelField = value;
+               }
+
+        /**
+                *  The data being display by the List.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion Royale 0.9.3
+                *  @royaleignorecoercion 
org.apache.royale.core.IDataProviderModel
+                */
         public function get dataProvider():Object
         {
-            return ISelectionModel(model).dataProvider;
+            return IDataProviderModel(model).dataProvider;
+        }
+               /**
+                * @royaleignorecoercion 
org.apache.royale.core.IDataProviderModel
+                */
+        public function set dataProvider(value:Object):void
+        {
+            IDataProviderModel(model).dataProvider = value;
         }
 
         /**
@@ -104,41 +163,44 @@ package org.apache.royale.jewel
          *  @royaleignorecoercion HTMLSelectElement
          *  @royaleignorecoercion org.apache.royale.core.ISelectionModel
          */
-        public function set dataProvider(value:Object):void
-        {
-            ISelectionModel(model).dataProvider = value;
-            COMPILE::JS
-            {
-                var dp:HTMLOptionsCollection;
-                var i:int;
-                var n:int;
-                var opt:HTMLOptionElement;
-                var dd:HTMLSelectElement = element as HTMLSelectElement;
-
-                dp = dd.options;
-                n = dp.length;
-                for (i = 0; i < n; i++) {
-                    dd.remove(0);
-                }
-                // The value could be undefined if data binding is used and 
the variable is not initialized.
-                if(!value)return;
+        // public function set dataProvider(value:Object):void
+        // {
+        //     ISelectionModel(model).dataProvider = value;
+        //     COMPILE::JS
+        //     {
+        //         var dp:HTMLOptionsCollection;
+        //         var i:int;
+        //         var n:int;
+        //         var opt:HTMLOptionElement;
+        //         var dd:HTMLSelectElement = element as HTMLSelectElement;
+
+        //         dp = dd.options;
+        //         n = dp.length;
+        //         for (i = 0; i < n; i++) {
+        //             dd.remove(0);
+        //         }
+        //         // The value could be undefined if data binding is used and 
the variable is not initialized.
+        //         if(!value)return;
                 
-                var lf:String = labelField;
-                n = value.length;
-                for (i = 0; i < n; i++) {
-                    opt = document.createElement('option') as 
HTMLOptionElement;
-                    if (lf)
-                        opt.text = value[i][lf];
-                    else
-                        opt.text = value[i];
-                    dd.add(opt, null);
-                }
-
-            }
-        }
+        //         var lf:String = labelField;
+        //         n = value.length;
+        //         for (i = 0; i < n; i++) {
+        //             opt = document.createElement('option') as 
HTMLOptionElement;
+        //             if (lf)
+        //                 opt.text = value[i][lf];
+        //             else
+        //                 opt.text = value[i];
+        //             dd.add(opt, null);
+        //         }
+
+        //     }
+        // }
 
         [Bindable("change")]
         /**
+         *  The index of the currently selected item. Changing this value
+                *  also changes the selectedItem property.
+         *  
          *  @copy org.apache.royale.core.ISelectionModel#selectedIndex
          *
          *  @langversion 3.0
@@ -160,15 +222,17 @@ package org.apache.royale.jewel
         public function set selectedIndex(value:int):void
         {
             ISelectionModel(model).selectedIndex = value;
-            COMPILE::JS
-            {
-                (element as HTMLSelectElement).selectedIndex = 
ISelectionModel(model).selectedIndex;
-            }
+            // COMPILE::JS
+            // {
+            //     (element as HTMLSelectElement).selectedIndex = 
ISelectionModel(model).selectedIndex;
+            // }
         }
 
-
         [Bindable("change")]
         /**
+         *  The item currently selected. Changing this value also
+                *  changes the selectedIndex property.
+         * 
          *  @copy org.apache.royale.core.ISelectionModel#selectedItem
          *
          *  @langversion 3.0
@@ -190,33 +254,31 @@ package org.apache.royale.jewel
         public function set selectedItem(value:Object):void
         {
             ISelectionModel(model).selectedItem = value;
-            COMPILE::JS
-            {
-                (element as HTMLSelectElement).selectedIndex = 
ISelectionModel(model).selectedIndex;
-            }
+            // COMPILE::JS
+            // {
+            //     (element as HTMLSelectElement).selectedIndex = 
ISelectionModel(model).selectedIndex;
+            // }
         }
 
         /**
-         *  The name of field within the data used for display. Each item of 
the
-         *  data should have a property with this name.
-         *
-         *  @langversion 3.0
-         *  @playerversion Flash 10.2
-         *  @playerversion AIR 2.6
-         *  @productversion Royale 0.9.3
-         *  @royaleignorecoercion org.apache.royale.core.ISelectionModel
-         */
-        public function get labelField():String
-        {
-            return ISelectionModel(model).labelField;
-        }
-        /**
-         * @royaleignorecoercion org.apache.royale.core.ISelectionModel
-         */
-        public function set labelField(value:String):void
-        {
-            ISelectionModel(model).labelField = value;
-        }
+                *  The presentation model for the list.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion Royale 0.9.3
+                *  @royaleignorecoercion 
org.apache.royale.core.IListPresentationModel
+                */
+               public function get presentationModel():IListPresentationModel
+               {
+                       var presModel:IListPresentationModel = 
getBeadByType(IListPresentationModel) as IListPresentationModel;
+                       if (presModel == null) {
+                               presModel = new ListPresentationModel();
+                               addBead(presModel);
+                       }
+                       return presModel;
+               }
+        
 
         /**
          * @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
@@ -225,10 +287,11 @@ package org.apache.royale.jewel
         COMPILE::JS
         override protected function createElement():WrappedHTMLElement
         {
-                       addElementToWrapper(this,'select');
+                       addElementToWrapper(this, 'select');
             (element as HTMLSelectElement).size = 1;
-            goog.events.listen(element, 'change',
-                changeHandler);
+            
+            //goog.events.listen(element, 'change', changeHandler);
+            
             positioner = element;
             return element;
         }
@@ -236,10 +299,10 @@ package org.apache.royale.jewel
         /**
          * @royaleignorecoercion HTMLSelectElement
          */
-        COMPILE::JS
-        protected function changeHandler(event:Event):void
-        {
-            model.selectedIndex = (element as HTMLSelectElement).selectedIndex;
-        }
+        // COMPILE::JS
+        // protected function changeHandler(event:Event):void
+        // {
+        //     model.selectedIndex = (element as 
HTMLSelectElement).selectedIndex;
+        // }
     }
 }
diff --git 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DropDownListView.as
 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DropDownListView.as
index 2582856..75fcf47 100644
--- 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DropDownListView.as
+++ 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DropDownListView.as
@@ -18,288 +18,129 @@
 
////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.views
 {
-       import flash.display.DisplayObjectContainer;
-       import flash.display.Graphics;
-       import flash.display.Shape;
-       import flash.display.SimpleButton;
-       import flash.display.Sprite;
-       import flash.text.TextFieldType;
-       
-       import org.apache.royale.core.BeadViewBase;
-       import org.apache.royale.core.CSSTextField;
-       import org.apache.royale.core.IBeadView;
-       import org.apache.royale.core.IChild;
-       import org.apache.royale.core.IPopUpHost;
-       import org.apache.royale.core.ISelectionModel;
-       import org.apache.royale.core.IStrand;
-       import org.apache.royale.core.IUIBase;
-       import org.apache.royale.core.ValuesManager;
-       import org.apache.royale.events.Event;
-       import org.apache.royale.events.IEventDispatcher;
-       import org.apache.royale.utils.SolidBorderUtil;
-       import org.apache.royale.utils.UIUtils;
-    import org.apache.royale.html.beads.IDropDownListView;
-    
+    import org.apache.royale.core.ISelectionModel;
+    import org.apache.royale.core.IStrand;
+    import org.apache.royale.html.elements.Option;
+    import org.apache.royale.html.elements.Select;
+    import org.apache.royale.html.beads.DataContainerView;
+    import org.apache.royale.jewel.DropDownList;
+    import org.apache.royale.events.Event;
+
     /**
-     *  The DropDownListView class is the default view for
-     *  the org.apache.royale.html.DropDownList class.
-     *  It displays a simple text label with what appears to be a
-     *  down arrow button on the right, but really, the entire
-     *  view is the button that will display or dismiss the dropdown.
-     *  
-        *  @viewbead
+     *  The DropDownListView class creates the visual elements of the 
org.apache.royale.jewel.DropDownList
+     *  component. The job of the view bead is to put together the parts of 
the DropDownList such as the Select and Label
+     *
+     *  @viewbead
      *  @langversion 3.0
      *  @playerversion Flash 10.2
      *  @playerversion AIR 2.6
-     *  @productversion Royale 0.9.3
+     *  @productversion Royale 0.8
      */
-       public class DropDownListView extends BeadViewBase implements 
IDropDownListView, IBeadView
-       {
-        /**
-         *  Constructor.
-         *  
-         *  @langversion 3.0
-         *  @playerversion Flash 10.2
-         *  @playerversion AIR 2.6
-         *  @productversion Royale 0.9.3
-         */
-               public function DropDownListView()
-               {
-            upSprite = new Sprite();
-            downSprite = new Sprite();
-            overSprite = new Sprite();
-                       upTextField = new CSSTextField();
-                       downTextField = new CSSTextField();
-                       overTextField = new CSSTextField();
-            upSprite.addChild(upTextField);
-            overSprite.addChild(overTextField);
-            downSprite.addChild(downTextField);
-            upTextField.parentDrawsBackground = true;
-            downTextField.parentDrawsBackground = true;
-            overTextField.parentDrawsBackground = true;
-                       upTextField.selectable = false;
-                       upTextField.type = TextFieldType.DYNAMIC;
-                       downTextField.selectable = false;
-                       downTextField.type = TextFieldType.DYNAMIC;
-                       overTextField.selectable = false;
-            overTextField.type = TextFieldType.DYNAMIC;
-            // auto-size collapses if no text
-                       //upTextField.autoSize = "left";
-                       //downTextField.autoSize = "left";
-                       //overTextField.autoSize = "left";
-
-            upArrows = new Shape();
-            overArrows = new Shape();
-            downArrows = new Shape();
-            upSprite.addChild(upArrows);
-                       overSprite.addChild(overArrows);
-                       downSprite.addChild(downArrows);
-            drawArrows(upArrows);
-            drawArrows(overArrows);
-            drawArrows(downArrows);
-
-               }
+    public class DropDownListView extends DataContainerView
+    {
+        public function DropDownListView()
+        {
+            super();
+        }
 
-        
-               private var selectionModel:ISelectionModel;
-               
-               private var shape:Shape;
-               
         /**
          *  @copy org.apache.royale.core.IBead#strand
-         *  
+         *
+         *  @royaleignorecoercion HTMLLabelElement
+         *
          *  @langversion 3.0
          *  @playerversion Flash 10.2
          *  @playerversion AIR 2.6
-         *  @productversion Royale 0.9.3
+         *  @productversion Royale 0.8
          */
-               override public function set strand(value:IStrand):void
-               {
-                       super.strand = value;
-            selectionModel = value.getBeadByType(ISelectionModel) as 
ISelectionModel;
-            selectionModel.addEventListener("selectedIndexChanged", 
selectionChangeHandler);
-            selectionModel.addEventListener("dataProviderChanged", 
selectionChangeHandler);
-                       shape = new Shape();
-                       shape.graphics.beginFill(0xCCCCCC);
-                       shape.graphics.drawRect(0, 0, 10, 10);
-                       shape.graphics.endFill();
-            upTextField.styleParent = _strand;
-            downTextField.styleParent = _strand;
-            overTextField.styleParent = _strand;
-            var button:SimpleButton = value as SimpleButton;
-                       button.upState = upSprite;
-            button.downState = downSprite;
-            button.overState = overSprite;
-            button.hitTestState = shape;
-                       if (selectionModel.selectedIndex !== -1)
-                               text = selectionModel.selectedItem.toString();
-            else
-                text = "^W_";
-            upTextField.height = upTextField.textHeight + 4;
-            downTextField.height = downTextField.textHeight + 4;
-            overTextField.height = overTextField.textHeight + 4;
-            if (selectionModel.selectedIndex == -1)
-                text = "";
-            
-            IEventDispatcher(value).addEventListener("heightChanged", 
changeHandler);
-            IEventDispatcher(value).addEventListener("widthChanged", 
changeHandler);
-                       changeHandler(null);
-               }
-               
-               private function selectionChangeHandler(event:Event):void
-               {
-            if (selectionModel.selectedItem == null)
-                text = "";
-            else if (selectionModel.labelField != null)
-                text = 
selectionModel.selectedItem[selectionModel.labelField].toString();
-            else
-                text = selectionModel.selectedItem.toString();
-               }
-               
-        private function changeHandler(event:Event):void
+        override public function set strand(value:IStrand):void
         {
-            var ww:Number = IUIBase(_strand).width;
-            var hh:Number = IUIBase(_strand).height;
-            
-            upArrows.x = ww - upArrows.width - 6;            
-            overArrows.x = ww - overArrows.width - 6;            
-            downArrows.x = ww - downArrows.width - 6;
-            upArrows.y = (hh - upArrows.height) / 2;            
-            overArrows.y = (hh - overArrows.height) / 2;            
-            downArrows.y = (hh - downArrows.height) / 2;
+            super.strand = value;
 
-                       upTextField.width = upArrows.x;
-                       downTextField.width = downArrows.x;
-                       overTextField.width = overArrows.x;
-                       upTextField.height = hh;
-                       downTextField.height = hh;
-                       overTextField.height = hh;
-            
-            drawBorder(upSprite, 0xf8f8f8, ww, hh);
-            drawBorder(overSprite, 0xe8e8e8, ww, hh);
-            drawBorder(downSprite, 0xd8d8d8, ww, hh);
-            
-                       shape.graphics.clear();
-                       shape.graphics.beginFill(0xCCCCCC);
-                       shape.graphics.drawRect(0, 0, ww, hh);
-                       shape.graphics.endFill();
+            COMPILE::JS
+            {
+                var dropDownList:DropDownList = (value as DropDownList);
+
+                // dropDownList.labelDisplay = document.createElement('label') 
as HTMLLabelElement;
+                // dropDownList.labelDisplay.innerText = dropDownList.prompt;
+                // 
dropDownList.labelDisplay.classList.add("mdl-textfield__label");
+
+                dropDownList.dropDown = new Select();
+                // dropDownList.dropDown.className = "mdl-textfield__input";
+
+                var emptyOption:Option = new Option();
+                // emptyOption.element.style.display = "none";
+
+                dropDownList.dropDown.addElement(emptyOption);
+                
+                setNameForDropDownList();
+
+                // dropDownList.element.appendChild(dropDownList.labelDisplay);
+                dropDownList.addElement(dropDownList.dropDown);
+            }
         }
-        
-               private var upTextField:CSSTextField;
-               private var downTextField:CSSTextField;
-               private var overTextField:CSSTextField;
-        private var upSprite:Sprite;
-        private var downSprite:Sprite;
-        private var overSprite:Sprite;
-        private var upArrows:Shape;
-        private var downArrows:Shape;
-        private var overArrows:Shape;
-               
-        private function drawBorder(sprite:Sprite, color:uint, ww:Number, 
hh:Number):void
+
+        override protected function dataProviderChangeHandler(event:Event):void
         {
-                       sprite.graphics.clear();
-            SolidBorderUtil.drawBorder(sprite.graphics, 0, 0,
-                ww, hh,
-                0x808080, color, 1, 1, 4);
+            super.dataProviderChangeHandler(event);
+
+            COMPILE::JS
+            {
+                setProgrammaticallyChangedSelection();
+            }
         }
-        
-        private function drawArrows(shape:Shape):void
+
+        override protected function 
itemsCreatedHandler(event:org.apache.royale.events.Event):void
         {
-            var g:Graphics = shape.graphics;
-            g.beginFill(0);
-            g.moveTo(8, 0);
-            g.lineTo(12, 4);
-            g.lineTo(4, 4);
-            g.lineTo(8, 0);
-            g.endFill();
-            g.beginFill(0);
-            g.moveTo(8, 10);
-            g.lineTo(12, 6);
-            g.lineTo(4, 6);
-            g.lineTo(8, 10);
-            g.endFill();
+            super.itemsCreatedHandler(event);
+
+            COMPILE::JS
+            {
+                setProgrammaticallyChangedSelection();
+            }
         }
-            
-       /**
-         *  The text that is displayed in the view.
-         *  
-         *  @langversion 3.0
-         *  @playerversion Flash 10.2
-         *  @playerversion AIR 2.6
-         *  @productversion Royale 0.9.3
-         */
-               public function get text():String
-               {
-                       return upTextField.text;
-               }
-        
-        /**
-         *  @private
-         */
-               public function set text(value:String):void
-               {
-                       upTextField.text = value;
-                       downTextField.text = value;
-                       overTextField.text = value;
-               }
-               
-        private var _popUp:IStrand;
-        
-        /**
-         *  The dropdown/popup that displays the set of choices.
-         *  
-         *  @langversion 3.0
-         *  @playerversion Flash 10.2
-         *  @playerversion AIR 2.6
-         *  @productversion Royale 0.9.3
-         */
-        public function get popUp():IStrand
+
+        private function selectionChangeHandler(event:Event):void
         {
-            if (!_popUp)
+            COMPILE::JS
             {
-                var popUpClass:Class = 
ValuesManager.valuesImpl.getValue(_strand, "iPopUp") as Class;
-                _popUp = new popUpClass() as IStrand;
+                setProgrammaticallyChangedSelection();
             }
-            return _popUp;
         }
-        
-        private var _popUpVisible:Boolean;
-        
-        /**
-         *  A flag that indicates whether the dropdown/popup is
-         *  visible.
-         *  
-         *  @langversion 3.0
-         *  @playerversion Flash 10.2
-         *  @playerversion AIR 2.6
-         *  @productversion Royale 0.9.3
-         */
-        public function get popUpVisible():Boolean
+
+        override protected function handleInitComplete(event:Event):void
         {
-            return _popUpVisible;
+            super.handleInitComplete(event);
+            
+            dataModel.addEventListener("selectedIndexChanged", 
selectionChangeHandler);
+
+            // COMPILE::JS
+            // {
+            //     host.element.classList.add("DropDownList");
+            // }
         }
-        
-        /**
-         *  @private
-         */
-        public function set popUpVisible(value:Boolean):void
+
+        COMPILE::JS
+        private function setNameForDropDownList():void
         {
-            var host:IPopUpHost;
-            if (value != _popUpVisible)
+            var dropDownList:DropDownList = (_strand as DropDownList);
+
+            var name:String = "dropDownList" + Math.random();
+            // dropDownList.labelDisplay.htmlFor = name;
+            dropDownList.dropDown.element.name = name;
+        }
+
+        COMPILE::JS
+        private function setProgrammaticallyChangedSelection():void
+        {
+            var dropDownList:DropDownList = (_strand as DropDownList);
+            var selectedIndex:int = 
dropDownList.dropDown.element["selectedIndex"] - 1;
+            var model:ISelectionModel = dataModel as ISelectionModel;
+
+            if (model.selectedIndex > -1 && model.dataProvider && 
model.selectedIndex != selectedIndex)
             {
-                _popUpVisible = value;
-                if (value)
-                {
-                                       host = UIUtils.findPopUpHost(_strand as 
IUIBase);
-                    IPopUpHost(host).popUpParent.addElement(popUp as IChild);
-                }
-                else
-                {
-                    host = UIUtils.findPopUpHost(_strand as IUIBase);
-                    IPopUpHost(host).popUpParent.removeElement(popUp as 
IChild);
-                }
+                dropDownList.dropDown.element["selectedIndex"] = 
model.selectedIndex + 1;
             }
         }
-        
-       }
+    }
 }
diff --git 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/itemRenderers/DropDownListItemRenderer.as
 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/itemRenderers/DropDownListItemRenderer.as
new file mode 100644
index 0000000..251ffb7
--- /dev/null
+++ 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/itemRenderers/DropDownListItemRenderer.as
@@ -0,0 +1,104 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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.royale.jewel.itemRenderers
+{
+    import org.apache.royale.html.elements.Option;
+    import org.apache.royale.html.supportClasses.MXMLItemRenderer;
+
+    COMPILE::JS
+    {
+        import org.apache.royale.core.WrappedHTMLElement;            
+    }
+       
+    /**
+     *  The DropDownListItemRenderer class creates a DropDownList menu item
+     *
+     *  @langversion 3.0
+     *  @playerversion Flash 10.2
+     *  @playerversion AIR 2.6
+     *  @productversion Royale 0.9.3
+     */    
+       public class DropDownListItemRenderer extends MXMLItemRenderer
+       {
+        /**
+         *  Constructor.
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion Royale 0.9.3
+         */
+               public function DropDownListItemRenderer()
+               {
+                       super();
+
+            //className = ""; //set to empty string avoid 'undefined' output 
when no class selector is assigned by user;
+        }
+
+        private var item:Option;
+
+        /**
+         *  Sets the data value and uses the String version of the data for 
display.
+         *
+         *  @param Object data The object being displayed by the itemRenderer 
instance.
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion Royale 0.9.3
+         */
+        override public function set data(value:Object):void
+        {
+            super.data = value;
+
+            if (labelField)
+            {
+                item.text = String(value[labelField]);
+            }
+            else
+            {
+                item.text = String(value);
+            }
+
+            COMPILE::JS
+            {
+                if (dataField)
+                {
+                    item.element["value"] = String(value[dataField]);
+                }
+                else
+                {
+                    item.element["value"] = String(value);
+                }
+            }
+        }
+
+        /**
+         * @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
+         */
+        COMPILE::JS
+        override protected function createElement():WrappedHTMLElement
+        {
+            item = new Option();
+
+            element = item.element as WrappedHTMLElement;
+            return element;
+        }
+       }
+}
diff --git 
a/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass 
b/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
index 451434f..af06064 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
@@ -20,11 +20,21 @@
 // Jewel DropDownList
 
 // DropDownList variables
+j|DropDownList
+    IBeadView: 
ClassReference("org.apache.royale.jewel.beads.views.DropDownListView")
+    IBeadModel: 
ClassReference("org.apache.royale.jewel.beads.models.ArrayListSelectionModel")
+    IDataProviderItemRendererMapper: 
ClassReference("org.apache.royale.jewel.beads.itemRenderers.DataItemRendererFactoryForCollectionView")
+    IItemRendererClassFactory: 
ClassReference("org.apache.royale.core.ItemRendererClassFactory")
+    IItemRenderer: 
ClassReference("org.apache.royale.jewel.itemRenderers.DropDownListItemRenderer")
+    // IBeadController: 
ClassReference("org.apache.royale.mdl.beads.controllers.DropDownListController")
+
+    // IBeadModel: 
ClassReference("org.apache.royale.mdl.beads.models.DropDownListModel");
+    // IBeadLayout: ClassReference(null);
+    // IDataProviderItemRendererMapper: 
ClassReference("org.apache.royale.html.beads.DataItemRendererFactoryForArrayData");
 
 @media -royale-swf     
     j|DropDownList
-        IBeadModel: 
ClassReference("org.apache.royale.html.beads.models.ArraySelectionModel")
-        IBeadView: 
ClassReference("org.apache.royale.jewel.beads.views.DropDownListView")
+        IBeadModel: 
ClassReference("org.apache.royale.jewel.beads.models.ArrayListSelectionModel")
         IBeadController: 
ClassReference("org.apache.royale.jewel.beads.controllers.DropDownListController")
         IPopUp: 
ClassReference("org.apache.royale.jewel.supportClasses.dropdownlist.DropDownListList")
         // font-size: 11px

Reply via email to