That's an interesting suggestion. In Flex or even html, we specify a 'tooltip' attribute or 'title' attribute. MDL makes it a bit more complicated by treating the component and the tooltip as different entities and then inventing a new way to connect them.
Specifying it as a bead seems like the natural and correct thing to do in the 'FlexJS way'. Thanks, Om On Fri, Dec 2, 2016 at 2:02 PM, Carlos Rovira <carlos.rov...@codeoscopic.com > wrote: > I though on it too, but in MDL they created a separate div that relates to > the target component by id. For that reason I follow the most natural path > that is separate. If not I think we could make a bead, but then instead of > "append" to target it should be write "nextto". I search a bit and I think > this is done in this way: > > referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling); > > so what do you think? > > > 2016-12-02 21:14 GMT+01:00 Piotr Zarzycki <piotrzarzyck...@gmail.com>: > > > Hi Carlos, > > > > Maybe Tooltip should be a Bead ? Just my first thought when I saw how > > example look like. > > > > Piotr > > > > 2016-12-02 15:46 GMT+01:00 <carlosrov...@apache.org>: > > > > > Repository: flex-asjs > > > Updated Branches: > > > refs/heads/develop 5aebf86cb -> 4e7c7361d > > > > > > > > > MDL Tooltip > > > > > > > > > Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo > > > Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/ > 4e7c7361 > > > Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/4e7c7361 > > > Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/4e7c7361 > > > > > > Branch: refs/heads/develop > > > Commit: 4e7c7361d579f24a43645c3a524078389d1862e6 > > > Parents: 5aebf86 > > > Author: Carlos Rovira <carlosrov...@apache.org> > > > Authored: Fri Dec 2 15:46:22 2016 +0100 > > > Committer: Carlos Rovira <carlosrov...@apache.org> > > > Committed: Fri Dec 2 15:46:22 2016 +0100 > > > > > > ---------------------------------------------------------------------- > > > .../MDLExample/src/main/flex/Buttons.mxml | 3 +- > > > .../main/flex/org/apache/flex/mdl/Tooltip.as | 137 > > +++++++++++++++++++ > > > .../src/main/resources/mdl-manifest.xml | 1 + > > > 3 files changed, 140 insertions(+), 1 deletion(-) > > > ---------------------------------------------------------------------- > > > > > > > > > http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/ > > > 4e7c7361/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 7879fad..73edb28 100644 > > > --- a/examples/flexjs/MDLExample/src/main/flex/Buttons.mxml > > > +++ b/examples/flexjs/MDLExample/src/main/flex/Buttons.mxml > > > @@ -31,11 +31,12 @@ limitations under the License. > > > > > > <mdl:GridCell column="1"> > > > <!-- Fab button --> > > > - <mdl:Button fab="true" colored="true"> > > > + <mdl:Button id="mybtn" fab="true" colored="true"> > > > <mdl:beads> > > > <mdl:MaterialIconAdd /> > > > </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/ > > > 4e7c7361/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 > > > new file mode 100644 > > > index 0000000..e3b519d > > > --- /dev/null > > > +++ b/frameworks/projects/MaterialDesignLite/src/main/ > > > flex/org/apache/flex/mdl/Tooltip.as > > > @@ -0,0 +1,137 @@ > > > +/////////////////////////////////////////////////////////// > > > ///////////////////// > > > +// > > > +// 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); > > > + } > > > + } > > > + > > > + /** > > > + * @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/ > > > 4e7c7361/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 66a739b..2fd804f 100644 > > > --- a/frameworks/projects/MaterialDesignLite/src/main/ > > > resources/mdl-manifest.xml > > > +++ b/frameworks/projects/MaterialDesignLite/src/main/ > > > resources/mdl-manifest.xml > > > @@ -64,4 +64,5 @@ > > > <component id="DeletableChip" class="org.apache.flex.mdl. > > > beads.DeletableChip"/> > > > <component id="MaterialIconCancel" class="org.apache.flex.mdl. > > > beads.materialIcons.MaterialIconCancel"/> > > > <component id="MaterialIconAdd" class="org.apache.flex.mdl. > > > beads.materialIcons.MaterialIconAdd"/> > > > + <component id="Tooltip" class="org.apache.flex.mdl.Tooltip"/> > > > </componentPackage> > > > > > > > > > > > > -- > > > > Greetings > > Piotr Zarzycki > > > > Flex/AIR/.NET Developer > > > > mobile: +48 880 859 557 > > e-mail: piotrzarzyck...@gmail.com > > skype: zarzycki10 > > > > LinkedIn: http://www.linkedin.com/piotrzarzycki > > <https://pl.linkedin.com/in/piotr-zarzycki-92a53552> > > > > > > -- > > Carlos Rovira > Director General > M: +34 607 22 60 05 > http://www.codeoscopic.com > http://www.avant2.es > > Este mensaje se dirige exclusivamente a su destinatario y puede contener > información privilegiada o confidencial. Si ha recibido este mensaje por > error, le rogamos que nos lo comunique inmediatamente por esta misma vía y > proceda a su destrucción. > > De la vigente Ley Orgánica de Protección de Datos (15/1999), le comunicamos > que sus datos forman parte de un fichero cuyo responsable es CODEOSCOPIC > S.A. La finalidad de dicho tratamiento es facilitar la prestación del > servicio o información solicitados, teniendo usted derecho de acceso, > rectificación, cancelación y oposición de sus datos dirigiéndose a nuestras > oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la documentación > necesaria. >
