Repository: flex-examples Updated Branches: refs/heads/develop a3a903137 -> c652cfba6
http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/productsView/ProductCatalogPanelSkin.mxml ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/productsView/ProductCatalogPanelSkin.mxml b/FlexStore/spark/src/productsView/ProductCatalogPanelSkin.mxml new file mode 100644 index 0000000..d7f4aea --- /dev/null +++ b/FlexStore/spark/src/productsView/ProductCatalogPanelSkin.mxml @@ -0,0 +1,286 @@ +<?xml version="1.0" encoding="utf-8"?> + +<!-- + +ADOBE SYSTEMS INCORPORATED +Copyright 2008 Adobe Systems Incorporated +All Rights Reserved. + +NOTICE: Adobe permits you to use, modify, and distribute this file +in accordance with the terms of the license agreement accompanying it. + +--> + +<!--- The default skin class for a Spark Panel container. + + @see spark.components.Panel + + @langversion 3.0 + @playerversion Flash 10 + @playerversion AIR 1.5 + @productversion Flex 4 +--> +<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:fb="http://ns.adobe.com/flashbuilder/2009"; blendMode="normal" mouseEnabled="false" + minWidth="131" minHeight="127" alpha.disabled="0.5" alpha.disabledWithControlBar="0.5" xmlns:productsView="productsView.*"> + <fx:Metadata>[HostComponent("productsView.ProductCatalogPanel")]</fx:Metadata> + + <fx:Script fb:purpose="styling"> + <![CDATA[ + import mx.core.FlexVersion; + + /* Define the skin elements that should not be colorized. + For panel, border and title background are skinned, but the content area, background, border, and title text are not. */ + static private const exclusions:Array = ["background", "titleDisplay", "contentGroup", "controlBarGroup", "border"]; + + /* exclusions before Flex 4.5 for backwards-compatibility purposes */ + static private const exclusions_4_0:Array = ["background", "titleDisplay", "contentGroup", "controlBarGroup"]; + + /** + * @private + */ + override public function get colorizeExclusions():Array + { + // Since border is styleable via borderColor, no need to allow chromeColor to affect + // the border. This is wrapped in a compatibility flag since this change was added + // in Flex 4.5 + if (FlexVersion.compatibilityVersion < FlexVersion.VERSION_4_5) + { + return exclusions_4_0; + } + + return exclusions; + } + + /** + * @private + */ + override protected function initializationComplete():void + { + useChromeColor = true; + super.initializationComplete(); + } + + /** + * @private + */ + override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void + { + if (getStyle("borderVisible") == true) + { + border.visible = true; + background.left = background.top = background.right = background.bottom = 1; + contents.left = contents.top = contents.right = contents.bottom = 1; + } + else + { + border.visible = false; + background.left = background.top = background.right = background.bottom = 0; + contents.left = contents.top = contents.right = contents.bottom = 0; + } + + dropShadow.visible = getStyle("dropShadowVisible"); + + var cr:Number = getStyle("cornerRadius"); + var withControls:Boolean = + (currentState == "disabledWithControlBar" || + currentState == "normalWithControlBar"); + + if (cornerRadius != cr) + { + cornerRadius = cr; + + dropShadow.tlRadius = cornerRadius; + dropShadow.trRadius = cornerRadius; + dropShadow.blRadius = withControls ? cornerRadius : 0; + dropShadow.brRadius = withControls ? cornerRadius : 0; + + setPartCornerRadii(topMaskRect, withControls); + setPartCornerRadii(border, withControls); + setPartCornerRadii(background, withControls); + } + + if (bottomMaskRect) setPartCornerRadii(bottomMaskRect, withControls); + + borderStroke.color = getStyle("borderColor"); + borderStroke.alpha = getStyle("borderAlpha"); + backgroundFill.color = getStyle("backgroundColor"); + backgroundFill.alpha = getStyle("backgroundAlpha"); + + super.updateDisplayList(unscaledWidth, unscaledHeight); + } + + /** + * @private + */ + private function setPartCornerRadii(target:Rect, includeBottom:Boolean):void + { + target.topLeftRadiusX = cornerRadius; + target.topRightRadiusX = cornerRadius; + target.bottomLeftRadiusX = includeBottom ? cornerRadius : 0; + target.bottomRightRadiusX = includeBottom ? cornerRadius : 0; + } + + private var cornerRadius:Number; + ]]> + </fx:Script> + + <s:states> + <s:State name="normal" /> + <s:State name="disabled" /> + <s:State name="normalWithControlBar" stateGroups="withControls" /> + <s:State name="disabledWithControlBar" stateGroups="withControls" /> + </s:states> + + <!-- drop shadow can't be hittable so it stays sibling of other graphics --> + <!--- @private --> + <s:RectangularDropShadow id="dropShadow" blurX="20" blurY="20" alpha="0.32" distance="11" + angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/> + + <!-- drop shadow can't be hittable so all other graphics go in this group --> + <s:Group left="0" right="0" top="0" bottom="0"> + + <!-- top group mask --> + <!--- @private --> + <s:Group left="1" top="1" right="1" bottom="1" id="topGroupMask" > + <!--- @private --> + <s:Rect id="topMaskRect" left="0" top="0" right="0" bottom="0"> + <s:fill> + <s:SolidColor alpha="0"/> + </s:fill> + </s:Rect> + </s:Group> + + <!-- bottom group mask --> + <!--- @private --> + <s:Group left="1" top="1" right="1" bottom="1" id="bottomGroupMask" + includeIn="normalWithControlBar, disabledWithControlBar"> + <!--- @private --> + <s:Rect id="bottomMaskRect" left="0" top="0" right="0" bottom="0"> + <s:fill> + <s:SolidColor alpha="0"/> + </s:fill> + </s:Rect> + </s:Group> + + <!-- layer 1: border --> + <!--- @private --> + <s:Rect id="border" left="0" right="0" top="0" bottom="0" > + <s:stroke> + <!--- @private --> + <s:SolidColorStroke id="borderStroke" weight="1" /> + </s:stroke> + </s:Rect> + + <!-- layer 2: background fill --> + <!--- Defines the appearance of the PanelSkin class's background. --> + <s:Rect id="background" left="1" top="1" right="1" bottom="1"> + <s:fill> + <!--- @private + Defines the PanelSkin class's background fill. The default color is 0xFFFFFF. --> + <s:SolidColor id="backgroundFill" color="#FFFFFF"/> + </s:fill> + </s:Rect> + + <!-- layer 3: contents --> + <!--- Contains the vertical stack of titlebar content and controlbar. --> + <s:Group left="1" right="1" top="1" bottom="1" id="contents"> + <s:layout> + <s:VerticalLayout gap="0" horizontalAlign="justify" /> + </s:layout> + + <!--- @private --> + <s:Group id="topGroup" mask="{topGroupMask}"> + + <!-- layer 0: title bar fill --> + <!--- @private --> + <s:Rect id="tbFill" left="0" right="0" top="0" bottom="1"> + <s:fill> + <s:LinearGradient rotation="90"> + <s:GradientEntry color="0xE2E2E2" /> + <s:GradientEntry color="0xD9D9D9" /> + </s:LinearGradient> + </s:fill> + </s:Rect> + + <!-- layer 1: title bar highlight --> + <!--- @private --> + <s:Rect id="tbHilite" left="0" right="0" top="0" bottom="0"> + <s:stroke> + <s:LinearGradientStroke rotation="90" weight="1"> + <s:GradientEntry color="0xEAEAEA" /> + <s:GradientEntry color="0xD9D9D9" /> + </s:LinearGradientStroke> + </s:stroke> + </s:Rect> + + <!-- layer 2: title bar divider --> + <!--- @private --> + <s:Rect id="tbDiv" left="0" right="0" height="1" bottom="0"> + <s:fill> + <s:SolidColor color="0xC0C0C0" /> + </s:fill> + </s:Rect> + + <!-- layer 3: text --> + <!--- @copy spark.components.Panel#titleDisplay --> + <s:Label id="titleDisplay" maxDisplayedLines="1" + left="9" right="3" top="1" bottom="0" minHeight="30" + verticalAlign="middle" textAlign="start" fontWeight="bold"> + </s:Label> + <productsView:CatalogTitleButtons id="titleButtons" width="50%" right="0" top="6" /> + </s:Group> + + <!-- + Note: setting the minimum size to 0 here so that changes to the host component's + size will not be thwarted by this skin part's minimum size. This is a compromise, + more about it here: http://bugs.adobe.com/jira/browse/SDK-21143 + --> + <!--- @copy spark.components.SkinnableContainer#contentGroup --> + <s:Group id="contentGroup" width="100%" height="100%" minWidth="0" minHeight="0"> + </s:Group> + + <!--- @private --> + <s:Group id="bottomGroup" minWidth="0" minHeight="0" + includeIn="normalWithControlBar, disabledWithControlBar" > + + <s:Group left="0" right="0" top="0" bottom="0" mask="{bottomGroupMask}"> + + <!-- layer 0: control bar divider line --> + <s:Rect left="0" right="0" top="0" height="1" alpha="0.22"> + <s:fill> + <s:SolidColor color="0x000000" /> + </s:fill> + </s:Rect> + + <!-- layer 1: control bar highlight --> + <s:Rect left="0" right="0" top="1" bottom="0"> + <s:stroke> + <s:LinearGradientStroke rotation="90" weight="1"> + <s:GradientEntry color="0xE5E5E5" /> + <s:GradientEntry color="0xD8D8D8" /> + </s:LinearGradientStroke> + </s:stroke> + </s:Rect> + + <!-- layer 2: control bar fill --> + <s:Rect left="1" right="1" top="2" bottom="1"> + <s:fill> + <s:LinearGradient rotation="90"> + <s:GradientEntry color="0xDADADA" /> + <s:GradientEntry color="0xC5C5C5" /> + </s:LinearGradient> + </s:fill> + </s:Rect> + </s:Group> + <!-- layer 3: control bar --> + <!--- @copy spark.components.Panel#controlBarGroup --> + <s:Group id="controlBarGroup" left="0" right="0" top="1" bottom="1" minWidth="0" minHeight="0"> + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="7" paddingBottom="7" gap="10" /> + </s:layout> + </s:Group> + </s:Group> + </s:Group> + </s:Group> +</s:SparkSkin> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/productsView/ProductCatalogThumbnail.mxml ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/productsView/ProductCatalogThumbnail.mxml b/FlexStore/spark/src/productsView/ProductCatalogThumbnail.mxml new file mode 100644 index 0000000..60c5821 --- /dev/null +++ b/FlexStore/spark/src/productsView/ProductCatalogThumbnail.mxml @@ -0,0 +1,195 @@ +<?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. + +--> +<s:BorderContainer xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + width="{COL_WIDTH_4}" height="{COL_HEIGHT_4}" height.compare="502" + width.x4cols="{COL_WIDTH_4}" height.x4cols="{COL_HEIGHT_4}" + width.x3cols="{COL_WIDTH_3}" height.x3cols="{COL_HEIGHT_3}" + width.x2cols="{COL_WIDTH_2}" height.x2cols="{COL_HEIGHT_2}" + + borderStyle="solid" + borderColor="#FFFFFF" + rollOver="rollOverHandler(event)" + rollOut="rollOutHandler(event)" + mouseDown="mouseDownHandler(event)" + mouseMove="mouseMoveHandler(event)" + mouseUp="mouseUpHandler(event)" + click="clickHandler(event)" + currentState="x4cols" + automationName="{product.name}" + > + + <fx:Metadata> + [Event(name="purchase", type="samples.flexstore.ProductThumbEvent")] + [Event(name="compare", type="samples.flexstore.ProductThumbEvent")] + [Event(name="details", type="samples.flexstore.ProductThumbEvent")] + </fx:Metadata> + + <fx:Script> + <![CDATA[ + + import mx.events.*; + import mx.core.*; + + import samples.flexstore.Product; + import samples.flexstore.ProductThumbEvent; + + public static const COL_WIDTH_4:int = 162; + public static const COL_HEIGHT_4:int = 122; + public static const COL_WIDTH_3:int = 217; + public static const COL_HEIGHT_3:int = 165; + public static const COL_WIDTH_2:int = 327; + public static const COL_HEIGHT_2:int = 250; + public static const COMPARE_WIDTH:int = 162; + public static const HORIZONTAL_GAP:int = 2; + public static const VERTICAL_GAP:int = 3; + + [Bindable] + public var product:Product; + + private function rollOverHandler(event:MouseEvent):void + { + setStyle("borderColor", "#CCCCCC"); + setStyle("dropShadowEnabled", true); + buttons.visible = true; + } + + private function rollOutHandler(event:MouseEvent):void + { + setStyle("borderColor", "#FFFFFF"); + setStyle("dropShadowEnabled", false); + buttons.visible = false; + } + + private var dragStartPoint:Point; + + public function mouseDownHandler(event:MouseEvent):void + { + if (event.target != purchase && + event.target != compare && + event.target != details) + { + dragStartPoint = new Point(event.stageX, event.stageY); + dragStartPoint = globalToLocal(dragStartPoint); + + } + } + + public function mouseMoveHandler(event:MouseEvent):void + { + if (dragStartPoint != null) + { + var dragEvent:DragEvent = new DragEvent(DragEvent.DRAG_START, true); + dragEvent.localX = dragStartPoint.x; + dragEvent.localY = dragStartPoint.y; + dragEvent.buttonDown = true; + dispatchEvent(dragEvent); + + rollOutHandler(event); + + dragStartPoint = null; + } + } + + public function mouseUpHandler(event:MouseEvent):void + { + if (dragStartPoint != null) + { + dragStartPoint = null; + } + } + + public function clickHandler(event:MouseEvent):void + { + if (event.target != purchase && + event.target != compare && + event.target != details) + { + dispatchEvent(new ProductThumbEvent(ProductThumbEvent.DETAILS, product)); + } + } + + ]]> + </fx:Script> + + <fx:Declarations> + <s:CurrencyFormatter currencySymbol="$" id="cf" fractionalDigits="2"/> + </fx:Declarations> + + <s:VGroup id="vb" width="100%" height="100%" + paddingLeft="6" paddingTop="4" paddingRight="8" paddingBottom="4" + gap="0"> + + <s:Label text="{product.name}" fontWeight="bold"/> + + <s:HGroup width="100%" paddingTop="0" gap="4"> + + <s:Image id="img" height="90" width="45" + width.x3cols="60" height.x3cols="120" + width.x2cols="60" height.x2cols="120" + source="{product.image}" /> + + <s:VGroup id="descr" width="100%" height="100%" gap="0" paddingTop="0"> + <s:Label text="{product.featureString}" width="80" height="48" maxDisplayedLines="5"/> + <s:Label text="{cf.format(product.price)}" fontWeight="bold"/> + <s:Spacer height="4"/> + <s:Label text="{product.highlight1}" color="#EE8D0C" includeIn="x3cols, x2cols"/> + <s:Label text="{product.highlight2}" color="#EE8D0C" includeIn="x3cols, x2cols"/> + </s:VGroup> + + </s:HGroup> + + <s:Spacer height="8"/> + + <s:Label text="Years: {product.experience}" includeIn="compare"/> + <s:Label text="BlazeDS: {product.blazeds}" includeIn="compare"/> + <s:Label text="Mobile: {product.mobile}" includeIn="compare"/> + <s:Label text="Video: {product.video}" includeIn="compare"/> + <s:Label text="Highlight: {product.highlight1}" includeIn="compare"/> + <s:Label text="Highlight: {product.highlight2}" includeIn="compare"/> + <s:Label text="Description:" includeIn="compare"/> + <s:Label text="{product.description}" width="100%" includeIn="compare" maxDisplayedLines="5"/> + </s:VGroup> + + + <s:VGroup id="buttons" visible="false" gap="4" paddingRight="8" right="8" top="12"> + <s:Button id="purchase" icon="@Embed('/assets/icon_cart_empty.png')" + click="dispatchEvent(new ProductThumbEvent(ProductThumbEvent.PURCHASE, product))" + width="30" toolTip="Add to cart"/> + <s:Button id="compare" icon="@Embed('/assets/icon_compare.png')" + click="dispatchEvent(new ProductThumbEvent(ProductThumbEvent.COMPARE, product))" + width="30" toolTip="Add to compare list"/> + <s:Button id="details" icon="@Embed('/assets/icon_details.png')" + click="dispatchEvent(new ProductThumbEvent(ProductThumbEvent.DETAILS, product))" + width="30" toolTip="Show details"/> + </s:VGroup> + + <s:states> + + <s:State name="compare" /> + + <s:State name="x4cols" /> + + <s:State name="x3cols" /> + + <s:State name="x2cols"/> + </s:states> + +</s:BorderContainer> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/productsView/ProductDetails.mxml ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/productsView/ProductDetails.mxml b/FlexStore/spark/src/productsView/ProductDetails.mxml new file mode 100644 index 0000000..4b2417d --- /dev/null +++ b/FlexStore/spark/src/productsView/ProductDetails.mxml @@ -0,0 +1,121 @@ +<?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. + +--> +<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:productsView="productsView.*" + > + + <fx:Metadata> + [Event(name="purchase", type="samples.flexstore.ProductThumbEvent")] + [Event(name="compare", type="samples.flexstore.ProductThumbEvent")] + [Event(name="browse", type="samples.flexstore.ProductThumbEvent")] + </fx:Metadata> + + <fx:Script> + <![CDATA[ + + import mx.events.*; + + import samples.flexstore.Product; + import samples.flexstore.ProductThumbEvent; + + private var _product:Product; + + [Bindable] + public function get product():Product + { + return _product; + } + + public function set product(p:Product):void + { + _product = p; + tn.selectedIndex = 0; + } + + ]]> + </fx:Script> + + <fx:Declarations> + <s:CurrencyFormatter currencySymbol="$" id="cf" fractionalDigits="2"/> + </fx:Declarations> + + <s:states> + <s:State name="Features" /> + <s:State name="Support" /> + </s:states> + + <s:transitions> + <s:Transition> + <s:Fade /> + </s:Transition> + </s:transitions> + + <s:TabBar id="tn" width="100%" change="currentState = tn.selectedItem"> + <s:dataProvider> + <s:ArrayList> + <fx:Array> + <fx:String>Features</fx:String> + <fx:String>Support</fx:String> + </fx:Array> + </s:ArrayList> + </s:dataProvider> + </s:TabBar> + <s:Group width="100%" height="100%" + left="4" right="8" top="34" bottom="4"> + + <s:VGroup width="100%" height="100%" includeIn="Features" gap="8" + paddingLeft="8" paddingTop="8" paddingRight="8" paddingBottom="8"> + + <s:HGroup width="100%" gap="12"> + + <s:Image id="img" width="101" height="200" source="{product.image}"/> + + <s:VGroup id="descr" width="100%" height="100%" paddingTop="0" gap="4"> + + <s:Label text="{product.name}" fontSize="11" fontWeight="bold"/> + + <s:Label text="{product.featureString}" width="80" height="48" maxDisplayedLines="4"/> + + <s:Label text="{product.highlight1}" color="#EE8D0C"/> + + <s:Label text="{product.highlight2}" color="#EE8D0C"/> + + <s:Label text="{cf.format(product.price)}" fontWeight="bold"/> + + </s:VGroup> + </s:HGroup> + + <s:Label id="descriptionText" width="100%" height="100%" text="{product.description}" maxDisplayedLines="0"/> + + </s:VGroup> + + <productsView:ProductSupport width="100%" height="100%" includeIn="Support" /> + + </s:Group> + + <s:VGroup gap="4" right="16" top="36"> + <s:Spacer width="100%"/> + <s:Button icon="@Embed('/assets/icon_cart_empty.png')" click="dispatchEvent(new ProductThumbEvent(ProductThumbEvent.PURCHASE, product))" width="30" toolTip="Add to cart"/> + <s:Button icon="@Embed('/assets/icon_compare.png')" click="dispatchEvent(new ProductThumbEvent(ProductThumbEvent.COMPARE, product))" width="30" toolTip="Add to compare list"/> + <s:Button icon="@Embed('/assets/icon_tiles.png')" click="dispatchEvent(new ProductThumbEvent(ProductThumbEvent.BROWSE, product));" width="30" toolTip="Back to thumbnail view"/> + </s:VGroup> + +</s:Group> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/productsView/ProductFilterPanel.mxml ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/productsView/ProductFilterPanel.mxml b/FlexStore/spark/src/productsView/ProductFilterPanel.mxml new file mode 100644 index 0000000..a0310df --- /dev/null +++ b/FlexStore/spark/src/productsView/ProductFilterPanel.mxml @@ -0,0 +1,200 @@ +<?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. + +--> +<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:productsView="productsView.*" + xmlns:flexstore="samples.flexstore.*" + height="100%" + paddingLeft="4" + paddingRight="12" + paddingTop="12" + paddingBottom="8" + gap="0" + currentState="showingThumbnails"> + + <fx:Metadata> + [Event(name="filter", type="samples.flexstore.ProductFilterEvent")] + [Event("compare")] + </fx:Metadata> + + <fx:Script> + <![CDATA[ + import mx.controls.sliderClasses.Slider; + import mx.controls.Alert; + import samples.flexstore.ProductFilterEvent; + + private var thumbBeingPressed:Boolean; + + private function dispatchFilter():void + { + var event:ProductFilterEvent = + new ProductFilterEvent(filter, thumbBeingPressed); + dispatchEvent(event); + currentState = "showingThumbnails"; + } + + private function sliderValue(values:Array, index:int):Number + { + return values[index]; + } + + private function productRemoved():void + { + if (currentState == "showingComparison") + { + if (productList.items.length == 0) + { + dispatchFilter(); + } + else + { + attemptCompare(); + } + } + } + + private function attemptCompare():void + { + if (productList.items.length > 0) + { + dispatchEvent(new Event("compare")); + currentState = "showingComparison"; + } + else + { + Alert.show("There are no items to compare.", "Compare"); + } + } + + ]]> + </fx:Script> + <fx:Declarations> + <flexstore:ProductFilter id="filter"> + <flexstore:experience>{series.selectedItem}</flexstore:experience> + <flexstore:minPrice>{loPrice.value}</flexstore:minPrice> + <flexstore:maxPrice>{hiPrice.value}</flexstore:maxPrice> + <flexstore:blazeds>{cbBlazeDS.selected}</flexstore:blazeds> + <flexstore:mobile>{cbMobile.selected}</flexstore:mobile> + <flexstore:video>{cbVideo.selected}</flexstore:video> + </flexstore:ProductFilter> + + <s:CurrencyFormatter currencySymbol="$" id="cf"/> + + </fx:Declarations> + + <s:Label text="Find" styleName="sectionHeader"/> + + <s:HGroup width="100%"> + <s:TextInput styleName="glass" width="100%"/> + <s:Button styleName="glass" label="Go" click="Alert.show('This feature is not implemented in this sample', 'Find')"/> + </s:HGroup> + + <s:Spacer height="18"/> + + <s:Line width="100%"/> + + <s:Spacer height="8"/> + + <s:HGroup paddingTop="0" paddingLeft="0" verticalAlign="bottom"> + <s:Label text="Filter" styleName="sectionHeader"/> + <s:Label text="({filter.count} items selected)" color="{getStyle('themeColor')}" fontWeight="bold"/> + </s:HGroup> + + <s:Spacer height="8"/> + + <s:Label text="Years of Experience"/> + + <s:ComboBox id="series" styleName="glass" width="140" change="dispatchFilter();"> + <s:dataProvider> + <s:ArrayList> + <fx:Array> + <fx:String>All</fx:String> + <fx:String>3</fx:String> + <fx:String>5</fx:String> + <fx:String>7</fx:String> + <fx:String>9</fx:String> + </fx:Array> + </s:ArrayList> + </s:dataProvider> + </s:ComboBox> + + <s:Spacer height="18"/> + + <s:Label text="Price"/> + + <!--<s:HSlider id="priceSlider" styleName="glassSlider" minimum="0" maximum="200" tickInterval="10" snapInterval="10" + width="100%" thumbCount="2" values="[0,200]" labels="[$0,$200]" liveDragging="true" dataTipFormatFunction="{cf.format}" + change="dispatchFilter()" + thumbPress="thumbBeingPressed=true" + thumbRelease="thumbBeingPressed=false;dispatchFilter()" + />--> + <s:HGroup> + <s:NumericStepper id="loPrice" minimum="0" maximum="{hiPrice.value}" value="0" change="dispatchFilter()" /> + <s:NumericStepper id="hiPrice" minimum="{loPrice.value}" maximum="200" value="200" change="dispatchFilter()" /> + </s:HGroup> + + <s:Spacer height="18"/> + + <s:Label text="Required Features"/> + + <s:Spacer height="4"/> + + <s:CheckBox id="cbBlazeDS" styleName="glass" label="BlazeDS" click="dispatchFilter();"/> + <s:Spacer height="4"/> + <s:CheckBox id="cbMobile" styleName="glass" label="Mobile" click="dispatchFilter()"/> + <s:Spacer height="4"/> + <s:CheckBox id="cbVideo" styleName="glass" label="Video" click="dispatchFilter();"/> + + <s:Spacer height="18"/> + + <s:Line width="100%"/> + + <s:Spacer height="8"/> + + <s:HGroup> + <s:Label text="Compare" styleName="sectionHeader"/> + <s:Label text="(Drag items here to compare)" styleName="instructions"/> + </s:HGroup> + + + <s:Spacer height="4"/> + + <!-- height is maxItems * ProductListItem.HEIGHT + 2px border --> + <productsView:ProductList id="productList" height="{productList.maxItems * ProductListItem.HEIGHT + 2}" width="100%" + newItemStartX="300" newItemStartY="-100" maxItems="4" + removeProduct="productRemoved()"/> + + <s:Spacer height="8"/> + + <s:Button id="compareButton" styleName="glass" + label.showingThumbnails="Compare Items" + icon.showingThumbnails="@Embed('/assets/icon_compare.png')" + click.showingThumbnails="attemptCompare()" + label.showingComparison="Back to thumbnail view" + icon.showingComparison="@Embed('/assets/icon_tiles.png')" + click.showingComparison="dispatchFilter()" + /> + + <s:states> + <s:State name="showingThumbnails" /> + <s:State name="showingComparison" /> + </s:states> + +</s:VGroup> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/productsView/ProductList.mxml ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/productsView/ProductList.mxml b/FlexStore/spark/src/productsView/ProductList.mxml new file mode 100644 index 0000000..37d2e26 --- /dev/null +++ b/FlexStore/spark/src/productsView/ProductList.mxml @@ -0,0 +1,214 @@ +<?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. + +--> +<s:BorderContainer xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + borderStyle="solid" + dragEnter="doDragEnter(event)" + dragDrop="doDragDrop(event)" + backgroundAlpha="0" backgroundColor="#FF0000"> <!-- need a background color for drag and drop but can set alpha to 0 --> + + <fx:Metadata> + [Event(name="addProduct", type="samples.flexstore.ProductListEvent")] + [Event(name="duplicateProduct", type="samples.flexstore.ProductListEvent")] + [Event(name="productQtyChange", type="samples.flexstore.ProductListEvent")] + [Event(name="removeProduct", type="samples.flexstore.ProductListEvent")] + </fx:Metadata> + + <fx:Script> + <![CDATA[ + import mx.core.*; + import mx.effects.*; + import mx.events.*; + import mx.managers.DragManager; + import mx.effects.EffectManager; + + import samples.flexstore.Product; + import samples.flexstore.ProductListEvent; + + public var items:Array = []; + + public var newItemStartX:int; + public var newItemStartY:int; + [Bindable] + public var maxItems:int; + public var showQuantity:Boolean; + + private var playingEffects:Dictionary = new Dictionary(true); + + public function addProduct(product:Product):void + { + var index:int = indexOf(product.productId); + var event:ProductListEvent; + var item:ProductListItem; + + if (index != -1) + { + item = items[index] as ProductListItem; + //if we don't keep track of what's playing a double-click can + //cause the list item to keep rising + if (playingEffects[item] == null) + { + var jump:Sequence = new Sequence(); + var m1:Move = new Move(item) + m1.yBy = -5; + var m2:Move = new Move(item) + m2.yBy = 5; + jump.addChild(m1); + jump.addChild(m2); + jump.duration = 150; + playingEffects[item] = jump; + jump.addEventListener(EffectEvent.EFFECT_END, function(event:Event):void + { + delete playingEffects[item]; + }); + jump.play(); + } + event = new ProductListEvent(ProductListEvent.DUPLICATE_PRODUCT); + event.product = item.product; + dispatchEvent(event); + } + else + { + index = items.length; + if (maxItems <= 0 || index < maxItems) + { + item = new ProductListItem(); + if (showQuantity) + { + item.currentState = 'showQuantity'; + } + item.product = product; + item.percentWidth = 100; + item.addEventListener(ProductListEvent.REMOVE_PRODUCT, removeItemHandler); + items[index] = item; + item.includeInLayout = false; + viewport.addElement(item); + item.setLayoutBoundsSize(viewport.width, item.getPreferredBoundsHeight()); + layoutItems(index, true); + event = new ProductListEvent(ProductListEvent.ADD_PRODUCT); + event.product = product; + dispatchEvent(event); + } + } + } + + public function getProducts():Array + { + var ret:Array = []; + for (var i:int = 0; i < items.length; i++) + { + ret[i] = items[i].product; + } + return ret; + } + + private function removeItemHandler(event:Event):void + { + var item:ProductListItem = event.target as ProductListItem; + var index:int = indexOf(item.product.productId); + items.splice(index, 1); + viewport.removeElement(item); + layoutItems(index); + } + + private function layoutItems(startIndex:int, scrollToBottom:Boolean=false):void + { + var n:int = items.length; + var e:Move; + for (var i:int = startIndex; i < n ; i++) + { + var item:ProductListItem = items[i]; + var yTo:Number = i * (item.height); + //still need to prevent items that are already in motion from getting + //jumpy + if (playingEffects[item] == null) + { + e = new Move(item); + if (item.x == 0 && item.y == 0) + { + e.xFrom = newItemStartX; + e.yFrom = newItemStartY; + } + + e.xTo = 0; + e.yTo = yTo; + playingEffects[item] = e; + e.addEventListener(EffectEvent.EFFECT_END, function(event:Event):void + { + delete playingEffects[item]; + }); + e.play(); + } + else + { + playingEffects[item].pause(); + playingEffects[item].yTo = yTo; + playingEffects[item].play(); + } + } + //get the last event and if we should scroll make sure we can validate + //and scroll to maxVPosition + if (scrollToBottom) + { + e.addEventListener(EffectEvent.EFFECT_END, function(event:Event):void + { + validateNow(); + viewport.verticalScrollPosition = viewport.contentHeight - viewport.height; + }); + } + } + + private function indexOf(productId:int):int + { + var index:int = -1; + + var n:int = items.length; + for (var i:int = 0; i < items.length; i++) + { + if (items[i].product.productId == productId) + { + index = i; + break; + } + } + + return index; + } + + private function doDragEnter(event:DragEvent):void + { + if (event.dragSource.hasFormat("product")) + { + DragManager.acceptDragDrop(IUIComponent(event.target)); + } + } + + private function doDragDrop(event:DragEvent):void + { + var product:Product = event.dragSource.dataForFormat("product") as Product; + addProduct(product); + } + + ]]> + </fx:Script> + <s:Scroller id="scroller" width="100%" height="100%"> + <s:Group id="viewport" width="100%" height="100%" /> + </s:Scroller> +</s:BorderContainer> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/productsView/ProductListItem.mxml ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/productsView/ProductListItem.mxml b/FlexStore/spark/src/productsView/ProductListItem.mxml new file mode 100644 index 0000000..5d32431 --- /dev/null +++ b/FlexStore/spark/src/productsView/ProductListItem.mxml @@ -0,0 +1,90 @@ +<?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. + +--> +<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + styleName="listItem" + height="{ProductListItem.HEIGHT}" + automationName="{product.name}"> + + <fx:Metadata> + [Event(name="productQtyChange", type="samples.flexstore.ProductListEvent")] + [Event(name="removeProduct", type="samples.flexstore.ProductListEvent")] + </fx:Metadata> + + <fx:Script> + <![CDATA[ + + import samples.flexstore.Product; + import samples.flexstore.ProductListEvent; + + public static const HEIGHT:int = 30; + + [Bindable] + public var product:Product; + + private function qtyChange():void + { + product.qty = int(qty.text); + var event:ProductListEvent = new ProductListEvent(ProductListEvent.PRODUCT_QTY_CHANGE); + event.product = product; + dispatchEvent(event); + } + + private function removeItem():void + { + var event:ProductListEvent = new ProductListEvent(ProductListEvent.REMOVE_PRODUCT); + event.product = product; + dispatchEvent(event); + } + + ]]> + </fx:Script> + + <fx:Declarations> + <s:CurrencyFormatter currencySymbol="$" id="cf" fractionalDigits="2"/> + </fx:Declarations> + + <s:layout> + <s:HorizontalLayout /> + </s:layout> + + <s:Button id="removeButton" + width="14" height="14" + icon="@Embed('/assets/trashcan.png')" + toolTip="Remove from cart" + click="removeItem()"/> + + <s:Image id="productImage" width="12" height="24" source="{product.image}"/> + + <s:Label id="productName" maxWidth="100" text="{product.name}"/> + + <s:Spacer width="100%" /> + + <s:Label id="productPrice" + text="{cf.format(product.price)}" textAlign="right"/> + + <s:TextInput id="qty" width="25" text="{product.qty}" includeIn="showQuantity" + textAlign="right" maxChars="3" change="qtyChange()" /> + <s:states> + <s:State name="compare" /> + <s:State name="showQuantity" /> + </s:states> + +</s:ItemRenderer> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/productsView/ProductSupport.mxml ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/productsView/ProductSupport.mxml b/FlexStore/spark/src/productsView/ProductSupport.mxml new file mode 100644 index 0000000..599ea87 --- /dev/null +++ b/FlexStore/spark/src/productsView/ProductSupport.mxml @@ -0,0 +1,88 @@ +<?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. + +--> +<s:HGroup xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + paddingLeft="4" paddingRight="8" paddingBottom="4" + > + + <fx:Script> + <![CDATA[ + + private function toggle():void + { + /* + if (vd.playing) + { + vd.stop(); + list.visible = true; + } + else + { + list.visible = false; + vd.play(); + } + */ + } + + ]]> + </fx:Script> + + <fx:Declarations> + <s:Parallel id="hideList"> + <s:children> + <fx:Array> + <s:Resize target="{list}" widthTo="0"/> + <!--<mx:Resize target="{vd}" widthTo="400" heightTo="314"/>--> + </fx:Array> + </s:children> + </s:Parallel> + + <s:Parallel id="showList"> + <s:children> + <fx:Array> + <s:Resize target="{list}" widthTo="130"/> + <!--<mx:Resize target="{vd}" widthTo="270" heightTo="217"/>--> + </fx:Array> + </s:children> + </s:Parallel> + </fx:Declarations> + <s:List id="list" width="130" height="100%" selectedIndex="0" + hideEffect="hideList" showEffect="showList"> + <s:dataProvider> + <s:ArrayList> + <fx:Array> + <fx:Object label="Install SIM Card"/> + </fx:Array> + </s:ArrayList> + </s:dataProvider> + </s:List> + + <s:Group width="100%"> + + <!--<mx:VideoDisplay id="vd" width="270" height="217" source="assets/phone.flv" + autoPlay="false" complete="list.visible=true"/> + + <mx:Button label="{vd.playing ? 'Stop' : 'Play'}" click="toggle()" left="8" bottom="8" includeInLayout="false"> + </mx:Button> + --> + </s:Group> + + +</s:HGroup> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/samples/flexstore/ButtonBarButtonSkin.as ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/samples/flexstore/ButtonBarButtonSkin.as b/FlexStore/spark/src/samples/flexstore/ButtonBarButtonSkin.as new file mode 100644 index 0000000..5e94b58 --- /dev/null +++ b/FlexStore/spark/src/samples/flexstore/ButtonBarButtonSkin.as @@ -0,0 +1,298 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 samples.flexstore +{ + +import flash.display.GradientType; +import mx.containers.BoxDirection; +import mx.controls.Button; +import mx.controls.ButtonBar; +import mx.skins.Border; +import mx.skins.halo.*; +import mx.styles.StyleManager; +import mx.utils.ColorUtil; + +/** + * Adapted from mx.skins.halo.ButtonBarButtonSkin. + * This version of the ButtonBarButtonSkin is applied for the + * selectedOver, selectedUp, and over states to use the 2nd two + * values of the fillColors for the selected state of the + * button. The over state then uses a computed value from + * the themeColor to show emphasis. The border of the selected + * button also uses a computed value from the themeColor, but + * is partially transparent. + */ +public class ButtonBarButtonSkin extends Border +{ + //-------------------------------------------------------------------------- + // + // Class variables + // + //-------------------------------------------------------------------------- + + /** + * @private + */ + private static var cache:Object = {}; + + //-------------------------------------------------------------------------- + // + // Class methods + // + //-------------------------------------------------------------------------- + + /** + * @private + * Several colors used for drawing are calculated from the base colors + * of the component (themeColor, borderColor and fillColors). + * Since these calculations can be a bit expensive, + * we calculate once per color set and cache the results. + */ + private static function calcDerivedStyles(themeColor:uint, + fillColor0:uint, + fillColor1:uint):Object + { + var key:String = HaloColors.getCacheKey(themeColor, + fillColor0, fillColor1); + + if (!cache[key]) + { + var o:Object = cache[key] = {}; + + // Cross-component styles. + HaloColors.addHaloColors(o, themeColor, fillColor0, fillColor1); + + // Button-specific styles. + o.innerEdgeColor1 = ColorUtil.adjustBrightness2(fillColor0, -10); + o.innerEdgeColor2 = ColorUtil.adjustBrightness2(fillColor1, -25); + } + + return cache[key]; + } + + //-------------------------------------------------------------------------- + // + // Constructor + // + //-------------------------------------------------------------------------- + + /** + * @private + * Constructor. + */ + public function ButtonBarButtonSkin() + { + super(); + } + + //-------------------------------------------------------------------------- + // + // Overridden properties + // + //-------------------------------------------------------------------------- + + //---------------------------------- + // measuredWidth + //---------------------------------- + + /** + * @private + */ + override public function get measuredWidth():Number + { + return 50; + } + + //---------------------------------- + // measuredHeight + //---------------------------------- + + /** + * @private + */ + override public function get measuredHeight():Number + { + return 22; + } + + //-------------------------------------------------------------------------- + // + // Overridden methods + // + //-------------------------------------------------------------------------- + + /** + * @private + */ + override protected function updateDisplayList(w:Number, h:Number):void + { + super.updateDisplayList(w, h); + + // User-defined styles. + var borderColor:uint = getStyle("borderColor"); + var cornerRadius:Number = getStyle("cornerRadius"); + var fillAlphas:Array = getStyle("fillAlphas"); + var fillColors:Array = getStyle("fillColors"); + styleManager.getColorNames(fillColors); + var highlightAlphas:Array = getStyle("highlightAlphas"); + var themeColor:uint = getStyle("themeColor"); + + // Derivative styles. + var derStyles:Object = calcDerivedStyles(themeColor, fillColors[0], + fillColors[1]); + + var borderColorDrk1:Number = + ColorUtil.adjustBrightness2(borderColor, -50); + + var themeColorDrk1:Number = + ColorUtil.adjustBrightness2(themeColor, -25); + + var emph:Boolean = false; + + if (parent is Button) + emph = (parent as Button).emphasized; + + var tmp:Number; + + var bar:ButtonBar = parent ? ButtonBar(parent.parent) : null; + var horizontal:Boolean = true; + var pos:int = 0; + + if (bar) + { + if (bar.direction == BoxDirection.VERTICAL) + horizontal = false; + + // first: -1, middle: 0, last: 1 + var index:int = bar.getChildIndex(parent); + pos = (index == 0 ? -1 : (index == bar.numChildren - 1 ? 1 : 0)); + } + + var radius:Object = getCornerRadius(pos, horizontal, cornerRadius); + var cr:Object = getCornerRadius(pos, horizontal, cornerRadius); + var cr1:Object = getCornerRadius(pos, horizontal, cornerRadius - 1); + var cr2:Object = getCornerRadius(pos, horizontal, cornerRadius - 2); + var cr3:Object = getCornerRadius(pos, horizontal, cornerRadius - 3); + + graphics.clear(); + + switch (name) + { + case "selectedUpSkin": + case "selectedOverSkin": + { + var overFillColors:Array; + if (fillColors.length > 2) + overFillColors = [ fillColors[2], fillColors[3] ]; + else + overFillColors = [ fillColors[0], fillColors[1] ]; + + var overFillAlphas:Array; + if (fillAlphas.length > 2) + overFillAlphas = [ fillAlphas[2], fillAlphas[3] ]; + else + overFillAlphas = [ fillAlphas[0], fillAlphas[1] ]; + + // button border/edge + drawRoundRect( + 0, 0, w, h, cr, + [ themeColor, derStyles.themeColDrk1 ], 0.5, + verticalGradientMatrix(0, 0, w , h), + GradientType.LINEAR, null, + { x: 1, y: 1, w: w - 2, h: h - 2, r: cr1 }); + + // button fill + drawRoundRect( + 1, 1, w - 2, h - 2, cr1, + overFillColors, overFillAlphas, + verticalGradientMatrix(0, 0, w - 2, h - 2)); + + // top highlight + if (!(radius is Number)) + { radius.bl = radius.br = 0;} + drawRoundRect( + 1, 1, w - 2, (h - 2) / 2, radius, + [ 0xFFFFFF, 0xFFFFFF ], highlightAlphas, + verticalGradientMatrix(1, 1, w - 2, (h - 2) / 2)); + break; + } + + case "overSkin": + { + // button border/edge + drawRoundRect( + 0, 0, w, h, cr, + [ themeColor, derStyles.themeColDrk1 ], 0.5, + verticalGradientMatrix(0, 0, w, h)); + + // button fill + drawRoundRect( + 1, 1, w - 2, h - 2, cr1, + [ derStyles.fillColorPress1, derStyles.fillColorPress2 ], 1, + verticalGradientMatrix(0, 0, w - 2, h - 2)); + + // top highlight + if (!(radius is Number)) + { radius.bl = radius.br = 0;} + drawRoundRect( + 1, 1, w - 2, (h - 2) / 2, radius, + [ 0xFFFFFF, 0xFFFFFF ], highlightAlphas, + verticalGradientMatrix(1, 1, w - 2, (h - 2) / 2)); + + break; + } + } + } + + //-------------------------------------------------------------------------- + // + // Methods + // + //-------------------------------------------------------------------------- + + /** + * @private + */ + private function getCornerRadius(pos:int, horizontal:Boolean, + radius:Number):Object + { + if (pos == 0) + return 0; + + radius = Math.max(0, radius); + + if (horizontal) + { + if (pos == -1) + return { tl: radius, tr: 0, bl: radius, br: 0 }; + else // pos == 1 + return { tl: 0, tr: radius, bl: 0, br: radius }; + } + else + { + if (pos == -1) + return { tl: radius, tr: radius, bl: 0, br: 0 }; + else // pos == 1 + return { tl: 0, tr: 0, bl: radius, br: radius }; + } + } +} + +} http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/samples/flexstore/Product.as ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/samples/flexstore/Product.as b/FlexStore/spark/src/samples/flexstore/Product.as new file mode 100644 index 0000000..040fb8f --- /dev/null +++ b/FlexStore/spark/src/samples/flexstore/Product.as @@ -0,0 +1,78 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 samples.flexstore +{ + +[Bindable] +public class Product +{ + + public var productId:int; + public var name:String; + public var description:String; + public var price:Number; + public var image:String; + public var experience:String; + public var blazeds:Boolean; + public var mobile:Boolean; + public var video:Boolean; + public var highlight1:String; + public var highlight2:String; + public var qty:int; + + public function Product() + { + + } + + public function fill(obj:Object):void + { + for (var i:String in obj) + { + this[i] = obj[i]; + } + } + + [Bindable(event="propertyChange")] + public function get featureString():String + { + var str:String = ""; + if (blazeds) + str += "BlazeDS"; + + if (mobile) + { + if (str.length > 0) + str += "\n"; + str += "Mobile"; + } + + if (video) + { + if (str.length > 0) + str += "\n"; + str += "Video"; + } + + return str; + } + +} + +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/samples/flexstore/ProductFilter.as ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/samples/flexstore/ProductFilter.as b/FlexStore/spark/src/samples/flexstore/ProductFilter.as new file mode 100644 index 0000000..d182371 --- /dev/null +++ b/FlexStore/spark/src/samples/flexstore/ProductFilter.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 samples.flexstore +{ + +[Bindable] +public class ProductFilter +{ + public var count:int; + public var experience:String; + public var minPrice:Number; + public var maxPrice:Number; + public var blazeds:Boolean; + public var mobile:Boolean; + public var video:Boolean; + + public function ProductFilter() + { + super(); + } + + public function accept(product:Product):Boolean + { + //price is often the first test so let's fail fast if possible + if (minPrice > product.price || maxPrice < product.price) + return false; + if (experience != "All" && experience > product.experience) + return false; + if (blazeds && !product.blazeds) + return false; + if (mobile && !product.mobile) + return false; + if (video && !product.video) + return false; + + return true; + } +} + +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/samples/flexstore/ProductFilterEvent.as ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/samples/flexstore/ProductFilterEvent.as b/FlexStore/spark/src/samples/flexstore/ProductFilterEvent.as new file mode 100644 index 0000000..b13af3e --- /dev/null +++ b/FlexStore/spark/src/samples/flexstore/ProductFilterEvent.as @@ -0,0 +1,39 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 samples.flexstore +{ + +import flash.events.Event; + +public class ProductFilterEvent extends Event +{ + public static const FILTER:String = "filter"; + + public var live:Boolean; + public var filter:ProductFilter; + + public function ProductFilterEvent(filter:ProductFilter, live:Boolean) + { + super(FILTER); + this.filter = filter; + this.live = live; + } +} + +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/samples/flexstore/ProductListEvent.as ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/samples/flexstore/ProductListEvent.as b/FlexStore/spark/src/samples/flexstore/ProductListEvent.as new file mode 100644 index 0000000..fb4992f --- /dev/null +++ b/FlexStore/spark/src/samples/flexstore/ProductListEvent.as @@ -0,0 +1,42 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 samples.flexstore +{ + +import flash.events.Event; + +public class ProductListEvent extends Event +{ + public static const ADD_PRODUCT:String = "addProduct"; + public static const DUPLICATE_PRODUCT:String = "duplicateProduct"; + public static const REMOVE_PRODUCT:String = "removeProduct"; + public static const PRODUCT_QTY_CHANGE:String = "productQtyChange"; + + public var product:Product; + + //making the default bubbles behavior of the event to true since we want + //it to bubble out of the ProductListItem and beyond + public function ProductListEvent(type:String, bubbles:Boolean=true, cancelable:Boolean=false) + { + super(type, bubbles, cancelable); + } + +} + +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/c652cfba/FlexStore/spark/src/samples/flexstore/ProductThumbEvent.as ---------------------------------------------------------------------- diff --git a/FlexStore/spark/src/samples/flexstore/ProductThumbEvent.as b/FlexStore/spark/src/samples/flexstore/ProductThumbEvent.as new file mode 100644 index 0000000..e967daf --- /dev/null +++ b/FlexStore/spark/src/samples/flexstore/ProductThumbEvent.as @@ -0,0 +1,45 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 samples.flexstore +{ + +import flash.events.Event; + +public class ProductThumbEvent extends Event +{ + public static const PURCHASE:String = "purchase"; + public static const COMPARE:String = "compare"; + public static const DETAILS:String = "details"; + public static const BROWSE:String = "browse"; + + public var product:Product; + + public function ProductThumbEvent(type:String, product:Product) + { + super(type); + this.product = product; + } + + override public function clone():Event + { + return new ProductThumbEvent(type, product); + } +} + +} \ No newline at end of file
