You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@flex.apache.org by Carlos Rovira <ca...@apache.org> on 2013/12/09 19:28:47 UTC
New Flex MaskedTextInput Spark Component
Hi,
These days I worked a new spark MaskedTextInput component and I want to
share a demo of this component so you can play with it.
I think there's no such component already in the Flex SDK or out there, and
as I needed for a project I had to make one from scratch.
The component is an extension of spark TextInput.
I plan to commit this component to Apache Flex SDK in the next days unless
someone let me know another alternative or some info
that make this component useless. In order to prepare the commit I want to
ask other committers and PMCs here where is the appropriate place
to hold this component and share what you consider to take into account in
order to make a right integration. If someone thinks it's not worth it to
make it part of the Flex SDK, let me know as well. I don't want to commit
code that could not be right for the SDK.
Here's the link to the demo. I posted as well some doc comment text to
share the properties you can use:
http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
Hope you consider it interesting and if you know some other similar
component out there, please let me know! :)
Best,
--
--
Carlos Rovira
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
@Justin, I'll go the 1 route since although the component is functionally
complete (minus the things we commented here), I don't have the test. I
think it's better start in experimental and as it evolves move it to a
better place
@Cosma, so this component will not work on mobile since it uses
FlowOperation extensively to manage insertion, deletion and copy/paste...,
but I maybe we could adapt the automata algorithm behind the scenes to work
on a closer implementation for mobile.
2013/12/10 Cosma Colanicchia <co...@gmail.com>
> Nice component, thanks.
>
> About the mobile, I had a component with immediate validation (e.g. numeric
> input), that on mobile does not work because the TextOperationEvent
> dispatched does not contain the most important information (the
> operation:FlowOperation attribute). Probably non-TLF implementations used
> on mobiles only emulates the top-level event, but does not have a way to
> provide the same level of detail about the operation.
>
>
> 2013/12/10 Justin Mclean <ju...@classsoftware.com>
>
> > Hi,
> >
> > > @Justin, I'll check your comments to see how we can take into account
> all
> > > this things, but I'm afraid that this initial component is not as
> > > smart..maybe with the time and your help we can build such versatile
> > > maskedtextinput component.
> > Sure can help out there and tat certainly doesn't need to be done right
> > away. Have a single separator is still useful for a lot of cases.
> >
> > > So taking into account that the component is wanted, could you guys
> point
> > > me to the place where I could make a first commit?
> >
> > Two main choices:
> > 1. in frameworks/projects/experimental
> > 2. in frameworks/projects/apache
> >
> > I'd go with 1. if you think it still needs a bit of work or is missing
> > tests and 2. If it's reasonably complete and has tests.
> >
> > Thanks,
> > Justin
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Cosma Colanicchia <co...@gmail.com>.
Nice component, thanks.
About the mobile, I had a component with immediate validation (e.g. numeric
input), that on mobile does not work because the TextOperationEvent
dispatched does not contain the most important information (the
operation:FlowOperation attribute). Probably non-TLF implementations used
on mobiles only emulates the top-level event, but does not have a way to
provide the same level of detail about the operation.
2013/12/10 Justin Mclean <ju...@classsoftware.com>
> Hi,
>
> > @Justin, I'll check your comments to see how we can take into account all
> > this things, but I'm afraid that this initial component is not as
> > smart..maybe with the time and your help we can build such versatile
> > maskedtextinput component.
> Sure can help out there and tat certainly doesn't need to be done right
> away. Have a single separator is still useful for a lot of cases.
>
> > So taking into account that the component is wanted, could you guys point
> > me to the place where I could make a first commit?
>
> Two main choices:
> 1. in frameworks/projects/experimental
> 2. in frameworks/projects/apache
>
> I'd go with 1. if you think it still needs a bit of work or is missing
> tests and 2. If it's reasonably complete and has tests.
>
> Thanks,
> Justin
Re: New Flex MaskedTextInput Spark Component
Posted by Justin Mclean <ju...@classsoftware.com>.
Hi,
> @Justin, I'll check your comments to see how we can take into account all
> this things, but I'm afraid that this initial component is not as
> smart..maybe with the time and your help we can build such versatile
> maskedtextinput component.
Sure can help out there and tat certainly doesn't need to be done right away. Have a single separator is still useful for a lot of cases.
> So taking into account that the component is wanted, could you guys point
> me to the place where I could make a first commit?
Two main choices:
1. in frameworks/projects/experimental
2. in frameworks/projects/apache
I'd go with 1. if you think it still needs a bit of work or is missing tests and 2. If it's reasonably complete and has tests.
Thanks,
Justin
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Hi,
@Erik, @Maurice, thanks for your kindly words :), this encourages me to
commit the component :)
@Lee, I must confess that my development is focused on browser so I didn't
take StageText into account, but as this is a spark TextInput extension, I
think it should work, since it mainly uses two listeners to play with
TextEvent and TextOperationEvent. Hope you could help me to test in a
mobile device and see if we need to tweak something to make it work or if
it works with the actual approach.
@Harbs: You're right, as this is a first draft, it only support one
separator, so we need to update to more than one to make it work as you
expect. It's the next on the list, but I think I'll commit first the actual
version and then we can update it to get this feature.
@Maxime, very helpful comments, it throws many ideas and experience. If you
want to share your code it would be good, but your experience with this
stuff is already valuable to update this component. I'll take your
recommendations into account to make further enhancements as the one
commented before for multiple separators or the kind of multiple
placeholders you suggest.
As you did, I already has a r:DateField (r is the namespace in my framework
Riality) that is basically a mx:DateField with a spark TextInput and a mask
logic similar to this component. I'd like to get a spark DateField some
day, but I think the focus on spark DateField is more based on flash
globalization capabilities than this usability enhancements. But it would
be a great addition to the actual unique mx:DateField option to start a
s:Datefield official component that use a TextInput component like this ;)
@Justin, I'll check your comments to see how we can take into account all
this things, but I'm afraid that this initial component is not as
smart..maybe with the time and your help we can build such versatile
maskedtextinput component.
So taking into account that the component is wanted, could you guys point
me to the place where I could make a first commit? it will consist of the
AS3 class, the basic skin and some CSS styles.
Thanks again for your feedback and hope that we could enhance this
component to make it better with the comments shared in this thread.
Best
Carlos
2013/12/9 Justin Mclean <ju...@classsoftware.com>
> Hi,
>
> > - there was a list of possible separators
>
> The mx:DateFormatter validator does this (see parseDateString), you might
> want to take a look at how it does it. Also you might want to consider how
> to mask for currency ($ + , + .) and non english dates with multiple
> separators (eg Japanese date are usually written 2008年12月31日).
>
> Also perhaps a nice addition would be able to use a RegEx for masking as
> you type? Or provide a hook for custom checking like the extraValidation
> property of the PostCodeValidator.
>
> Thanks,
> Justin
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Justin Mclean <ju...@classsoftware.com>.
Hi,
> - there was a list of possible separators
The mx:DateFormatter validator does this (see parseDateString), you might want to take a look at how it does it. Also you might want to consider how to mask for currency ($ + , + .) and non english dates with multiple separators (eg Japanese date are usually written 2008年12月31日).
Also perhaps a nice addition would be able to use a RegEx for masking as you type? Or provide a hook for custom checking like the extraValidation property of the PostCodeValidator.
Thanks,
Justin
Re: New Flex MaskedTextInput Spark Component
Posted by Maxime Cowez <ma...@gmail.com>.
Hey Carlos,
That's great. I'd written a very similar component a few years ago, which
worked pretty much the same as yours except the code was never
publication-worthy ;)
>From what I've seen, there are 2 minor differences:
- there was a list of possible separators (which could also be
configured); yours seems to have only one separator. I absolutely needed
this because I created the component initially for a Belgian national
register number which has a mask like this: ##.##.## - ###.## so both the
dots and the dashes had to be separators. This would fix your 'sample phone
mask' and 'sample IBAN mask' which are behaving a bit oddly as Harbs
already mentioned. This is the list of default separators I
used: /\|:-.()[]{}<> For the 'sample IBAN mask' the developer could then
set separators="ES-" to override these defaults.
- you could provide a custom mask like 'dd/mm/yyyy' for a date. I'm not
sure, but it looks like your version supports only one mask character at a
time.
I also used this component to create a custom date input which combined the
masked text input and the old mx date picker for better UX than mx
DateField provides.
I don't mind sharing my code, but as I already mentioned, it's a bit dirty
:-/
cheers,
Max
On Mon, Dec 9, 2013 at 8:27 PM, Harbs <ha...@gmail.com> wrote:
> Very nice!
>
> One thing:
>
> The IBAN and Phone masks do not work the way I'd expect. It should jump
> straight to the numbers.
>
>
> On Dec 9, 2013, at 8:28 PM, Carlos Rovira wrote:
>
> > Hi,
> >
> > These days I worked a new spark MaskedTextInput component and I want to
> > share a demo of this component so you can play with it.
> > I think there's no such component already in the Flex SDK or out there,
> and
> > as I needed for a project I had to make one from scratch.
> > The component is an extension of spark TextInput.
> >
> > I plan to commit this component to Apache Flex SDK in the next days
> unless
> > someone let me know another alternative or some info
> > that make this component useless. In order to prepare the commit I want
> to
> > ask other committers and PMCs here where is the appropriate place
> > to hold this component and share what you consider to take into account
> in
> > order to make a right integration. If someone thinks it's not worth it to
> > make it part of the Flex SDK, let me know as well. I don't want to commit
> > code that could not be right for the SDK.
> >
> > Here's the link to the demo. I posted as well some doc comment text to
> > share the properties you can use:
> >
> > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> >
> > Hope you consider it interesting and if you know some other similar
> > component out there, please let me know! :)
> >
> > Best,
> >
> >
> > --
> > --
> > Carlos Rovira
>
>
Re: New Flex MaskedTextInput Spark Component
Posted by Harbs <ha...@gmail.com>.
Very nice!
One thing:
The IBAN and Phone masks do not work the way I'd expect. It should jump straight to the numbers.
On Dec 9, 2013, at 8:28 PM, Carlos Rovira wrote:
> Hi,
>
> These days I worked a new spark MaskedTextInput component and I want to
> share a demo of this component so you can play with it.
> I think there's no such component already in the Flex SDK or out there, and
> as I needed for a project I had to make one from scratch.
> The component is an extension of spark TextInput.
>
> I plan to commit this component to Apache Flex SDK in the next days unless
> someone let me know another alternative or some info
> that make this component useless. In order to prepare the commit I want to
> ask other committers and PMCs here where is the appropriate place
> to hold this component and share what you consider to take into account in
> order to make a right integration. If someone thinks it's not worth it to
> make it part of the Flex SDK, let me know as well. I don't want to commit
> code that could not be right for the SDK.
>
> Here's the link to the demo. I posted as well some doc comment text to
> share the properties you can use:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Hope you consider it interesting and if you know some other similar
> component out there, please let me know! :)
>
> Best,
>
>
> --
> --
> Carlos Rovira
RE:New Flex MaskedTextInput Spark Component
Posted by Maurice Amsellem <ma...@systar.com>.
Great component. +1
________________________________________
De : Lee Burrows [subscriptions@leeburrows.com]
Envoyé : lundi 9 décembre 2013 19:41
À : dev@flex.apache.org
Objet : Re: New Flex MaskedTextInput Spark Component
Awesome stuff Carlos. Does it work with Mobile too? (ie: with StageText)
On 09/12/2013 18:28, Carlos Rovira wrote:
> Hi,
>
> These days I worked a new spark MaskedTextInput component and I want to
> share a demo of this component so you can play with it.
> I think there's no such component already in the Flex SDK or out there, and
> as I needed for a project I had to make one from scratch.
> The component is an extension of spark TextInput.
>
> I plan to commit this component to Apache Flex SDK in the next days unless
> someone let me know another alternative or some info
> that make this component useless. In order to prepare the commit I want to
> ask other committers and PMCs here where is the appropriate place
> to hold this component and share what you consider to take into account in
> order to make a right integration. If someone thinks it's not worth it to
> make it part of the Flex SDK, let me know as well. I don't want to commit
> code that could not be right for the SDK.
>
> Here's the link to the demo. I posted as well some doc comment text to
> share the properties you can use:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Hope you consider it interesting and if you know some other similar
> component out there, please let me know! :)
>
> Best,
>
>
--
Lee Burrows
ActionScripter
Re: New Flex MaskedTextInput Spark Component
Posted by Lee Burrows <su...@leeburrows.com>.
Awesome stuff Carlos. Does it work with Mobile too? (ie: with StageText)
On 09/12/2013 18:28, Carlos Rovira wrote:
> Hi,
>
> These days I worked a new spark MaskedTextInput component and I want to
> share a demo of this component so you can play with it.
> I think there's no such component already in the Flex SDK or out there, and
> as I needed for a project I had to make one from scratch.
> The component is an extension of spark TextInput.
>
> I plan to commit this component to Apache Flex SDK in the next days unless
> someone let me know another alternative or some info
> that make this component useless. In order to prepare the commit I want to
> ask other committers and PMCs here where is the appropriate place
> to hold this component and share what you consider to take into account in
> order to make a right integration. If someone thinks it's not worth it to
> make it part of the Flex SDK, let me know as well. I don't want to commit
> code that could not be right for the SDK.
>
> Here's the link to the demo. I posted as well some doc comment text to
> share the properties you can use:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Hope you consider it interesting and if you know some other similar
> component out there, please let me know! :)
>
> Best,
>
>
--
Lee Burrows
ActionScripter
RE: New Flex MaskedTextInput Spark Component
Posted by Maurice Amsellem <ma...@systar.com>.
Carlos,
I noticed a strange behavior, for example in the Date Mask:
- type DD/MM/YYYY
- click after MM, or move with the left arrow key just after MM ( eg. to change the month)
- type backspace twice
Expected Result: MM should be replaced by __
Actual Result: YYYY is replaced by YY__
Once again, really nice components,
PS: I like the "controls rain" app :-)
Maurice
-----Message d'origine-----
De : Dany Dhondt [mailto:archemedia@mac.com]
Envoyé : mardi 10 décembre 2013 17:15
À : dev@flex.apache.org
Objet : Re: New Flex MaskedTextInput Spark Component
Great work Carlos! Nice component!
Dany Dhondt
archemedia@mac.com
Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <ca...@apache.org> het volgende geschreven:
> Hi,
>
> These days I worked a new spark MaskedTextInput component and I want
> to share a demo of this component so you can play with it.
> I think there's no such component already in the Flex SDK or out
> there, and as I needed for a project I had to make one from scratch.
> The component is an extension of spark TextInput.
>
> I plan to commit this component to Apache Flex SDK in the next days
> unless someone let me know another alternative or some info that make
> this component useless. In order to prepare the commit I want to ask
> other committers and PMCs here where is the appropriate place to hold
> this component and share what you consider to take into account in
> order to make a right integration. If someone thinks it's not worth it
> to make it part of the Flex SDK, let me know as well. I don't want to
> commit code that could not be right for the SDK.
>
> Here's the link to the demo. I posted as well some doc comment text to
> share the properties you can use:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Hope you consider it interesting and if you know some other similar
> component out there, please let me know! :)
>
> Best,
>
>
> --
> --
> Carlos Rovira
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Hi Maxime,
extremely useful testing. many thanks.
As I posted I see some bugs mainly on deletion, and although I could fix
something I need to make revise all your posting.
For operations with select all text or portions the component needs
specific implementations (was one of the points left in this 1.0, but I
think it could enter as well giving it some more time).
The phone case seems the problem with removing operation that I mentioned
at the begin of the email. There's the same problem on insertion.
The problem with colors could be due to use the TextInputSkin now. In the
skin the prompt is over the textDisplay so the rendering is grey over
black. This could be improved a little. I decided to left it in that state
since in my mac it looks ok (at least it could be assumible while fixing
other problems), but maybe on windows the rendering is not so good. One
thing I'd like could be to have the textDisplay over the promptDisplay...or
maybe use other strategy...
For (5), It's the expected result for me. This was the point I commented in
my email that could be configured with a flag like "dragMode". This
usability is taken from other components in javascript out there. But
there's other way to see it where positions are not "dragged" as you insert
or remove. Your component worked in this last mode and it's ok too.
the only one problem I see in my approach is in the case of a plate mask.
When you remove the last number, a letter comes in the place of a number.
Maybe the component should remove all characters until it founds a valid
one. In the case of the plate mask all characters to the right will be
removed.
I'll be working as I get some time in fix all this things to present a
fixed component soon.
Thanks again for your revision. Very much appreciated.
Carlos
2014/1/8 Maxime Cowez <ma...@gmail.com>
> Hi Carlos,
> great work.
>
> I found these little bugs:
> 1./
> - take any input of your demo
> - fill completely
> - select all (with the mouse or ctrl+a, doesn't matter)
> - type one character
> > expected: one character at first position
> > got: two identical characters at first and second position; second
> character selected/highlighted
> 2./
> - take phone input of your demo
> - fill completely
> - put cursor at first position (before the separator)
> - type one number
> > expected: replace first character with new one
> > got: replaced the '+' separator with the new character
> 3./
> - take customized CCC input of your demo
> - fill five characters
> > expected: separator doesn't change
> > got: separator turns black
> 4./
> The separator colors sometimes look a bit strange. For instance the 'S' of
> the IBAN input is darker than the 'E'.
> I'm looking at the demo from a Linux box and I'm guessing you didn't use
> embedded fonts for the demo.
> 5./
> There's an inconsistency when typing over already filled in characters.
> Use case 1:
> - fill a field completely
> - set cursor at first position
> - type a character
> > result: first character is replaced with new character
> Use case 2:
> - fill a field partially
> - set cursor at first position
> - type a character
> > result: all existing characters shift right one place and the new
> character is written at the first position
> The behaviour should at least be consistent, but I think for usabillity
> "use case 1" should be the default behaviour since a text mask field is
> used to fill in fixed positions.
>
> Hope this helps and let me know if there's anything else I can do to help.
> M
>
>
> On Wed, Jan 8, 2014 at 1:29 PM, Kessler CTR Mark J <
> mark.kessler.ctr@usmc.mil> wrote:
>
> > >* Regex patterns like proposed by Justin and Maxime (this will allow us
> to
> > restrict a insertion to a Max/Min value).
> >
> > Is the regex requirement just for numbers or all input?
> >
> > -Mark
> >
> > -----Original Message-----
> > From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf
> > Of Carlos Rovira
> > Sent: Tuesday, January 07, 2014 7:38 PM
> > To: dev@flex.apache.org
> > Subject: Re: New Flex MaskedTextInput Spark Component
> >
> > Hi,
> >
> > I rewrite the MaskedTextInput component to support various important
> > concepts:
> >
> > * get/set data vía "text" property (remove "rawText" property). "get"
> text
> > remove separators and "set" text format the string to display in the
> > component. I think this the most important improvement.
> > * Support for more than one separator (now the property is
> "separators"). I
> > added "-+/|()[]{}.", but I think Maxime has a more complete list that I
> > will check before first commit.
> > * Now the component "jumps" separator places (i.e: (+34)915.666.77.88)
> > * Support for custom prompt vía new property "textMaskPrompt" (i.e:
> > dd/mm/yyyy)
> > * removed the need of a MaskedTextInputSkin (now using TextInputSkin and
> > getCurrentSkinState)
> > * remove the uppercase, so now is a CSS style using property
> > typographicCase: uppercase;
> > * flex life cycle is better used (commitProperties) and text is always
> fine
> > thanks to dispatchEvent(new Event("textChanged")); both in insertion,
> > override, etc...
> > * bettter handling of restricted chars using TextOperationEvent.CHANGING
> to
> > cancel the insert operation.
> > * simplified the logic getting a more clean code (the Automata's logic is
> > now few methods compared with old version)
> > * new getter "fullText" to get a convenient method that get the text
> > formatted with separators included
> > * removed test validation in latest version posted (this was only for my
> > testing purposes and not for a final SDK component)
> > * rewrite the docs.
> >
> > I think this version is more like a 1.0 version (I need to make some
> > further testing since I could consider finished but right now I could
> > considere in a decent shape)
> >
> > What is not implemented yet:
> >
> > * Regex patterns like proposed by Justin and Maxime (this will allow us
> to
> > restrict a insertion to a Max/Min value).
> > * A handling of "insertion in a place" (i.e. inserting blank spaces
> between
> > chars, or inserts directly in char at position 5). My approach is more
> like
> > a normal text input that you can add/remove characters taking into
> account
> > all string dragging the rest of string with the operation. Is the way I
> see
> > in similar components in other technologies out there. Maybe this could
> be
> > discussed or make a configuration to support both methods (i.e:
> > dragMode="true/false" or something similar)
> > * As I use TextOperationEvent, I think this component is not mobile
> > friendly. Maybe someone could point me how we could support it as well
> > (StageText,...)
> > * I think copy/paste could be improved supporting "appending" text, as
> well
> > select a piece of intermediate text and make cut, copy and paste... (this
> > maybe could be added soon)
> >
> > Here is the code:
> >
> > AS3: https://gist.github.com/carlosrovira/7895322
> > CSS: https://gist.github.com/carlosrovira/7895435
> >
> > (I also put the namespace to spark.components, and the Apache header)
> >
> > demo:
> >
> > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> >
> > Feedback is highly appreciated for this version to fix any bug before
> > commit to experimental library.
> >
> > Best,
> >
> > Carlos Rovira
> >
> >
> >
> >
> >
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Maxime Cowez <ma...@gmail.com>.
Hi Carlos,
great work.
I found these little bugs:
1./
- take any input of your demo
- fill completely
- select all (with the mouse or ctrl+a, doesn't matter)
- type one character
> expected: one character at first position
> got: two identical characters at first and second position; second
character selected/highlighted
2./
- take phone input of your demo
- fill completely
- put cursor at first position (before the separator)
- type one number
> expected: replace first character with new one
> got: replaced the '+' separator with the new character
3./
- take customized CCC input of your demo
- fill five characters
> expected: separator doesn't change
> got: separator turns black
4./
The separator colors sometimes look a bit strange. For instance the 'S' of
the IBAN input is darker than the 'E'.
I'm looking at the demo from a Linux box and I'm guessing you didn't use
embedded fonts for the demo.
5./
There's an inconsistency when typing over already filled in characters.
Use case 1:
- fill a field completely
- set cursor at first position
- type a character
> result: first character is replaced with new character
Use case 2:
- fill a field partially
- set cursor at first position
- type a character
> result: all existing characters shift right one place and the new
character is written at the first position
The behaviour should at least be consistent, but I think for usabillity
"use case 1" should be the default behaviour since a text mask field is
used to fill in fixed positions.
Hope this helps and let me know if there's anything else I can do to help.
M
On Wed, Jan 8, 2014 at 1:29 PM, Kessler CTR Mark J <
mark.kessler.ctr@usmc.mil> wrote:
> >* Regex patterns like proposed by Justin and Maxime (this will allow us to
> restrict a insertion to a Max/Min value).
>
> Is the regex requirement just for numbers or all input?
>
> -Mark
>
> -----Original Message-----
> From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf
> Of Carlos Rovira
> Sent: Tuesday, January 07, 2014 7:38 PM
> To: dev@flex.apache.org
> Subject: Re: New Flex MaskedTextInput Spark Component
>
> Hi,
>
> I rewrite the MaskedTextInput component to support various important
> concepts:
>
> * get/set data vía "text" property (remove "rawText" property). "get" text
> remove separators and "set" text format the string to display in the
> component. I think this the most important improvement.
> * Support for more than one separator (now the property is "separators"). I
> added "-+/|()[]{}.", but I think Maxime has a more complete list that I
> will check before first commit.
> * Now the component "jumps" separator places (i.e: (+34)915.666.77.88)
> * Support for custom prompt vía new property "textMaskPrompt" (i.e:
> dd/mm/yyyy)
> * removed the need of a MaskedTextInputSkin (now using TextInputSkin and
> getCurrentSkinState)
> * remove the uppercase, so now is a CSS style using property
> typographicCase: uppercase;
> * flex life cycle is better used (commitProperties) and text is always fine
> thanks to dispatchEvent(new Event("textChanged")); both in insertion,
> override, etc...
> * bettter handling of restricted chars using TextOperationEvent.CHANGING to
> cancel the insert operation.
> * simplified the logic getting a more clean code (the Automata's logic is
> now few methods compared with old version)
> * new getter "fullText" to get a convenient method that get the text
> formatted with separators included
> * removed test validation in latest version posted (this was only for my
> testing purposes and not for a final SDK component)
> * rewrite the docs.
>
> I think this version is more like a 1.0 version (I need to make some
> further testing since I could consider finished but right now I could
> considere in a decent shape)
>
> What is not implemented yet:
>
> * Regex patterns like proposed by Justin and Maxime (this will allow us to
> restrict a insertion to a Max/Min value).
> * A handling of "insertion in a place" (i.e. inserting blank spaces between
> chars, or inserts directly in char at position 5). My approach is more like
> a normal text input that you can add/remove characters taking into account
> all string dragging the rest of string with the operation. Is the way I see
> in similar components in other technologies out there. Maybe this could be
> discussed or make a configuration to support both methods (i.e:
> dragMode="true/false" or something similar)
> * As I use TextOperationEvent, I think this component is not mobile
> friendly. Maybe someone could point me how we could support it as well
> (StageText,...)
> * I think copy/paste could be improved supporting "appending" text, as well
> select a piece of intermediate text and make cut, copy and paste... (this
> maybe could be added soon)
>
> Here is the code:
>
> AS3: https://gist.github.com/carlosrovira/7895322
> CSS: https://gist.github.com/carlosrovira/7895435
>
> (I also put the namespace to spark.components, and the Apache header)
>
> demo:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Feedback is highly appreciated for this version to fix any bug before
> commit to experimental library.
>
> Best,
>
> Carlos Rovira
>
>
>
>
>
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
I made a ticket to track MTI changes:
https://issues.apache.org/jira/browse/FLEX-34149
2014-03-16 23:55 GMT+01:00 Carlos Rovira <ca...@codeoscopic.com>:
> Hi Maxime,
>
> thanks for pointing to the new component. As you said MTI doesn't support
> LTR direction right now. At this point I think there's other features that
> will IMO more needed (i.e: Mobile support). As I have no experience with
> LTR text I don't know how needed is that feature, so at this moment I don't
> have plans to implement it, but I can add it to the list as possible
> feature to implement and give it priority based on demand, if people does
> not produce a patch for it. As I say I'm more interested, when I invest
> time, in give priority to mobile support or mustella test to promote the
> component from experimental to main spark library.
>
> btw, I was making the changes proposed here, and at the same time watching
> the needs for mobile. Since is not straight forward changes, I'm at this
> time evaluating to convert the component to mobile and take into account
> the "keep slot" philosophy to avoid working in the later and then have to
> rewrite to support mobile...
>
>
>
>
>
> 2014-03-14 10:09 GMT+01:00 Maxime Cowez <ma...@gmail.com>:
>
> Hi Carlos,
>>
>> I got this issue on my draft version of MaskedTextInput:
>> https://github.com/RIAstar/MaskedTextInputFx/issues/2
>> I redirected the poster to the Apache Flex experimental component, but I
>> think his issue might apply to your component as well.
>> Did you think of RTL text support?
>>
>> Cheers,
>> Max
>>
>>
>> On Wed, Jan 22, 2014 at 12:54 AM, Carlos Rovira <
>> carlos.rovira@codeoscopic.com> wrote:
>>
>> > Just created the ticket:
>> >
>> > https://issues.apache.org/jira/browse/FLEX-34053
>> >
>> > And make the first commit of this component to Apache Flex.
>> >
>> > As well fixed the copy/paste issue mentioned some days ago.
>> >
>> > Hope people can test and share now that the component is already in the
>> > sdk. I'll make some revisions and fixes in the following days.
>> >
>> > Best,
>> >
>> > Carlos
>> >
>> >
>> >
>> >
>> >
>> > 2014/1/21 Carlos Rovira <ca...@codeoscopic.com>
>> >
>> > > Hi,
>> > >
>> > > a new revision of the MaskedTextinputComponent is here:
>> > >
>> > > https://gist.github.com/carlosrovira/7895322
>> > >
>> > > and the demo update here (as usual):
>> > >
>> > > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>> > >
>> > > No all bugs has gone yet, but there's important fixes:
>> > >
>> > > * Rebuild internal separatorLocations when maskedText change at
>> runtime
>> > > * override text routed to TextOperationEvent.CHANGE to throw
>> textChange
>> > > and change events. (The component is tested in validation scenarios
>> and
>> > > with other flex events like change and now is working as expected) -
>> This
>> > > is very important to be integrated as expected in your application
>> using
>> > > events, binding,etc like you do with a normal s:TextInput.
>> > > * fixed verification chars allowed (better handling)
>> > > * fixed some bugs on insertion when cursor is not at the end
>> > > * fixed some bugs on deletion (more than one consecutive separator)
>> > >
>> > > There's some bugs to fix yet (some of them exposed by Maxime) and
>> hope to
>> > > see look to fix it soon, but though that this revision was important
>> for
>> > > people using it right now so I take the time to update this thread.
>> > >
>> > > Best,
>> > >
>> > > Carlos
>> > >
>> > >
>> > >
>> > >
>> > >
>> > >
>> > > 2014/1/9 Kessler CTR Mark J <ma...@usmc.mil>
>> > >
>> > >> Here is a quick example usage...
>> > >>
>> > >>
>> > >> var pattern:RegExp = RegExPatterns.createRegExp("what I'm matching",
>> > >> RegExPatterns.CONTAINS);
>> > >>
>> > >> myTextInput.text.match(pattern);
>> > >> or
>> > >> myTextInput.text.replace(pattern, replacementObject);
>> > >> or
>> > >> myTextInput.text.search(pattern);
>> > >>
>> > >>
>> > >> -Mark
>> > >>
>> > >> -----Original Message-----
>> > >> From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On
>> > Behalf
>> > >> Of Carlos Rovira
>> > >> Sent: Thursday, January 09, 2014 7:17 AM
>> > >> To: dev@flex.apache.org
>> > >> Subject: Re: New Flex MaskedTextInput Spark Component
>> > >>
>> > >> Hi Mark, thanks for pointing me to this class, I was not aware of it,
>> > and
>> > >> I
>> > >> will add to my arsenal :).
>> > >>
>> > >> Regarding this concrete case, If we end inserting regex
>> functionality in
>> > >> the MaskedTextInput (very likely) we could think if we need some
>> > behaviour
>> > >> to complement this class.
>> > >>
>> > >>
>> > >
>> > >
>> > > --
>> > > Carlos Rovira
>> > > Director de Tecnología
>> > > M: +34 607 22 60 05
>> > > F: +34 912 94 80 80
>> > > http://www.codeoscopic.com
>> > > http://www.directwriter.es
>> > > http://www.avant2.es
>> > >
>> >
>> >
>> >
>> > --
>> > Carlos Rovira
>> > Director de Tecnología
>> > M: +34 607 22 60 05
>> > F: +34 912 94 80 80
>> > http://www.codeoscopic.com
>> > http://www.directwriter.es
>> > http://www.avant2.es
>> >
>>
>
>
>
> --
> Carlos Rovira
> Director de Tecnología
> M: +34 607 22 60 05
> F: +34 912 94 80 80
> http://www.codeoscopic.com
> http://www.directwriter.es
> http://www.avant2.es
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Hi Maxime,
thanks for pointing to the new component. As you said MTI doesn't support
LTR direction right now. At this point I think there's other features that
will IMO more needed (i.e: Mobile support). As I have no experience with
LTR text I don't know how needed is that feature, so at this moment I don't
have plans to implement it, but I can add it to the list as possible
feature to implement and give it priority based on demand, if people does
not produce a patch for it. As I say I'm more interested, when I invest
time, in give priority to mobile support or mustella test to promote the
component from experimental to main spark library.
btw, I was making the changes proposed here, and at the same time watching
the needs for mobile. Since is not straight forward changes, I'm at this
time evaluating to convert the component to mobile and take into account
the "keep slot" philosophy to avoid working in the later and then have to
rewrite to support mobile...
2014-03-14 10:09 GMT+01:00 Maxime Cowez <ma...@gmail.com>:
> Hi Carlos,
>
> I got this issue on my draft version of MaskedTextInput:
> https://github.com/RIAstar/MaskedTextInputFx/issues/2
> I redirected the poster to the Apache Flex experimental component, but I
> think his issue might apply to your component as well.
> Did you think of RTL text support?
>
> Cheers,
> Max
>
>
> On Wed, Jan 22, 2014 at 12:54 AM, Carlos Rovira <
> carlos.rovira@codeoscopic.com> wrote:
>
> > Just created the ticket:
> >
> > https://issues.apache.org/jira/browse/FLEX-34053
> >
> > And make the first commit of this component to Apache Flex.
> >
> > As well fixed the copy/paste issue mentioned some days ago.
> >
> > Hope people can test and share now that the component is already in the
> > sdk. I'll make some revisions and fixes in the following days.
> >
> > Best,
> >
> > Carlos
> >
> >
> >
> >
> >
> > 2014/1/21 Carlos Rovira <ca...@codeoscopic.com>
> >
> > > Hi,
> > >
> > > a new revision of the MaskedTextinputComponent is here:
> > >
> > > https://gist.github.com/carlosrovira/7895322
> > >
> > > and the demo update here (as usual):
> > >
> > > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> > >
> > > No all bugs has gone yet, but there's important fixes:
> > >
> > > * Rebuild internal separatorLocations when maskedText change at runtime
> > > * override text routed to TextOperationEvent.CHANGE to throw textChange
> > > and change events. (The component is tested in validation scenarios and
> > > with other flex events like change and now is working as expected) -
> This
> > > is very important to be integrated as expected in your application
> using
> > > events, binding,etc like you do with a normal s:TextInput.
> > > * fixed verification chars allowed (better handling)
> > > * fixed some bugs on insertion when cursor is not at the end
> > > * fixed some bugs on deletion (more than one consecutive separator)
> > >
> > > There's some bugs to fix yet (some of them exposed by Maxime) and hope
> to
> > > see look to fix it soon, but though that this revision was important
> for
> > > people using it right now so I take the time to update this thread.
> > >
> > > Best,
> > >
> > > Carlos
> > >
> > >
> > >
> > >
> > >
> > >
> > > 2014/1/9 Kessler CTR Mark J <ma...@usmc.mil>
> > >
> > >> Here is a quick example usage...
> > >>
> > >>
> > >> var pattern:RegExp = RegExPatterns.createRegExp("what I'm matching",
> > >> RegExPatterns.CONTAINS);
> > >>
> > >> myTextInput.text.match(pattern);
> > >> or
> > >> myTextInput.text.replace(pattern, replacementObject);
> > >> or
> > >> myTextInput.text.search(pattern);
> > >>
> > >>
> > >> -Mark
> > >>
> > >> -----Original Message-----
> > >> From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On
> > Behalf
> > >> Of Carlos Rovira
> > >> Sent: Thursday, January 09, 2014 7:17 AM
> > >> To: dev@flex.apache.org
> > >> Subject: Re: New Flex MaskedTextInput Spark Component
> > >>
> > >> Hi Mark, thanks for pointing me to this class, I was not aware of it,
> > and
> > >> I
> > >> will add to my arsenal :).
> > >>
> > >> Regarding this concrete case, If we end inserting regex functionality
> in
> > >> the MaskedTextInput (very likely) we could think if we need some
> > behaviour
> > >> to complement this class.
> > >>
> > >>
> > >
> > >
> > > --
> > > Carlos Rovira
> > > Director de Tecnología
> > > M: +34 607 22 60 05
> > > F: +34 912 94 80 80
> > > http://www.codeoscopic.com
> > > http://www.directwriter.es
> > > http://www.avant2.es
> > >
> >
> >
> >
> > --
> > Carlos Rovira
> > Director de Tecnología
> > M: +34 607 22 60 05
> > F: +34 912 94 80 80
> > http://www.codeoscopic.com
> > http://www.directwriter.es
> > http://www.avant2.es
> >
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Maxime Cowez <ma...@gmail.com>.
Hi Carlos,
I got this issue on my draft version of MaskedTextInput:
https://github.com/RIAstar/MaskedTextInputFx/issues/2
I redirected the poster to the Apache Flex experimental component, but I
think his issue might apply to your component as well.
Did you think of RTL text support?
Cheers,
Max
On Wed, Jan 22, 2014 at 12:54 AM, Carlos Rovira <
carlos.rovira@codeoscopic.com> wrote:
> Just created the ticket:
>
> https://issues.apache.org/jira/browse/FLEX-34053
>
> And make the first commit of this component to Apache Flex.
>
> As well fixed the copy/paste issue mentioned some days ago.
>
> Hope people can test and share now that the component is already in the
> sdk. I'll make some revisions and fixes in the following days.
>
> Best,
>
> Carlos
>
>
>
>
>
> 2014/1/21 Carlos Rovira <ca...@codeoscopic.com>
>
> > Hi,
> >
> > a new revision of the MaskedTextinputComponent is here:
> >
> > https://gist.github.com/carlosrovira/7895322
> >
> > and the demo update here (as usual):
> >
> > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> >
> > No all bugs has gone yet, but there's important fixes:
> >
> > * Rebuild internal separatorLocations when maskedText change at runtime
> > * override text routed to TextOperationEvent.CHANGE to throw textChange
> > and change events. (The component is tested in validation scenarios and
> > with other flex events like change and now is working as expected) - This
> > is very important to be integrated as expected in your application using
> > events, binding,etc like you do with a normal s:TextInput.
> > * fixed verification chars allowed (better handling)
> > * fixed some bugs on insertion when cursor is not at the end
> > * fixed some bugs on deletion (more than one consecutive separator)
> >
> > There's some bugs to fix yet (some of them exposed by Maxime) and hope to
> > see look to fix it soon, but though that this revision was important for
> > people using it right now so I take the time to update this thread.
> >
> > Best,
> >
> > Carlos
> >
> >
> >
> >
> >
> >
> > 2014/1/9 Kessler CTR Mark J <ma...@usmc.mil>
> >
> >> Here is a quick example usage...
> >>
> >>
> >> var pattern:RegExp = RegExPatterns.createRegExp("what I'm matching",
> >> RegExPatterns.CONTAINS);
> >>
> >> myTextInput.text.match(pattern);
> >> or
> >> myTextInput.text.replace(pattern, replacementObject);
> >> or
> >> myTextInput.text.search(pattern);
> >>
> >>
> >> -Mark
> >>
> >> -----Original Message-----
> >> From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On
> Behalf
> >> Of Carlos Rovira
> >> Sent: Thursday, January 09, 2014 7:17 AM
> >> To: dev@flex.apache.org
> >> Subject: Re: New Flex MaskedTextInput Spark Component
> >>
> >> Hi Mark, thanks for pointing me to this class, I was not aware of it,
> and
> >> I
> >> will add to my arsenal :).
> >>
> >> Regarding this concrete case, If we end inserting regex functionality in
> >> the MaskedTextInput (very likely) we could think if we need some
> behaviour
> >> to complement this class.
> >>
> >>
> >
> >
> > --
> > Carlos Rovira
> > Director de Tecnología
> > M: +34 607 22 60 05
> > F: +34 912 94 80 80
> > http://www.codeoscopic.com
> > http://www.directwriter.es
> > http://www.avant2.es
> >
>
>
>
> --
> Carlos Rovira
> Director de Tecnología
> M: +34 607 22 60 05
> F: +34 912 94 80 80
> http://www.codeoscopic.com
> http://www.directwriter.es
> http://www.avant2.es
>
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Just created the ticket:
https://issues.apache.org/jira/browse/FLEX-34053
And make the first commit of this component to Apache Flex.
As well fixed the copy/paste issue mentioned some days ago.
Hope people can test and share now that the component is already in the
sdk. I'll make some revisions and fixes in the following days.
Best,
Carlos
2014/1/21 Carlos Rovira <ca...@codeoscopic.com>
> Hi,
>
> a new revision of the MaskedTextinputComponent is here:
>
> https://gist.github.com/carlosrovira/7895322
>
> and the demo update here (as usual):
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> No all bugs has gone yet, but there's important fixes:
>
> * Rebuild internal separatorLocations when maskedText change at runtime
> * override text routed to TextOperationEvent.CHANGE to throw textChange
> and change events. (The component is tested in validation scenarios and
> with other flex events like change and now is working as expected) - This
> is very important to be integrated as expected in your application using
> events, binding,etc like you do with a normal s:TextInput.
> * fixed verification chars allowed (better handling)
> * fixed some bugs on insertion when cursor is not at the end
> * fixed some bugs on deletion (more than one consecutive separator)
>
> There's some bugs to fix yet (some of them exposed by Maxime) and hope to
> see look to fix it soon, but though that this revision was important for
> people using it right now so I take the time to update this thread.
>
> Best,
>
> Carlos
>
>
>
>
>
>
> 2014/1/9 Kessler CTR Mark J <ma...@usmc.mil>
>
>> Here is a quick example usage...
>>
>>
>> var pattern:RegExp = RegExPatterns.createRegExp("what I'm matching",
>> RegExPatterns.CONTAINS);
>>
>> myTextInput.text.match(pattern);
>> or
>> myTextInput.text.replace(pattern, replacementObject);
>> or
>> myTextInput.text.search(pattern);
>>
>>
>> -Mark
>>
>> -----Original Message-----
>> From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf
>> Of Carlos Rovira
>> Sent: Thursday, January 09, 2014 7:17 AM
>> To: dev@flex.apache.org
>> Subject: Re: New Flex MaskedTextInput Spark Component
>>
>> Hi Mark, thanks for pointing me to this class, I was not aware of it, and
>> I
>> will add to my arsenal :).
>>
>> Regarding this concrete case, If we end inserting regex functionality in
>> the MaskedTextInput (very likely) we could think if we need some behaviour
>> to complement this class.
>>
>>
>
>
> --
> Carlos Rovira
> Director de Tecnología
> M: +34 607 22 60 05
> F: +34 912 94 80 80
> http://www.codeoscopic.com
> http://www.directwriter.es
> http://www.avant2.es
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Hi,
a new revision of the MaskedTextinputComponent is here:
https://gist.github.com/carlosrovira/7895322
and the demo update here (as usual):
http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
No all bugs has gone yet, but there's important fixes:
* Rebuild internal separatorLocations when maskedText change at runtime
* override text routed to TextOperationEvent.CHANGE to throw textChange and
change events. (The component is tested in validation scenarios and with
other flex events like change and now is working as expected) - This is
very important to be integrated as expected in your application using
events, binding,etc like you do with a normal s:TextInput.
* fixed verification chars allowed (better handling)
* fixed some bugs on insertion when cursor is not at the end
* fixed some bugs on deletion (more than one consecutive separator)
There's some bugs to fix yet (some of them exposed by Maxime) and hope to
see look to fix it soon, but though that this revision was important for
people using it right now so I take the time to update this thread.
Best,
Carlos
2014/1/9 Kessler CTR Mark J <ma...@usmc.mil>
> Here is a quick example usage...
>
>
> var pattern:RegExp = RegExPatterns.createRegExp("what I'm matching",
> RegExPatterns.CONTAINS);
>
> myTextInput.text.match(pattern);
> or
> myTextInput.text.replace(pattern, replacementObject);
> or
> myTextInput.text.search(pattern);
>
>
> -Mark
>
> -----Original Message-----
> From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf
> Of Carlos Rovira
> Sent: Thursday, January 09, 2014 7:17 AM
> To: dev@flex.apache.org
> Subject: Re: New Flex MaskedTextInput Spark Component
>
> Hi Mark, thanks for pointing me to this class, I was not aware of it, and I
> will add to my arsenal :).
>
> Regarding this concrete case, If we end inserting regex functionality in
> the MaskedTextInput (very likely) we could think if we need some behaviour
> to complement this class.
>
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
RE: New Flex MaskedTextInput Spark Component
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
Here is a quick example usage...
var pattern:RegExp = RegExPatterns.createRegExp("what I'm matching", RegExPatterns.CONTAINS);
myTextInput.text.match(pattern);
or
myTextInput.text.replace(pattern, replacementObject);
or
myTextInput.text.search(pattern);
-Mark
-----Original Message-----
From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf Of Carlos Rovira
Sent: Thursday, January 09, 2014 7:17 AM
To: dev@flex.apache.org
Subject: Re: New Flex MaskedTextInput Spark Component
Hi Mark, thanks for pointing me to this class, I was not aware of it, and I
will add to my arsenal :).
Regarding this concrete case, If we end inserting regex functionality in
the MaskedTextInput (very likely) we could think if we need some behaviour
to complement this class.
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Hi Mark, thanks for pointing me to this class, I was not aware of it, and I
will add to my arsenal :).
Regarding this concrete case, If we end inserting regex functionality in
the MaskedTextInput (very likely) we could think if we need some behaviour
to complement this class.
2014/1/8 Kessler CTR Mark J <ma...@usmc.mil>
> Well the only reason I brought it up was the simple RegExPatterns [1] that
> were added a while back. I was just wondering if there other patterns we
> could add it it.
>
>
> [1]
> http://flex.apache.org/asdoc/spark/components/supportClasses/RegExPatterns.html
>
>
> -Mark
>
> -----Original Message-----
> From: Maxime Cowez [mailto:maxime.cowez@gmail.com]
> Sent: Wednesday, January 08, 2014 8:50 AM
> To: dev@flex.apache.org
> Subject: Re: New Flex MaskedTextInput Spark Component
>
> @Mark
> > Is the regex requirement just for numbers or all input?
>
> If you're working with a regex, you can configure any possible restriction
> on the characters.
> For instance: char at first position must be number between 4 and 8; char
> at second position must be D, T or Z; char at third position must be
> uppercase; etc.
>
> M
>
>
> On Wed, Jan 8, 2014 at 1:29 PM, Kessler CTR Mark J <
> mark.kessler.ctr@usmc.mil> wrote:
>
> > >* Regex patterns like proposed by Justin and Maxime (this will allow us
> to
> > restrict a insertion to a Max/Min value).
> >
> > Is the regex requirement just for numbers or all input?
> >
> > -Mark
> >
> > -----Original Message-----
> > From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf
> > Of Carlos Rovira
> > Sent: Tuesday, January 07, 2014 7:38 PM
> > To: dev@flex.apache.org
> > Subject: Re: New Flex MaskedTextInput Spark Component
> >
> > Hi,
> >
> > I rewrite the MaskedTextInput component to support various important
> > concepts:
> >
> > * get/set data vía "text" property (remove "rawText" property). "get"
> text
> > remove separators and "set" text format the string to display in the
> > component. I think this the most important improvement.
> > * Support for more than one separator (now the property is
> "separators"). I
> > added "-+/|()[]{}.", but I think Maxime has a more complete list that I
> > will check before first commit.
> > * Now the component "jumps" separator places (i.e: (+34)915.666.77.88)
> > * Support for custom prompt vía new property "textMaskPrompt" (i.e:
> > dd/mm/yyyy)
> > * removed the need of a MaskedTextInputSkin (now using TextInputSkin and
> > getCurrentSkinState)
> > * remove the uppercase, so now is a CSS style using property
> > typographicCase: uppercase;
> > * flex life cycle is better used (commitProperties) and text is always
> fine
> > thanks to dispatchEvent(new Event("textChanged")); both in insertion,
> > override, etc...
> > * bettter handling of restricted chars using TextOperationEvent.CHANGING
> to
> > cancel the insert operation.
> > * simplified the logic getting a more clean code (the Automata's logic is
> > now few methods compared with old version)
> > * new getter "fullText" to get a convenient method that get the text
> > formatted with separators included
> > * removed test validation in latest version posted (this was only for my
> > testing purposes and not for a final SDK component)
> > * rewrite the docs.
> >
> > I think this version is more like a 1.0 version (I need to make some
> > further testing since I could consider finished but right now I could
> > considere in a decent shape)
> >
> > What is not implemented yet:
> >
> > * Regex patterns like proposed by Justin and Maxime (this will allow us
> to
> > restrict a insertion to a Max/Min value).
> > * A handling of "insertion in a place" (i.e. inserting blank spaces
> between
> > chars, or inserts directly in char at position 5). My approach is more
> like
> > a normal text input that you can add/remove characters taking into
> account
> > all string dragging the rest of string with the operation. Is the way I
> see
> > in similar components in other technologies out there. Maybe this could
> be
> > discussed or make a configuration to support both methods (i.e:
> > dragMode="true/false" or something similar)
> > * As I use TextOperationEvent, I think this component is not mobile
> > friendly. Maybe someone could point me how we could support it as well
> > (StageText,...)
> > * I think copy/paste could be improved supporting "appending" text, as
> well
> > select a piece of intermediate text and make cut, copy and paste... (this
> > maybe could be added soon)
> >
> > Here is the code:
> >
> > AS3: https://gist.github.com/carlosrovira/7895322
> > CSS: https://gist.github.com/carlosrovira/7895435
> >
> > (I also put the namespace to spark.components, and the Apache header)
> >
> > demo:
> >
> > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> >
> > Feedback is highly appreciated for this version to fix any bug before
> > commit to experimental library.
> >
> > Best,
> >
> > Carlos Rovira
> >
> >
> >
> >
> >
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
RE: New Flex MaskedTextInput Spark Component
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
Well the only reason I brought it up was the simple RegExPatterns [1] that were added a while back. I was just wondering if there other patterns we could add it it.
[1] http://flex.apache.org/asdoc/spark/components/supportClasses/RegExPatterns.html
-Mark
-----Original Message-----
From: Maxime Cowez [mailto:maxime.cowez@gmail.com]
Sent: Wednesday, January 08, 2014 8:50 AM
To: dev@flex.apache.org
Subject: Re: New Flex MaskedTextInput Spark Component
@Mark
> Is the regex requirement just for numbers or all input?
If you're working with a regex, you can configure any possible restriction
on the characters.
For instance: char at first position must be number between 4 and 8; char
at second position must be D, T or Z; char at third position must be
uppercase; etc.
M
On Wed, Jan 8, 2014 at 1:29 PM, Kessler CTR Mark J <
mark.kessler.ctr@usmc.mil> wrote:
> >* Regex patterns like proposed by Justin and Maxime (this will allow us to
> restrict a insertion to a Max/Min value).
>
> Is the regex requirement just for numbers or all input?
>
> -Mark
>
> -----Original Message-----
> From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf
> Of Carlos Rovira
> Sent: Tuesday, January 07, 2014 7:38 PM
> To: dev@flex.apache.org
> Subject: Re: New Flex MaskedTextInput Spark Component
>
> Hi,
>
> I rewrite the MaskedTextInput component to support various important
> concepts:
>
> * get/set data vía "text" property (remove "rawText" property). "get" text
> remove separators and "set" text format the string to display in the
> component. I think this the most important improvement.
> * Support for more than one separator (now the property is "separators"). I
> added "-+/|()[]{}.", but I think Maxime has a more complete list that I
> will check before first commit.
> * Now the component "jumps" separator places (i.e: (+34)915.666.77.88)
> * Support for custom prompt vía new property "textMaskPrompt" (i.e:
> dd/mm/yyyy)
> * removed the need of a MaskedTextInputSkin (now using TextInputSkin and
> getCurrentSkinState)
> * remove the uppercase, so now is a CSS style using property
> typographicCase: uppercase;
> * flex life cycle is better used (commitProperties) and text is always fine
> thanks to dispatchEvent(new Event("textChanged")); both in insertion,
> override, etc...
> * bettter handling of restricted chars using TextOperationEvent.CHANGING to
> cancel the insert operation.
> * simplified the logic getting a more clean code (the Automata's logic is
> now few methods compared with old version)
> * new getter "fullText" to get a convenient method that get the text
> formatted with separators included
> * removed test validation in latest version posted (this was only for my
> testing purposes and not for a final SDK component)
> * rewrite the docs.
>
> I think this version is more like a 1.0 version (I need to make some
> further testing since I could consider finished but right now I could
> considere in a decent shape)
>
> What is not implemented yet:
>
> * Regex patterns like proposed by Justin and Maxime (this will allow us to
> restrict a insertion to a Max/Min value).
> * A handling of "insertion in a place" (i.e. inserting blank spaces between
> chars, or inserts directly in char at position 5). My approach is more like
> a normal text input that you can add/remove characters taking into account
> all string dragging the rest of string with the operation. Is the way I see
> in similar components in other technologies out there. Maybe this could be
> discussed or make a configuration to support both methods (i.e:
> dragMode="true/false" or something similar)
> * As I use TextOperationEvent, I think this component is not mobile
> friendly. Maybe someone could point me how we could support it as well
> (StageText,...)
> * I think copy/paste could be improved supporting "appending" text, as well
> select a piece of intermediate text and make cut, copy and paste... (this
> maybe could be added soon)
>
> Here is the code:
>
> AS3: https://gist.github.com/carlosrovira/7895322
> CSS: https://gist.github.com/carlosrovira/7895435
>
> (I also put the namespace to spark.components, and the Apache header)
>
> demo:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Feedback is highly appreciated for this version to fix any bug before
> commit to experimental library.
>
> Best,
>
> Carlos Rovira
>
>
>
>
>
Re: New Flex MaskedTextInput Spark Component
Posted by Maxime Cowez <ma...@gmail.com>.
@Mark
> Is the regex requirement just for numbers or all input?
If you're working with a regex, you can configure any possible restriction
on the characters.
For instance: char at first position must be number between 4 and 8; char
at second position must be D, T or Z; char at third position must be
uppercase; etc.
M
On Wed, Jan 8, 2014 at 1:29 PM, Kessler CTR Mark J <
mark.kessler.ctr@usmc.mil> wrote:
> >* Regex patterns like proposed by Justin and Maxime (this will allow us to
> restrict a insertion to a Max/Min value).
>
> Is the regex requirement just for numbers or all input?
>
> -Mark
>
> -----Original Message-----
> From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf
> Of Carlos Rovira
> Sent: Tuesday, January 07, 2014 7:38 PM
> To: dev@flex.apache.org
> Subject: Re: New Flex MaskedTextInput Spark Component
>
> Hi,
>
> I rewrite the MaskedTextInput component to support various important
> concepts:
>
> * get/set data vía "text" property (remove "rawText" property). "get" text
> remove separators and "set" text format the string to display in the
> component. I think this the most important improvement.
> * Support for more than one separator (now the property is "separators"). I
> added "-+/|()[]{}.", but I think Maxime has a more complete list that I
> will check before first commit.
> * Now the component "jumps" separator places (i.e: (+34)915.666.77.88)
> * Support for custom prompt vía new property "textMaskPrompt" (i.e:
> dd/mm/yyyy)
> * removed the need of a MaskedTextInputSkin (now using TextInputSkin and
> getCurrentSkinState)
> * remove the uppercase, so now is a CSS style using property
> typographicCase: uppercase;
> * flex life cycle is better used (commitProperties) and text is always fine
> thanks to dispatchEvent(new Event("textChanged")); both in insertion,
> override, etc...
> * bettter handling of restricted chars using TextOperationEvent.CHANGING to
> cancel the insert operation.
> * simplified the logic getting a more clean code (the Automata's logic is
> now few methods compared with old version)
> * new getter "fullText" to get a convenient method that get the text
> formatted with separators included
> * removed test validation in latest version posted (this was only for my
> testing purposes and not for a final SDK component)
> * rewrite the docs.
>
> I think this version is more like a 1.0 version (I need to make some
> further testing since I could consider finished but right now I could
> considere in a decent shape)
>
> What is not implemented yet:
>
> * Regex patterns like proposed by Justin and Maxime (this will allow us to
> restrict a insertion to a Max/Min value).
> * A handling of "insertion in a place" (i.e. inserting blank spaces between
> chars, or inserts directly in char at position 5). My approach is more like
> a normal text input that you can add/remove characters taking into account
> all string dragging the rest of string with the operation. Is the way I see
> in similar components in other technologies out there. Maybe this could be
> discussed or make a configuration to support both methods (i.e:
> dragMode="true/false" or something similar)
> * As I use TextOperationEvent, I think this component is not mobile
> friendly. Maybe someone could point me how we could support it as well
> (StageText,...)
> * I think copy/paste could be improved supporting "appending" text, as well
> select a piece of intermediate text and make cut, copy and paste... (this
> maybe could be added soon)
>
> Here is the code:
>
> AS3: https://gist.github.com/carlosrovira/7895322
> CSS: https://gist.github.com/carlosrovira/7895435
>
> (I also put the namespace to spark.components, and the Apache header)
>
> demo:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Feedback is highly appreciated for this version to fix any bug before
> commit to experimental library.
>
> Best,
>
> Carlos Rovira
>
>
>
>
>
RE: New Flex MaskedTextInput Spark Component
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
>* Regex patterns like proposed by Justin and Maxime (this will allow us to
restrict a insertion to a Max/Min value).
Is the regex requirement just for numbers or all input?
-Mark
-----Original Message-----
From: carlos.rovira@gmail.com [mailto:carlos.rovira@gmail.com] On Behalf Of Carlos Rovira
Sent: Tuesday, January 07, 2014 7:38 PM
To: dev@flex.apache.org
Subject: Re: New Flex MaskedTextInput Spark Component
Hi,
I rewrite the MaskedTextInput component to support various important
concepts:
* get/set data vía "text" property (remove "rawText" property). "get" text
remove separators and "set" text format the string to display in the
component. I think this the most important improvement.
* Support for more than one separator (now the property is "separators"). I
added "-+/|()[]{}.", but I think Maxime has a more complete list that I
will check before first commit.
* Now the component "jumps" separator places (i.e: (+34)915.666.77.88)
* Support for custom prompt vía new property "textMaskPrompt" (i.e:
dd/mm/yyyy)
* removed the need of a MaskedTextInputSkin (now using TextInputSkin and
getCurrentSkinState)
* remove the uppercase, so now is a CSS style using property
typographicCase: uppercase;
* flex life cycle is better used (commitProperties) and text is always fine
thanks to dispatchEvent(new Event("textChanged")); both in insertion,
override, etc...
* bettter handling of restricted chars using TextOperationEvent.CHANGING to
cancel the insert operation.
* simplified the logic getting a more clean code (the Automata's logic is
now few methods compared with old version)
* new getter "fullText" to get a convenient method that get the text
formatted with separators included
* removed test validation in latest version posted (this was only for my
testing purposes and not for a final SDK component)
* rewrite the docs.
I think this version is more like a 1.0 version (I need to make some
further testing since I could consider finished but right now I could
considere in a decent shape)
What is not implemented yet:
* Regex patterns like proposed by Justin and Maxime (this will allow us to
restrict a insertion to a Max/Min value).
* A handling of "insertion in a place" (i.e. inserting blank spaces between
chars, or inserts directly in char at position 5). My approach is more like
a normal text input that you can add/remove characters taking into account
all string dragging the rest of string with the operation. Is the way I see
in similar components in other technologies out there. Maybe this could be
discussed or make a configuration to support both methods (i.e:
dragMode="true/false" or something similar)
* As I use TextOperationEvent, I think this component is not mobile
friendly. Maybe someone could point me how we could support it as well
(StageText,...)
* I think copy/paste could be improved supporting "appending" text, as well
select a piece of intermediate text and make cut, copy and paste... (this
maybe could be added soon)
Here is the code:
AS3: https://gist.github.com/carlosrovira/7895322
CSS: https://gist.github.com/carlosrovira/7895435
(I also put the namespace to spark.components, and the Apache header)
demo:
http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
Feedback is highly appreciated for this version to fix any bug before
commit to experimental library.
Best,
Carlos Rovira
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Hi,
I rewrite the MaskedTextInput component to support various important
concepts:
* get/set data vía "text" property (remove "rawText" property). "get" text
remove separators and "set" text format the string to display in the
component. I think this the most important improvement.
* Support for more than one separator (now the property is "separators"). I
added "-+/|()[]{}.", but I think Maxime has a more complete list that I
will check before first commit.
* Now the component "jumps" separator places (i.e: (+34)915.666.77.88)
* Support for custom prompt vía new property "textMaskPrompt" (i.e:
dd/mm/yyyy)
* removed the need of a MaskedTextInputSkin (now using TextInputSkin and
getCurrentSkinState)
* remove the uppercase, so now is a CSS style using property
typographicCase: uppercase;
* flex life cycle is better used (commitProperties) and text is always fine
thanks to dispatchEvent(new Event("textChanged")); both in insertion,
override, etc...
* bettter handling of restricted chars using TextOperationEvent.CHANGING to
cancel the insert operation.
* simplified the logic getting a more clean code (the Automata's logic is
now few methods compared with old version)
* new getter "fullText" to get a convenient method that get the text
formatted with separators included
* removed test validation in latest version posted (this was only for my
testing purposes and not for a final SDK component)
* rewrite the docs.
I think this version is more like a 1.0 version (I need to make some
further testing since I could consider finished but right now I could
considere in a decent shape)
What is not implemented yet:
* Regex patterns like proposed by Justin and Maxime (this will allow us to
restrict a insertion to a Max/Min value).
* A handling of "insertion in a place" (i.e. inserting blank spaces between
chars, or inserts directly in char at position 5). My approach is more like
a normal text input that you can add/remove characters taking into account
all string dragging the rest of string with the operation. Is the way I see
in similar components in other technologies out there. Maybe this could be
discussed or make a configuration to support both methods (i.e:
dragMode="true/false" or something similar)
* As I use TextOperationEvent, I think this component is not mobile
friendly. Maybe someone could point me how we could support it as well
(StageText,...)
* I think copy/paste could be improved supporting "appending" text, as well
select a piece of intermediate text and make cut, copy and paste... (this
maybe could be added soon)
Here is the code:
AS3: https://gist.github.com/carlosrovira/7895322
CSS: https://gist.github.com/carlosrovira/7895435
(I also put the namespace to spark.components, and the Apache header)
demo:
http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
Feedback is highly appreciated for this version to fix any bug before
commit to experimental library.
Best,
Carlos Rovira
2013/12/11 Carlos Rovira <ca...@codeoscopic.com>
> Hi Maxime,
>
> love your example, works pretty well :). I think your approach is very
> near the final solution. As my version both requires to implement two or
> three more features to be valid to 99% of Flex SDK users.
>
> In you sample I only could see a little layout problem with IBAN that make
> the text overflow the bounding box when your are near the end of the text.
>
> I agree with your comments of pros and cons of both approaches, and I'm
> open to whatever we want to do.
>
> Maybe, as we reach at this point, we should consider the component a
> "black box", with a well defined API to use, so we could commit a first
> draft of the component (that could ship in experimental lib in the next
> Apache Flex SDK release) that behaves like it does right now and consider
> two main focus:
>
> 1.- What we need to make it work on mobile (I think the FlowOperation is a
> problem if it does not work on mobile, StageText,...)
>
> 2.- Make the enhancements proposed here in this thread (multiple
> separators, complex prompt,...). For example regex could be left to a next
> version and could be introduced without API changes, only need to support
> it as a valid entry on the field...
>
> Best,
>
> Carlos
>
>
>
>
> 2013/12/10 Maxime Cowez <ma...@gmail.com>
>
>> I managed to compile a little demo application of my Gist.
>> http://riastar.github.io/MaskedTextInputFx/
>>
>> What I noticed:
>> - yours handles copy/paste operations, mine doesn't
>> - mine handles the phone and IBAN samples a little better (because of the
>> multiple separators/delimiters)
>> - yours handles the plate sample better: yours has restrictions per
>> character, mine uses TextInput's own 'restrict' property and so it can
>> only
>> limit the input for all characters
>> - mine allows for a more complex prompt (e.g. dd/mm/yyyy for a date)
>> - neither can configure a maximum value (e.g. 12 for the 'mm' mask in a
>> date)
>>
>> I think we'll have best of both worlds if we - that means you ;) - can
>> make
>> it so that we have complex prompt *and* multiple separators. I guess to
>> achieve that, we need a separate property for the prompt and the
>> restrictions. Technically speaking we could simply override the existing
>> 'prompt' and 'restrict' properties to achieve that (dropping the
>> 'textMask/maskText' property).
>> It might also avoid confusion. e.g. what would happen with
>> <s:MaskedTextInput textMask="dd/mm/yyyy" prompt="aa-bb-cccc"/> ?
>> Perhaps a date mask input would be better like this: <s:MaskedTextInput
>> prompt="dd/mm/yyyy" restrict="##-##-##"/>
>> Or maybe using more standard regex patterns: <s:MaskedTextInput
>> prompt="dd/mm/yyyy" restrict="\d{2}-\d{2}-\d{4}"/>
>> The last approach would even allow you to do restrictions on the values in
>> the date (which I think is what Justin suggested).
>> To make it easier for the developer we could also provide some default
>> regex patterns (for instance a date pattern - preferably localized...)
>>
>> What do you think?
>> Max
>>
>>
>> On Tue, Dec 10, 2013 at 7:27 PM, Carlos Rovira <
>> carlos.rovira@codeoscopic.com> wrote:
>>
>> > Hi Maxime and all,
>> >
>> > I share the component in gist to give it access until I have the time to
>> > commit to Flex SDK. You can see it here:
>> >
>> > AS3 Class: https://gist.github.com/carlosrovira/7895322
>> > Skin: https://gist.github.com/carlosrovira/7895395
>> > CSS: https://gist.github.com/carlosrovira/7895435
>> >
>> > As commented, this is the first draft, and it will hopefully evolved in
>> the
>> > experimental library...
>> >
>> > Hope you like it! :)
>> >
>> > Carlos
>> >
>> >
>> >
>> >
>> > 2013/12/10 Maxime Cowez <ma...@gmail.com>
>> >
>> > > @Carlos
>> > > It only *looks *clean and organized on the surface ;)
>> > > But it doesn't really respect the component lifecycle very well. Just
>> > look
>> > > at the last line (the override of dispatchEvent) and the override of
>> > > setText.
>> > > I'll try to cook you an example as soon as I can.
>> > >
>> > >
>> > > On Tue, Dec 10, 2013 at 6:11 PM, Carlos Rovira <
>> > > carlos.rovira@codeoscopic.com> wrote:
>> > >
>> > > > @Maurice. The behavior you describe is the expected behaviour.
>> Before I
>> > > > code the component, I search the web for available solutions, and I
>> see
>> > > the
>> > > > same behaviour adopted in various implementations, so I take that
>> as a
>> > > > pattern... The way you expect it to behave is already valid too and
>> > > widely
>> > > > used...maybe we could take some property to go one behaviour or
>> > > > another...since I think both are valid
>> > > >
>> > > > @Maxime. Thanks for sharing :), In a first quick revision I see it
>> very
>> > > > clean and organized, I'll digg as I get some time :). can you
>> upload a
>> > > demo
>> > > > to some place where we can preview it?. Regarding the skin, It's
>> very
>> > > close
>> > > > to default spark TextInput skin, but I use the prompt to show the
>> > remaing
>> > > > mask, and I removed the incluedIn from prompt. I think nothing more
>> > there
>> > > > :)
>> > > >
>> > > >
>> > > >
>> > > >
>> > > >
>> > > > 2013/12/10 Maxime Cowez <ma...@gmail.com>
>> > > >
>> > > > > @Carlos
>> > > > >
>> > > > > I put my take at a MaskedTextInput in a Gist:
>> > > > > https://gist.github.com/RIAstar/7893328
>> > > > > I repeat: there's some rather dirty code in there, however there's
>> > also
>> > > > > some logic to handle multiple separators with a regex. Perhaps you
>> > can
>> > > > find
>> > > > > some inspiration there.
>> > > > > Apparently I also felt the need for a boolean property called
>> > > > 'isComplete',
>> > > > > which returns true (and fires a property change event) when all
>> > > required
>> > > > > characters have been typed.
>> > > > >
>> > > > > One question though: why did you need a new skin? Seems to me the
>> > > default
>> > > > > TextInput skin should suffice, don't you think?
>> > > > > Max
>> > > > >
>> > > > >
>> > > > > On Tue, Dec 10, 2013 at 5:14 PM, Dany Dhondt <ar...@mac.com>
>> > > wrote:
>> > > > >
>> > > > > > Great work Carlos! Nice component!
>> > > > > >
>> > > > > > Dany Dhondt
>> > > > > > archemedia@mac.com
>> > > > > >
>> > > > > >
>> > > > > >
>> > > > > > Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <
>> > > carlosrovira@apache.org>
>> > > > > > het volgende geschreven:
>> > > > > >
>> > > > > > > Hi,
>> > > > > > >
>> > > > > > > These days I worked a new spark MaskedTextInput component and
>> I
>> > > want
>> > > > to
>> > > > > > > share a demo of this component so you can play with it.
>> > > > > > > I think there's no such component already in the Flex SDK or
>> out
>> > > > there,
>> > > > > > and
>> > > > > > > as I needed for a project I had to make one from scratch.
>> > > > > > > The component is an extension of spark TextInput.
>> > > > > > >
>> > > > > > > I plan to commit this component to Apache Flex SDK in the next
>> > days
>> > > > > > unless
>> > > > > > > someone let me know another alternative or some info
>> > > > > > > that make this component useless. In order to prepare the
>> commit
>> > I
>> > > > want
>> > > > > > to
>> > > > > > > ask other committers and PMCs here where is the appropriate
>> place
>> > > > > > > to hold this component and share what you consider to take
>> into
>> > > > account
>> > > > > > in
>> > > > > > > order to make a right integration. If someone thinks it's not
>> > worth
>> > > > it
>> > > > > to
>> > > > > > > make it part of the Flex SDK, let me know as well. I don't
>> want
>> > to
>> > > > > commit
>> > > > > > > code that could not be right for the SDK.
>> > > > > > >
>> > > > > > > Here's the link to the demo. I posted as well some doc comment
>> > text
>> > > > to
>> > > > > > > share the properties you can use:
>> > > > > > >
>> > > > > > > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>> > > > > > >
>> > > > > > > Hope you consider it interesting and if you know some other
>> > similar
>> > > > > > > component out there, please let me know! :)
>> > > > > > >
>> > > > > > > Best,
>> > > > > > >
>> > > > > > >
>> > > > > > > --
>> > > > > > > --
>> > > > > > > Carlos Rovira
>> > > > > >
>> > > > > >
>> > > > >
>> > > >
>> > > >
>> > > >
>> > > > --
>> > > > Carlos Rovira
>> > > > Director de Tecnología
>> > > > M: +34 607 22 60 05
>> > > > F: +34 912 94 80 80
>> > > > http://www.codeoscopic.com
>> > > > http://www.directwriter.es
>> > > > http://www.avant2.es
>> > > >
>> > >
>> >
>> >
>> >
>> > --
>> > Carlos Rovira
>> > Director de Tecnología
>> > M: +34 607 22 60 05
>> > F: +34 912 94 80 80
>> > http://www.codeoscopic.com
>> > http://www.directwriter.es
>> > http://www.avant2.es
>> >
>>
>
>
>
> --
> Carlos Rovira
> Director de Tecnología
> M: +34 607 22 60 05
> F: +34 912 94 80 80
> http://www.codeoscopic.com
> http://www.directwriter.es
> http://www.avant2.es
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Hi Maxime,
love your example, works pretty well :). I think your approach is very near
the final solution. As my version both requires to implement two or three
more features to be valid to 99% of Flex SDK users.
In you sample I only could see a little layout problem with IBAN that make
the text overflow the bounding box when your are near the end of the text.
I agree with your comments of pros and cons of both approaches, and I'm
open to whatever we want to do.
Maybe, as we reach at this point, we should consider the component a "black
box", with a well defined API to use, so we could commit a first draft of
the component (that could ship in experimental lib in the next Apache Flex
SDK release) that behaves like it does right now and consider two main
focus:
1.- What we need to make it work on mobile (I think the FlowOperation is a
problem if it does not work on mobile, StageText,...)
2.- Make the enhancements proposed here in this thread (multiple
separators, complex prompt,...). For example regex could be left to a next
version and could be introduced without API changes, only need to support
it as a valid entry on the field...
Best,
Carlos
2013/12/10 Maxime Cowez <ma...@gmail.com>
> I managed to compile a little demo application of my Gist.
> http://riastar.github.io/MaskedTextInputFx/
>
> What I noticed:
> - yours handles copy/paste operations, mine doesn't
> - mine handles the phone and IBAN samples a little better (because of the
> multiple separators/delimiters)
> - yours handles the plate sample better: yours has restrictions per
> character, mine uses TextInput's own 'restrict' property and so it can only
> limit the input for all characters
> - mine allows for a more complex prompt (e.g. dd/mm/yyyy for a date)
> - neither can configure a maximum value (e.g. 12 for the 'mm' mask in a
> date)
>
> I think we'll have best of both worlds if we - that means you ;) - can make
> it so that we have complex prompt *and* multiple separators. I guess to
> achieve that, we need a separate property for the prompt and the
> restrictions. Technically speaking we could simply override the existing
> 'prompt' and 'restrict' properties to achieve that (dropping the
> 'textMask/maskText' property).
> It might also avoid confusion. e.g. what would happen with
> <s:MaskedTextInput textMask="dd/mm/yyyy" prompt="aa-bb-cccc"/> ?
> Perhaps a date mask input would be better like this: <s:MaskedTextInput
> prompt="dd/mm/yyyy" restrict="##-##-##"/>
> Or maybe using more standard regex patterns: <s:MaskedTextInput
> prompt="dd/mm/yyyy" restrict="\d{2}-\d{2}-\d{4}"/>
> The last approach would even allow you to do restrictions on the values in
> the date (which I think is what Justin suggested).
> To make it easier for the developer we could also provide some default
> regex patterns (for instance a date pattern - preferably localized...)
>
> What do you think?
> Max
>
>
> On Tue, Dec 10, 2013 at 7:27 PM, Carlos Rovira <
> carlos.rovira@codeoscopic.com> wrote:
>
> > Hi Maxime and all,
> >
> > I share the component in gist to give it access until I have the time to
> > commit to Flex SDK. You can see it here:
> >
> > AS3 Class: https://gist.github.com/carlosrovira/7895322
> > Skin: https://gist.github.com/carlosrovira/7895395
> > CSS: https://gist.github.com/carlosrovira/7895435
> >
> > As commented, this is the first draft, and it will hopefully evolved in
> the
> > experimental library...
> >
> > Hope you like it! :)
> >
> > Carlos
> >
> >
> >
> >
> > 2013/12/10 Maxime Cowez <ma...@gmail.com>
> >
> > > @Carlos
> > > It only *looks *clean and organized on the surface ;)
> > > But it doesn't really respect the component lifecycle very well. Just
> > look
> > > at the last line (the override of dispatchEvent) and the override of
> > > setText.
> > > I'll try to cook you an example as soon as I can.
> > >
> > >
> > > On Tue, Dec 10, 2013 at 6:11 PM, Carlos Rovira <
> > > carlos.rovira@codeoscopic.com> wrote:
> > >
> > > > @Maurice. The behavior you describe is the expected behaviour.
> Before I
> > > > code the component, I search the web for available solutions, and I
> see
> > > the
> > > > same behaviour adopted in various implementations, so I take that as
> a
> > > > pattern... The way you expect it to behave is already valid too and
> > > widely
> > > > used...maybe we could take some property to go one behaviour or
> > > > another...since I think both are valid
> > > >
> > > > @Maxime. Thanks for sharing :), In a first quick revision I see it
> very
> > > > clean and organized, I'll digg as I get some time :). can you upload
> a
> > > demo
> > > > to some place where we can preview it?. Regarding the skin, It's very
> > > close
> > > > to default spark TextInput skin, but I use the prompt to show the
> > remaing
> > > > mask, and I removed the incluedIn from prompt. I think nothing more
> > there
> > > > :)
> > > >
> > > >
> > > >
> > > >
> > > >
> > > > 2013/12/10 Maxime Cowez <ma...@gmail.com>
> > > >
> > > > > @Carlos
> > > > >
> > > > > I put my take at a MaskedTextInput in a Gist:
> > > > > https://gist.github.com/RIAstar/7893328
> > > > > I repeat: there's some rather dirty code in there, however there's
> > also
> > > > > some logic to handle multiple separators with a regex. Perhaps you
> > can
> > > > find
> > > > > some inspiration there.
> > > > > Apparently I also felt the need for a boolean property called
> > > > 'isComplete',
> > > > > which returns true (and fires a property change event) when all
> > > required
> > > > > characters have been typed.
> > > > >
> > > > > One question though: why did you need a new skin? Seems to me the
> > > default
> > > > > TextInput skin should suffice, don't you think?
> > > > > Max
> > > > >
> > > > >
> > > > > On Tue, Dec 10, 2013 at 5:14 PM, Dany Dhondt <ar...@mac.com>
> > > wrote:
> > > > >
> > > > > > Great work Carlos! Nice component!
> > > > > >
> > > > > > Dany Dhondt
> > > > > > archemedia@mac.com
> > > > > >
> > > > > >
> > > > > >
> > > > > > Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <
> > > carlosrovira@apache.org>
> > > > > > het volgende geschreven:
> > > > > >
> > > > > > > Hi,
> > > > > > >
> > > > > > > These days I worked a new spark MaskedTextInput component and I
> > > want
> > > > to
> > > > > > > share a demo of this component so you can play with it.
> > > > > > > I think there's no such component already in the Flex SDK or
> out
> > > > there,
> > > > > > and
> > > > > > > as I needed for a project I had to make one from scratch.
> > > > > > > The component is an extension of spark TextInput.
> > > > > > >
> > > > > > > I plan to commit this component to Apache Flex SDK in the next
> > days
> > > > > > unless
> > > > > > > someone let me know another alternative or some info
> > > > > > > that make this component useless. In order to prepare the
> commit
> > I
> > > > want
> > > > > > to
> > > > > > > ask other committers and PMCs here where is the appropriate
> place
> > > > > > > to hold this component and share what you consider to take into
> > > > account
> > > > > > in
> > > > > > > order to make a right integration. If someone thinks it's not
> > worth
> > > > it
> > > > > to
> > > > > > > make it part of the Flex SDK, let me know as well. I don't want
> > to
> > > > > commit
> > > > > > > code that could not be right for the SDK.
> > > > > > >
> > > > > > > Here's the link to the demo. I posted as well some doc comment
> > text
> > > > to
> > > > > > > share the properties you can use:
> > > > > > >
> > > > > > > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> > > > > > >
> > > > > > > Hope you consider it interesting and if you know some other
> > similar
> > > > > > > component out there, please let me know! :)
> > > > > > >
> > > > > > > Best,
> > > > > > >
> > > > > > >
> > > > > > > --
> > > > > > > --
> > > > > > > Carlos Rovira
> > > > > >
> > > > > >
> > > > >
> > > >
> > > >
> > > >
> > > > --
> > > > Carlos Rovira
> > > > Director de Tecnología
> > > > M: +34 607 22 60 05
> > > > F: +34 912 94 80 80
> > > > http://www.codeoscopic.com
> > > > http://www.directwriter.es
> > > > http://www.avant2.es
> > > >
> > >
> >
> >
> >
> > --
> > Carlos Rovira
> > Director de Tecnología
> > M: +34 607 22 60 05
> > F: +34 912 94 80 80
> > http://www.codeoscopic.com
> > http://www.directwriter.es
> > http://www.avant2.es
> >
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Maxime Cowez <ma...@gmail.com>.
I managed to compile a little demo application of my Gist.
http://riastar.github.io/MaskedTextInputFx/
What I noticed:
- yours handles copy/paste operations, mine doesn't
- mine handles the phone and IBAN samples a little better (because of the
multiple separators/delimiters)
- yours handles the plate sample better: yours has restrictions per
character, mine uses TextInput's own 'restrict' property and so it can only
limit the input for all characters
- mine allows for a more complex prompt (e.g. dd/mm/yyyy for a date)
- neither can configure a maximum value (e.g. 12 for the 'mm' mask in a
date)
I think we'll have best of both worlds if we - that means you ;) - can make
it so that we have complex prompt *and* multiple separators. I guess to
achieve that, we need a separate property for the prompt and the
restrictions. Technically speaking we could simply override the existing
'prompt' and 'restrict' properties to achieve that (dropping the
'textMask/maskText' property).
It might also avoid confusion. e.g. what would happen with
<s:MaskedTextInput textMask="dd/mm/yyyy" prompt="aa-bb-cccc"/> ?
Perhaps a date mask input would be better like this: <s:MaskedTextInput
prompt="dd/mm/yyyy" restrict="##-##-##"/>
Or maybe using more standard regex patterns: <s:MaskedTextInput
prompt="dd/mm/yyyy" restrict="\d{2}-\d{2}-\d{4}"/>
The last approach would even allow you to do restrictions on the values in
the date (which I think is what Justin suggested).
To make it easier for the developer we could also provide some default
regex patterns (for instance a date pattern - preferably localized...)
What do you think?
Max
On Tue, Dec 10, 2013 at 7:27 PM, Carlos Rovira <
carlos.rovira@codeoscopic.com> wrote:
> Hi Maxime and all,
>
> I share the component in gist to give it access until I have the time to
> commit to Flex SDK. You can see it here:
>
> AS3 Class: https://gist.github.com/carlosrovira/7895322
> Skin: https://gist.github.com/carlosrovira/7895395
> CSS: https://gist.github.com/carlosrovira/7895435
>
> As commented, this is the first draft, and it will hopefully evolved in the
> experimental library...
>
> Hope you like it! :)
>
> Carlos
>
>
>
>
> 2013/12/10 Maxime Cowez <ma...@gmail.com>
>
> > @Carlos
> > It only *looks *clean and organized on the surface ;)
> > But it doesn't really respect the component lifecycle very well. Just
> look
> > at the last line (the override of dispatchEvent) and the override of
> > setText.
> > I'll try to cook you an example as soon as I can.
> >
> >
> > On Tue, Dec 10, 2013 at 6:11 PM, Carlos Rovira <
> > carlos.rovira@codeoscopic.com> wrote:
> >
> > > @Maurice. The behavior you describe is the expected behaviour. Before I
> > > code the component, I search the web for available solutions, and I see
> > the
> > > same behaviour adopted in various implementations, so I take that as a
> > > pattern... The way you expect it to behave is already valid too and
> > widely
> > > used...maybe we could take some property to go one behaviour or
> > > another...since I think both are valid
> > >
> > > @Maxime. Thanks for sharing :), In a first quick revision I see it very
> > > clean and organized, I'll digg as I get some time :). can you upload a
> > demo
> > > to some place where we can preview it?. Regarding the skin, It's very
> > close
> > > to default spark TextInput skin, but I use the prompt to show the
> remaing
> > > mask, and I removed the incluedIn from prompt. I think nothing more
> there
> > > :)
> > >
> > >
> > >
> > >
> > >
> > > 2013/12/10 Maxime Cowez <ma...@gmail.com>
> > >
> > > > @Carlos
> > > >
> > > > I put my take at a MaskedTextInput in a Gist:
> > > > https://gist.github.com/RIAstar/7893328
> > > > I repeat: there's some rather dirty code in there, however there's
> also
> > > > some logic to handle multiple separators with a regex. Perhaps you
> can
> > > find
> > > > some inspiration there.
> > > > Apparently I also felt the need for a boolean property called
> > > 'isComplete',
> > > > which returns true (and fires a property change event) when all
> > required
> > > > characters have been typed.
> > > >
> > > > One question though: why did you need a new skin? Seems to me the
> > default
> > > > TextInput skin should suffice, don't you think?
> > > > Max
> > > >
> > > >
> > > > On Tue, Dec 10, 2013 at 5:14 PM, Dany Dhondt <ar...@mac.com>
> > wrote:
> > > >
> > > > > Great work Carlos! Nice component!
> > > > >
> > > > > Dany Dhondt
> > > > > archemedia@mac.com
> > > > >
> > > > >
> > > > >
> > > > > Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <
> > carlosrovira@apache.org>
> > > > > het volgende geschreven:
> > > > >
> > > > > > Hi,
> > > > > >
> > > > > > These days I worked a new spark MaskedTextInput component and I
> > want
> > > to
> > > > > > share a demo of this component so you can play with it.
> > > > > > I think there's no such component already in the Flex SDK or out
> > > there,
> > > > > and
> > > > > > as I needed for a project I had to make one from scratch.
> > > > > > The component is an extension of spark TextInput.
> > > > > >
> > > > > > I plan to commit this component to Apache Flex SDK in the next
> days
> > > > > unless
> > > > > > someone let me know another alternative or some info
> > > > > > that make this component useless. In order to prepare the commit
> I
> > > want
> > > > > to
> > > > > > ask other committers and PMCs here where is the appropriate place
> > > > > > to hold this component and share what you consider to take into
> > > account
> > > > > in
> > > > > > order to make a right integration. If someone thinks it's not
> worth
> > > it
> > > > to
> > > > > > make it part of the Flex SDK, let me know as well. I don't want
> to
> > > > commit
> > > > > > code that could not be right for the SDK.
> > > > > >
> > > > > > Here's the link to the demo. I posted as well some doc comment
> text
> > > to
> > > > > > share the properties you can use:
> > > > > >
> > > > > > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> > > > > >
> > > > > > Hope you consider it interesting and if you know some other
> similar
> > > > > > component out there, please let me know! :)
> > > > > >
> > > > > > Best,
> > > > > >
> > > > > >
> > > > > > --
> > > > > > --
> > > > > > Carlos Rovira
> > > > >
> > > > >
> > > >
> > >
> > >
> > >
> > > --
> > > Carlos Rovira
> > > Director de Tecnología
> > > M: +34 607 22 60 05
> > > F: +34 912 94 80 80
> > > http://www.codeoscopic.com
> > > http://www.directwriter.es
> > > http://www.avant2.es
> > >
> >
>
>
>
> --
> Carlos Rovira
> Director de Tecnología
> M: +34 607 22 60 05
> F: +34 912 94 80 80
> http://www.codeoscopic.com
> http://www.directwriter.es
> http://www.avant2.es
>
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
Hi Maxime and all,
I share the component in gist to give it access until I have the time to
commit to Flex SDK. You can see it here:
AS3 Class: https://gist.github.com/carlosrovira/7895322
Skin: https://gist.github.com/carlosrovira/7895395
CSS: https://gist.github.com/carlosrovira/7895435
As commented, this is the first draft, and it will hopefully evolved in the
experimental library...
Hope you like it! :)
Carlos
2013/12/10 Maxime Cowez <ma...@gmail.com>
> @Carlos
> It only *looks *clean and organized on the surface ;)
> But it doesn't really respect the component lifecycle very well. Just look
> at the last line (the override of dispatchEvent) and the override of
> setText.
> I'll try to cook you an example as soon as I can.
>
>
> On Tue, Dec 10, 2013 at 6:11 PM, Carlos Rovira <
> carlos.rovira@codeoscopic.com> wrote:
>
> > @Maurice. The behavior you describe is the expected behaviour. Before I
> > code the component, I search the web for available solutions, and I see
> the
> > same behaviour adopted in various implementations, so I take that as a
> > pattern... The way you expect it to behave is already valid too and
> widely
> > used...maybe we could take some property to go one behaviour or
> > another...since I think both are valid
> >
> > @Maxime. Thanks for sharing :), In a first quick revision I see it very
> > clean and organized, I'll digg as I get some time :). can you upload a
> demo
> > to some place where we can preview it?. Regarding the skin, It's very
> close
> > to default spark TextInput skin, but I use the prompt to show the remaing
> > mask, and I removed the incluedIn from prompt. I think nothing more there
> > :)
> >
> >
> >
> >
> >
> > 2013/12/10 Maxime Cowez <ma...@gmail.com>
> >
> > > @Carlos
> > >
> > > I put my take at a MaskedTextInput in a Gist:
> > > https://gist.github.com/RIAstar/7893328
> > > I repeat: there's some rather dirty code in there, however there's also
> > > some logic to handle multiple separators with a regex. Perhaps you can
> > find
> > > some inspiration there.
> > > Apparently I also felt the need for a boolean property called
> > 'isComplete',
> > > which returns true (and fires a property change event) when all
> required
> > > characters have been typed.
> > >
> > > One question though: why did you need a new skin? Seems to me the
> default
> > > TextInput skin should suffice, don't you think?
> > > Max
> > >
> > >
> > > On Tue, Dec 10, 2013 at 5:14 PM, Dany Dhondt <ar...@mac.com>
> wrote:
> > >
> > > > Great work Carlos! Nice component!
> > > >
> > > > Dany Dhondt
> > > > archemedia@mac.com
> > > >
> > > >
> > > >
> > > > Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <
> carlosrovira@apache.org>
> > > > het volgende geschreven:
> > > >
> > > > > Hi,
> > > > >
> > > > > These days I worked a new spark MaskedTextInput component and I
> want
> > to
> > > > > share a demo of this component so you can play with it.
> > > > > I think there's no such component already in the Flex SDK or out
> > there,
> > > > and
> > > > > as I needed for a project I had to make one from scratch.
> > > > > The component is an extension of spark TextInput.
> > > > >
> > > > > I plan to commit this component to Apache Flex SDK in the next days
> > > > unless
> > > > > someone let me know another alternative or some info
> > > > > that make this component useless. In order to prepare the commit I
> > want
> > > > to
> > > > > ask other committers and PMCs here where is the appropriate place
> > > > > to hold this component and share what you consider to take into
> > account
> > > > in
> > > > > order to make a right integration. If someone thinks it's not worth
> > it
> > > to
> > > > > make it part of the Flex SDK, let me know as well. I don't want to
> > > commit
> > > > > code that could not be right for the SDK.
> > > > >
> > > > > Here's the link to the demo. I posted as well some doc comment text
> > to
> > > > > share the properties you can use:
> > > > >
> > > > > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> > > > >
> > > > > Hope you consider it interesting and if you know some other similar
> > > > > component out there, please let me know! :)
> > > > >
> > > > > Best,
> > > > >
> > > > >
> > > > > --
> > > > > --
> > > > > Carlos Rovira
> > > >
> > > >
> > >
> >
> >
> >
> > --
> > Carlos Rovira
> > Director de Tecnología
> > M: +34 607 22 60 05
> > F: +34 912 94 80 80
> > http://www.codeoscopic.com
> > http://www.directwriter.es
> > http://www.avant2.es
> >
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Maxime Cowez <ma...@gmail.com>.
@Carlos
It only *looks *clean and organized on the surface ;)
But it doesn't really respect the component lifecycle very well. Just look
at the last line (the override of dispatchEvent) and the override of
setText.
I'll try to cook you an example as soon as I can.
On Tue, Dec 10, 2013 at 6:11 PM, Carlos Rovira <
carlos.rovira@codeoscopic.com> wrote:
> @Maurice. The behavior you describe is the expected behaviour. Before I
> code the component, I search the web for available solutions, and I see the
> same behaviour adopted in various implementations, so I take that as a
> pattern... The way you expect it to behave is already valid too and widely
> used...maybe we could take some property to go one behaviour or
> another...since I think both are valid
>
> @Maxime. Thanks for sharing :), In a first quick revision I see it very
> clean and organized, I'll digg as I get some time :). can you upload a demo
> to some place where we can preview it?. Regarding the skin, It's very close
> to default spark TextInput skin, but I use the prompt to show the remaing
> mask, and I removed the incluedIn from prompt. I think nothing more there
> :)
>
>
>
>
>
> 2013/12/10 Maxime Cowez <ma...@gmail.com>
>
> > @Carlos
> >
> > I put my take at a MaskedTextInput in a Gist:
> > https://gist.github.com/RIAstar/7893328
> > I repeat: there's some rather dirty code in there, however there's also
> > some logic to handle multiple separators with a regex. Perhaps you can
> find
> > some inspiration there.
> > Apparently I also felt the need for a boolean property called
> 'isComplete',
> > which returns true (and fires a property change event) when all required
> > characters have been typed.
> >
> > One question though: why did you need a new skin? Seems to me the default
> > TextInput skin should suffice, don't you think?
> > Max
> >
> >
> > On Tue, Dec 10, 2013 at 5:14 PM, Dany Dhondt <ar...@mac.com> wrote:
> >
> > > Great work Carlos! Nice component!
> > >
> > > Dany Dhondt
> > > archemedia@mac.com
> > >
> > >
> > >
> > > Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <ca...@apache.org>
> > > het volgende geschreven:
> > >
> > > > Hi,
> > > >
> > > > These days I worked a new spark MaskedTextInput component and I want
> to
> > > > share a demo of this component so you can play with it.
> > > > I think there's no such component already in the Flex SDK or out
> there,
> > > and
> > > > as I needed for a project I had to make one from scratch.
> > > > The component is an extension of spark TextInput.
> > > >
> > > > I plan to commit this component to Apache Flex SDK in the next days
> > > unless
> > > > someone let me know another alternative or some info
> > > > that make this component useless. In order to prepare the commit I
> want
> > > to
> > > > ask other committers and PMCs here where is the appropriate place
> > > > to hold this component and share what you consider to take into
> account
> > > in
> > > > order to make a right integration. If someone thinks it's not worth
> it
> > to
> > > > make it part of the Flex SDK, let me know as well. I don't want to
> > commit
> > > > code that could not be right for the SDK.
> > > >
> > > > Here's the link to the demo. I posted as well some doc comment text
> to
> > > > share the properties you can use:
> > > >
> > > > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> > > >
> > > > Hope you consider it interesting and if you know some other similar
> > > > component out there, please let me know! :)
> > > >
> > > > Best,
> > > >
> > > >
> > > > --
> > > > --
> > > > Carlos Rovira
> > >
> > >
> >
>
>
>
> --
> Carlos Rovira
> Director de Tecnología
> M: +34 607 22 60 05
> F: +34 912 94 80 80
> http://www.codeoscopic.com
> http://www.directwriter.es
> http://www.avant2.es
>
Re: New Flex MaskedTextInput Spark Component
Posted by Carlos Rovira <ca...@codeoscopic.com>.
@Maurice. The behavior you describe is the expected behaviour. Before I
code the component, I search the web for available solutions, and I see the
same behaviour adopted in various implementations, so I take that as a
pattern... The way you expect it to behave is already valid too and widely
used...maybe we could take some property to go one behaviour or
another...since I think both are valid
@Maxime. Thanks for sharing :), In a first quick revision I see it very
clean and organized, I'll digg as I get some time :). can you upload a demo
to some place where we can preview it?. Regarding the skin, It's very close
to default spark TextInput skin, but I use the prompt to show the remaing
mask, and I removed the incluedIn from prompt. I think nothing more there :)
2013/12/10 Maxime Cowez <ma...@gmail.com>
> @Carlos
>
> I put my take at a MaskedTextInput in a Gist:
> https://gist.github.com/RIAstar/7893328
> I repeat: there's some rather dirty code in there, however there's also
> some logic to handle multiple separators with a regex. Perhaps you can find
> some inspiration there.
> Apparently I also felt the need for a boolean property called 'isComplete',
> which returns true (and fires a property change event) when all required
> characters have been typed.
>
> One question though: why did you need a new skin? Seems to me the default
> TextInput skin should suffice, don't you think?
> Max
>
>
> On Tue, Dec 10, 2013 at 5:14 PM, Dany Dhondt <ar...@mac.com> wrote:
>
> > Great work Carlos! Nice component!
> >
> > Dany Dhondt
> > archemedia@mac.com
> >
> >
> >
> > Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <ca...@apache.org>
> > het volgende geschreven:
> >
> > > Hi,
> > >
> > > These days I worked a new spark MaskedTextInput component and I want to
> > > share a demo of this component so you can play with it.
> > > I think there's no such component already in the Flex SDK or out there,
> > and
> > > as I needed for a project I had to make one from scratch.
> > > The component is an extension of spark TextInput.
> > >
> > > I plan to commit this component to Apache Flex SDK in the next days
> > unless
> > > someone let me know another alternative or some info
> > > that make this component useless. In order to prepare the commit I want
> > to
> > > ask other committers and PMCs here where is the appropriate place
> > > to hold this component and share what you consider to take into account
> > in
> > > order to make a right integration. If someone thinks it's not worth it
> to
> > > make it part of the Flex SDK, let me know as well. I don't want to
> commit
> > > code that could not be right for the SDK.
> > >
> > > Here's the link to the demo. I posted as well some doc comment text to
> > > share the properties you can use:
> > >
> > > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> > >
> > > Hope you consider it interesting and if you know some other similar
> > > component out there, please let me know! :)
> > >
> > > Best,
> > >
> > >
> > > --
> > > --
> > > Carlos Rovira
> >
> >
>
--
Carlos Rovira
Director de Tecnología
M: +34 607 22 60 05
F: +34 912 94 80 80
http://www.codeoscopic.com
http://www.directwriter.es
http://www.avant2.es
Re: New Flex MaskedTextInput Spark Component
Posted by Maxime Cowez <ma...@gmail.com>.
@Carlos
I put my take at a MaskedTextInput in a Gist:
https://gist.github.com/RIAstar/7893328
I repeat: there's some rather dirty code in there, however there's also
some logic to handle multiple separators with a regex. Perhaps you can find
some inspiration there.
Apparently I also felt the need for a boolean property called 'isComplete',
which returns true (and fires a property change event) when all required
characters have been typed.
One question though: why did you need a new skin? Seems to me the default
TextInput skin should suffice, don't you think?
Max
On Tue, Dec 10, 2013 at 5:14 PM, Dany Dhondt <ar...@mac.com> wrote:
> Great work Carlos! Nice component!
>
> Dany Dhondt
> archemedia@mac.com
>
>
>
> Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <ca...@apache.org>
> het volgende geschreven:
>
> > Hi,
> >
> > These days I worked a new spark MaskedTextInput component and I want to
> > share a demo of this component so you can play with it.
> > I think there's no such component already in the Flex SDK or out there,
> and
> > as I needed for a project I had to make one from scratch.
> > The component is an extension of spark TextInput.
> >
> > I plan to commit this component to Apache Flex SDK in the next days
> unless
> > someone let me know another alternative or some info
> > that make this component useless. In order to prepare the commit I want
> to
> > ask other committers and PMCs here where is the appropriate place
> > to hold this component and share what you consider to take into account
> in
> > order to make a right integration. If someone thinks it's not worth it to
> > make it part of the Flex SDK, let me know as well. I don't want to commit
> > code that could not be right for the SDK.
> >
> > Here's the link to the demo. I posted as well some doc comment text to
> > share the properties you can use:
> >
> > http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
> >
> > Hope you consider it interesting and if you know some other similar
> > component out there, please let me know! :)
> >
> > Best,
> >
> >
> > --
> > --
> > Carlos Rovira
>
>
Re: New Flex MaskedTextInput Spark Component
Posted by Dany Dhondt <ar...@mac.com>.
Great work Carlos! Nice component!
Dany Dhondt
archemedia@mac.com
Op 9-dec.-2013, om 19:28 heeft Carlos Rovira <ca...@apache.org> het volgende geschreven:
> Hi,
>
> These days I worked a new spark MaskedTextInput component and I want to
> share a demo of this component so you can play with it.
> I think there's no such component already in the Flex SDK or out there, and
> as I needed for a project I had to make one from scratch.
> The component is an extension of spark TextInput.
>
> I plan to commit this component to Apache Flex SDK in the next days unless
> someone let me know another alternative or some info
> that make this component useless. In order to prepare the commit I want to
> ask other committers and PMCs here where is the appropriate place
> to hold this component and share what you consider to take into account in
> order to make a right integration. If someone thinks it's not worth it to
> make it part of the Flex SDK, let me know as well. I don't want to commit
> code that could not be right for the SDK.
>
> Here's the link to the demo. I posted as well some doc comment text to
> share the properties you can use:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Hope you consider it interesting and if you know some other similar
> component out there, please let me know! :)
>
> Best,
>
>
> --
> --
> Carlos Rovira
Re: New Flex MaskedTextInput Spark Component
Posted by Erik de Bruin <er...@ixsoftware.nl>.
This is supremely useful, thank you!
EdB
On Mon, Dec 9, 2013 at 7:28 PM, Carlos Rovira <ca...@apache.org> wrote:
> Hi,
>
> These days I worked a new spark MaskedTextInput component and I want to
> share a demo of this component so you can play with it.
> I think there's no such component already in the Flex SDK or out there, and
> as I needed for a project I had to make one from scratch.
> The component is an extension of spark TextInput.
>
> I plan to commit this component to Apache Flex SDK in the next days unless
> someone let me know another alternative or some info
> that make this component useless. In order to prepare the commit I want to
> ask other committers and PMCs here where is the appropriate place
> to hold this component and share what you consider to take into account in
> order to make a right integration. If someone thinks it's not worth it to
> make it part of the Flex SDK, let me know as well. I don't want to commit
> code that could not be right for the SDK.
>
> Here's the link to the demo. I posted as well some doc comment text to
> share the properties you can use:
>
> http://www.carlosrovira.com/blog/spark-maskedtextinput-demo/
>
> Hope you consider it interesting and if you know some other similar
> component out there, please let me know! :)
>
> Best,
>
>
> --
> --
> Carlos Rovira
--
Ix Multimedia Software
Jan Luykenstraat 27
3521 VB Utrecht
T. 06-51952295
I. www.ixsoftware.nl