You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2020/08/15 09:09:04 UTC
[royale-asjs] branch develop updated: jewel-textinput-beads: fix
all beads that manipulate input text (UpperCase,
LowerCase and Restrict). setting cursor in the middle of text was generating
incorrect behaviour
This is an automated email from the ASF dual-hosted git repository.
carlosrovira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git
The following commit(s) were added to refs/heads/develop by this push:
new a1d40d6 jewel-textinput-beads: fix all beads that manipulate input text (UpperCase, LowerCase and Restrict). setting cursor in the middle of text was generating incorrect behaviour
a1d40d6 is described below
commit a1d40d627c3503f15246262755bd94d8e636b45a
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sat Aug 15 11:08:50 2020 +0200
jewel-textinput-beads: fix all beads that manipulate input text (UpperCase, LowerCase and Restrict). setting cursor in the middle of text was generating incorrect behaviour
---
.../jewel/beads/controls/textinput/LowerCase.as | 24 +++++---
.../jewel/beads/controls/textinput/Restrict.as | 64 +++++++++++-----------
.../jewel/beads/controls/textinput/UpperCase.as | 25 ++++-----
3 files changed, 60 insertions(+), 53 deletions(-)
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/LowerCase.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/LowerCase.as
index 48c66eb..09f9ee7 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/LowerCase.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/LowerCase.as
@@ -21,7 +21,6 @@ package org.apache.royale.jewel.beads.controls.textinput
import org.apache.royale.core.IBead;
import org.apache.royale.core.IStrand;
import org.apache.royale.events.Event;
- import org.apache.royale.events.IEventDispatcher;
import org.apache.royale.jewel.supportClasses.textinput.TextInputBase;
/**
@@ -49,8 +48,6 @@ package org.apache.royale.jewel.beads.controls.textinput
{
}
- protected var t:TextInputBase;
-
/**
* @copy org.apache.royale.core.IBead#strand
*
@@ -61,17 +58,26 @@ package org.apache.royale.jewel.beads.controls.textinput
*/
public function set strand(value:IStrand):void
{
- t = value as TextInputBase;
- IEventDispatcher(t).addEventListener(Event.CHANGE, changeToLowerCase);
- t.text = t.text.toLowerCase();
+ var host:TextInputBase = value as TextInputBase;
+ host.addEventListener(Event.CHANGE, changeToLowerCase);
+ host.text = host.text.toLowerCase();
}
/**
+ * Change text to lower case as user types
+ *
* @private
*/
- private function changeToLowerCase(event:Event):void
+ protected function changeToLowerCase(event:Event):void
{
- t.text = t.text.toLowerCase();
+ COMPILE::JS
+ {
+ var input:HTMLInputElement = event.target.input as HTMLInputElement;
+ var start:Number = input.selectionStart;
+ var end:Number = input.selectionEnd;
+ input.value = input.value.toLowerCase();
+ input.setSelectionRange(start, end);
+ }
}
}
-}
+}
\ No newline at end of file
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/Restrict.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/Restrict.as
index 247a838..1540b0d 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/Restrict.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/Restrict.as
@@ -18,19 +18,9 @@
////////////////////////////////////////////////////////////////////////////////
package org.apache.royale.jewel.beads.controls.textinput
{
- COMPILE::JS
- {
- import goog.events.BrowserEvent;
- }
- COMPILE::SWF
- {
- import flash.events.TextEvent;
-
- import org.apache.royale.core.CSSTextField;
- import org.apache.royale.html.beads.ITextFieldView;
- }
import org.apache.royale.core.IBead;
import org.apache.royale.core.IStrand;
+ import org.apache.royale.events.Event;
import org.apache.royale.jewel.supportClasses.textinput.TextInputBase;
/**
@@ -63,7 +53,6 @@ package org.apache.royale.jewel.beads.controls.textinput
}
private var _pattern:String;
-
/**
* The string to use as numeric pattern.
*
@@ -79,21 +68,10 @@ package org.apache.royale.jewel.beads.controls.textinput
public function set pattern(value:String):void
{
_pattern = value;
- // updateRestriction();
+ updateTextToRestriction();
}
private var host:TextInputBase;
-
- // private function updateRestriction():void
- // {
- // COMPILE::JS
- // {
- // if (host)
- // {
- // host.input.setAttribute('pattern', pattern);
- // }
- // }
- // }
/**
* @copy org.apache.royale.core.IBead#strand
@@ -107,22 +85,46 @@ package org.apache.royale.jewel.beads.controls.textinput
public function set strand(value:IStrand):void
{
host = value as TextInputBase;
+ host.addEventListener(Event.CHANGE, restrictTetToPattern);
+ updateTextToRestriction();
+ }
+
+ /**
+ * Restrict the text to the reg exp pattern as user types
+ * @private
+ */
+ protected function restrictTetToPattern(event:Event):void
+ {
COMPILE::JS
{
- host.input.addEventListener('input', keyEventHandler);
+ var start:Number = host.input.selectionStart;
+ var end:Number = host.input.selectionEnd;
+ var textChanged:Boolean = updateTextToRestriction();
+ if(textChanged)
+ host.input.setSelectionRange(start, end);
+ else
+ host.input.setSelectionRange(start - 1, end - 1);
}
- // updateRestriction();
}
/**
- * @private
+ * update the text in the input to the restriction pattern
+ *
+ * @return true if text changed, false otherwise
*/
- COMPILE::JS
- protected function keyEventHandler(event:KeyboardEvent):void
+ protected function updateTextToRestriction():Boolean
{
- //event.stopImmediatePropagation();
- var re:RegExp = new RegExp(pattern, 'g');
+ var textChanged:Boolean = false;
+ if(!host)
+ return textChanged;
+ const re:RegExp = new RegExp(pattern, 'g');
+ COMPILE::JS
+ {
+ const oldText:String = host.input.value;
host.input.value = host.input.value.replace(re, '');
+ textChanged = oldText == host.input.value;
+ }
+ return textChanged;
}
}
}
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/UpperCase.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/UpperCase.as
index 7330d39..00f6a7d 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/UpperCase.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/textinput/UpperCase.as
@@ -21,7 +21,6 @@ package org.apache.royale.jewel.beads.controls.textinput
import org.apache.royale.core.IBead;
import org.apache.royale.core.IStrand;
import org.apache.royale.events.Event;
- import org.apache.royale.events.KeyboardEvent;
import org.apache.royale.jewel.supportClasses.textinput.TextInputBase;
/**
@@ -49,8 +48,6 @@ package org.apache.royale.jewel.beads.controls.textinput
{
}
- protected var t:TextInputBase;
-
/**
* @copy org.apache.royale.core.IBead#strand
*
@@ -61,24 +58,26 @@ package org.apache.royale.jewel.beads.controls.textinput
*/
public function set strand(value:IStrand):void
{
- t = value as TextInputBase;
- t.addEventListener(Event.CHANGE, changeToUpperCase);
- t.text = t.text.toUpperCase();
+ var host:TextInputBase = value as TextInputBase;
+ host.addEventListener(Event.CHANGE, changeToUpperCase);
+ host.text = host.text.toUpperCase();
}
/**
+ * Change text to upper case as user types
+ *
* @private
*/
- private function changeToUpperCase(event:KeyboardEvent):void
+ protected function changeToUpperCase(event:Event):void
{
COMPILE::JS
{
- var start:Number = t.input.selectionStart;
- var end:Number = t.input.selectionEnd;
- t.input.value = t.input.value.toUpperCase();
- t.input.setSelectionRange(start, end);;
+ var input:HTMLInputElement = event.target.input as HTMLInputElement;
+ var start:Number = input.selectionStart;
+ var end:Number = input.selectionEnd;
+ input.value = input.value.toUpperCase();
+ input.setSelectionRange(start, end);
}
}
}
-}
-
\ No newline at end of file
+}
\ No newline at end of file