Add Animate bead for FontAwesomeIcon
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/5c227d43 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/5c227d43 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/5c227d43 Branch: refs/heads/develop Commit: 5c227d4302f123c023e0f073caf4438d7c89f36f Parents: b7a3da3 Author: OmPrakash Muppirala <bigosma...@gmail.com> Authored: Mon Jan 9 00:13:53 2017 -0800 Committer: OmPrakash Muppirala <bigosma...@gmail.com> Committed: Mon Jan 9 00:13:53 2017 -0800 ---------------------------------------------------------------------- .../flex/itemRenderers/MemberItemRenderer.mxml | 25 +++++- .../flex/org/apache/flex/fa/beads/Animate.as | 95 ++++++++++++++++++++ .../src/main/resources/fa-manifest.xml | 1 + 3 files changed, 118 insertions(+), 3 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5c227d43/examples/flexjs/FlexTeamPage_MDL/src/main/flex/itemRenderers/MemberItemRenderer.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/FlexTeamPage_MDL/src/main/flex/itemRenderers/MemberItemRenderer.mxml b/examples/flexjs/FlexTeamPage_MDL/src/main/flex/itemRenderers/MemberItemRenderer.mxml index d32fc78..3d47333 100644 --- a/examples/flexjs/FlexTeamPage_MDL/src/main/flex/itemRenderers/MemberItemRenderer.mxml +++ b/examples/flexjs/FlexTeamPage_MDL/src/main/flex/itemRenderers/MemberItemRenderer.mxml @@ -80,11 +80,30 @@ limitations under the License. <mdl:Button colored="true" fab="true" ripple="true" raised="false"> <mdl:materialIcon> <fa:FontAwesomeIcon iconType="{FontAwesomeIconType.GLASS}" - fixedWidth="true" - showBorder="true" - /> + showBorder="true"> + </fa:FontAwesomeIcon> </mdl:materialIcon> </mdl:Button> + <mdl:Button colored="true" fab="true" ripple="true" raised="false"> + <mdl:materialIcon> + <fa:FontAwesomeIcon iconType="{FontAwesomeIconType.COG}"> + <fa:beads> + <fa:Animate /> + </fa:beads> + </fa:FontAwesomeIcon> + </mdl:materialIcon> + </mdl:Button> + + <mdl:Button colored="true" fab="true" ripple="true" raised="false"> + <mdl:materialIcon> + <fa:FontAwesomeIcon iconType="{FontAwesomeIconType.SPINNER}"> + <fa:beads> + <fa:Animate pulse="true"/> + </fa:beads> + </fa:FontAwesomeIcon> + </mdl:materialIcon> + </mdl:Button> + </mdl:CardActions> </mdl:Card> </mdl:ListItemRenderer> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5c227d43/frameworks/projects/FontAwesome/src/main/flex/org/apache/flex/fa/beads/Animate.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/FontAwesome/src/main/flex/org/apache/flex/fa/beads/Animate.as b/frameworks/projects/FontAwesome/src/main/flex/org/apache/flex/fa/beads/Animate.as new file mode 100644 index 0000000..4185b0f --- /dev/null +++ b/frameworks/projects/FontAwesome/src/main/flex/org/apache/flex/fa/beads/Animate.as @@ -0,0 +1,95 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// Licensed to the Apache Software Foundation (ASF) under one or more +// contributor license agreements. See the NOTICE file distributed with +// this work for additional information regarding copyright ownership. +// The ASF licenses this file to You under the Apache License, Version 2.0 +// (the "License"); you may not use this file except in compliance with +// the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// +//////////////////////////////////////////////////////////////////////////////// +package org.apache.flex.fa.beads { +import org.apache.flex.core.IBead; +import org.apache.flex.core.IStrand; +import org.apache.flex.core.UIBase; +import org.osmf.elements.HTMLElement; + +public class Animate implements IBead { + /** + * constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function Animate() { + } + + private var _strand:IStrand; + private var _spin:Boolean = true; + private var _pulse:Boolean = false; + + /** + * Rotate the icon + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get spin():Boolean + { + return _spin; + } + + public function set spin(value:Boolean):void + { + _spin = value; + } + /** + * Pulse the icon, i.e. rotate with 8 steps + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get pulse():Boolean + { + return _pulse; + } + + public function set pulse(value:Boolean):void + { + _pulse = value; + } + + /** + * @flexjsignorecoercion HTMLElement + * + * @param value + */ + public function set strand(value:IStrand):void + { + _strand = value; + + COMPILE::JS + { + var host:UIBase = value as UIBase; + var element:HTMLElement = host.element as HTMLElement; + element.classList.toggle('fa-spin',_spin); + element.classList.toggle('fa-pulse',_pulse); + } + } + +} +} http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/5c227d43/frameworks/projects/FontAwesome/src/main/resources/fa-manifest.xml ---------------------------------------------------------------------- diff --git a/frameworks/projects/FontAwesome/src/main/resources/fa-manifest.xml b/frameworks/projects/FontAwesome/src/main/resources/fa-manifest.xml index a6fe235..04f263c 100644 --- a/frameworks/projects/FontAwesome/src/main/resources/fa-manifest.xml +++ b/frameworks/projects/FontAwesome/src/main/resources/fa-manifest.xml @@ -21,4 +21,5 @@ <componentPackage> <component id="FontAwesomeIcon" class="org.apache.flex.fa.FontAwesomeIcon"/> + <component id="Animate" class="org.apache.flex.fa.beads.Animate"/> </componentPackage>
