Repository: flex-asjs Updated Branches: refs/heads/develop 0272dbdb2 -> 2be6d7351
Added jQuery versions. Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/2be6d735 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/2be6d735 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/2be6d735 Branch: refs/heads/develop Commit: 2be6d73519c2efb4f36879c9c107fde0f37af7be Parents: 0272dbd Author: Peter Ent <[email protected]> Authored: Wed Jan 14 15:11:47 2015 -0500 Committer: Peter Ent <[email protected]> Committed: Wed Jan 14 15:11:47 2015 -0500 ---------------------------------------------------------------------- .../FlexJSStore/src/FlexJSStore_jquery.mxml | 270 +++++++++++++++++++ examples/FlexJSStore/src/HomeView_jquery.mxml | 207 ++++++++++++++ 2 files changed, 477 insertions(+) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/2be6d735/examples/FlexJSStore/src/FlexJSStore_jquery.mxml ---------------------------------------------------------------------- diff --git a/examples/FlexJSStore/src/FlexJSStore_jquery.mxml b/examples/FlexJSStore/src/FlexJSStore_jquery.mxml new file mode 100755 index 0000000..cdf073a --- /dev/null +++ b/examples/FlexJSStore/src/FlexJSStore_jquery.mxml @@ -0,0 +1,270 @@ +<?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. + +--> +<jquery:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:basic="library://ns.apache.org/flexjs/basic" + xmlns:mx="library://ns.adobe.com/flex/mx" + xmlns:jquery="library://ns.apache.org/flexjs/jquery" + 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> + <basic:HTTPService id="productService" url="data/catalog.json"> + <basic:LazyCollection id="catalog"> + <basic:inputParser> + <basic:JSONInputParser /> + </basic:inputParser> + <basic:itemConverter> + <ProductJSONItemConverter /> + </basic:itemConverter> + </basic:LazyCollection> + </basic:HTTPService> + </fx:Declarations> + <jquery:valuesImpl> + <basic:SimpleCSSValuesImpl /> + </jquery:valuesImpl> + <jquery:beads> + <basic:CallLaterBead id="callLater" /> + <basic:ApplicationDataBinding /> + </jquery:beads> + <jquery:initialView> + <basic:ViewBase width="990" height="550" + initComplete="completeHandler(null)" + stateChangeComplete="chainStatesIfNeeded()"> + <basic:states> + <mx:State name="HomeState" stateGroups="['Home']" /> + <mx:State name="HomeWipeUp" stateGroups="['Home']" /> + <mx:State name="HomeWipeDown" stateGroups="['Home']" /> + <mx:State name="ProductsPreBake" stateGroups="['Home', 'Products']" /> + <mx:State name="ProductsState" stateGroups="['Products']" /> + <mx:State name="ProductsWipeUp" stateGroups="['Products']" /> + <mx:State name="ProductsWipeDown" stateGroups="['Products']" /> + <mx:State name="SupportState" stateGroups="['Support']" /> + <mx:State name="SupportWipeUp" stateGroups="['Support']" /> + <mx:State name="SupportWipeDown" stateGroups="['Support']" /> + </basic:states> + + <basic:transitions> + <basic:Transition fromState="HomeState" toState="HomeWipeUp"> + <basic:Wipe direction="up" target="homeView" /> + </basic:Transition> + <basic:Transition fromState="HomeWipeDown" toState="HomeState"> + <basic:Wipe direction="down" target="homeView" /> + </basic:Transition> + <basic:Transition fromState="ProductsState" toState="ProductsWipeUp"> + <basic:Wipe direction="up" target="pView" /> + </basic:Transition> + <basic:Transition fromState="ProductsWipeDown" toState="ProductsState"> + <basic:Wipe direction="down" target="pView" /> + </basic:Transition> + <basic:Transition fromState="SupportState" toState="SupportWipeUp"> + <basic:Wipe direction="up" target="supportView" /> + </basic:Transition> + <basic:Transition fromState="SupportWipeDown" toState="SupportState"> + <basic:Wipe direction="down" target="supportView" /> + </basic:Transition> + </basic:transitions> + <basic:beads> + <basic:NonVirtualVerticalLayout /> + </basic:beads> + <basic:ControlBar id="acb" width="100%" className="storeControlBar" > + <basic:beads> + <basic:NonVirtualHorizontalLayout /> + <basic:LayoutChangeNotifier watchedProperty="{image.width}" /> + </basic:beads> + <basic:Image id="image" /> + <!-- click="toggleTheme()" --> + <!-- toolTip="Change Theme"/ --> + <basic:ToggleTextButton id="homeButton" + text="Home" + height="100%" + selected="true" + className="storeButtonBar" + click="headHome()" /> + <basic:ToggleTextButton id="productsButton" + text="Products" + height="100%" + className="storeButtonBar" + click="headToProducts()"/> + <basic:ToggleTextButton id="supportButton" + text="Support" + height="100%" + className="storeButtonBar" + click="headToSupport()"/> + </basic:ControlBar> + <basic:Container width="990" > + <basic:style> + <basic:SimpleCSSStyles paddingLeft="0" paddingRight="0" horizontalCenter="0"/> + </basic:style> + + <HomeView id="homeView" width="100%" height="550" includeIn="Home" + /> + <ProductsView id="pView" includeIn="Products" visible.ProductsPreBake="false" + width="100%" height="550" initComplete="pView.catalog = catalog" + /> + <SupportView id="supportView" includeIn="Support" + width="100%" height="550" + /> + </basic:Container> + </basic:ViewBase> + </jquery:initialView> +</jquery:Application> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/2be6d735/examples/FlexJSStore/src/HomeView_jquery.mxml ---------------------------------------------------------------------- diff --git a/examples/FlexJSStore/src/HomeView_jquery.mxml b/examples/FlexJSStore/src/HomeView_jquery.mxml new file mode 100755 index 0000000..8273c19 --- /dev/null +++ b/examples/FlexJSStore/src/HomeView_jquery.mxml @@ -0,0 +1,207 @@ +<?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. +--> +<basic:Container xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:basic="library://ns.apache.org/flexjs/basic" + xmlns:mx="library://ns.adobe.com/flex/mx" + xmlns:jquery="library://ns.apache.org/flexjs/jquery" + 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> + <basic:beads> + <basic:ContainerDataBinding /> + </basic:beads> + <basic:HContainer width="100%" height="100%" y="0" x="0" className="colorPanel"> + <basic:VContainer width="230" height="100%"> + <basic:Container width="100%" height="100%"> + + <basic:Container height="60" className="homeSection"> + <basic:style> + <basic:SimpleCSSStyles backgroundColor="#ebebe9" left="10" top="10" right="10"/> + </basic:style> + <basic:Label style="left:10;top:10" text="Search Developers" height="22" className="sectionHeader" /> + <jquery: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')"/> + <basic:TextInput style="left:10;top:30" height="20" width="150"/> + </basic:Container> + + <basic:Container height="280" className="homeSection"> + <basic:style> + <basic:SimpleCSSStyles backgroundColor="#ffffff" left="10" top="78" right="10" /> + </basic:style> + <basic:VContainer width="100%" height="100%"> + <basic:style> + <basic:SimpleCSSStyles left="10" top="10" /> + </basic:style> + <basic:Label text="Flex Experts That Can Help You" className="sectionHeader"/> + <basic:HRule height="5" width="187" style="marginLeft:0"/> + <basic:Label text="General" className="homeProgramHeader"/> + <basic:Label text="BlazeDS Experts" style="fontSize:9"/> + <basic:Spacer height="8" width="100%"/> + <basic:Label text="Server-side" className="homeProgramHeader"/> + <basic:Label text="Java, PHP Developers" style="fontSize:9"/> + <basic:Spacer height="8" width="100%"/> + <basic:Label text="Mobile" className="homeProgramHeader"/> + <basic:Label text="Android, IOS and more" style="fontSize:9"/> + <basic:Spacer height="8" width="100%"/> + <basic:Label text="Students" className="homeProgramHeader"/> + <basic:Label text="Free Assistance" style="fontSize:9"/> + <basic:Spacer height="8" width="100%"/> + </basic:VContainer> + </basic:Container> + + <basic:Container height="174" className="homeSection"> + <basic:style> + <basic:SimpleCSSStyles backgroundColor="#ebebe9" left="10" top="366" right="10" /> + </basic:style> + <basic:VContainer width="100%" height="100%"> + <basic:style> + <basic:SimpleCSSStyles left="10" top="10" /> + </basic:style> + <basic:Label text="Manage My Account" className="sectionHeader"/> + + <basic:Label text="Phone Number"/> + + <basic:HContainer width="100%" height="25" > + <basic:style> + <basic:SimpleCSSStyles horizontalAlign="left" verticalAlign="middle" /> + </basic:style> + <basic:TextInput height="20" width="40"/> + <basic:HRule width="8" height="2"/> + <basic:TextInput height="20" width="40"/> + <basic:HRule width="8" height="2"/> + <basic:TextInput height="20" width="40"/> + </basic:HContainer> + + <basic:Label text="Password"/> + <basic:TextInput height="20"/> + <basic:Spacer height="8" width="100%"/> + + <jquery:CheckBox text="Remember my phone number" selected="true"/> + <basic:Spacer height="8" width="100%"/> + + <jquery:TextButton text="Login" className="glass" height="20" width="55" click="SimpleAlert.show('This feature is not implemented in this sample', 'Login')"/> + + </basic:VContainer> + </basic:Container> + + </basic:Container> + + </basic:VContainer> + + <basic:VContainer width="750" height="100%"> + <basic:Container width="100%" height="100%"> + + <!-- can't use binding to set the mapImage source because the style isn't available early enough --> + <basic:Container id="mapCanvas" height="35%" className="homeMap"> + <basic:style> + <basic:SimpleCSSStyles left="0" right="10" top="10" /> + </basic:style> + <basic:Image id="mapImage" width="487" height="100%" alpha="1.0" style="left:10;top:10"/> + <basic:Label y="110" text="US Developers . Flex . FlexJS" width="95%" height="40" style="horizontalCenter:0;fontWeight:'bold';fontSize:22;color:#ffffff;fontFamily:'Arial';textAlign:'center'"/> + <basic:Label text="Learn More >>" width="95" style="fontSize:12;fontFamily:'Arial';bottom:10;right:10"/> + <basic:Label text="$60/hr" style="color:#ffffff;fontWeight:'bold';fontFamily:'Arial';fontSize:20;right:10:top:10"/> + <basic:Label text="Rates as low as" x="551" y="16" style="fontSize:12"/> + </basic:Container> + + <basic:Container height="330" > + <basic:style> + <basic:SimpleCSSStyles backgroundColor="#ffffff" borderStyle="solid" bottom="10" right="10" left="0" /> <!-- cornerRadius="4" --> + </basic:style> + + <basic:Label style="left:10;top:10" text="Featured Developers" width="173" height="25" className="sectionHeader"/> + + <basic:HContainer style="left:10;top:43" width="100%" height="100%"> + <basic:VContainer width="33%" height="100%"> + <basic:beads> + <basic:LayoutChangeNotifier watchedProperty="{image1.height}" /> + </basic:beads> + <basic:Container width="100%"> + <basic:Image id="image1" source="assets/akotter.jpg" style="horizontalCenter:0;verticalCenter:0"/> + </basic:Container> + + <basic:Container width="100%"> + <basic:Label text="Annette Kotter" id="feat_prod_1" style="horizontalCenter:0;fontWeight:'bold';fontSize:12"/> + </basic:Container> + + </basic:VContainer> + + <basic:VContainer width="33%" height="100%"> + <basic:beads> + <basic:LayoutChangeNotifier watchedProperty="{image2.height}" /> + </basic:beads> + + <basic:Container width="100%"> + <basic:Image id="image2" style="horizontalCenter:0;verticalCenter:0" source="assets/bcrater.jpg"/> + </basic:Container> + + <basic:Container width="100%"> + <basic:Label text="Ben Crater" id="feat_prod_2" style="horizontalCenter:0;fontWeight:'bold';fontSize:12"/> + </basic:Container> + + </basic:VContainer> + + <basic:VContainer width="33%" height="100%"> + <basic:beads> + <basic:LayoutChangeNotifier watchedProperty="{image3.height}" /> + </basic:beads> + + <basic:Container width="100%"> + <basic:Image id="image3" style="horizontalCenter:0;verticalCenter:0" source="assets/jproctor.jpg"/> + </basic:Container> + + <basic:Container width="100%"> + <basic:Label text="Jane Proctor" id="feat_prod_3" style="horizontalCenter:0;fontWeight:'bold';fontSize:12"/> + </basic:Container> + + </basic:VContainer> + + </basic:HContainer> + + </basic:Container> + + </basic:Container> + + </basic:VContainer> + + </basic:HContainer> + +</basic:Container>
