http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..1c31b58 --- /dev/null +++ b/examples/flexjs/DataBindingExample_as/src/MyInitialView.as @@ -0,0 +1,283 @@ +/** + +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; + var viv:Object = vi.values; + viv[".output"]= { + fontSize: 20 + }; + + viv[".topContainer"] = { + padding: 10 + }; + + viv[".leftSide"] = { + verticalAlign: "top", + marginRight: 10 + } + + viv[".rightSide"] = { + verticalAlign: "top", + marginLeft: 10, + paddingLeft: 10 + } + + viv[".quoteButton"] = { + marginTop: 10, + marginBottom: 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/d33fe63c/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 new file mode 100644 index 0000000..a39606b --- /dev/null +++ b/examples/flexjs/DataBindingExample_as/src/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/d33fe63c/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 new file mode 100644 index 0000000..2ee16ae --- /dev/null +++ b/examples/flexjs/DataBindingExample_as/src/controllers/MyController.as @@ -0,0 +1,81 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 models.MyModel; + + public class MyController implements IDocument + { + public function MyController(app:Application = null) + { + if (app) + { + this.app = app as DataBindingExample; + app.addEventListener("viewChanged", viewChangeHandler); + } + } + + 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 var app:DataBindingExample; + + private function viewChangeHandler(event:Event):void + { + app.initialView.addEventListener("buttonClicked", buttonClickHandler); + app.initialView.addEventListener("radioClicked", radioClickHandler); + app.initialView.addEventListener("listChanged", listChangedHandler); + } + + private function buttonClickHandler(event:Event):void + { + var sym:String = MyInitialView(app.initialView).symbol; + app.service.url = queryBegin + sym + queryEnd; + app.service.send(); + app.service.addEventListener("complete", completeHandler); + } + + private function radioClickHandler(event:Event):void + { + var field:String = MyInitialView(app.initialView).requestedField; + MyModel(app.model).requestedField = field; + } + + private function completeHandler(event:Event):void + { + MyModel(app.model).responseData = app.collection.getItemAt(0); + } + + private function listChangedHandler(event:Event):void + { + MyModel(app.model).stockSymbol = MyInitialView(app.initialView).symbol; + } + + public function setDocument(document:Object, id:String = null):void + { + this.app = document as DataBindingExample; + app.addEventListener("viewChanged", viewChangeHandler); + } + + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..4a17f22 --- /dev/null +++ b/examples/flexjs/DataBindingExample_as/src/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/d33fe63c/examples/flexjs/DataGridExample/build.xml ---------------------------------------------------------------------- diff --git a/examples/flexjs/DataGridExample/build.xml b/examples/flexjs/DataGridExample/build.xml new file mode 100644 index 0000000..b7c8e80 --- /dev/null +++ b/examples/flexjs/DataGridExample/build.xml @@ -0,0 +1,71 @@ +<?xml version="1.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. + +--> + + +<project name="datagridexample" default="main" basedir="."> + <property name="FLEXJS_HOME" location="../.."/> + <property name="example" value="DataGridExample" /> + + <property file="${FLEXJS_HOME}/env.properties"/> + <property environment="env"/> + <property file="${FLEXJS_HOME}/build.properties"/> + <property name="FLEX_HOME" value="${FLEXJS_HOME}"/> + <available file="${env.FALCON_HOME}/lib/falcon-mxmlc.jar" + type="file" + property="FALCON_HOME" + value="${env.FALCON_HOME}"/> + + <available file="${FLEXJS_HOME}/../flex-falcon/compiler/generated/dist/sdk/lib/falcon-mxmlc.jar" + type="file" + property="FALCON_HOME" + value="${FLEXJS_HOME}/../flex-falcon/compiler/generated/dist/sdk"/> + + <available file="${env.FALCONJX_HOME}/lib/jsc.jar" + type="file" + property="FALCONJX_HOME" + value="${env.FALCONJX_HOME}"/> + + <available file="${FLEXJS_HOME}/../flex-falcon/compiler.jx/lib/jsc.jar" + type="file" + property="FALCONJX_HOME" + value="${FLEXJS_HOME}/../flex-falcon/compiler.jx"/> + + <available file="${env.GOOG_HOME}/closure/goog/base.js" + type="file" + property="GOOG_HOME" + value="${env.GOOG_HOME}"/> + + <available file="${FLEXJS_HOME}/js/lib/google/closure-library/closure/goog/base.js" + type="file" + property="GOOG_HOME" + value="${FLEXJS_HOME}/js/lib/google/closure-library"/> + + <include file="${basedir}/../build_example.xml" /> + + <target name="main" depends="clean,build_example.compile,build_example.compilejs" description="Clean build of ${example}"> + </target> + + <target name="clean"> + <delete dir="${basedir}/bin" failonerror="false" /> + <delete dir="${basedir}/bin-debug" failonerror="false" /> + <delete dir="${basedir}/bin-release" failonerror="false" /> + </target> + +</project> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/DataGridExample/src/DataGridExample.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/DataGridExample/src/DataGridExample.mxml b/examples/flexjs/DataGridExample/src/DataGridExample.mxml new file mode 100644 index 0000000..41989f8 --- /dev/null +++ b/examples/flexjs/DataGridExample/src/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/d33fe63c/examples/flexjs/DataGridExample/src/MyInitialView.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/DataGridExample/src/MyInitialView.mxml b/examples/flexjs/DataGridExample/src/MyInitialView.mxml new file mode 100644 index 0000000..dd51c7c --- /dev/null +++ b/examples/flexjs/DataGridExample/src/MyInitialView.mxml @@ -0,0 +1,48 @@ +<?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:ViewBase 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: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:ViewBase> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/DataGridExample/src/README.txt ---------------------------------------------------------------------- diff --git a/examples/flexjs/DataGridExample/src/README.txt b/examples/flexjs/DataGridExample/src/README.txt new file mode 100644 index 0000000..77a0b8e --- /dev/null +++ b/examples/flexjs/DataGridExample/src/README.txt @@ -0,0 +1,46 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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. +// +//////////////////////////////////////////////////////////////////////////////// + +DESCRIPTION + +The DataGridExample demonstrates the FlexJS DataGrid which is a composite +component that is built from a set of List components; each List is a column +in the DataGrid. The header is provided by the ButtonBar component. + +This Flex application may be run as a Flash SWF or cross-compiled (using Falcon JX) +into JavaScript and HTML and run without Flash. + +The data for the DataGrid is found in the application's model and is connected +using a ConstantBinding bead which ties a property of a model to a property +in a component, in this case, the DataGrid's dataProvider property. + +COMPONENTS and BEADS + +- DataGrid +- List +- ButtonBar + +- ConstantBinding + +NOTES + +The column headers - buttons in a ButtonBar - do not align correctly over each +column. + +The columns scroll independently. \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..80ed275 Binary files /dev/null and b/examples/flexjs/DataGridExample/src/assets/smallbluerect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..c5f9ce6 Binary files /dev/null and b/examples/flexjs/DataGridExample/src/assets/smallgreenrect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..603f810 Binary files /dev/null and b/examples/flexjs/DataGridExample/src/assets/smallorangerect.gif differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..4982d87 Binary files /dev/null and b/examples/flexjs/DataGridExample/src/assets/smallorangerect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..201f625 Binary files /dev/null and b/examples/flexjs/DataGridExample/src/assets/smallpurplerect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..d2cfa31 Binary files /dev/null and b/examples/flexjs/DataGridExample/src/assets/smallredrect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..b17b62d Binary files /dev/null and b/examples/flexjs/DataGridExample/src/assets/smallyellowrect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/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 new file mode 100644 index 0000000..e3a42a9 --- /dev/null +++ b/examples/flexjs/DataGridExample/src/models/ProductsModel.as @@ -0,0 +1,49 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 products.Product; + + public class ProductsModel extends EventDispatcher + { + public function ProductsModel() + { + } + + private var _productList: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") + ]; + public function get productList():Array + { + 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/d33fe63c/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 new file mode 100644 index 0000000..fd4b31e --- /dev/null +++ b/examples/flexjs/DataGridExample/src/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/d33fe63c/examples/flexjs/DataGridExample/src/products/ProductItemRenderer.as ---------------------------------------------------------------------- diff --git a/examples/flexjs/DataGridExample/src/products/ProductItemRenderer.as b/examples/flexjs/DataGridExample/src/products/ProductItemRenderer.as new file mode 100644 index 0000000..4edc5b7 --- /dev/null +++ b/examples/flexjs/DataGridExample/src/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/d33fe63c/examples/flexjs/DesktopMap/DesktopMap-app.xml ---------------------------------------------------------------------- diff --git a/examples/flexjs/DesktopMap/DesktopMap-app.xml b/examples/flexjs/DesktopMap/DesktopMap-app.xml new file mode 100644 index 0000000..8beb581 --- /dev/null +++ b/examples/flexjs/DesktopMap/DesktopMap-app.xml @@ -0,0 +1,252 @@ +<?xml version="1.0" encoding="utf-8" standalone="no"?> +<!-- + + 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. + +--> +<application xmlns="http://ns.adobe.com/air/application/4.0";> + +<!-- Adobe AIR Application Descriptor File Template. + + Specifies parameters for identifying, installing, and launching AIR applications. + + xmlns - The Adobe AIR namespace: http://ns.adobe.com/air/application/3.8 + The last segment of the namespace specifies the version + of the AIR runtime required for this application to run. + + minimumPatchLevel - The minimum patch level of the AIR runtime required to run + the application. Optional. +--> + + <!-- A universally unique application identifier. Must be unique across all AIR applications. + Using a reverse DNS-style name as the id is recommended. (Eg. com.example.ExampleApplication.) Required. --> + <id>org.apache.flexjs.desktopmap</id> + + <!-- Used as the filename for the application. Required. --> + <filename>Apache FlexJS Google Map Example</filename> + + <!-- The name that is displayed in the AIR application installer. + May have multiple values for each language. See samples or xsd schema file. Optional. --> + <name>Apache FlexJS Google Map Example</name> + + <!-- A string value of the format <0-999>.<0-999>.<0-999> that represents application version which can be used to check for application upgrade. + Values can also be 1-part or 2-part. It is not necessary to have a 3-part value. + An updated version of application must have a versionNumber value higher than the previous version. Required for namespace >= 2.5 . --> + <versionNumber>0.0.1</versionNumber> + + <!-- A string value (such as "v1", "2.5", or "Alpha 1") that represents the version of the application, as it should be shown to users. Optional. --> + <!-- <versionLabel></versionLabel> --> + + <!-- Description, displayed in the AIR application installer. + May have multiple values for each language. See samples or xsd schema file. Optional. --> + <!-- <description></description> --> + + <!-- Copyright information. Optional --> + <copyright>Copyright 2013 The Apache Software Foundation.</copyright> + + <!-- Publisher ID. Used if you're updating an application created prior to 1.5.3 --> + <!-- <publisherID></publisherID> --> + + <!-- Settings for the application's initial window. Required. --> + <initialWindow> + <!-- The main SWF or HTML file of the application. Required. --> + <!-- Note: In Flash Builder, the SWF reference is set automatically. --> + <content>DesktopMap.swf</content> + + <!-- The title of the main window. Optional. --> + <!-- <title></title> --> + + <!-- The type of system chrome to use (either "standard" or "none"). Optional. Default standard. --> + <!-- <systemChrome></systemChrome> --> + + <!-- Whether the window is transparent. Only applicable when systemChrome is none. Optional. Default false. --> + <!-- <transparent></transparent> --> + + <!-- Whether the window is initially visible. Optional. Default false. --> + <!-- <visible></visible> --> + + <!-- Whether the user can minimize the window. Optional. Default true. --> + <!-- <minimizable></minimizable> --> + + <!-- Whether the user can maximize the window. Optional. Default true. --> + <!-- <maximizable></maximizable> --> + + <!-- Whether the user can resize the window. Optional. Default true. --> + <!-- <resizable></resizable> --> + + <!-- The window's initial width in pixels. Optional. --> + <!-- <width></width> --> + + <!-- The window's initial height in pixels. Optional. --> + <!-- <height></height> --> + + <!-- The window's initial x position. Optional. --> + <!-- <x></x> --> + + <!-- The window's initial y position. Optional. --> + <!-- <y></y> --> + + <!-- The window's minimum size, specified as a width/height pair in pixels, such as "400 200". Optional. --> + <!-- <minSize></minSize> --> + + <!-- The window's initial maximum size, specified as a width/height pair in pixels, such as "1600 1200". Optional. --> + <!-- <maxSize></maxSize> --> + + <!-- The initial aspect ratio of the app when launched (either "portrait" or "landscape"). Optional. Mobile only. Default is the natural orientation of the device --> + + <!-- <aspectRatio></aspectRatio> --> + + <!-- Whether the app will begin auto-orienting on launch. Optional. Mobile only. Default false --> + + <!-- <autoOrients></autoOrients> --> + + <!-- Whether the app launches in full screen. Optional. Mobile only. Default false --> + + <!-- <fullScreen></fullScreen> --> + + <!-- The render mode for the app (either auto, cpu, gpu, or direct). Optional. Default auto --> + + <!-- <renderMode></renderMode> --> + + <!-- Whether or not to pan when a soft keyboard is raised or lowered (either "pan" or "none"). Optional. Defaults "pan." --> + <!-- <softKeyboardBehavior></softKeyboardBehavior> --> + <autoOrients>false</autoOrients> + <fullScreen>false</fullScreen> + <visible>true</visible> + </initialWindow> + + <!-- We recommend omitting the supportedProfiles element, --> + <!-- which in turn permits your application to be deployed to all --> + <!-- devices supported by AIR. If you wish to restrict deployment --> + <!-- (i.e., to only mobile devices) then add this element and list --> + <!-- only the profiles which your application does support. --> + <!-- <supportedProfiles>desktop extendedDesktop mobileDevice extendedMobileDevice</supportedProfiles> --> + <supportedProfiles>extendedDesktop desktop</supportedProfiles> + + <!-- The subpath of the standard default installation location to use. Optional. --> + <installFolder>Apache Flex</installFolder> + + <!-- The subpath of the Programs menu to use. (Ignored on operating systems without a Programs menu.) Optional. --> + <programMenuFolder>Apache Flex</programMenuFolder> + + <!-- The icon the system uses for the application. For at least one resolution, + specify the path to a PNG file included in the AIR package. Optional. --> + <icon> + <image16x16>assets/icons/16.png</image16x16> + <image29x29>assets/icons/29.png</image29x29> + <image32x32>assets/icons/32.png</image32x32> + <image36x36>assets/icons/36.png</image36x36> + <image48x48>assets/icons/48.png</image48x48> + <image57x57>assets/icons/57.png</image57x57> + <image72x72>assets/icons/72.png</image72x72> + <image114x114>assets/icons/114.png</image114x114> + <image128x128>assets/icons/128.png</image128x128> + </icon> + + <!-- Whether the application handles the update when a user double-clicks an update version + of the AIR file (true), or the default AIR application installer handles the update (false). + Optional. Default false. --> + <!-- <customUpdateUI></customUpdateUI> --> + + <!-- Whether the application can be launched when the user clicks a link in a web browser. + Optional. Default false. --> + <!-- <allowBrowserInvocation></allowBrowserInvocation> --> + + <!-- Listing of file types for which the application can register. Optional. --> + <!-- <fileTypes> --> + + <!-- Defines one file type. Optional. --> + <!-- <fileType> --> + + <!-- The name that the system displays for the registered file type. Required. --> + <!-- <name></name> --> + + <!-- The extension to register. Required. --> + <!-- <extension></extension> --> + + <!-- The description of the file type. Optional. --> + <!-- <description></description> --> + + <!-- The MIME content type. --> + <!-- <contentType></contentType> --> + + <!-- The icon to display for the file type. Optional. --> + <!-- <icon> + <image16x16></image16x16> + <image32x32></image32x32> + <image48x48></image48x48> + <image128x128></image128x128> + </icon> --> + + <!-- </fileType> --> + <!-- </fileTypes> --> + + <!-- iOS specific capabilities --> + <!-- <iPhone> --> + <!-- A list of plist key/value pairs to be added to the application Info.plist --> + <!-- <InfoAdditions> + <![CDATA[ + <key>UIDeviceFamily</key> + <array> + <string>1</string> + <string>2</string> + </array> + <key>UIStatusBarStyle</key> + <string>UIStatusBarStyleBlackOpaque</string> + <key>UIRequiresPersistentWiFi</key> + <string>YES</string> + ]]> + </InfoAdditions> --> + <!-- A list of plist key/value pairs to be added to the application Entitlements.plist --> + <!-- <Entitlements> + <![CDATA[ + <key>keychain-access-groups</key> + <array> + <string></string> + <string></string> + </array> + ]]> + </Entitlements> --> + <!-- Display Resolution for the app (either "standard" or "high"). Optional. Default "standard" --> + <!-- <requestedDisplayResolution></requestedDisplayResolution> --> + <!-- </iPhone> --> + + <!-- Specify Android specific tags that get passed to AndroidManifest.xml file. --> + <!--<android> --> + <!-- <manifestAdditions> + <![CDATA[ + <manifest android:installLocation="auto"> + <uses-permission android:name="android.permission.INTERNET"/> + <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/> + <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/> + <uses-feature android:required="true" android:name="android.hardware.touchscreen.multitouch"/> + <application android:enabled="true"> + <activity android:excludeFromRecents="false"> + <intent-filter> + <action android:name="android.intent.action.MAIN"/> + <category android:name="android.intent.category.LAUNCHER"/> + </intent-filter> + </activity> + </application> + </manifest> + ]]> + </manifestAdditions> --> + <!-- Color depth for the app (either "32bit" or "16bit"). Optional. Default 16bit before namespace 3.0, 32bit after --> + <!-- <colorDepth></colorDepth> --> + <!-- </android> --> + <!-- End of the schema for adding the android specific tags in AndroidManifest.xml file --> + +</application> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/DesktopMap/README.txt ---------------------------------------------------------------------- diff --git a/examples/flexjs/DesktopMap/README.txt b/examples/flexjs/DesktopMap/README.txt new file mode 100644 index 0000000..30ff2ea --- /dev/null +++ b/examples/flexjs/DesktopMap/README.txt @@ -0,0 +1,41 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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. +// +//////////////////////////////////////////////////////////////////////////////// + +DESCRIPTION + +This sample FlexJS application shows how you can integrate a 3rd party library, such as Google Maps, into the +world of FlexJS. + +The ActionScript side is an AIR app that uses HTMLLoader to bring in the Google MAP JavaScript API. You could +also try to use an iFrame with a web application (there are examples of iFrame and Flex scattered around the web). + +You can also cross-compile this sample into JavaScript. This is possible because there is a JavaScript version of the +ActionScript Map class. The JavaScript Map class loads the Google MAP API asynchronously and dispatches a "ready" +event when the load and initialization of the API is complete. + +You will need a Google API developer key. When you have it, replace --put your Google API dev token here-- with +your developer token in the MyInitialView.mxml <basic:Map> tag. + +COMPONENTS and BEADS + +- Container +- DropDownList +- Label +- TextButton +- TextInput \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/DesktopMap/build.xml ---------------------------------------------------------------------- diff --git a/examples/flexjs/DesktopMap/build.xml b/examples/flexjs/DesktopMap/build.xml new file mode 100644 index 0000000..d55be5a --- /dev/null +++ b/examples/flexjs/DesktopMap/build.xml @@ -0,0 +1,104 @@ +<?xml version="1.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. + +--> + + +<project name="desktopmap" default="main" basedir="."> + <property name="FLEXJS_HOME" location="../.."/> + <property name="example" value="DesktopMap" /> + + <!-- this project needs AIR 3.4 FP 11.4 --> + <property name="swf.version" value="17" /> + <property name="playerglobal.version" value="11.4" /> + + <property file="${FLEXJS_HOME}/env.properties"/> + <property environment="env"/> + <property file="${FLEXJS_HOME}/build.properties"/> + <property name="FLEX_HOME" value="${FLEXJS_HOME}"/> + <available file="${env.FALCON_HOME}/lib/falcon-mxmlc.jar" + type="file" + property="FALCON_HOME" + value="${env.FALCON_HOME}"/> + + <available file="${FLEXJS_HOME}/../flex-falcon/compiler/generated/dist/sdk/lib/falcon-mxmlc.jar" + type="file" + property="FALCON_HOME" + value="${FLEXJS_HOME}/../flex-falcon/compiler/generated/dist/sdk"/> + + <available file="${env.FALCONJX_HOME}/lib/jsc.jar" + type="file" + property="FALCONJX_HOME" + value="${env.FALCONJX_HOME}"/> + + <available file="${FLEXJS_HOME}/../flex-falcon/compiler.jx/lib/jsc.jar" + type="file" + property="FALCONJX_HOME" + value="${FLEXJS_HOME}/../flex-falcon/compiler.jx"/> + + <available file="${env.GOOG_HOME}/closure/goog/base.js" + type="file" + property="GOOG_HOME" + value="${env.GOOG_HOME}"/> + + <available file="${FLEXJS_HOME}/js/lib/google/closure-library/closure/goog/base.js" + type="file" + property="GOOG_HOME" + value="${FLEXJS_HOME}/js/lib/google/closure-library"/> + + <property name="AIR_HOME" value="${env.AIR_HOME}"/> + + + <condition property="adl" value="adl.exe"> + <os family="windows"/> + </condition> + + <condition property="adl" value="adl"> + <os family="mac"/> + </condition> + + <condition property="runtime" value="win"> + <os family="windows"/> + </condition> + + <condition property="runtime" value="mac"> + <os family="mac"/> + </condition> + + <include file="${basedir}/../build_example.xml" /> + + <target name="main" depends="clean,build_example.compileair,build_example.compilejsair" description="Clean build of ${example}"> + </target> + + <target name="clean"> + <echo>playerglobal.version = ${playerglobal.version}</echo> + <delete dir="${basedir}/bin" failonerror="false" /> + <delete dir="${basedir}/bin-debug" failonerror="false" /> + <delete dir="${basedir}/bin-release" failonerror="false" /> + </target> + + <target name="run"> + <exec executable="${AIR_HOME}/bin/${adl}" dir="${basedir}/bin-debug" failonerror="true"> + <arg value="-runtime" /> + <arg value="${AIR_HOME}/runtimes/air/${runtime}" /> + <arg value="-profile" /> + <arg value="extendedDesktop" /> + <arg value="${basedir}/bin-debug/${example}-app.xml" /> + </exec> + </target> +</project> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/DesktopMap/src/DesktopMap.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/DesktopMap/src/DesktopMap.mxml b/examples/flexjs/DesktopMap/src/DesktopMap.mxml new file mode 100644 index 0000000..4f938b6 --- /dev/null +++ b/examples/flexjs/DesktopMap/src/DesktopMap.mxml @@ -0,0 +1,46 @@ +<?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" + > + + <!-- This application demonstrates how to use the Google MAP API + on both the AIR and JavaScript/browser platform. After cross- + compiling this application for JavaScript, edit the index.html + file and include your Google developer API token. + --> + + <js:valuesImpl> + <js:SimpleCSSValuesImpl /> + </js:valuesImpl> + <js:initialView> + <local:MyInitialView /> + </js:initialView> + <js:model> + <models:MyModel /> + </js:model> + <js:beads> + <js:MixinManager /> + </js:beads> + +</js:Application> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/DesktopMap/src/MyInitialView.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/DesktopMap/src/MyInitialView.mxml b/examples/flexjs/DesktopMap/src/MyInitialView.mxml new file mode 100644 index 0000000..9559493 --- /dev/null +++ b/examples/flexjs/DesktopMap/src/MyInitialView.mxml @@ -0,0 +1,147 @@ +<?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:ViewBase xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:js="library://ns.apache.org/flexjs/basic" + xmlns:google="library://ns.apache.org/flexjs/google" + xmlns:local="*" + initComplete="initControls()"> + <fx:Script> + <![CDATA[ + import models.MyModel; + import org.apache.flex.events.Event; + + + private function initControls() : void + { + + } + + /** + * Take the values from the input field and have the map + * display that coordinate. + */ + private function mapIt() : void + { + var lat:Number = Number(latInput.text); + var lng:Number = Number(longInput.text); + var zoom:Number = Number(zoomInput.text); + + map.loadMap(lat, lng, zoom); + } + + private var selectedCity:String; + + /** + * Triggered by a change in the drop list with a new city selected. This + * will also update the input fields. + */ + private function changeCity(event:org.apache.flex.events.Event) : void + { + var index:int = list.selectedIndex; + + var latlng:Object = MyModel(applicationModel).coordinates[index]; + map.loadMap(latlng.lat, latlng.lng, Number(zoomInput.text)); + + latInput.text = String(latlng.lat); + longInput.text = String(latlng.lng); + } + + private function codeAddress() : void + { + map.markAddress(mapLocation.text); + map.setZoom(12); + } + + private function searchOnMap() : void + { + map.nearbySearch(search.text); + map.setZoom(12); + } + + private function clearSearchResults() : void + { + map.clearSearchResults(); + } + + private function orientMap() : void + { + map.centerOnAddress(mapLocation.text); + map.setZoom(12); + } + + ]]> + </fx:Script> + + <fx:Style> + @namespace basic "library://ns.apache.org/flexjs/basic"; + + </fx:Style> + + <js:beads> + <js:ViewBaseDataBinding /> + </js:beads> + + + <js:Container x="5" y="5" className="topContainer" > + <js:beads> + <js:VerticalLayout /> + </js:beads> + + <js:Container> + <js:beads> + <js:HorizontalLayout /> + </js:beads> + <js:Label text="Location:" /> + <js:TextInput id="mapLocation" /> + <js:TextButton text="Go" click="orientMap()" /> + </js:Container> + + <google:Map id="map" width="450" height="300" token="AIzaSyDkQgg2iojLCYeuW6hK7DkuAHD-SwJJhdE" /> + + <js:Container> + <js:beads> + <js:HorizontalLayout /> + </js:beads> + <js:Label text="Search on Map:" /> + <js:TextInput id="search" /> + <js:TextButton text="Find" click="searchOnMap()" /> + <js:TextButton text="Clear" click="clearSearchResults()" /> + </js:Container> + + <js:Label text="History:" /> + + <!--<js:List id="historyList" />--> + <js:DropDownList id="list" width="100" height="17" + change="changeCity(event)" + dataProvider="{MyModel(applicationModel).cities}" /> + + <js:Label text="Lat:" /> + <js:TextInput id="latInput" text="-34.397" /> + + <js:Label text="Long:" /> + <js:TextInput id="longInput" text="150.644" /> + + <js:Label text="Zoom:" /> + <js:TextInput id="zoomInput" text="8" /> + + <js:TextButton text="MapIt" click="mapIt()" /> + </js:Container> + +</js:ViewBase> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/DesktopMap/src/models/MyModel.as ---------------------------------------------------------------------- diff --git a/examples/flexjs/DesktopMap/src/models/MyModel.as b/examples/flexjs/DesktopMap/src/models/MyModel.as new file mode 100644 index 0000000..406c30c --- /dev/null +++ b/examples/flexjs/DesktopMap/src/models/MyModel.as @@ -0,0 +1,56 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.core.IBeadModel; + import org.apache.flex.core.IStrand; + import org.apache.flex.events.Event; + import org.apache.flex.events.EventDispatcher; + + public class MyModel extends EventDispatcher implements IBeadModel + { + public function MyModel() + { + super(); + } + + private var _strand:IStrand; + + public function set strand(value:IStrand):void + { + _strand = value; + } + + private var _cities:Array = ["Sydney", "NYC", "Mexico City", "London", "Rio de Janeiro"]; + public function get cities():Array + { + return _cities; + } + + private var _coordinates:Array = [{lat:-33.86, lng:151.211}, + {lat:40.712, lng:-74.0059}, + {lat:19.26, lng:-99.03}, + {lat:51.4, lng:-0.1}, + {lat:-22.95, lng:-43.12}]; + public function get coordinates():Array + { + return _coordinates; + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/FlexJSStore/build.xml ---------------------------------------------------------------------- diff --git a/examples/flexjs/FlexJSStore/build.xml b/examples/flexjs/FlexJSStore/build.xml new file mode 100644 index 0000000..d4b9777 --- /dev/null +++ b/examples/flexjs/FlexJSStore/build.xml @@ -0,0 +1,91 @@ +<?xml version="1.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. + +--> + + +<project name="flexjsstore" default="main" basedir="."> + <property name="FLEXJS_HOME" location="../.."/> + <property name="example" value="FlexJSStore" /> + + <property file="${FLEXJS_HOME}/env.properties"/> + <property environment="env"/> + <property file="${FLEXJS_HOME}/build.properties"/> + <property name="FLEX_HOME" value="${FLEXJS_HOME}"/> + <available file="${env.FALCON_HOME}/lib/falcon-mxmlc.jar" + type="file" + property="FALCON_HOME" + value="${env.FALCON_HOME}"/> + + <available file="${FLEXJS_HOME}/../flex-falcon/compiler/generated/dist/sdk/lib/falcon-mxmlc.jar" + type="file" + property="FALCON_HOME" + value="${FLEXJS_HOME}/../flex-falcon/compiler/generated/dist/sdk"/> + + <available file="${env.FALCONJX_HOME}/lib/jsc.jar" + type="file" + property="FALCONJX_HOME" + value="${env.FALCONJX_HOME}"/> + + <available file="${FLEXJS_HOME}/../flex-falcon/compiler.jx/lib/jsc.jar" + type="file" + property="FALCONJX_HOME" + value="${FLEXJS_HOME}/../flex-falcon/compiler.jx"/> + + <available file="${env.GOOG_HOME}/closure/goog/base.js" + type="file" + property="GOOG_HOME" + value="${env.GOOG_HOME}"/> + + <available file="${FLEXJS_HOME}/js/lib/google/closure-library/closure/goog/base.js" + type="file" + property="GOOG_HOME" + value="${FLEXJS_HOME}/js/lib/google/closure-library"/> + + <include file="${basedir}/../build_example.xml" /> + + <target name="main" depends="clean,build_example.compile,build_example.compilejs" description="Clean build of ${example}"> + <mkdir dir="${basedir}/bin-debug/data" /> + <copy file="${basedir}/src/data/catalog.json" tofile="${basedir}/bin-debug/data/catalog.json" /> + <mkdir dir="${basedir}/bin/js-debug/data" /> + <copy file="${basedir}/src/data/catalog.json" tofile="${basedir}/bin/js-debug/data/catalog.json" /> + <mkdir dir="${basedir}/bin/js-release/data" /> + <copy file="${basedir}/src/data/catalog.json" tofile="${basedir}/bin/js-release/data/catalog.json" /> + <mkdir dir="${basedir}/bin/js-debug/assets" /> + <copy todir="${basedir}/bin/js-debug/assets" > + <fileset dir="${basedir}/src/assets"> + <include name="**" /> + </fileset> + </copy> + <mkdir dir="${basedir}/bin/js-release/assets" /> + <copy todir="${basedir}/bin/js-release/assets" > + <fileset dir="${basedir}/src/assets"> + <include name="**" /> + </fileset> + </copy> + </target> + + <target name="clean"> + <delete dir="${basedir}/bin" failonerror="false" /> + <delete dir="${basedir}/bin-debug" failonerror="false" /> + <delete dir="${basedir}/bin-release" failonerror="false" /> + </target> + + + +</project> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/FlexJSStore/src/FlexJSStore.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/FlexJSStore/src/FlexJSStore.mxml b/examples/flexjs/FlexJSStore/src/FlexJSStore.mxml new file mode 100755 index 0000000..4d04dc6 --- /dev/null +++ b/examples/flexjs/FlexJSStore/src/FlexJSStore.mxml @@ -0,0 +1,268 @@ +<?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:js="library://ns.apache.org/flexjs/basic" + xmlns="*" + initialize="startService()" + pageTitle="FlexStore"> + + <fx:Script> + <![CDATA[ + import org.apache.flex.core.ValuesManager; + + /* + private var currentTheme:String = "beige"; + + private function toggleTheme():void + { + if (currentTheme == "beige") + { + currentTheme = "blue"; + } + else + { + currentTheme = "beige"; + } + + loadStyle(); + } + */ + + private function startService():void + { + productService.send(); + } + + private function loadStyle():void + { + /* load css not implemented yet + var eventDispatcher:IEventDispatcher = + styleManager.loadStyleDeclarations(currentTheme + ".swf"); + eventDispatcher.addEventListener(StyleEvent.COMPLETE, completeHandler); + */ + } + + private function completeHandler(event:Event):void + { + image.source = ValuesManager.valuesImpl.getValue(acb, "storeLogo"); + /* + super.initialized = true; + */ + callLater.callLater(prebake); + } + + /* + override public function set initialized(value:Boolean):void + { + // Hold off until the Runtime CSS SWF is done loading. + } + */ + + private var stateChain:Array; + + private function headHome():void + { + homeButton.selected = true; + if (initialView.currentState == "ProductsState") + { + productsButton.selected = false; + stateChain = ["ProductsWipeUp", "HomeWipeDown", "HomeState"]; + initialView.currentState = "ProductsWipeUp"; + } + else if (initialView.currentState == "SupportState") + { + supportButton.selected = false; + stateChain = ["SupportWipeUp", "HomeWipeDown", "HomeState"]; + initialView.currentState = "SupportWipeUp"; + } + } + + private function headToProducts():void + { + productsButton.selected = true; + if (initialView.currentState == "SupportState") + { + supportButton.selected = false; + stateChain = ["SupportWipeUp", "ProductsWipeDown", "ProductsState"]; + initialView.currentState = "SupportWipeUp"; + } + if (initialView.currentState == "HomeState") + { + homeButton.selected = false; + stateChain = ["HomeWipeUp", "ProductsWipeDown", "ProductsState"]; + initialView.currentState = "HomeWipeUp"; + } + } + + private function headToSupport():void + { + supportButton.selected = true; + if (initialView.currentState == "ProductsState") + { + productsButton.selected = false; + stateChain = ["ProductsWipeUp", "SupportWipeDown", "SupportState"]; + initialView.currentState = "ProductsWipeUp"; + } + if (initialView.currentState == "HomeState") + { + homeButton.selected = false; + stateChain = ["HomeWipeUp", "SupportWipeDown", "SupportState"]; + initialView.currentState = "HomeWipeUp"; + } + } + + private function prebake():void + { + callLater.callLater(prebake2); + } + + private function prebake2():void + { + trace("prebake2"); + stateChain = ["ProductsPreBake", "HomeState"]; + initialView.currentState = "ProductsPreBake"; + } + + private function chainStatesIfNeeded():void + { + if (stateChain != null) + { + if (initialView.currentState == stateChain[0]) + { + callLater.callLater(nextState); + } + } + } + + private function nextState():void + { + stateChain.shift(); + if (stateChain.length) + initialView.currentState = stateChain[0]; + else + stateChain = null; + } + ]]> + </fx:Script> + + <fx:Style source="main.css"/> + <fx:Style source="beige.css"/> + + <fx:Declarations> + <js:HTTPService id="productService" url="data/catalog.json"> + <js:LazyCollection id="catalog" complete="if (pView) pView.catalog = catalog"> + <js:inputParser> + <js:JSONInputParser /> + </js:inputParser> + <js:itemConverter> + <ProductJSONItemConverter /> + </js:itemConverter> + </js:LazyCollection> + </js:HTTPService> + </fx:Declarations> + <js:valuesImpl> + <js:SimpleCSSValuesImpl /> + </js:valuesImpl> + <js:beads> + <js:ViewSourceContextMenuOption /> + <js:CallLaterBead id="callLater" /> + <js:ApplicationDataBinding /> + </js:beads> + <js:initialView> + <js:ViewBase width="990" height="585" + initComplete="completeHandler(null)" + stateChangeComplete="chainStatesIfNeeded()"> + <js:states> + <js:State name="HomeState" stateGroups="['Home']" /> + <js:State name="HomeWipeUp" stateGroups="['Home']" /> + <js:State name="HomeWipeDown" stateGroups="['Home']" /> + <js:State name="ProductsPreBake" stateGroups="['Home', 'Products']" /> + <js:State name="ProductsState" stateGroups="['Products']" /> + <js:State name="ProductsWipeUp" stateGroups="['Products']" /> + <js:State name="ProductsWipeDown" stateGroups="['Products']" /> + <js:State name="SupportState" stateGroups="['Support']" /> + <js:State name="SupportWipeUp" stateGroups="['Support']" /> + <js:State name="SupportWipeDown" stateGroups="['Support']" /> + </js:states> + + <js:transitions> + <js:Transition fromState="HomeState" toState="HomeWipeUp"> + <js:Wipe direction="up" target="homeView" /> + </js:Transition> + <js:Transition fromState="HomeWipeDown" toState="HomeState"> + <js:Wipe direction="down" target="homeView" /> + </js:Transition> + <js:Transition fromState="ProductsState" toState="ProductsWipeUp"> + <js:Wipe direction="up" target="pView" /> + </js:Transition> + <js:Transition fromState="ProductsWipeDown" toState="ProductsState"> + <js:Wipe direction="down" target="pView" /> + </js:Transition> + <js:Transition fromState="SupportState" toState="SupportWipeUp"> + <js:Wipe direction="up" target="supportView" /> + </js:Transition> + <js:Transition fromState="SupportWipeDown" toState="SupportState"> + <js:Wipe direction="down" target="supportView" /> + </js:Transition> + </js:transitions> + <js:beads> + <js:VerticalLayout /> + </js:beads> + <js:ControlBar id="acb" width="100%" className="storeControlBar" > + <js:beads> + <js:HorizontalLayout /> + </js:beads> + <js:Image id="image" /> + <!-- click="toggleTheme()" --> + <!-- toolTip="Change Theme"/ --> + <js:ToggleTextButton id="homeButton" + text="Home" + height="100%" + selected="true" + className="storeButtonBar" + click="headHome()" /> + <js:ToggleTextButton id="productsButton" + text="Products" + height="100%" + className="storeButtonBar" + click="headToProducts()"/> + <js:ToggleTextButton id="supportButton" + text="Support" + height="100%" + className="storeButtonBar" + click="headToSupport()"/> + </js:ControlBar> + <js:Container width="990" id="viewholder"> + <js:style> + <js:SimpleCSSStyles paddingLeft="0" paddingRight="0"/> + </js:style> + + <HomeView id="homeView" width="100%" height="550" includeIn="Home" + /> + <ProductsView id="pView" includeIn="Products" visible.ProductsPreBake="false" + width="100%" height="550" initComplete="if (catalog.length) pView.catalog = catalog" + /> + <SupportView id="supportView" includeIn="Support" + width="100%" height="550" + /> + </js:Container> + </js:ViewBase> + </js:initialView> +</js:Application> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/d33fe63c/examples/flexjs/FlexJSStore/src/HomeView.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/FlexJSStore/src/HomeView.mxml b/examples/flexjs/FlexJSStore/src/HomeView.mxml new file mode 100755 index 0000000..451c5c1 --- /dev/null +++ b/examples/flexjs/FlexJSStore/src/HomeView.mxml @@ -0,0 +1,194 @@ +<?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. + +--> +<!-- +This component is primarily static and is only meant to show what other +pages of the store could look like. + +Note that this page was put together in the Design view so you'll see more +hard coded locations and sizes. + +Also note when working with a Canvas that using the constraint styles +(e.g., left, top, right, bottom) can provide better layout predictability than +using x and y, especially when percentage widths and heights are used. + +Width and height are hard-coded in the root tag to help the Design view. +--> +<js:Container xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:js="library://ns.apache.org/flexjs/basic" + xmlns="*" width="990" height="550" + initComplete="updateMapImage()"> + <fx:Script> + <![CDATA[ + import org.apache.flex.core.ValuesManager; + import org.apache.flex.html.SimpleAlert; + + public function updateMapImage():void + { + mapImage.source = ValuesManager.valuesImpl.getValue(mapCanvas, 'dottedMap'); + } + ]]> + </fx:Script> + <js:beads> + <js:ContainerDataBinding /> + </js:beads> + <js:HContainer width="100%" height="100%" y="0" x="0" className="colorPanel"> + <js:VContainer width="230" height="100%"> + <js:Container width="100%" height="100%"> + + <js:Container height="60" className="homeSection"> + <js:style> + <js:SimpleCSSStyles backgroundColor="#ebebe9" left="10" top="10" right="10"/> + </js:style> + <js:Label style="left:10;top:10" text="Search Developers" height="22" className="sectionHeader" /> + <js:TextButton style="left:168;top:30" text="Go" width="27" height="20" className="glass" click="SimpleAlert.show('This feature is not implemented in this sample', 'Go')"/> + <js:TextInput style="left:10;top:30" height="20" width="150"/> + </js:Container> + + <js:Container height="280" className="homeSection"> + <js:style> + <js:SimpleCSSStyles backgroundColor="#ffffff" left="10" top="78" right="10" /> + </js:style> + <js:VContainer width="100%" height="100%"> + <js:style> + <js:SimpleCSSStyles left="10" top="10" /> + </js:style> + <js:Label text="Flex Experts That Can Help You" className="sectionHeader"/> + <js:HRule height="5" width="187" style="marginLeft:0"/> + <js:Label text="General" className="homeProgramHeader"/> + <js:Label text="BlazeDS Experts" style="fontSize:9"/> + <js:Spacer height="8" width="100%"/> + <js:Label text="Server-side" className="homeProgramHeader"/> + <js:Label text="Java, PHP Developers" style="fontSize:9"/> + <js:Spacer height="8" width="100%"/> + <js:Label text="Mobile" className="homeProgramHeader"/> + <js:Label text="Android, IOS and more" style="fontSize:9"/> + <js:Spacer height="8" width="100%"/> + <js:Label text="Students" className="homeProgramHeader"/> + <js:Label text="Free Assistance" style="fontSize:9"/> + <js:Spacer height="8" width="100%"/> + </js:VContainer> + </js:Container> + + <js:Container height="174" className="homeSection"> + <js:style> + <js:SimpleCSSStyles backgroundColor="#ebebe9" left="10" top="366" right="10" /> + </js:style> + <js:VContainer width="100%" height="100%"> + <js:style> + <js:SimpleCSSStyles left="10" top="10" /> + </js:style> + <js:Label text="Manage My Account" className="sectionHeader"/> + + <js:Label text="Phone Number"/> + + <js:HContainer width="100%" height="25" > + <js:style> + <js:SimpleCSSStyles verticalAlign="middle" /> + </js:style> + <js:TextInput height="20" width="40"/> + <js:HRule width="8" height="2"/> + <js:TextInput height="20" width="40"/> + <js:HRule width="8" height="2"/> + <js:TextInput height="20" width="40"/> + </js:HContainer> + + <js:Label text="Password"/> + <js:TextInput height="20"/> + <js:Spacer height="8" width="100%"/> + + <js:CheckBox text="Remember my phone number" selected="true"/> + <js:Spacer height="8" width="100%"/> + + <js:TextButton text="Login" className="glass" height="20" width="55" click="SimpleAlert.show('This feature is not implemented in this sample', 'Login')"/> + + </js:VContainer> + </js:Container> + + </js:Container> + + </js:VContainer> + + <js:VContainer width="750" height="100%"> + <js:Container width="100%" height="100%"> + + <!-- can't use binding to set the mapImage source because the style isn't available early enough --> + <js:Container id="mapCanvas" height="35%" className="homeMap"> + <js:style> + <js:SimpleCSSStyles left="0" right="10" top="10" /> + </js:style> + <js:Image id="mapImage" width="487" height="100%" alpha="1.0" style="left:10;top:10"/> + <js:Label y="110" text="US Developers . Flex . FlexJS" width="95%" height="40" style="margin:auto;fontWeight:'bold';fontSize:22;color:#ffffff;fontFamily:'Arial';textAlign:'center'"/> + <js:Label text="Learn More >>" width="95" style="fontSize:12;fontFamily:'Arial';bottom:10;right:10"/> + <js:Label text="$60/hr" style="color:#ffffff;fontWeight:'bold';fontFamily:'Arial';fontSize:20;right:10:top:10"/> + <js:Label text="Rates as low as" x="551" y="16" style="fontSize:12"/> + </js:Container> + + <js:Container height="330" > + <js:style> + <js:SimpleCSSStyles backgroundColor="#ffffff" borderStyle="solid" bottom="10" right="10" left="0" /> <!-- cornerRadius="4" --> + </js:style> + + <js:Label style="left:10;top:10" text="Featured Developers" width="173" height="25" className="sectionHeader"/> + + <js:HContainer style="left:10;top:43" width="100%" height="100%"> + <js:VContainer width="33%" height="100%"> + <js:Container width="100%"> + <js:Image id="image1" source="assets/akotter.jpg" style="margin:auto;verticalCenter:0"/> + </js:Container> + + <js:Container width="100%"> + <js:Label text="Annette Kotter" id="feat_prod_1" style="margin:auto;fontWeight:'bold';fontSize:12"/> + </js:Container> + + </js:VContainer> + + <js:VContainer width="33%" height="100%"> + <js:Container width="100%"> + <js:Image id="image2" style="margin:auto;verticalCenter:0" source="assets/bcrater.jpg"/> + </js:Container> + + <js:Container width="100%"> + <js:Label text="Ben Crater" id="feat_prod_2" style="margin:auto;fontWeight:'bold';fontSize:12"/> + </js:Container> + + </js:VContainer> + + <js:VContainer width="33%" height="100%"> + <js:Container width="100%"> + <js:Image id="image3" style="margin:auto;verticalCenter:0" source="assets/jproctor.jpg"/> + </js:Container> + + <js:Container width="100%"> + <js:Label text="Jane Proctor" id="feat_prod_3" style="margin:auto;fontWeight:'bold';fontSize:12"/> + </js:Container> + + </js:VContainer> + + </js:HContainer> + + </js:Container> + + </js:Container> + + </js:VContainer> + + </js:HContainer> + +</js:Container>
