Vaadin - TextArea/RichTextArea with real-time text analyzing - vaadin

I am working on a Vaadin (7) server-side application, and i need to use a TextArea or a RichTextArea that will analyze word-by-word the typed input, and will highlight words of a certain type, for example - dates and times.
My problem is that a RichTextArea does not have a TextChangeListener, and a regular TextArea does not have a highlighting option because it does not support HTML tags...
I tries using ShortcutKeyListener for RichTextArea and analyze the text after every Space key, but it was too slow and had also some other problems.
Is there anything else i can do?
Is there an option to analyze the text on real time when using RichTextArea? or is there any add-on youre familiar with that can do that?
Or is there a way to highlight text in TextArea after analyzing it?
Thank you!

My suggestion is a bit strange, but anyway, take a look on Vaadin AceEditor. It supports text mode and SelectionChangeListener:
ed.addSelectionChangeListener(new SelectionChangeListener() {
#Override
public void selectionChanged(SelectionChangeEvent e) {
int cursor = e.getSelection().getCursorPosition();
Notification.show("Cursor at: " + cursor);
}
});
See details here: Vaadin AceEditor

Related

Issue adding an Emoji to TextInput for React-Native on iOS

I've been having an issue with maxLength on <TextInput/>in ReactNative and I'm pretty sure its only happening on iOS.
The problem:
If the last character of an input is an emoji, and that emoji puts you over the maxlength number then it deletes the entire input! An example of it is if the maxLength is set to 5 and the input is "xxxx" (4 characters) and then you add an emoji the entire input text gets deleted. I'm sure this has something to do with emojis mostly being 2 characters but I can't seem to find an "eloquent" work around!
Snack to see exactly what I'm talking about:
(I've only been able to replicate it in iOS)
https://snack.expo.io/#sararan/textinput
Things I've tried:
Adding an onKeyPress event (that gets hit before the onChangeText event) that calls e.stopPropagation() and e.preventDefault() (both for good measure ;) ). But it doesn't actually stop the event and I'm thinking it has to do with how react handles events and maybe that it's already bubbled up by this time?
Taking out maxLength altogether and creating my own rules that splices the input if its over the length I want and then replaces any special characters something like...
const onChangeText = (value) => {
if (value.length > 5) {
value = value.slice(0, 30).replace(/[^\w\s]/gi, '');
}
setText({ value });
};
but this solution seems to cause the flickering that we all hate with these types of solutions.
I'm wondering if anyone might have run into this before and might have a more eloquent solution? Thank you for your help!

Infragistics UltraTree print/preview with nodes that have formatted/markup text

I'm trying to print/preview an Infragistics UltraTree (winform) (version 14.2) which has formatted/markup text
The nodes of the tree use Infragistics.Win.FormattedLinkLabel.UltraFormattedTextEditor
with TreatValueAs = FormattedLinkLabel.TreatValueAs.FormattedText
On the screen the tree looks nice. However when I use Infragistics.Win.Printing.UltraPrintPreviewDialog, the resulting tree displays each node with all of its markups.
<span style='color:Navy; font-size:11pt; font-weight:bold; '> The Node's Text </span>
Is there a way to have the preview display the same way it looks on the screen? That is instead of the above, display "The Node's Text", where this text is printed in 11pt and the text color is navy.
The guys at Infragistics said it is a bug in their control here. However, they provided and work around. Add this event handler in form's constructor:
this.ultraTreePrintDocument1.Tree = this.ultraTree1;
this.ultraTreePrintDocument1.InitializeTree += UltraTreePrintDocument1_InitializeTree;
And then in InitializeTree add this code:
private void UltraTreePrintDocument1_InitializeTree(object sender, InitializeTreeEventArgs e)
{
e.Control.Override.EditorComponent = new UltraFormattedTextEditor();
}
As #wnvko indicated, Infragistics acknowledges the bug which will be corrected in their next service release. This is the statement I received from Infragistics:
Issue "237272: EditorComponent is not taken into account when printing
the tree" has been fixed and verified by our Engineering Team in the
following versions . We are in the final stages of creating the
service release and expect to publish it according to following
schedule:
http://www.infragistics.com/support/service-releases/

Intercept dialog from <webview> and read the contents

