Repository: flex-asjs Updated Branches: refs/heads/develop 098018e76 -> daffc0286
Animate bead for FontAwesomeIcon now responds to property changes Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/daffc028 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/daffc028 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/daffc028 Branch: refs/heads/develop Commit: daffc02861a14489239e81483b95f8508f3a2136 Parents: 098018e Author: OmPrakash Muppirala <bigosma...@gmail.com> Authored: Sat Jan 14 00:13:05 2017 -0800 Committer: OmPrakash Muppirala <bigosma...@gmail.com> Committed: Sat Jan 14 00:13:36 2017 -0800 ---------------------------------------------------------------------- .../main/flex/itemRenderers/MemberItemRenderer.mxml | 10 ++++++++-- .../src/main/flex/org/apache/flex/fa/beads/Animate.as | 13 ++++++++++--- 2 files changed, 18 insertions(+), 5 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/daffc028/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 ddd0a89..ae78d4c 100644 --- a/examples/flexjs/FlexTeamPage_MDL/src/main/flex/itemRenderers/MemberItemRenderer.mxml +++ b/examples/flexjs/FlexTeamPage_MDL/src/main/flex/itemRenderers/MemberItemRenderer.mxml @@ -37,6 +37,12 @@ limitations under the License. return data as MemberVO; } + [Bindable] private var _spin:Boolean = false; + + private function handleCogClick():void { + _spin= !_spin; + } + ]]> </fx:Script> @@ -85,11 +91,11 @@ limitations under the License. </fa:FontAwesomeIcon> </mdl:materialIcon> </mdl:Button> - <mdl:Button colored="true" fab="true" ripple="true" raised="false"> + <mdl:Button colored="true" fab="true" ripple="true" raised="false" click="{handleCogClick()}"> <mdl:materialIcon> <fa:FontAwesomeIcon iconType="{FontAwesomeIconType.COG}"> <fa:beads> - <fa:Animate /> + <fa:Animate spin="{_spin}" /> </fa:beads> </fa:FontAwesomeIcon> </mdl:materialIcon> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/daffc028/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 index e22501c..5e699db 100644 --- 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 @@ -34,6 +34,7 @@ public class Animate implements IBead { } private var _strand:IStrand; + private var _hostElement:Object; private var _spin:Boolean = true; private var _pulse:Boolean = false; @@ -53,6 +54,9 @@ public class Animate implements IBead { public function set spin(value:Boolean):void { _spin = value; + if(this._hostElement) { + _hostElement.classList.toggle('fa-spin', _spin); + } } /** * Pulse the icon, i.e. rotate with 8 steps @@ -70,6 +74,9 @@ public class Animate implements IBead { public function set pulse(value:Boolean):void { _pulse = value; + if(this._hostElement) { + _hostElement.classList.toggle('fa-pulse',_pulse); + } } /** @@ -84,9 +91,9 @@ public class Animate implements IBead { 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); + _hostElement = host.element; + _hostElement.classList.toggle('fa-spin',_spin); + _hostElement.classList.toggle('fa-pulse',_pulse); } }
