You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by ca...@apache.org on 2016/11/10 09:23:22 UTC

[15/53] git commit: [flex-asjs] [refs/heads/feature/mdl] - - Refactored the directory structure of the example projects to be maven-style

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/DataBindingExample.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/DataBindingExample.as b/examples/flexjs/DataBindingExample_as/src/DataBindingExample.as
deleted file mode 100644
index 95609cd..0000000
--- a/examples/flexjs/DataBindingExample_as/src/DataBindingExample.as
+++ /dev/null
@@ -1,290 +0,0 @@
-/**
-
-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
-{
-
-import org.apache.flex.core.Application;
-import org.apache.flex.core.ItemRendererClassFactory;
-import org.apache.flex.core.SimpleCSSValuesImpl;
-import org.apache.flex.events.Event;
-import org.apache.flex.html.beads.CSSButtonView;
-import org.apache.flex.html.beads.CSSTextButtonView;
-import org.apache.flex.html.beads.CSSTextToggleButtonView;
-import org.apache.flex.html.beads.CheckBoxView;
-import org.apache.flex.html.beads.ContainerView;
-import org.apache.flex.html.beads.DataItemRendererFactoryForArrayData;
-import org.apache.flex.html.beads.DropDownListView;
-import org.apache.flex.html.beads.ListView;
-import org.apache.flex.html.beads.RadioButtonView;
-import org.apache.flex.html.beads.SingleLineBorderBead;
-import org.apache.flex.html.beads.SolidBackgroundBead;
-import org.apache.flex.html.beads.TextAreaView;
-import org.apache.flex.html.beads.TextButtonMeasurementBead;
-import org.apache.flex.html.beads.TextFieldLabelMeasurementBead;
-import org.apache.flex.html.beads.TextFieldView;
-import org.apache.flex.html.beads.TextInputWithBorderView;
-import org.apache.flex.html.beads.TextItemRendererFactoryForArrayData;
-import org.apache.flex.html.beads.controllers.DropDownListController;
-import org.apache.flex.html.beads.controllers.ItemRendererMouseController;
-import org.apache.flex.html.beads.controllers.EditableTextKeyboardController;
-import org.apache.flex.html.beads.controllers.ListSingleSelectionMouseController;
-import org.apache.flex.html.beads.layouts.BasicLayout;
-import org.apache.flex.html.beads.layouts.VerticalLayout;
-import org.apache.flex.html.beads.models.ArraySelectionModel;
-import org.apache.flex.html.beads.models.SingleLineBorderModel;
-import org.apache.flex.html.beads.models.TextModel;
-import org.apache.flex.html.beads.models.ToggleButtonModel;
-import org.apache.flex.html.beads.models.ValueToggleButtonModel;
-import org.apache.flex.html.beads.models.ViewportModel;
-import org.apache.flex.html.supportClasses.ContainerContentArea;
-import org.apache.flex.html.supportClasses.DropDownListList;
-import org.apache.flex.html.supportClasses.DataGroup;
-import org.apache.flex.html.supportClasses.ScrollingViewport;
-import org.apache.flex.html.supportClasses.Viewport;
-import org.apache.flex.html.supportClasses.StringItemRenderer;
-import org.apache.flex.net.HTTPService;
-import org.apache.flex.collections.parsers.JSONInputParser;
-import org.apache.flex.collections.LazyCollection;
-import org.apache.flex.utils.ViewSourceContextMenuOption;
-
-import models.MyModel;
-import controllers.MyController;
-
-public class DataBindingExample extends Application
-{
-    
-    public function DataBindingExample()
-    {
-        addEventListener("initialize", initializeHandler);
-        var vi:SimpleCSSValuesImpl = new SimpleCSSValuesImpl();
-        setupStyles(vi);
-        valuesImpl = vi;
-        initialView = new MyInitialView();
-        model = new MyModel();
-        controller = new MyController(this);
-        service = new HTTPService();
-        collection = new LazyCollection();
-        collection.inputParser = new JSONInputParser();
-        collection.itemConverter = new StockDataJSONItemConverter();
-        service.addBead(collection);
-        addBead(service);
-        addBead(new ViewSourceContextMenuOption());
-    }
-        
-    public var service:HTTPService;
-    public var collection:LazyCollection;
-    
-    private function initializeHandler(event:Event):void
-    {
-        MyModel(model).stockSymbol="ADBE";
-    }
-
-    private function setupStyles(vi:SimpleCSSValuesImpl):void
-    {
-        var viv:Object = vi.values = {};
-        viv["global"] = 
-        {
-            fontFamily: "Arial",
-            fontSize: 12        
-        };
-        
-        var o:Object;
-        
-        o = viv[makeDefinitionName("org.apache.flex.html::Container")] =
-        {
-            
-            iBeadView: ContainerView,
-    		iBeadLayout: BasicLayout,
-    		iContentView: ContainerContentArea,
-			iViewport: Viewport,
-			iViewportModel: ViewportModel
-        };
-        
-        o = viv[makeDefinitionName("org.apache.flex.core::View")] =
-        {
-            
-            iBeadView: ContainerView,
-    		iBeadLayout: BasicLayout,
-    		iContentView: ContainerContentArea,
-			iViewport: Viewport,
-			iViewportModel: ViewportModel
-        };
-		
-        CONFIG::as_only {
-            o.iBackgroundBead = SolidBackgroundBead;
-            o.iBorderBead = SingleLineBorderBead;
-        }
-            
-        viv[makeDefinitionName("org.apache.flex.html::List")] = 
-        {
-            iBeadModel: ArraySelectionModel,
-            iBeadView:  ListView,		
-            iBeadController: ListSingleSelectionMouseController,
-            iBeadLayout: VerticalLayout,
-            iContentView: DataGroup,
-            iDataProviderItemRendererMapper: DataItemRendererFactoryForArrayData,
-			iViewport: ScrollingViewport,
-			iViewportModel: ViewportModel,
-            iItemRendererClassFactory: ItemRendererClassFactory,
-            iItemRenderer: StringItemRenderer
-        };
-        
-        o = viv[makeDefinitionName("org.apache.flex.html::Button")] =
-        {
-            backgroundColor: 0xd8d8d8,
-            border: [1, "solid", 0x000000],
-            padding: 4
-        };
-        CONFIG::as_only {
-            o.iBeadView = CSSButtonView;
-        }
-            
-        viv[makeDefinitionName("org.apache.flex.html::Button:hover")] =
-        {
-            backgroundColor: 0x9fa0a1,
-            border: [1, "solid", 0x000000],
-            padding: 4
-        };
-        
-        viv[makeDefinitionName("org.apache.flex.html::Button:active")] =
-        {
-            backgroundColor: 0x929496,
-            border: [1, "solid", 0x000000],
-            padding: 4
-        };
-        
-        CONFIG::as_only {
-            viv["org.apache.flex.html::CheckBox"] =
-            {
-                iBeadModel: ToggleButtonModel,
-                iBeadView:  CheckBoxView
-            };
-            
-            viv["org.apache.flex.html::DropDownList"] =
-            {
-                iBeadModel: ArraySelectionModel,
-                iBeadView: DropDownListView,
-                iBeadController: DropDownListController,
-                iPopUp: DropDownListList
-            };
-            
-            viv["org.apache.flex.html.supportClasses::DropDownListList"] =
-            {
-                iBeadModel: ArraySelectionModel,
-                iDataProviderItemRendererMapper: TextItemRendererFactoryForArrayData,
-                iItemRendererClassFactory: ItemRendererClassFactory,
-                iItemRenderer: StringItemRenderer,
-			    iBackgroundBead: SolidBackgroundBead,
-				borderStyle: "solid",
-    			borderRadius: 4,
-			    borderColor: 0,
-			    borderWidth: 1,
-			    backgroundColor: 0xFFFFFF
-            };
-            
-            viv["org.apache.flex.html::Label"] =
-            {
-                iBeadModel: TextModel,
-                iBeadView: TextFieldView,
-                iMeasurementBead: TextFieldLabelMeasurementBead
-            };
-    
-            viv["org.apache.flex.html::List"] =
-            {
-                iBorderBead: SingleLineBorderBead,
-                iBorderModel: SingleLineBorderModel
-            };
-    
-            viv["org.apache.flex.html::RadioButton"] =
-            {
-                iBeadModel: ValueToggleButtonModel,
-                iBeadView:  RadioButtonView
-            };
-            
-            viv["org.apache.flex.html::TextArea"] =
-            {
-                iBeadModel: TextModel,
-                iBeadView: TextAreaView,
-                iBeadController: EditableTextKeyboardController,
-                iBorderBead: SingleLineBorderBead,
-                iBorderModel: SingleLineBorderModel,
-			    borderStyle: "solid",
-    			borderColor: 0,
-    			borderWidth: 1,
-    			backgroundColor: 0xFFFFFF
-            };
-            
-            viv["org.apache.flex.html::TextButton"] =
-            {
-                iBeadModel: TextModel,
-                iBeadView: CSSTextButtonView,
-                iMeasurementBead: TextButtonMeasurementBead
-            };
-    
-            viv["org.apache.flex.html::TextInput"] =
-            {
-                iBeadModel: TextModel,
-                iBeadView: TextInputWithBorderView,
-                iBeadController: EditableTextKeyboardController,
-                iBorderBead: SingleLineBorderBead,
-			    iBackgroundBead: SolidBackgroundBead,
-			    borderStyle: "solid",
-    			borderColor: 0,
-    			borderWidth: 1,
-    			backgroundColor: 0xFFFFFF
-            };
-            
-            viv["org.apache.flex.html::ToggleTextButton"] =
-            {
-                iBeadModel: ToggleButtonModel,
-                iBeadView:  CSSTextToggleButtonView
-            };
-    
-            viv["org.apache.flex.html::SimpleList"] =
-            {
-                iBeadModel: ArraySelectionModel,
-                iBeadView:  ListView,
-                iBeadController: ListSingleSelectionMouseController,
-                iBeadLayout: VerticalLayout,
-                iContentView: DataGroup,
-                iDataProviderItemRendererMapper: TextItemRendererFactoryForArrayData,
-	    		iViewport: ScrollingViewport,
-	    		iViewportModel: ViewportModel,
-                iItemRendererClassFactory: ItemRendererClassFactory,
-                iItemRenderer: StringItemRenderer
-            }
-            
-            viv["org.apache.flex.html.supportClasses::StringItemRenderer"] =
-            {
-                iBeadController: ItemRendererMouseController,
-                height: 16
-            }
-        }
-    }
-    
-    private function makeDefinitionName(s:String):String
-    {
-        CONFIG::js_only {
-            s = s.replace("::", ".");
-        }
-        return s;
-    }
-}
-
-}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/MyInitialView.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/MyInitialView.as b/examples/flexjs/DataBindingExample_as/src/MyInitialView.as
deleted file mode 100644
index 135cb61..0000000
--- a/examples/flexjs/DataBindingExample_as/src/MyInitialView.as
+++ /dev/null
@@ -1,282 +0,0 @@
-/**
-
-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 
-{    
-
-//import mx.states.State;
-
-import models.MyModel;
-
-import org.apache.flex.binding.ConstantBinding;
-import org.apache.flex.binding.SimpleBinding;
-import org.apache.flex.core.SimpleCSSValuesImpl;
-import org.apache.flex.core.ValuesManager;
-import org.apache.flex.core.ViewBase;
-import org.apache.flex.events.CustomEvent;
-import org.apache.flex.events.Event;
-import org.apache.flex.html.CheckBox;
-import org.apache.flex.html.Container;
-import org.apache.flex.html.DropDownList;
-import org.apache.flex.html.Label;
-import org.apache.flex.html.RadioButton;
-import org.apache.flex.html.TextArea;
-import org.apache.flex.html.TextButton;
-import org.apache.flex.html.TextInput;
-import org.apache.flex.html.beads.layouts.HorizontalLayout;
-import org.apache.flex.html.beads.layouts.VerticalLayout;
-
-public class MyInitialView extends ViewBase
-{
-
-    public function MyInitialView()
-    {
-        addEventListener("initComplete", initCompleteHandler);
-        /*
-        var statesArray = [];
-        var state:State = new mx.states.State();
-        state.name = "hideAll";
-        statesArray.push(state);
-        state = new mx.states.State();
-        state.name = "showAll";
-        statesArray.push(state);
-        states = statesArray;
-        */
-        var vi:SimpleCSSValuesImpl = ValuesManager.valuesImpl as SimpleCSSValuesImpl;
-        vi.addRule(".output", {
-            "font-size": 20
-        });
-        
-        vi.addRule(".topContainer", {
-            "padding": 10
-        });
-        
-        vi.addRule(".leftSide", {
-            "vertical-align": "top",
-            "margin-right": 10
-        });
-        
-        vi.addRule(".rightSide", {
-            "vertical-align": "top",
-            "margin-left": 10,
-            "padding-left": 10
-        });
-        
-        vi.addRule(".quoteButton", {
-            "margin-top": 10,
-            "margin-bottom": 10
-        });
-        
-    }
-    
-    private function initCompleteHandler(event:Event):void
-    {
-        initControls();
-    }
-			
-	private var _symbol:String;
-	
-    public function get symbol():String
-    {
-        return _symbol;
-    }
-	
-	public function get requestedField():String
-	{
-		return radio1.selectedValue as String;
-	}
-	
-    [Bindable]
-    public var fieldText:String;
-    
-	private function radioChanged(e:org.apache.flex.events.Event):void
-	{
-		dispatchEvent(new CustomEvent("radioClicked"));
-		fieldText = RadioButton(e.target).text;
-	}
-	
-	private function initControls():void
-	{
-		list.selectedItem = MyModel(applicationModel).stockSymbol;
-		radio1.selectedValue = MyModel(applicationModel).requestedField;
-		if (radio1.selected)
-			fieldText = radio1.text;
-		else if (radio2.selected)
-			fieldText = radio2.text;
-		else if (radio3.selected)
-			fieldText = radio3.text;
-		else if (radio4.selected)
-			fieldText = radio4.text;
-		
-	}
-    
-    private function setState():void
-    {
-        currentState = showAllData.selected ? "showAll" : "hideAll";    
-    }
-    
-    override public function get MXMLDescriptor():Array
-    {
-        var c:Container = new Container();
-        c.x = 0;
-        c.y = 0;
-        c.className = "topContainer";
-        c.addBead(new VerticalLayout());
-        addElement(c);
-        var l:Label = new Label();
-        l.width = 300;
-        l.text = "Enter Stock Symbol or choose from list:";
-        c.addElement(l);
-        var c2:Container = new Container();
-        c2.addBead(new HorizontalLayout());
-        c.addElement(c2);
-        var c3:Container = new Container();
-        c3.className = "leftSide";
-        c3.addBead(new VerticalLayout());
-        c2.addElement(c3);
-        symbolTI = new TextInput();
-        var sb:SimpleBinding = new SimpleBinding();
-        sb.sourceID = "applicationModel";
-        sb.sourcePropertyName = "stockSymbol";
-        sb.eventName = "stockSymbolChanged";
-        sb.destination = symbolTI;
-        sb.destinationPropertyName = "text";
-        sb.setDocument(this);
-        addBead(sb);
-        c3.addElement(symbolTI);
-        var tb:TextButton = new TextButton();
-        tb.text = "Get Quote";
-        tb.className = "quoteButton";
-        tb.addEventListener("click", tb_clickHandler);
-        c3.addElement(tb);
-        field = new Label();
-        sb = new SimpleBinding();
-        sb.sourcePropertyName = "fieldText";
-        sb.eventName = "valueChange";
-        sb.destination = field;
-        sb.destinationPropertyName = "text";
-        sb.setDocument(this);
-        addBead(sb);
-        c3.addElement(field);
-        output = new Label();
-        output.className = "output";
-        output.height=24;
-        sb = new SimpleBinding();
-        sb.sourceID = "applicationModel";
-        sb.sourcePropertyName = "responseText";
-        sb.eventName = "responseTextChanged";
-        sb.destination = output;
-        sb.destinationPropertyName = "text";
-        sb.setDocument(this);
-        addBead(sb);
-        c3.addElement(output);
-        c3.childrenAdded();
-        
-        c3 = new Container();
-        c3.className="rightSide";
-        c3.addBead(new VerticalLayout());
-        c2.addElement(c3);
-        list = new DropDownList();
-        list.width=100;
-        list.height=17;
-        var cb:ConstantBinding = new ConstantBinding();
-        cb.sourceID = "applicationModel";
-        cb.sourcePropertyName = "strings";
-        cb.destination = list;
-        cb.destinationPropertyName = "dataProvider";
-        cb.setDocument(this);
-        addBead(cb);
-        list.addEventListener("change", list_changeHandler);
-        c3.addElement(list);
-        radio1 = new RadioButton();
-        radio1.text = "Price";
-        radio1.value = "Ask";
-        radio1.groupName = "group1";
-        radio1.addEventListener("change", radioChanged);
-        c3.addElement(radio1);
-        radio2 = new RadioButton();
-        radio2.text = "Change";
-        radio2.value = "Change";
-        radio2.groupName = "group1";
-        radio2.addEventListener("change", radioChanged);
-        c3.addElement(radio2);
-        radio3 = new RadioButton();
-        radio3.text = "Day's High";
-        radio3.value = "DaysHight";
-        radio3.groupName = "group1";
-        radio3.addEventListener("change", radioChanged);
-        c3.addElement(radio3);
-        radio4 = new RadioButton();
-        radio4.text = "Day's Low";
-        radio4.value = "DaysLow";
-        radio4.groupName = "group1";
-        radio4.addEventListener("change", radioChanged);
-        c3.addElement(radio4);
-        showAllData = new CheckBox();
-        showAllData.text = "Show All Data";
-        showAllData.addEventListener("change", showAllData_changeHandler);
-        c3.addElement(showAllData);
-        c3.childrenAdded();
-        ta = new TextArea();
-        ta.width = 300;
-        ta.height = 100;
-        sb = new SimpleBinding();
-        sb.sourceID = "applicationModel";
-        sb.sourcePropertyName = "allData";
-        sb.eventName = "responseDataChanged";
-        sb.destination = ta;
-        sb.destinationPropertyName = "text";
-        sb.setDocument(this);
-        addBead(sb);
-        c.addElement(ta);
-        c2.childrenAdded();
-        c.childrenAdded();
-        
-        return super.MXMLDescriptor;
-
-    }
-    
-    public var symbolTI:TextInput;
-    public var output:Label;
-    public var field:Label;
-    public var list:DropDownList;
-    public var radio1:RadioButton;
-    public var radio2:RadioButton;
-    public var radio3:RadioButton;
-    public var radio4:RadioButton;
-    public var showAllData:CheckBox;
-    public var ta:TextArea;
-    
-    private function tb_clickHandler(event:Event):void
-    {
-        _symbol = symbolTI.text;
-        dispatchEvent(new CustomEvent('buttonClicked'));
-    }
-    
-    private function list_changeHandler(event:Event):void
-    {
-        _symbol = list.selectedItem as String;
-        dispatchEvent(new CustomEvent('listChanged'));
-    }
-    
-    private function showAllData_changeHandler(event:Event):void
-    {
-        setState();
-    }
-}
-}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/StockDataJSONItemConverter.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/StockDataJSONItemConverter.as b/examples/flexjs/DataBindingExample_as/src/StockDataJSONItemConverter.as
deleted file mode 100644
index a39606b..0000000
--- a/examples/flexjs/DataBindingExample_as/src/StockDataJSONItemConverter.as
+++ /dev/null
@@ -1,40 +0,0 @@
-////////////////////////////////////////////////////////////////////////////////
-//
-//  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
-{
-    import org.apache.flex.collections.converters.JSONItemConverter;
-    
-    public class StockDataJSONItemConverter extends JSONItemConverter
-    {
-        public function StockDataJSONItemConverter()
-        {
-            super();
-        }
-        
-        override public function convertItem(data:String):Object
-        {
-            var obj:Object = super.convertItem(data);
-			if (obj["query"]["count"] == 0)
-				return "No Data";
-			
-			obj = obj["query"]["results"]["quote"];
-			return obj;
-        }
-    }
-}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/controllers/MyController.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/controllers/MyController.as b/examples/flexjs/DataBindingExample_as/src/controllers/MyController.as
deleted file mode 100644
index b7d52bd..0000000
--- a/examples/flexjs/DataBindingExample_as/src/controllers/MyController.as
+++ /dev/null
@@ -1,92 +0,0 @@
-////////////////////////////////////////////////////////////////////////////////
-//
-//  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 controllers
-{
-	import org.apache.flex.events.Event;
-
-	import org.apache.flex.core.Application;
-	import org.apache.flex.core.IDocument;
-	import org.apache.flex.net.HTTPService;
-	import org.apache.flex.collections.LazyCollection;
-
-    import models.MyModel;
-
-	public class MyController implements IDocument
-	{
-		public function MyController(app:Application = null)
-		{
-			if (app)
-			{
-				app.addEventListener("viewChanged", viewChangeHandler);
-			}
-		}
-
-		private var model:MyModel;
-		private var initialView:Object;
-		private var service:HTTPService;
-		private var collection:LazyCollection;
-
-        private var queryBegin:String = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20where%20symbol%20in%20(%22";
-        private var queryEnd:String = "%22)%0A%09%09&env=http%3A%2F%2Fdatatables.org%2Falltables.env&format=json";
-
-		private function viewChangeHandler(event:Event):void
-		{
-			var app:Application = event.target as Application;
-			app.initialView.addEventListener("buttonClicked", buttonClickHandler);
-			app.initialView.addEventListener("radioClicked", radioClickHandler);
-            app.initialView.addEventListener("listChanged", listChangedHandler);
-
-            initialView = app.initialView;
-			model = app.model as MyModel;
-			service = app["service"] as HTTPService;
-			collection = app["collection"] as LazyCollection;
-		}
-
-        private function buttonClickHandler(event:Event):void
-        {
-            var sym:String = MyInitialView(initialView).symbol;
-            service.url = queryBegin + sym + queryEnd;
-            service.send();
-            service.addEventListener("complete", completeHandler);
-        }
-
-		private function radioClickHandler(event:Event):void
-		{
-			var field:String = MyInitialView(initialView).requestedField;
-			model.requestedField = field;
-		}
-
-        private function completeHandler(event:Event):void
-        {
-			model.responseData = collection.getItemAt(0);
-        }
-
-        private function listChangedHandler(event:Event):void
-        {
-            model.stockSymbol = MyInitialView(initialView).symbol;
-        }
-
-		public function setDocument(document:Object, id:String = null):void
-		{
-			var app:Application = document as Application;
-			app.addEventListener("viewChanged", viewChangeHandler);
-		}
-
-	}
-}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/main/flex/DataBindingExample.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/main/flex/DataBindingExample.as b/examples/flexjs/DataBindingExample_as/src/main/flex/DataBindingExample.as
new file mode 100644
index 0000000..95609cd
--- /dev/null
+++ b/examples/flexjs/DataBindingExample_as/src/main/flex/DataBindingExample.as
@@ -0,0 +1,290 @@
+/**
+
+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
+{
+
+import org.apache.flex.core.Application;
+import org.apache.flex.core.ItemRendererClassFactory;
+import org.apache.flex.core.SimpleCSSValuesImpl;
+import org.apache.flex.events.Event;
+import org.apache.flex.html.beads.CSSButtonView;
+import org.apache.flex.html.beads.CSSTextButtonView;
+import org.apache.flex.html.beads.CSSTextToggleButtonView;
+import org.apache.flex.html.beads.CheckBoxView;
+import org.apache.flex.html.beads.ContainerView;
+import org.apache.flex.html.beads.DataItemRendererFactoryForArrayData;
+import org.apache.flex.html.beads.DropDownListView;
+import org.apache.flex.html.beads.ListView;
+import org.apache.flex.html.beads.RadioButtonView;
+import org.apache.flex.html.beads.SingleLineBorderBead;
+import org.apache.flex.html.beads.SolidBackgroundBead;
+import org.apache.flex.html.beads.TextAreaView;
+import org.apache.flex.html.beads.TextButtonMeasurementBead;
+import org.apache.flex.html.beads.TextFieldLabelMeasurementBead;
+import org.apache.flex.html.beads.TextFieldView;
+import org.apache.flex.html.beads.TextInputWithBorderView;
+import org.apache.flex.html.beads.TextItemRendererFactoryForArrayData;
+import org.apache.flex.html.beads.controllers.DropDownListController;
+import org.apache.flex.html.beads.controllers.ItemRendererMouseController;
+import org.apache.flex.html.beads.controllers.EditableTextKeyboardController;
+import org.apache.flex.html.beads.controllers.ListSingleSelectionMouseController;
+import org.apache.flex.html.beads.layouts.BasicLayout;
+import org.apache.flex.html.beads.layouts.VerticalLayout;
+import org.apache.flex.html.beads.models.ArraySelectionModel;
+import org.apache.flex.html.beads.models.SingleLineBorderModel;
+import org.apache.flex.html.beads.models.TextModel;
+import org.apache.flex.html.beads.models.ToggleButtonModel;
+import org.apache.flex.html.beads.models.ValueToggleButtonModel;
+import org.apache.flex.html.beads.models.ViewportModel;
+import org.apache.flex.html.supportClasses.ContainerContentArea;
+import org.apache.flex.html.supportClasses.DropDownListList;
+import org.apache.flex.html.supportClasses.DataGroup;
+import org.apache.flex.html.supportClasses.ScrollingViewport;
+import org.apache.flex.html.supportClasses.Viewport;
+import org.apache.flex.html.supportClasses.StringItemRenderer;
+import org.apache.flex.net.HTTPService;
+import org.apache.flex.collections.parsers.JSONInputParser;
+import org.apache.flex.collections.LazyCollection;
+import org.apache.flex.utils.ViewSourceContextMenuOption;
+
+import models.MyModel;
+import controllers.MyController;
+
+public class DataBindingExample extends Application
+{
+    
+    public function DataBindingExample()
+    {
+        addEventListener("initialize", initializeHandler);
+        var vi:SimpleCSSValuesImpl = new SimpleCSSValuesImpl();
+        setupStyles(vi);
+        valuesImpl = vi;
+        initialView = new MyInitialView();
+        model = new MyModel();
+        controller = new MyController(this);
+        service = new HTTPService();
+        collection = new LazyCollection();
+        collection.inputParser = new JSONInputParser();
+        collection.itemConverter = new StockDataJSONItemConverter();
+        service.addBead(collection);
+        addBead(service);
+        addBead(new ViewSourceContextMenuOption());
+    }
+        
+    public var service:HTTPService;
+    public var collection:LazyCollection;
+    
+    private function initializeHandler(event:Event):void
+    {
+        MyModel(model).stockSymbol="ADBE";
+    }
+
+    private function setupStyles(vi:SimpleCSSValuesImpl):void
+    {
+        var viv:Object = vi.values = {};
+        viv["global"] = 
+        {
+            fontFamily: "Arial",
+            fontSize: 12        
+        };
+        
+        var o:Object;
+        
+        o = viv[makeDefinitionName("org.apache.flex.html::Container")] =
+        {
+            
+            iBeadView: ContainerView,
+    		iBeadLayout: BasicLayout,
+    		iContentView: ContainerContentArea,
+			iViewport: Viewport,
+			iViewportModel: ViewportModel
+        };
+        
+        o = viv[makeDefinitionName("org.apache.flex.core::View")] =
+        {
+            
+            iBeadView: ContainerView,
+    		iBeadLayout: BasicLayout,
+    		iContentView: ContainerContentArea,
+			iViewport: Viewport,
+			iViewportModel: ViewportModel
+        };
+		
+        CONFIG::as_only {
+            o.iBackgroundBead = SolidBackgroundBead;
+            o.iBorderBead = SingleLineBorderBead;
+        }
+            
+        viv[makeDefinitionName("org.apache.flex.html::List")] = 
+        {
+            iBeadModel: ArraySelectionModel,
+            iBeadView:  ListView,		
+            iBeadController: ListSingleSelectionMouseController,
+            iBeadLayout: VerticalLayout,
+            iContentView: DataGroup,
+            iDataProviderItemRendererMapper: DataItemRendererFactoryForArrayData,
+			iViewport: ScrollingViewport,
+			iViewportModel: ViewportModel,
+            iItemRendererClassFactory: ItemRendererClassFactory,
+            iItemRenderer: StringItemRenderer
+        };
+        
+        o = viv[makeDefinitionName("org.apache.flex.html::Button")] =
+        {
+            backgroundColor: 0xd8d8d8,
+            border: [1, "solid", 0x000000],
+            padding: 4
+        };
+        CONFIG::as_only {
+            o.iBeadView = CSSButtonView;
+        }
+            
+        viv[makeDefinitionName("org.apache.flex.html::Button:hover")] =
+        {
+            backgroundColor: 0x9fa0a1,
+            border: [1, "solid", 0x000000],
+            padding: 4
+        };
+        
+        viv[makeDefinitionName("org.apache.flex.html::Button:active")] =
+        {
+            backgroundColor: 0x929496,
+            border: [1, "solid", 0x000000],
+            padding: 4
+        };
+        
+        CONFIG::as_only {
+            viv["org.apache.flex.html::CheckBox"] =
+            {
+                iBeadModel: ToggleButtonModel,
+                iBeadView:  CheckBoxView
+            };
+            
+            viv["org.apache.flex.html::DropDownList"] =
+            {
+                iBeadModel: ArraySelectionModel,
+                iBeadView: DropDownListView,
+                iBeadController: DropDownListController,
+                iPopUp: DropDownListList
+            };
+            
+            viv["org.apache.flex.html.supportClasses::DropDownListList"] =
+            {
+                iBeadModel: ArraySelectionModel,
+                iDataProviderItemRendererMapper: TextItemRendererFactoryForArrayData,
+                iItemRendererClassFactory: ItemRendererClassFactory,
+                iItemRenderer: StringItemRenderer,
+			    iBackgroundBead: SolidBackgroundBead,
+				borderStyle: "solid",
+    			borderRadius: 4,
+			    borderColor: 0,
+			    borderWidth: 1,
+			    backgroundColor: 0xFFFFFF
+            };
+            
+            viv["org.apache.flex.html::Label"] =
+            {
+                iBeadModel: TextModel,
+                iBeadView: TextFieldView,
+                iMeasurementBead: TextFieldLabelMeasurementBead
+            };
+    
+            viv["org.apache.flex.html::List"] =
+            {
+                iBorderBead: SingleLineBorderBead,
+                iBorderModel: SingleLineBorderModel
+            };
+    
+            viv["org.apache.flex.html::RadioButton"] =
+            {
+                iBeadModel: ValueToggleButtonModel,
+                iBeadView:  RadioButtonView
+            };
+            
+            viv["org.apache.flex.html::TextArea"] =
+            {
+                iBeadModel: TextModel,
+                iBeadView: TextAreaView,
+                iBeadController: EditableTextKeyboardController,
+                iBorderBead: SingleLineBorderBead,
+                iBorderModel: SingleLineBorderModel,
+			    borderStyle: "solid",
+    			borderColor: 0,
+    			borderWidth: 1,
+    			backgroundColor: 0xFFFFFF
+            };
+            
+            viv["org.apache.flex.html::TextButton"] =
+            {
+                iBeadModel: TextModel,
+                iBeadView: CSSTextButtonView,
+                iMeasurementBead: TextButtonMeasurementBead
+            };
+    
+            viv["org.apache.flex.html::TextInput"] =
+            {
+                iBeadModel: TextModel,
+                iBeadView: TextInputWithBorderView,
+                iBeadController: EditableTextKeyboardController,
+                iBorderBead: SingleLineBorderBead,
+			    iBackgroundBead: SolidBackgroundBead,
+			    borderStyle: "solid",
+    			borderColor: 0,
+    			borderWidth: 1,
+    			backgroundColor: 0xFFFFFF
+            };
+            
+            viv["org.apache.flex.html::ToggleTextButton"] =
+            {
+                iBeadModel: ToggleButtonModel,
+                iBeadView:  CSSTextToggleButtonView
+            };
+    
+            viv["org.apache.flex.html::SimpleList"] =
+            {
+                iBeadModel: ArraySelectionModel,
+                iBeadView:  ListView,
+                iBeadController: ListSingleSelectionMouseController,
+                iBeadLayout: VerticalLayout,
+                iContentView: DataGroup,
+                iDataProviderItemRendererMapper: TextItemRendererFactoryForArrayData,
+	    		iViewport: ScrollingViewport,
+	    		iViewportModel: ViewportModel,
+                iItemRendererClassFactory: ItemRendererClassFactory,
+                iItemRenderer: StringItemRenderer
+            }
+            
+            viv["org.apache.flex.html.supportClasses::StringItemRenderer"] =
+            {
+                iBeadController: ItemRendererMouseController,
+                height: 16
+            }
+        }
+    }
+    
+    private function makeDefinitionName(s:String):String
+    {
+        CONFIG::js_only {
+            s = s.replace("::", ".");
+        }
+        return s;
+    }
+}
+
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/main/flex/MyInitialView.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/main/flex/MyInitialView.as b/examples/flexjs/DataBindingExample_as/src/main/flex/MyInitialView.as
new file mode 100644
index 0000000..135cb61
--- /dev/null
+++ b/examples/flexjs/DataBindingExample_as/src/main/flex/MyInitialView.as
@@ -0,0 +1,282 @@
+/**
+
+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 
+{    
+
+//import mx.states.State;
+
+import models.MyModel;
+
+import org.apache.flex.binding.ConstantBinding;
+import org.apache.flex.binding.SimpleBinding;
+import org.apache.flex.core.SimpleCSSValuesImpl;
+import org.apache.flex.core.ValuesManager;
+import org.apache.flex.core.ViewBase;
+import org.apache.flex.events.CustomEvent;
+import org.apache.flex.events.Event;
+import org.apache.flex.html.CheckBox;
+import org.apache.flex.html.Container;
+import org.apache.flex.html.DropDownList;
+import org.apache.flex.html.Label;
+import org.apache.flex.html.RadioButton;
+import org.apache.flex.html.TextArea;
+import org.apache.flex.html.TextButton;
+import org.apache.flex.html.TextInput;
+import org.apache.flex.html.beads.layouts.HorizontalLayout;
+import org.apache.flex.html.beads.layouts.VerticalLayout;
+
+public class MyInitialView extends ViewBase
+{
+
+    public function MyInitialView()
+    {
+        addEventListener("initComplete", initCompleteHandler);
+        /*
+        var statesArray = [];
+        var state:State = new mx.states.State();
+        state.name = "hideAll";
+        statesArray.push(state);
+        state = new mx.states.State();
+        state.name = "showAll";
+        statesArray.push(state);
+        states = statesArray;
+        */
+        var vi:SimpleCSSValuesImpl = ValuesManager.valuesImpl as SimpleCSSValuesImpl;
+        vi.addRule(".output", {
+            "font-size": 20
+        });
+        
+        vi.addRule(".topContainer", {
+            "padding": 10
+        });
+        
+        vi.addRule(".leftSide", {
+            "vertical-align": "top",
+            "margin-right": 10
+        });
+        
+        vi.addRule(".rightSide", {
+            "vertical-align": "top",
+            "margin-left": 10,
+            "padding-left": 10
+        });
+        
+        vi.addRule(".quoteButton", {
+            "margin-top": 10,
+            "margin-bottom": 10
+        });
+        
+    }
+    
+    private function initCompleteHandler(event:Event):void
+    {
+        initControls();
+    }
+			
+	private var _symbol:String;
+	
+    public function get symbol():String
+    {
+        return _symbol;
+    }
+	
+	public function get requestedField():String
+	{
+		return radio1.selectedValue as String;
+	}
+	
+    [Bindable]
+    public var fieldText:String;
+    
+	private function radioChanged(e:org.apache.flex.events.Event):void
+	{
+		dispatchEvent(new CustomEvent("radioClicked"));
+		fieldText = RadioButton(e.target).text;
+	}
+	
+	private function initControls():void
+	{
+		list.selectedItem = MyModel(applicationModel).stockSymbol;
+		radio1.selectedValue = MyModel(applicationModel).requestedField;
+		if (radio1.selected)
+			fieldText = radio1.text;
+		else if (radio2.selected)
+			fieldText = radio2.text;
+		else if (radio3.selected)
+			fieldText = radio3.text;
+		else if (radio4.selected)
+			fieldText = radio4.text;
+		
+	}
+    
+    private function setState():void
+    {
+        currentState = showAllData.selected ? "showAll" : "hideAll";    
+    }
+    
+    override public function get MXMLDescriptor():Array
+    {
+        var c:Container = new Container();
+        c.x = 0;
+        c.y = 0;
+        c.className = "topContainer";
+        c.addBead(new VerticalLayout());
+        addElement(c);
+        var l:Label = new Label();
+        l.width = 300;
+        l.text = "Enter Stock Symbol or choose from list:";
+        c.addElement(l);
+        var c2:Container = new Container();
+        c2.addBead(new HorizontalLayout());
+        c.addElement(c2);
+        var c3:Container = new Container();
+        c3.className = "leftSide";
+        c3.addBead(new VerticalLayout());
+        c2.addElement(c3);
+        symbolTI = new TextInput();
+        var sb:SimpleBinding = new SimpleBinding();
+        sb.sourceID = "applicationModel";
+        sb.sourcePropertyName = "stockSymbol";
+        sb.eventName = "stockSymbolChanged";
+        sb.destination = symbolTI;
+        sb.destinationPropertyName = "text";
+        sb.setDocument(this);
+        addBead(sb);
+        c3.addElement(symbolTI);
+        var tb:TextButton = new TextButton();
+        tb.text = "Get Quote";
+        tb.className = "quoteButton";
+        tb.addEventListener("click", tb_clickHandler);
+        c3.addElement(tb);
+        field = new Label();
+        sb = new SimpleBinding();
+        sb.sourcePropertyName = "fieldText";
+        sb.eventName = "valueChange";
+        sb.destination = field;
+        sb.destinationPropertyName = "text";
+        sb.setDocument(this);
+        addBead(sb);
+        c3.addElement(field);
+        output = new Label();
+        output.className = "output";
+        output.height=24;
+        sb = new SimpleBinding();
+        sb.sourceID = "applicationModel";
+        sb.sourcePropertyName = "responseText";
+        sb.eventName = "responseTextChanged";
+        sb.destination = output;
+        sb.destinationPropertyName = "text";
+        sb.setDocument(this);
+        addBead(sb);
+        c3.addElement(output);
+        c3.childrenAdded();
+        
+        c3 = new Container();
+        c3.className="rightSide";
+        c3.addBead(new VerticalLayout());
+        c2.addElement(c3);
+        list = new DropDownList();
+        list.width=100;
+        list.height=17;
+        var cb:ConstantBinding = new ConstantBinding();
+        cb.sourceID = "applicationModel";
+        cb.sourcePropertyName = "strings";
+        cb.destination = list;
+        cb.destinationPropertyName = "dataProvider";
+        cb.setDocument(this);
+        addBead(cb);
+        list.addEventListener("change", list_changeHandler);
+        c3.addElement(list);
+        radio1 = new RadioButton();
+        radio1.text = "Price";
+        radio1.value = "Ask";
+        radio1.groupName = "group1";
+        radio1.addEventListener("change", radioChanged);
+        c3.addElement(radio1);
+        radio2 = new RadioButton();
+        radio2.text = "Change";
+        radio2.value = "Change";
+        radio2.groupName = "group1";
+        radio2.addEventListener("change", radioChanged);
+        c3.addElement(radio2);
+        radio3 = new RadioButton();
+        radio3.text = "Day's High";
+        radio3.value = "DaysHight";
+        radio3.groupName = "group1";
+        radio3.addEventListener("change", radioChanged);
+        c3.addElement(radio3);
+        radio4 = new RadioButton();
+        radio4.text = "Day's Low";
+        radio4.value = "DaysLow";
+        radio4.groupName = "group1";
+        radio4.addEventListener("change", radioChanged);
+        c3.addElement(radio4);
+        showAllData = new CheckBox();
+        showAllData.text = "Show All Data";
+        showAllData.addEventListener("change", showAllData_changeHandler);
+        c3.addElement(showAllData);
+        c3.childrenAdded();
+        ta = new TextArea();
+        ta.width = 300;
+        ta.height = 100;
+        sb = new SimpleBinding();
+        sb.sourceID = "applicationModel";
+        sb.sourcePropertyName = "allData";
+        sb.eventName = "responseDataChanged";
+        sb.destination = ta;
+        sb.destinationPropertyName = "text";
+        sb.setDocument(this);
+        addBead(sb);
+        c.addElement(ta);
+        c2.childrenAdded();
+        c.childrenAdded();
+        
+        return super.MXMLDescriptor;
+
+    }
+    
+    public var symbolTI:TextInput;
+    public var output:Label;
+    public var field:Label;
+    public var list:DropDownList;
+    public var radio1:RadioButton;
+    public var radio2:RadioButton;
+    public var radio3:RadioButton;
+    public var radio4:RadioButton;
+    public var showAllData:CheckBox;
+    public var ta:TextArea;
+    
+    private function tb_clickHandler(event:Event):void
+    {
+        _symbol = symbolTI.text;
+        dispatchEvent(new CustomEvent('buttonClicked'));
+    }
+    
+    private function list_changeHandler(event:Event):void
+    {
+        _symbol = list.selectedItem as String;
+        dispatchEvent(new CustomEvent('listChanged'));
+    }
+    
+    private function showAllData_changeHandler(event:Event):void
+    {
+        setState();
+    }
+}
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/main/flex/StockDataJSONItemConverter.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/main/flex/StockDataJSONItemConverter.as b/examples/flexjs/DataBindingExample_as/src/main/flex/StockDataJSONItemConverter.as
new file mode 100644
index 0000000..a39606b
--- /dev/null
+++ b/examples/flexjs/DataBindingExample_as/src/main/flex/StockDataJSONItemConverter.as
@@ -0,0 +1,40 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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
+{
+    import org.apache.flex.collections.converters.JSONItemConverter;
+    
+    public class StockDataJSONItemConverter extends JSONItemConverter
+    {
+        public function StockDataJSONItemConverter()
+        {
+            super();
+        }
+        
+        override public function convertItem(data:String):Object
+        {
+            var obj:Object = super.convertItem(data);
+			if (obj["query"]["count"] == 0)
+				return "No Data";
+			
+			obj = obj["query"]["results"]["quote"];
+			return obj;
+        }
+    }
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/main/flex/controllers/MyController.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/main/flex/controllers/MyController.as b/examples/flexjs/DataBindingExample_as/src/main/flex/controllers/MyController.as
new file mode 100644
index 0000000..b7d52bd
--- /dev/null
+++ b/examples/flexjs/DataBindingExample_as/src/main/flex/controllers/MyController.as
@@ -0,0 +1,92 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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 controllers
+{
+	import org.apache.flex.events.Event;
+
+	import org.apache.flex.core.Application;
+	import org.apache.flex.core.IDocument;
+	import org.apache.flex.net.HTTPService;
+	import org.apache.flex.collections.LazyCollection;
+
+    import models.MyModel;
+
+	public class MyController implements IDocument
+	{
+		public function MyController(app:Application = null)
+		{
+			if (app)
+			{
+				app.addEventListener("viewChanged", viewChangeHandler);
+			}
+		}
+
+		private var model:MyModel;
+		private var initialView:Object;
+		private var service:HTTPService;
+		private var collection:LazyCollection;
+
+        private var queryBegin:String = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20where%20symbol%20in%20(%22";
+        private var queryEnd:String = "%22)%0A%09%09&env=http%3A%2F%2Fdatatables.org%2Falltables.env&format=json";
+
+		private function viewChangeHandler(event:Event):void
+		{
+			var app:Application = event.target as Application;
+			app.initialView.addEventListener("buttonClicked", buttonClickHandler);
+			app.initialView.addEventListener("radioClicked", radioClickHandler);
+            app.initialView.addEventListener("listChanged", listChangedHandler);
+
+            initialView = app.initialView;
+			model = app.model as MyModel;
+			service = app["service"] as HTTPService;
+			collection = app["collection"] as LazyCollection;
+		}
+
+        private function buttonClickHandler(event:Event):void
+        {
+            var sym:String = MyInitialView(initialView).symbol;
+            service.url = queryBegin + sym + queryEnd;
+            service.send();
+            service.addEventListener("complete", completeHandler);
+        }
+
+		private function radioClickHandler(event:Event):void
+		{
+			var field:String = MyInitialView(initialView).requestedField;
+			model.requestedField = field;
+		}
+
+        private function completeHandler(event:Event):void
+        {
+			model.responseData = collection.getItemAt(0);
+        }
+
+        private function listChangedHandler(event:Event):void
+        {
+            model.stockSymbol = MyInitialView(initialView).symbol;
+        }
+
+		public function setDocument(document:Object, id:String = null):void
+		{
+			var app:Application = document as Application;
+			app.addEventListener("viewChanged", viewChangeHandler);
+		}
+
+	}
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/main/flex/models/MyModel.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/main/flex/models/MyModel.as b/examples/flexjs/DataBindingExample_as/src/main/flex/models/MyModel.as
new file mode 100644
index 0000000..4a17f22
--- /dev/null
+++ b/examples/flexjs/DataBindingExample_as/src/main/flex/models/MyModel.as
@@ -0,0 +1,127 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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 models
+{
+	import org.apache.flex.events.Event;
+	import org.apache.flex.events.EventDispatcher;
+	
+	public class MyModel extends EventDispatcher
+	{
+		public function MyModel()
+		{
+		}
+		
+		private var _requestedField:String = "Ask";
+		
+		[Bindable("requestedFieldChanged")]
+		public function get requestedField():String
+		{
+			return _requestedField;
+		}
+		
+		public function set requestedField(value:String):void
+		{
+			if (value != _requestedField)
+			{
+				_requestedField = value;
+				dispatchEvent(new Event("requestedFieldChanged"));
+				if (_responseData)
+					dispatchEvent(new Event("responseTextChanged"));
+			}
+		}
+		
+		private var _responseText:String;
+		
+		[Bindable("responseTextChanged")]
+		public function get responseText():String
+		{
+			if (_responseData == null)
+				return "";
+			if (_responseData == "No Data")
+				return _responseData as String;
+			var s:String = _responseData[_requestedField];
+			if (s == null)
+			{
+				if (_requestedField == "Ask")
+					s = _responseData["Bid"];
+			}
+			return s;
+		}
+		
+		private var _responseData:Object;
+		
+		[Bindable("responseDataChanged")]
+		public function get responseData():Object
+		{
+			return _responseData;
+		}
+		
+		public function set responseData(value:Object):void
+		{
+			if (value != _responseData)
+			{
+				_responseData = value;
+				_allData = "";
+				dispatchEvent(new Event("responseDataChanged"));
+				dispatchEvent(new Event("responseTextChanged"));
+			}
+		}
+		
+		private var _allData:String = "";
+		
+		[Bindable("responseDataChanged")]
+		public function get allData():String
+		{
+			if (_allData == "" && _responseData != null)
+			{
+				for (var p:String in _responseData)
+				{
+					_allData += p + ": " + _responseData[p] + "\n";
+				}
+			}
+			return _allData;
+		}
+		
+		
+		private var _stockSymbol:String;
+		
+		[Bindable("stockSymbolChanged")]
+		public function get stockSymbol():String
+		{
+			return _stockSymbol;
+		}
+		
+		public function set stockSymbol(value:String):void
+		{
+			if (value != _stockSymbol)
+			{
+				_stockSymbol = value;
+				dispatchEvent(new Event("stockSymbolChanged"));
+			}
+		}
+
+        private var _strings:Array = ["AAPL", "ADBE", "GOOG", "MSFT", "YHOO"];
+        [Bindable("__NoChangeEvent__")]
+        public function get strings():Array
+        {
+            return _strings;
+        }
+
+	}
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataBindingExample_as/src/models/MyModel.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataBindingExample_as/src/models/MyModel.as b/examples/flexjs/DataBindingExample_as/src/models/MyModel.as
deleted file mode 100644
index 4a17f22..0000000
--- a/examples/flexjs/DataBindingExample_as/src/models/MyModel.as
+++ /dev/null
@@ -1,127 +0,0 @@
-////////////////////////////////////////////////////////////////////////////////
-//
-//  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 models
-{
-	import org.apache.flex.events.Event;
-	import org.apache.flex.events.EventDispatcher;
-	
-	public class MyModel extends EventDispatcher
-	{
-		public function MyModel()
-		{
-		}
-		
-		private var _requestedField:String = "Ask";
-		
-		[Bindable("requestedFieldChanged")]
-		public function get requestedField():String
-		{
-			return _requestedField;
-		}
-		
-		public function set requestedField(value:String):void
-		{
-			if (value != _requestedField)
-			{
-				_requestedField = value;
-				dispatchEvent(new Event("requestedFieldChanged"));
-				if (_responseData)
-					dispatchEvent(new Event("responseTextChanged"));
-			}
-		}
-		
-		private var _responseText:String;
-		
-		[Bindable("responseTextChanged")]
-		public function get responseText():String
-		{
-			if (_responseData == null)
-				return "";
-			if (_responseData == "No Data")
-				return _responseData as String;
-			var s:String = _responseData[_requestedField];
-			if (s == null)
-			{
-				if (_requestedField == "Ask")
-					s = _responseData["Bid"];
-			}
-			return s;
-		}
-		
-		private var _responseData:Object;
-		
-		[Bindable("responseDataChanged")]
-		public function get responseData():Object
-		{
-			return _responseData;
-		}
-		
-		public function set responseData(value:Object):void
-		{
-			if (value != _responseData)
-			{
-				_responseData = value;
-				_allData = "";
-				dispatchEvent(new Event("responseDataChanged"));
-				dispatchEvent(new Event("responseTextChanged"));
-			}
-		}
-		
-		private var _allData:String = "";
-		
-		[Bindable("responseDataChanged")]
-		public function get allData():String
-		{
-			if (_allData == "" && _responseData != null)
-			{
-				for (var p:String in _responseData)
-				{
-					_allData += p + ": " + _responseData[p] + "\n";
-				}
-			}
-			return _allData;
-		}
-		
-		
-		private var _stockSymbol:String;
-		
-		[Bindable("stockSymbolChanged")]
-		public function get stockSymbol():String
-		{
-			return _stockSymbol;
-		}
-		
-		public function set stockSymbol(value:String):void
-		{
-			if (value != _stockSymbol)
-			{
-				_stockSymbol = value;
-				dispatchEvent(new Event("stockSymbolChanged"));
-			}
-		}
-
-        private var _strings:Array = ["AAPL", "ADBE", "GOOG", "MSFT", "YHOO"];
-        [Bindable("__NoChangeEvent__")]
-        public function get strings():Array
-        {
-            return _strings;
-        }
-
-	}
-}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/DataGridExample.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/DataGridExample.mxml b/examples/flexjs/DataGridExample/src/DataGridExample.mxml
deleted file mode 100644
index 41989f8..0000000
--- a/examples/flexjs/DataGridExample/src/DataGridExample.mxml
+++ /dev/null
@@ -1,36 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!---
-//
-//  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.
-//
-////////////////////////////////////////////////////////////////////////////////
--->
-<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
-				   xmlns:local="*"
-				   xmlns:models="models.*"
-				   xmlns:js="library://ns.apache.org/flexjs/basic" 
-				   >
-	
-	<js:valuesImpl>
-		<js:SimpleCSSValuesImpl />
-	</js:valuesImpl>
-	<js:model>
-		<models:ProductsModel />
-	</js:model>
-	<js:initialView>
-		<local:MyInitialView />
-	</js:initialView>
-</js:Application>

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/MyInitialView.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/MyInitialView.mxml b/examples/flexjs/DataGridExample/src/MyInitialView.mxml
deleted file mode 100644
index 2f543e5..0000000
--- a/examples/flexjs/DataGridExample/src/MyInitialView.mxml
+++ /dev/null
@@ -1,68 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
-
-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.
-
--->
-<js:View xmlns:fx="http://ns.adobe.com/mxml/2009"
-				xmlns:js="library://ns.apache.org/flexjs/basic">
-    <fx:Script>
-        <![CDATA[
-		 private function dataGridChange() : void
-		 {
-			 output.text = "Clicked on row "+dataGrid.selectedIndex;
-			 trace("Click on row "+dataGrid.selectedIndex);
-		 }
-		]]>
-    </fx:Script>
-	
-	<js:Label id="output" x="450" y="30" width="100" />
-		
-	<js:DataGrid id="dataGrid" x="20" y="30" width="400" height="300" change="dataGridChange()" rowHeight="30">
-		<js:beads>
-			<js:DataGridPercentageLayout />
-			<js:ConstantBinding
-				sourceID="applicationModel"
-				sourcePropertyName="productList"
-				destinationPropertyName="dataProvider" />
-		</js:beads>
-		<js:columns>
-			<js:DataGridColumn label="Image" dataField="image" columnWidth="25" itemRenderer="products.ProductItemRenderer" />
-			<js:DataGridColumn label="Title" dataField="title" columnWidth="50" />
-			<js:DataGridColumn label="Sales" dataField="sales" columnWidth="25" />
-		</js:columns>
-	</js:DataGrid>
-		
-	<js:DataGrid id="dataGrid2" x="20" y="400" width="400" height="300" change="dataGridChange()" rowHeight="40">
-		<js:beads>
-		    <js:DataGridLinesBead>
-		       <js:stroke>
-		           <js:SolidColorStroke color="#FF8800" weight="2" />
-		       </js:stroke>
-		    </js:DataGridLinesBead>
-			<js:ConstantBinding
-				sourceID="applicationModel"
-				sourcePropertyName="productList"
-				destinationPropertyName="dataProvider" />
-		</js:beads>
-		<js:columns>
-			<js:DataGridColumn label="Image" dataField="image" columnWidth="100" itemRenderer="products.ProductItemRenderer" />
-			<js:DataGridColumn label="Title" dataField="title" columnWidth="200" />
-			<js:DataGridColumn label="Sales" dataField="sales" columnWidth="100" />
-		</js:columns>
-	</js:DataGrid>
-
-</js:View>

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/assets/smallbluerect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/assets/smallbluerect.jpg b/examples/flexjs/DataGridExample/src/assets/smallbluerect.jpg
deleted file mode 100644
index 80ed275..0000000
Binary files a/examples/flexjs/DataGridExample/src/assets/smallbluerect.jpg and /dev/null differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/assets/smallgreenrect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/assets/smallgreenrect.jpg b/examples/flexjs/DataGridExample/src/assets/smallgreenrect.jpg
deleted file mode 100644
index c5f9ce6..0000000
Binary files a/examples/flexjs/DataGridExample/src/assets/smallgreenrect.jpg and /dev/null differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/assets/smallorangerect.gif
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/assets/smallorangerect.gif b/examples/flexjs/DataGridExample/src/assets/smallorangerect.gif
deleted file mode 100644
index 603f810..0000000
Binary files a/examples/flexjs/DataGridExample/src/assets/smallorangerect.gif and /dev/null differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/assets/smallorangerect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/assets/smallorangerect.jpg b/examples/flexjs/DataGridExample/src/assets/smallorangerect.jpg
deleted file mode 100644
index 4982d87..0000000
Binary files a/examples/flexjs/DataGridExample/src/assets/smallorangerect.jpg and /dev/null differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/assets/smallpurplerect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/assets/smallpurplerect.jpg b/examples/flexjs/DataGridExample/src/assets/smallpurplerect.jpg
deleted file mode 100644
index 201f625..0000000
Binary files a/examples/flexjs/DataGridExample/src/assets/smallpurplerect.jpg and /dev/null differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/assets/smallredrect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/assets/smallredrect.jpg b/examples/flexjs/DataGridExample/src/assets/smallredrect.jpg
deleted file mode 100644
index d2cfa31..0000000
Binary files a/examples/flexjs/DataGridExample/src/assets/smallredrect.jpg and /dev/null differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/assets/smallyellowrect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/assets/smallyellowrect.jpg b/examples/flexjs/DataGridExample/src/assets/smallyellowrect.jpg
deleted file mode 100644
index b17b62d..0000000
Binary files a/examples/flexjs/DataGridExample/src/assets/smallyellowrect.jpg and /dev/null differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/DataGridExample.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/DataGridExample.mxml b/examples/flexjs/DataGridExample/src/main/flex/DataGridExample.mxml
new file mode 100644
index 0000000..41989f8
--- /dev/null
+++ b/examples/flexjs/DataGridExample/src/main/flex/DataGridExample.mxml
@@ -0,0 +1,36 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!---
+//
+//  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.
+//
+////////////////////////////////////////////////////////////////////////////////
+-->
+<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+				   xmlns:local="*"
+				   xmlns:models="models.*"
+				   xmlns:js="library://ns.apache.org/flexjs/basic" 
+				   >
+	
+	<js:valuesImpl>
+		<js:SimpleCSSValuesImpl />
+	</js:valuesImpl>
+	<js:model>
+		<models:ProductsModel />
+	</js:model>
+	<js:initialView>
+		<local:MyInitialView />
+	</js:initialView>
+</js:Application>

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/MyInitialView.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/MyInitialView.mxml b/examples/flexjs/DataGridExample/src/main/flex/MyInitialView.mxml
new file mode 100644
index 0000000..2f543e5
--- /dev/null
+++ b/examples/flexjs/DataGridExample/src/main/flex/MyInitialView.mxml
@@ -0,0 +1,68 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+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.
+
+-->
+<js:View xmlns:fx="http://ns.adobe.com/mxml/2009"
+				xmlns:js="library://ns.apache.org/flexjs/basic">
+    <fx:Script>
+        <![CDATA[
+		 private function dataGridChange() : void
+		 {
+			 output.text = "Clicked on row "+dataGrid.selectedIndex;
+			 trace("Click on row "+dataGrid.selectedIndex);
+		 }
+		]]>
+    </fx:Script>
+	
+	<js:Label id="output" x="450" y="30" width="100" />
+		
+	<js:DataGrid id="dataGrid" x="20" y="30" width="400" height="300" change="dataGridChange()" rowHeight="30">
+		<js:beads>
+			<js:DataGridPercentageLayout />
+			<js:ConstantBinding
+				sourceID="applicationModel"
+				sourcePropertyName="productList"
+				destinationPropertyName="dataProvider" />
+		</js:beads>
+		<js:columns>
+			<js:DataGridColumn label="Image" dataField="image" columnWidth="25" itemRenderer="products.ProductItemRenderer" />
+			<js:DataGridColumn label="Title" dataField="title" columnWidth="50" />
+			<js:DataGridColumn label="Sales" dataField="sales" columnWidth="25" />
+		</js:columns>
+	</js:DataGrid>
+		
+	<js:DataGrid id="dataGrid2" x="20" y="400" width="400" height="300" change="dataGridChange()" rowHeight="40">
+		<js:beads>
+		    <js:DataGridLinesBead>
+		       <js:stroke>
+		           <js:SolidColorStroke color="#FF8800" weight="2" />
+		       </js:stroke>
+		    </js:DataGridLinesBead>
+			<js:ConstantBinding
+				sourceID="applicationModel"
+				sourcePropertyName="productList"
+				destinationPropertyName="dataProvider" />
+		</js:beads>
+		<js:columns>
+			<js:DataGridColumn label="Image" dataField="image" columnWidth="100" itemRenderer="products.ProductItemRenderer" />
+			<js:DataGridColumn label="Title" dataField="title" columnWidth="200" />
+			<js:DataGridColumn label="Sales" dataField="sales" columnWidth="100" />
+		</js:columns>
+	</js:DataGrid>
+
+</js:View>

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/assets/smallbluerect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/assets/smallbluerect.jpg b/examples/flexjs/DataGridExample/src/main/flex/assets/smallbluerect.jpg
new file mode 100644
index 0000000..80ed275
Binary files /dev/null and b/examples/flexjs/DataGridExample/src/main/flex/assets/smallbluerect.jpg differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/assets/smallgreenrect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/assets/smallgreenrect.jpg b/examples/flexjs/DataGridExample/src/main/flex/assets/smallgreenrect.jpg
new file mode 100644
index 0000000..c5f9ce6
Binary files /dev/null and b/examples/flexjs/DataGridExample/src/main/flex/assets/smallgreenrect.jpg differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/assets/smallorangerect.gif
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/assets/smallorangerect.gif b/examples/flexjs/DataGridExample/src/main/flex/assets/smallorangerect.gif
new file mode 100644
index 0000000..603f810
Binary files /dev/null and b/examples/flexjs/DataGridExample/src/main/flex/assets/smallorangerect.gif differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/assets/smallorangerect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/assets/smallorangerect.jpg b/examples/flexjs/DataGridExample/src/main/flex/assets/smallorangerect.jpg
new file mode 100644
index 0000000..4982d87
Binary files /dev/null and b/examples/flexjs/DataGridExample/src/main/flex/assets/smallorangerect.jpg differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/assets/smallpurplerect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/assets/smallpurplerect.jpg b/examples/flexjs/DataGridExample/src/main/flex/assets/smallpurplerect.jpg
new file mode 100644
index 0000000..201f625
Binary files /dev/null and b/examples/flexjs/DataGridExample/src/main/flex/assets/smallpurplerect.jpg differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/assets/smallredrect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/assets/smallredrect.jpg b/examples/flexjs/DataGridExample/src/main/flex/assets/smallredrect.jpg
new file mode 100644
index 0000000..d2cfa31
Binary files /dev/null and b/examples/flexjs/DataGridExample/src/main/flex/assets/smallredrect.jpg differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/assets/smallyellowrect.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/assets/smallyellowrect.jpg b/examples/flexjs/DataGridExample/src/main/flex/assets/smallyellowrect.jpg
new file mode 100644
index 0000000..b17b62d
Binary files /dev/null and b/examples/flexjs/DataGridExample/src/main/flex/assets/smallyellowrect.jpg differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/models/ProductsModel.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/models/ProductsModel.as b/examples/flexjs/DataGridExample/src/main/flex/models/ProductsModel.as
new file mode 100644
index 0000000..8eab2fe
--- /dev/null
+++ b/examples/flexjs/DataGridExample/src/main/flex/models/ProductsModel.as
@@ -0,0 +1,55 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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 models
+{
+	import org.apache.flex.events.EventDispatcher;
+	import org.apache.flex.collections.ArrayList;
+	
+	import products.Product;
+	
+	public class ProductsModel extends EventDispatcher
+	{
+		public function ProductsModel()
+		{
+			_productList = new ArrayList();
+			_productList.source = source;
+		}
+
+		private var source:Array = [
+			new Product("ps100","Widgets",44,200,"assets/smallbluerect.jpg"),
+			new Product("tx200","Thingys",5,285,"assets/smallgreenrect.jpg"),
+			new Product("rz300","Sprockets",80,105,"assets/smallyellowrect.jpg"),
+			new Product("dh440","Doohickies",10,340,"assets/smallredrect.jpg"),
+			new Product("ps220","Weejets",35,190,"assets/smallorangerect.jpg")
+			];
+			
+		private var _productList:ArrayList;
+		
+		public function get productList():ArrayList
+		{
+			return _productList;
+		}
+
+		private var _labelFields:Array = [ "id", "title", "sales", "detail" ];
+		public function get labelFields():Array
+		{
+			return _labelFields;
+		}
+	}
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/products/Product.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/products/Product.as b/examples/flexjs/DataGridExample/src/main/flex/products/Product.as
new file mode 100644
index 0000000..fd4b31e
--- /dev/null
+++ b/examples/flexjs/DataGridExample/src/main/flex/products/Product.as
@@ -0,0 +1,43 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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 products
+{
+	public class Product
+	{
+		public function Product(id:String,title:String,detail:Number,sales:Number,image:String)
+		{
+			this.id = id;
+			this.title = title;
+			this.detail = detail;
+			this.sales = sales;
+			this.image = image;
+		}
+		
+		public var id:String;
+		public var title:String;
+		public var detail:Number;
+		public var image:String;
+		public var sales:Number;
+		
+		public function toString():String
+		{
+			return title;
+		}
+	}
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/main/flex/products/ProductItemRenderer.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/main/flex/products/ProductItemRenderer.as b/examples/flexjs/DataGridExample/src/main/flex/products/ProductItemRenderer.as
new file mode 100644
index 0000000..4edc5b7
--- /dev/null
+++ b/examples/flexjs/DataGridExample/src/main/flex/products/ProductItemRenderer.as
@@ -0,0 +1,66 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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 products
+{
+	import org.apache.flex.html.Image;
+	import org.apache.flex.html.supportClasses.DataItemRenderer;
+	
+	public class ProductItemRenderer extends DataItemRenderer
+	{
+		public function ProductItemRenderer()
+		{
+			super();
+		}
+		
+		private var image:Image;
+		
+		override public function addedToParent():void
+		{
+			super.addedToParent();
+			
+			// add an image and two labels
+			image = new Image();
+			addElement(image);
+		}
+		
+		override public function get data():Object
+		{
+			return super.data;
+		}
+		
+		override public function set data(value:Object):void
+		{
+			super.data = value;
+			
+			image.source = value.image;
+		}
+		
+		override public function adjustSize():void
+		{
+			var cy:Number = this.height/2;
+			
+			image.x = 4;
+			image.y = cy - 16;
+			image.width = 32;
+			image.height = 32;
+			
+			updateRenderer();
+		}
+	}
+}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/models/ProductsModel.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/models/ProductsModel.as b/examples/flexjs/DataGridExample/src/models/ProductsModel.as
deleted file mode 100644
index 8eab2fe..0000000
--- a/examples/flexjs/DataGridExample/src/models/ProductsModel.as
+++ /dev/null
@@ -1,55 +0,0 @@
-////////////////////////////////////////////////////////////////////////////////
-//
-//  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 models
-{
-	import org.apache.flex.events.EventDispatcher;
-	import org.apache.flex.collections.ArrayList;
-	
-	import products.Product;
-	
-	public class ProductsModel extends EventDispatcher
-	{
-		public function ProductsModel()
-		{
-			_productList = new ArrayList();
-			_productList.source = source;
-		}
-
-		private var source:Array = [
-			new Product("ps100","Widgets",44,200,"assets/smallbluerect.jpg"),
-			new Product("tx200","Thingys",5,285,"assets/smallgreenrect.jpg"),
-			new Product("rz300","Sprockets",80,105,"assets/smallyellowrect.jpg"),
-			new Product("dh440","Doohickies",10,340,"assets/smallredrect.jpg"),
-			new Product("ps220","Weejets",35,190,"assets/smallorangerect.jpg")
-			];
-			
-		private var _productList:ArrayList;
-		
-		public function get productList():ArrayList
-		{
-			return _productList;
-		}
-
-		private var _labelFields:Array = [ "id", "title", "sales", "detail" ];
-		public function get labelFields():Array
-		{
-			return _labelFields;
-		}
-	}
-}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/e75059f7/examples/flexjs/DataGridExample/src/products/Product.as
----------------------------------------------------------------------
diff --git a/examples/flexjs/DataGridExample/src/products/Product.as b/examples/flexjs/DataGridExample/src/products/Product.as
deleted file mode 100644
index fd4b31e..0000000
--- a/examples/flexjs/DataGridExample/src/products/Product.as
+++ /dev/null
@@ -1,43 +0,0 @@
-////////////////////////////////////////////////////////////////////////////////
-//
-//  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 products
-{
-	public class Product
-	{
-		public function Product(id:String,title:String,detail:Number,sales:Number,image:String)
-		{
-			this.id = id;
-			this.title = title;
-			this.detail = detail;
-			this.sales = sales;
-			this.image = image;
-		}
-		
-		public var id:String;
-		public var title:String;
-		public var detail:Number;
-		public var image:String;
-		public var sales:Number;
-		
-		public function toString():String
-		{
-			return title;
-		}
-	}
-}
\ No newline at end of file