I use this code to intercept a dialog from a webview but I can not see the content or interact with it:
Element webview= querySelector("#webview");
Map<String,String> map=new Map();
map["src"]=urlWebView+user;
webview.attributes.addAll(map);
querySelector("#webview_cont").style.visibility="visible";
window.addEventListener("dialog",(Event e){ //Use window or webview returns the same result
e.preventDefault();
... //What should I do here ??
} );
Any solution?
Thanks
Edit
Debug:
Open issue: https://code.google.com/p/dart/issues/detail?id=23556
The problem definitely lies with your usage of Dart's Event class.
It simply does not support the extra properties that Chrome is adding to the event: e.dialog, e.messageText, e.messageType.
It does not seem like there is a ready solution for that, at least not in chrome.dart.
Sadly, I don't know Dart well enough to give you a solution. You need to somehow extend that event class, possibly dropping to JS level.
This library, even if abandoned, should give you ideas on how to do that (by catching the JS-level event and stuffing the extra properties in CustomEvent's detail property), though implementing DialogController (which is not JSON-serializable) would be a bit trickier, I guess.

Insert dynamic text into Sitecore Rich Text field

I've been spending a bit of time with Sitecore recently, and I noticed the site I am working on has a copyright date in a Rich Text field. Unfortunately, it is 2012. Now, the easy way to fix this problem is to simply go in and change the Rich Text field which has the copyright information, but I don't want to have to worry about changing it in 2014.
Is there a way to insert dynamic text into the Text control? Even if I could have a sigil which I could manually replace in C# that would be preferable to either switching the Text for a Literal or force manual updates every year.
You can add your own processor to the renderField pipeline, check whether current field is RichText field and replace a token (e.g. __YEAR__) with current year:
<renderField>
<!--... other processors -->
<processor type="My.Assembly.Namespace.ReplaceTokenProcessor, My.Assembly" />
<!--... other processors -->
</renderField>
and the code of the processor:
namespace My.Assembly.Namespace
{
public class ReplaceTokenProcessor
{
public virtual void Process(RenderFieldArgs args)
{
if (args.FieldTypeKey != "rich text")
return;
args.Result.FirstPart = (args.Result.FirstPart == null) ? null : args.Result.FirstPart.Replace("__YEAR__", DateTime.Now.Year.ToString());
args.Result.LastPart = (args.Result.LastPart == null) ? null : args.Result.LastPart.Replace("__YEAR__", DateTime.Now.Year.ToString());
}
}
}
The solution Maras proposed works, but to me it sounds like a bit overkill for just one date in a RTE field.
Besides that, every RTE field that is rendered on every single page in your website is processed.
If it is only for one Year-value I would use a Literal and fill and replace the Text property of the Literal in Codebehind:
Literal.Text = FieldRenderer.Render(Context.Item, "RTE_FieldName")
.Replace("__YEAR__", DateTime.Now.Year.ToString());
Then add caching to the sublayout and it is only rendered once after the cache has been cleared.

Text URL in AIR iOS app not selectable

I'm using AIR 2.0 (soon will be updating to 3.3 with Flash CS6) to create an iPad app. We have textfields (Classic, dynamic) which sometimes contain one or multiple htmlText links which need to be clickable. In the desktop version of the program, all text is selectable and the links are easily accessed. My problem is that it takes me mashing the link like 20 times on the iPad before it will recognize that there's a link and navigate to it in Safari. The other strange thing is that none of the text appears to be selectable - I can't get the iPad cursor, copy/paste menu, etc. to show up.
I think, from reading other threads, that the hit area for the URL is only the stroke on the text itself... if that's true, what can I do to increase the hit area? Or make text selectable? It was suggested elsewhere to put movieclips behind the URLs but that's not really possible as this is all dynamic text from XML files.
I've read about StageText but I gather this is only used for input fields, which is not the case here.
I'm reasonably advanced in AS3 but I'd prefer an easy solution over re-writing large chunks of code. At the moment the only thing I can think to do is get the URL and make it so that as soon as you touch anywhere on the textfield, it navigates to the link. But this would break down if there were more than 1 URL in a given textfield.
Any ideas?
I had this exact same issue, and it's had me flummoxed for a while.
Here's what I did to get the desired behaviour:
1) Instead of using a listener for TextEvent.LINK, listen for MouseEvent.CLICK (or TouchEvent.TAP) on the TextField.
eg.
var tf:TextField = new TextField();
tf.addEventListener(MouseEvent.CLICK, linkClicked);
2) In the linkClicked() handler, you use getCharIndexAtPoint() to determine the index of the character that was clicked, and then from that determine the URL from the TextFormat of the character. This is adapted from a post by Colin Holgate on the Adobe Forums (http://forums.adobe.com/thread/231754)
public function linkClicked(e:MouseEvent):void {
var idx:int = e.target.getCharIndexAtPoint(e.localX, e.localY);
trace("Tapped:",idx);
var tf:TextFormat = e.target.getTextFormat(idx);
if(tf.url != "" && tf.url != null) {
var linkURL:String = tf.url;
trace(linkURL);
// Hyperlink processing code here
dispatchEvent(new UIEvent(UIEvent.LINK_TAPPED,tf.url));
}
}
3) The last line (dispatchEvent()) is sending a custom event to another function to process the link, but you could easily inline your code here.
I've tested on an iPad 3 running iOS6.1, building with AIR3.5. Links are much more responsive, and I don't find myself mashing the screen trying to hit the stroke of the text!

Resources