Repository: flex-asjs Updated Branches: refs/heads/develop 5b17d2c53 -> 327ced48a
Make Tooltip a 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/327ced48 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/327ced48 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/327ced48 Branch: refs/heads/develop Commit: 327ced48aadd15fb0ba03eb9d968dc070b9df947 Parents: 5b17d2c Author: piotrz <[email protected]> Authored: Wed Dec 7 07:57:16 2016 +0100 Committer: piotrz <[email protected]> Committed: Wed Dec 7 07:57:16 2016 +0100 ---------------------------------------------------------------------- .../MDLExample/src/main/flex/Buttons.mxml | 2 +- .../main/flex/org/apache/flex/mdl/Tooltip.as | 257 ------------------- .../flex/org/apache/flex/mdl/beads/Tooltip.as | 222 ++++++++++++++++ .../src/main/resources/mdl-manifest.xml | 2 +- 4 files changed, 224 insertions(+), 259 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/327ced48/examples/flexjs/MDLExample/src/main/flex/Buttons.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/MDLExample/src/main/flex/Buttons.mxml b/examples/flexjs/MDLExample/src/main/flex/Buttons.mxml index 73edb28..f1e9b05 100644 --- a/examples/flexjs/MDLExample/src/main/flex/Buttons.mxml +++ b/examples/flexjs/MDLExample/src/main/flex/Buttons.mxml @@ -34,9 +34,9 @@ limitations under the License. <mdl:Button id="mybtn" fab="true" colored="true"> <mdl:beads> <mdl:MaterialIconAdd /> + <mdl:Tooltip text="A simple tooltip"/> </mdl:beads> </mdl:Button> - <mdl:Tooltip text="A simple tooltip" dataMdlFor="mybtn"/> </mdl:GridCell> <mdl:GridCell column="2"> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/327ced48/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Tooltip.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Tooltip.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Tooltip.as deleted file mode 100644 index 4f40367..0000000 --- a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/Tooltip.as +++ /dev/null @@ -1,257 +0,0 @@ -//////////////////////////////////////////////////////////////////////////////// -// -// 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 -{ - import org.apache.flex.core.UIBase; - - COMPILE::JS - { - import org.apache.flex.core.WrappedHTMLElement; - } - - /** - * The Tooltip class represents - * - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public class Tooltip extends UIBase - { - /** - * constructor. - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public function Tooltip() - { - super(); - - className = ""; //set to empty string avoid 'undefined' output when no class selector is assigned by user; - } - - private var _text:String = ""; - - /** - * The text of the heading - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public function get text():String - { - COMPILE::SWF - { - return _text; - } - COMPILE::JS - { - return textNode.nodeValue; - } - } - - public function set text(value:String):void - { - COMPILE::SWF - { - _text = value; - } - COMPILE::JS - { - textNode.nodeValue = value; - } - } - - COMPILE::JS - private var textNode:Text; - - private var _dataMdlFor:String; - /** - * The id value of the associated button that opens this menu. - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public function get dataMdlFor():String - { - return _dataMdlFor; - } - public function set dataMdlFor(value:String):void - { - _dataMdlFor = value; - - COMPILE::JS - { - element.setAttribute('for', dataMdlFor); - } - } - - private var _large:Boolean = false; - /** - * A boolean flag to activate "mdl-tooltip--large" effect selector. - * Applies large-font effect. Optional - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public function get large():Boolean - { - return _large; - } - public function set large(value:Boolean):void - { - _large = value; - - COMPILE::JS - { - element.classList.toggle("mdl-tooltip--large", _large); - } - } - - private var _leftPosition:Boolean = false; - /** - * A boolean flag to activate "mdl-tooltip--left" effect selector. - * Positions the tooltip to the left of the target. Optional - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public function get leftPosition():Boolean - { - return _large; - } - public function set leftPosition(value:Boolean):void - { - _leftPosition = value; - - COMPILE::JS - { - element.classList.toggle("mdl-tooltip--left", _leftPosition); - } - } - - private var _rightPosition:Boolean = false; - /** - * A boolean flag to activate "mdl-tooltip--right" effect selector. - * Positions the tooltip to the right of the target. Optional - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public function get rightPosition():Boolean - { - return _rightPosition; - } - public function set rightPosition(value:Boolean):void - { - _rightPosition = value; - - COMPILE::JS - { - element.classList.toggle("mdl-tooltip--right", _rightPosition); - } - } - - private var _topPosition:Boolean = false; - /** - * A boolean flag to activate "mdl-tooltip--top" effect selector. - * Positions the tooltip to the top of the target. Optional - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public function get topPosition():Boolean - { - return _topPosition; - } - public function set topPosition(value:Boolean):void - { - _topPosition = value; - - COMPILE::JS - { - element.classList.toggle("mdl-tooltip--top", _topPosition); - } - } - - private var _bottomPosition:Boolean = false; - /** - * A boolean flag to activate "mdl-tooltip--bottom" effect selector. - * Positions the tooltip to the bottom of the target. Optional - * - * @langversion 3.0 - * @playerversion Flash 10.2 - * @playerversion AIR 2.6 - * @productversion FlexJS 0.0 - */ - public function get bottomPosition():Boolean - { - return _bottomPosition; - } - public function set bottomPosition(value:Boolean):void - { - _bottomPosition = value; - - COMPILE::JS - { - element.classList.toggle("mdl-tooltip--bottom", _bottomPosition); - } - } - - /** - * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement - * @flexjsignorecoercion HTMLDivElement - */ - COMPILE::JS - override protected function createElement():WrappedHTMLElement - { - typeNames = 'mdl-tooltip'; - - var div:HTMLElement = document.createElement('div') as HTMLDivElement; - - textNode = document.createTextNode('') as Text; - div.appendChild(textNode); - - element = div as WrappedHTMLElement; - element.setAttribute('for', dataMdlFor); - - positioner = element; - element.flexjs_wrapper = this; - - return element; - } - } -} http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/327ced48/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/Tooltip.as ---------------------------------------------------------------------- diff --git a/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/Tooltip.as b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/Tooltip.as new file mode 100644 index 0000000..4c9084f --- /dev/null +++ b/frameworks/projects/MaterialDesignLite/src/main/flex/org/apache/flex/mdl/beads/Tooltip.as @@ -0,0 +1,222 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.html.Div; + + COMPILE::JS + { + import org.apache.flex.core.WrappedHTMLElement; + } + + /** + * The Tooltip class represents + * + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public class Tooltip implements IBead + { + /** + * constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function Tooltip() + { + + } + + private var _strand:IStrand; + private var _text:String = ""; + + /** + * The text of the heading + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get text():String + { + return _text; + } + + public function set text(value:String):void + { + _text = value; + } + + private var _dataMdlFor:String; + /** + * The id value of the associated button that opens this menu. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get dataMdlFor():String + { + return _dataMdlFor; + } + public function set dataMdlFor(value:String):void + { + _dataMdlFor = value; + } + + private var _large:Boolean = false; + /** + * A boolean flag to activate "mdl-tooltip--large" effect selector. + * Applies large-font effect. Optional + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get large():Boolean + { + return _large; + } + public function set large(value:Boolean):void + { + _large = value; + } + + private var _leftPosition:Boolean = false; + /** + * A boolean flag to activate "mdl-tooltip--left" effect selector. + * Positions the tooltip to the left of the target. Optional + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get leftPosition():Boolean + { + return _large; + } + public function set leftPosition(value:Boolean):void + { + _leftPosition = value; + } + + private var _rightPosition:Boolean = false; + /** + * A boolean flag to activate "mdl-tooltip--right" effect selector. + * Positions the tooltip to the right of the target. Optional + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get rightPosition():Boolean + { + return _rightPosition; + } + public function set rightPosition(value:Boolean):void + { + _rightPosition = value; + } + + private var _topPosition:Boolean = false; + /** + * A boolean flag to activate "mdl-tooltip--top" effect selector. + * Positions the tooltip to the top of the target. Optional + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get topPosition():Boolean + { + return _topPosition; + } + public function set topPosition(value:Boolean):void + { + _topPosition = value; + } + + private var _bottomPosition:Boolean = false; + /** + * A boolean flag to activate "mdl-tooltip--bottom" effect selector. + * Positions the tooltip to the bottom of the target. Optional + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function get bottomPosition():Boolean + { + return _bottomPosition; + } + public function set bottomPosition(value:Boolean):void + { + _bottomPosition = 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; + + var divElemet:HTMLDivElement = document.createElement("div") as HTMLDivElement; + + divElemet.classList.add("mdl-tooltip"); + divElemet.classList.toggle("mdl-tooltip--top", _topPosition); + divElemet.classList.toggle("mdl-tooltip--left", _leftPosition); + divElemet.classList.toggle("mdl-tooltip--right", _rightPosition); + divElemet.classList.toggle("mdl-tooltip--bottom", _bottomPosition); + + divElemet.classList.toggle("mdl-tooltip--large", _large); + divElemet.setAttribute('for', host.id); + + var textNode:Text = document.createTextNode(''); + textNode.nodeValue = _text; + divElemet.appendChild(textNode); + + element.parentElement.appendChild(divElemet); + } + } + } +} http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/327ced48/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 041d8a3..02fa733 100644 --- a/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml +++ b/frameworks/projects/MaterialDesignLite/src/main/resources/mdl-manifest.xml @@ -68,5 +68,5 @@ <component id="MaterialIconAdd" class="org.apache.flex.mdl.beads.materialIcons.MaterialIconAdd"/> <component id="ContactChip" class="org.apache.flex.mdl.beads.ContactChip"/> <component id="ContactImageChip" class="org.apache.flex.mdl.beads.ContactImageChip"/> - <component id="Tooltip" class="org.apache.flex.mdl.Tooltip"/> + <component id="Tooltip" class="org.apache.flex.mdl.beads.Tooltip"/> </componentPackage>
