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 <maxime.co...@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....@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.rov...@gmail.com [mailto:carlos.rov...@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
