Repository: flex-asjs Updated Branches: refs/heads/develop 328a265c3 -> 0343012a5
- Add MdlTextColor - Proper apply MdlColor and MdlTextColor to ContactChip bead Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/0a434bfc Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/0a434bfc Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/0a434bfc Branch: refs/heads/develop Commit: 0a434bfc58eda005f53e3f98cd5c0c201c93d131 Parents: 6fd4482 Author: piotrz <pio...@apache.org> Authored: Sat Dec 17 10:16:17 2016 +0100 Committer: piotrz <pio...@apache.org> Committed: Sat Dec 17 10:16:17 2016 +0100 ---------------------------------------------------------------------- .../flexjs/MDLExample/src/main/flex/Cards.mxml | 8 +- .../flexjs/MDLExample/src/main/flex/Chips.mxml | 5 +- .../org/apache/flex/mdl/beads/ContactChip.as | 115 +++++----------- .../flex/org/apache/flex/mdl/beads/MdlColor.as | 2 +- .../org/apache/flex/mdl/beads/MdlTextColor.as | 132 +++++++++++++++++++ .../src/main/resources/mdl-manifest.xml | 1 + 6 files changed, 176 insertions(+), 87 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0a434bfc/examples/flexjs/MDLExample/src/main/flex/Cards.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/MDLExample/src/main/flex/Cards.mxml b/examples/flexjs/MDLExample/src/main/flex/Cards.mxml index 98c460d..b70993a 100644 --- a/examples/flexjs/MDLExample/src/main/flex/Cards.mxml +++ b/examples/flexjs/MDLExample/src/main/flex/Cards.mxml @@ -31,9 +31,7 @@ limitations under the License. <mdl:CardSupportingText> <js:beads> <js:InnerHTML> - <![CDATA[ - Lorem ipsum dolor sit <b>amet</b>, consectetur <i>adipiscing elit</i>. Mauris sagittis pellentesque lacus eleifend lacinia... - ]]> + <![CDATA[Lorem ipsum dolor sit <b>amet</b>, consectetur <i>adipiscing elit</i>. Mauris sagittis pellentesque lacus eleifend lacinia...]]> </js:InnerHTML> </js:beads> </mdl:CardSupportingText> @@ -75,9 +73,7 @@ limitations under the License. <mdl:CardTitleText> <js:beads> <js:InnerHTML> - <![CDATA[ - <h4 class="mdl-card__title_h4">Featured event:<br>May 24, 2016<br>7-11pm</h4> - ]]> + <![CDATA[<h4 class="mdl-card__title_h4">Featured event:<br>May 24, 2016<br>7-11pm</h4>]]> </js:InnerHTML> </js:beads> </mdl:CardTitleText> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0a434bfc/examples/flexjs/MDLExample/src/main/flex/Chips.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/MDLExample/src/main/flex/Chips.mxml b/examples/flexjs/MDLExample/src/main/flex/Chips.mxml index 0f27ec5..1664ace 100644 --- a/examples/flexjs/MDLExample/src/main/flex/Chips.mxml +++ b/examples/flexjs/MDLExample/src/main/flex/Chips.mxml @@ -46,6 +46,7 @@ limitations under the License. <mdl:Chip text="Contact Chip"> <mdl:beads> <mdl:MdlColor color="teal" /> + <mdl:MdlTextColor textColor="white" /> <mdl:ContactChip contactText="A" /> </mdl:beads> </mdl:Chip> @@ -53,7 +54,9 @@ limitations under the License. <mdl:GridCell column="5"> <mdl:Chip text="Contact Chip"> <mdl:beads> - <mdl:ContactChip contactText="A" color="teal" textColor="white"/> + <mdl:MdlColor color="teal" /> + <mdl:MdlTextColor textColor="white" /> + <mdl:ContactChip contactText="A" /> <mdl:MaterialIconCancel /> <mdl:DeletableChip /> </mdl:beads> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0a434bfc/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/ContactChip.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/ContactChip.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/ContactChip.as index 13b5cd2..289b959 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/ContactChip.as +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/ContactChip.as @@ -41,11 +41,8 @@ package org.apache.flex.mdl.beads * @productversion FlexJS 0.0 */ COMPILE::SWF - public class ContactChip implements IMdlTextColor + public class ContactChip { - private var _textColor:String; - private var _textColorWeight:String; - private var _contactText:String; public function ContactChip() @@ -57,36 +54,10 @@ package org.apache.flex.mdl.beads { _contactText = value; } - - /** - * @inheritDoc - */ - public function get textColor():String - { - return _textColor; - } - - public function set textColor(value:String):void - { - _textColor = value; - } - - /** - * @inheritDoc - */ - public function get textColorWeight():String - { - return _textColorWeight; - } - - public function set textColorWeight(value:String):void - { - _textColorWeight = value; - } } COMPILE::JS - public class ContactChip implements IBead, IMdlTextColor + public class ContactChip implements IBead { /** * constructor. @@ -100,14 +71,13 @@ package org.apache.flex.mdl.beads { } - private var _textColor:String = ""; - private var _textColorWeight:String = ""; private var _contactText:String = ""; private var contact:Span; private var textNode:Text; private var _strand:IStrand; + private var _strandHtmlElement:HTMLElement; /** * @flexjsignorecoercion HTMLElement @@ -123,12 +93,12 @@ package org.apache.flex.mdl.beads _strand = value; var host:UIBase = value as UIBase; - var element:HTMLElement = host.element as HTMLElement; - var isValidElement:Boolean = element is HTMLSpanElement || element is HTMLButtonElement; + _strandHtmlElement = host.element as HTMLElement; + var isValidElement:Boolean = _strandHtmlElement is HTMLSpanElement || _strandHtmlElement is HTMLButtonElement; - if (isValidElement && element.className.search("mdl-chip") > -1) + if (isValidElement && _strandHtmlElement.className.search("mdl-chip") > -1) { - element.classList.add("mdl-chip--contact"); + _strandHtmlElement.classList.add("mdl-chip--contact"); textNode = document.createTextNode('') as Text; textNode.nodeValue = _contactText; @@ -137,14 +107,11 @@ package org.apache.flex.mdl.beads contact.element.classList.add("mdl-chip__contact"); loadColorBead(); - - var contactTextColor:String = getContactTextColor(); - - contact.element.classList.toggle(contactTextColor, _textColor); + loadTextColorBead(); contact.element.appendChild(textNode); - element.insertBefore(contact.element, host["chipTextSpan"]); + _strandHtmlElement.insertBefore(contact.element, host["chipTextSpan"]); } else { @@ -152,54 +119,44 @@ package org.apache.flex.mdl.beads } } - private function loadColorBead():void - { - var mdlColorBead:IBead = StrandUtils.loadBead(MdlColor, "MdlColor", _strand); - - if (mdlColorBead != null) - { - //Maybe removing also css manually from strand is a solution ? - _strand.removeBead(mdlColorBead); - contact.addBead(mdlColorBead); - } - } - public function set contactText(value:String):void { _contactText = value; } - /** - * @inheritDoc - */ - public function get textColor():String + private function loadColorBead():void { - return _textColor; - } + var mdlColorBead:MdlColor = StrandUtils.loadBead(MdlColor, "MdlColor", _strand) as MdlColor; - public function set textColor(value:String):void - { - _textColor = value; + if (mdlColorBead != null) + { + var mdlColorElement:String = mdlColorBead.getMdlElementColor(); + if (!mdlColorElement) + { + throw new Error("MdlColor bead exists, but there is no color specified"); + } + + _strandHtmlElement.classList.remove(mdlColorElement); + contact.addBead(mdlColorBead); + } } - /** - * @inheritDoc - */ - public function get textColorWeight():String + private function loadTextColorBead():void { - return _textColorWeight; - } + var mdlTextColorBead:MdlTextColor = StrandUtils.loadBead(MdlTextColor, "MdlTextColor", _strand) + as MdlTextColor; - public function set textColorWeight(value:String):void - { - _textColorWeight = value; - } - - private function getContactTextColor():String - { - return _textColorWeight ? - "mdl-color-text--".concat(_textColor, "-", _textColorWeight) : - "mdl-color-text--".concat(_textColor); + if (mdlTextColorBead != null) + { + var mdlTextElementTextColor:String = mdlTextColorBead.getMdlElementTextColor(); + if (!mdlTextElementTextColor) + { + throw new Error("MdlTextColor bead exists, but there is no textColor specified"); + } + + _strandHtmlElement.classList.remove(mdlTextElementTextColor); + contact.addBead(mdlTextColorBead); + } } } } http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0a434bfc/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlColor.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlColor.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlColor.as index 5cc6912..e39856d 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlColor.as +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlColor.as @@ -139,7 +139,7 @@ package org.apache.flex.mdl.beads return _colorWeight != null && _colorWeight != ""; } - private function getMdlElementColor():String + public function getMdlElementColor():String { if (hasColor && hasColorWeight) { http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0a434bfc/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlTextColor.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlTextColor.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlTextColor.as new file mode 100644 index 0000000..58a2a91 --- /dev/null +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/MdlTextColor.as @@ -0,0 +1,132 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.mdl.beads +{ + import org.apache.flex.core.IBead; + import org.apache.flex.core.IStrand; + import org.apache.flex.core.UIBase; + import org.apache.flex.mdl.supportClasses.IMdlTextColor; + + COMPILE::SWF + public class MdlTextColor implements IMdlTextColor + { + private var _textColor:String; + private var _textColorWeight:String; + + /** + * @inheritDoc + */ + public function get textColor():String + { + return _textColor; + } + + public function set textColor(value:String):void + { + _textColor = value; + } + + /** + * @inheritDoc + */ + public function get textColorWeight():String + { + return _textColorWeight; + } + + public function set textColorWeight(value:String):void + { + _textColorWeight = value; + } + } + + COMPILE::JS + public class MdlTextColor implements IBead, IMdlTextColor + { + public function MdlTextColor() + { + } + + private var _textColor:String = ""; + private var _textColorWeight:String = ""; + + private var _strand:IStrand; + + public function set strand(value:IStrand):void + { + _strand = value; + + var host:UIBase = value as UIBase; + var element:HTMLElement = host.element as HTMLElement; + + var elementColor:String = getMdlElementTextColor(); + element.classList.toggle(elementColor, hasTextColor || hasTextColorWeight); + } + + /** + * @inheritDoc + */ + public function get textColor():String + { + return _textColor; + } + + public function set textColor(value:String):void + { + _textColor = value; + } + + /** + * @inheritDoc + */ + public function get textColorWeight():String + { + return _textColorWeight; + } + + public function set textColorWeight(value:String):void + { + _textColorWeight = value; + } + + private function get hasTextColor():Boolean + { + return _textColor != null && _textColor != ""; + } + + private function get hasTextColorWeight():Boolean + { + return _textColorWeight != null && _textColorWeight != ""; + } + + public function getMdlElementTextColor():String + { + if (hasTextColor && hasTextColorWeight) + { + return "mdl-color-text--".concat(_textColor, "-", _textColorWeight); + } + else if (hasTextColor) + { + return "mdl-color-text--".concat(_textColor); + } + + return ""; + } + } +} http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/0a434bfc/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml b/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml index ee56195..ca29048 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml +++ b/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml @@ -81,4 +81,5 @@ <component id="ContactImageChip" class="org.apache.flex.mdl.beads.ContactImageChip"/> <component id="Tooltip" class="org.apache.flex.mdl.beads.Tooltip"/> <component id="MdlColor" class="org.apache.flex.mdl.beads.MdlColor"/> + <component id="MdlTextColor" class="org.apache.flex.mdl.beads.MdlTextColor"/> </componentPackage>
