Arabic phrases in Flex 4.6 are flipped - actionscript-3

I have a flex application (version 4.6) that needs to support arabic localization.
The application already handles UTF-8 characters correctly as it is already available in French.
But for some reasons the arabic texts are not correctly displayed and are flipped, i.e. labels are displaying "ghi def abc" instead of "abc def ghi".
The button's text is fetched from an object filled by a Java server that reads a file encoded in UTF-8. In eclipse I checked the content of that object and the words are correctly displayed ("Expressions" view from eclipse).
<mx:Button id="button1"
label="{Messages.currentLanguage['button1']}"
click="button1_clicked ()"/>
in the button1_clicked () function I have added a little piece of coding to check if it could come from the Messages object:
private function importFile_clicked ():void
{
var temp:String = "قائمة مستخدمي المشروع";
//var temp:String = "toto and titi"; // toto and titi is correctly displayed
importFile.label = temp;
}
But it did not work... The button still displays:
المشروع مستخدمي قائمة
instead of:
قائمة مستخدمي المشروع
Note that I also tried to change layoutDirection and direction to "rtl" (both in the mx:button declaration and in the button1_clicked function) but it did not change anything...
I also tried to add special chars at the beginning and end of the string, but with no success: '\u202A', '\u202B', '\u202C', '\u202D', '\u202E', '\u202F'.
I'm really confused...

Text direction is implemented only on the Spark component set according to the Flex documentation about text direction:
Support for setting the direction on text controls is built into text controls in the Spark component set because those text controls are based on FTE (Flash Text Engine). Text-based controls that are based on the TextField control do not support mirroring or bidirectional text.
In order to make MX controls accept text direction, you should use Flash Text Engine for them too by adjusting the compiler(ref):
To ensure that MX controls use FTE in Flash Builder, select the "Use Flash Text Engine in MX Components" option. On the command line, you can apply the MXFTEText.css theme file:
mxmlc -theme+=themes/MXFTEText.css MyApp.mxml
Selecting this option causes most internal dependencies on UITextField to be replaced with UIFTETextField, which supports FTE. The MX TextInput, TextArea, and RichText text classes do not include this support. You should replace these controls with the equivalent Spark text-based controls.

Related

PrimeFaces 7.0 <p:textEditor HTML-sanitizer discards text formatting, such as centering

In PrimeFaces 8, it seems to be possible to enable / disable HMTML -sanitizer when using the <p:textEditor component by just specifying secure='false' for disabling it and secure='true' for enabling it. I tried to disable it in PrimeFaces 7.0 like this:
<p:textEditor id="quillToolbarId" secure='false' widgetVar="editor2" height="300" value="#{editTemplatesBean.kaufAnbotTemplate}" placeholder="Enter your content">
but the sanitizer still seems to be working.
My problem is that whenever I format a text in the primeFaces p:textEditor to be center-aligned, the HTML sanitizer just removes my formatting, so the text ends up without formatting.
One way to work this around is to use directly Quill and not Sanitize the input.This works, but then I face other problems, such as this one:
https://github.com/quilljs/quill/issues/1379
which also need to be worked-around.
Please help!
There is no secure property in TextEditor for PrimeFaces 7. If you look at the code of TextEditorRenderer.decode you will see that the sanitzier is called
if (PrimeApplicationContext.getCurrentInstance(context).getEnvironment().isHtmlSanitizerAvailable()) {
value = HtmlSanitizer.sanitizeHtml(value,
editor.isAllowBlocks(), editor.isAllowFormatting(),
editor.isAllowLinks(), editor.isAllowStyles(), editor.isAllowImages());
}
And if you look into PrimeEnvironment you'll see that the property will be set if the class org.owasp.html.PolicyFactory is available on classpath:
htmlSanitizerAvailable = LangUtils.tryToLoadClassForName("org.owasp.html.PolicyFactory") != null
So you either:
update to PF 8
make sure that you don't have this class on the classpath
override the renderer and change/remove the code for the check

How can I put an image on a Matlab uicontrol button?

I have Matlab 2019b, GUI Layout Toolbox 2.3.4 and t all runs on MacOs 14 Mojave.
I want to create button in in a UI that have icons/images instead of text. I have seen here:
https://undocumentedmatlab.com/blog/html-support-in-matlab-uicomponents/
that it is supposed to be possible to use HTML to render the button contents.
So - I try this sample code:
figure('MenuBar','none','Name','GUI-TEST','NumberTitle','off','Position',[200,200,140,90]);
push_btn = uicontrol('Style','PushButton','String','Push','Position',[30,60,80,20],...
'CallBack','disp(''You are pressed a push button'')');
close_btn = uicontrol('Style','PushButton','String','Close','Position',[30,5,80,50],...
'CallBack','close');
icon_file = fullfile(pwd, 'close.png')
str = ['<html><img src="file://' icon_file '"></html>']
set(close_btn,'String',str);
but it leaves me with an empty button.
If I deliberately use a filename that does not correspond to an existing file, I see a broken image icon:
So I am reasonably sure that the basic syntax and file path stuff is correct but the image does not get rendered in the button.
Is there something else I need to do to make this work or is it all just part of Matlab's overwhelming strangeness?
The easiest way to put an image on a uicontrol (and specifically a button), is to use the CData property,
im_orig = imread(icon_file); % Needs to be true color, i.e. MxNx3
im_sized = imresize(im_orig,[80,50]); % size of the button
% str = ['<html><img src="file://' icon_file '"></html>'];
% set(close_btn,'String',str);
set(close_btn,'CData',im_sized);

Angular 5 - add tooltip to string, possibly with Angular Material 2 mat-tooltip

I would like to dynamically add tooltips to some text. Ideally I would like to do so with the built-in tooltips shipped with Angular Material 2, but also a custom solution will do.
As an example, in the sentence the dog is barking, I would like to add to the word dog a tooltip displaying german shepherd.
The text is currently shown like this: <p>{{ stringFromSecureServer }}</p>.
So far I've tried with a custom pipe (addTooltip) with which I find and replace text:
transform(value: string): any {
value = value.replace('dog', '<span matTooltip="german shepherd">dog</span>');
value = this.sanitizer.bypassSecurityTrustScript(result);
return value;
}
If then I inject in the page the text with <p [innerHTML]="stringFromSecureServer | addTooltip"></p>, the text is actually modified, but matTooltip (Angular Material 2 component) is converted to mattooltip and it won't work.
Assuming that the problem was somehow linket to AM2, I've tried with a custom Directive, based on the excellent guide by Netanel Basal.
While the custom [tooltip] Directive is working with statically typed DOM elements (e.g. <span tooltip="test">test</span>), this still does not work when I find and replace the text as shown above.
Is there a way to achieve what I'm trying to do?
PS
As far as I can tell, I should not have XSS issues because all the strings that I need to work on are NOT user generated. All strings are served by the server through an https connection (Let's Encrypt auto renewed cert)

Sublime Text 3 - CSS Autocomplete WITHOUT typing property value

So I know autocomplete works great when you start typing a value. For example, the second you type the "c" in text-align:center, the available autocomplete values pop up (such as center, left, right).
However, when I used Dreamweaver, for properties with specific value options like text-align (center, right, left), display (block, inline-block), cursor (pointer, default), etc., the autocomplete popup would show immediately after the property was typed, it did NOT wait until I started typing a value. Right after text-align: was typed out, it would show me the autocomplete popup giving me the options center, right, left.
The value autocomplete should fire right after my property autocomplete fires:
So after I type te...
the autocomplete popup for "te" properties displays text-align, text-decoration, text-shadow etc....
then I press Enter to select text-align...
then immediately after pressing Enter an autocomplete popup should show for the text-align values: center, left, right.
Any idea how this can be accomplished in Sublime Text 3?
You can get ST to show the autocompletion popup again straight after a completion has been inserted using a small plugin and some preferences:
With a CSS file open in ST, open the Preferences menu and select Preferences - Syntax Specific. Add the following to the settings on the right hand side:
"auto_complete_triggers":
[
{
"characters": ": ",
"selector": "source.css meta.property-list.css meta.property-value.css"
},
],
and save it. This will tell ST to show the autocomplete popup automatically in CSS files when typing a : or a space when the syntax expects a property value.
Now, unfortunately, ST doesn't consider an autocompletion to have "typed" anything, so this trigger isn't fired automatically when selecting a property value like text-align from the autocomplete popup, which inserts text-align:. So, to get round that, this is where we need a small plugin. From the Tools menu, choose Developer -> New Plugin...
Select all text and replace with the following and save it, in the folder ST recommends (Packages/User/) as something like show_autocomplete_after_completion.py:
import sublime
import sublime_plugin
class AutoCompleteListener(sublime_plugin.EventListener):
def on_post_text_command(self, view, command_name, args):
if command_name in ('commit_completion', 'insert_best_completion'):
act = view.settings().get('auto_complete_triggers', [])
scope = view.scope_name(view.sel()[0].begin())
char = view.substr(view.sel()[0].begin() - 1)
for trigger in act:
if sublime.score_selector(scope, trigger['selector']) > 0:
if char in trigger['characters']:
view.run_command('auto_complete', { 'insert_best_completion': False })
break
This plugin basically detects when a completion has been inserted (although due to a limitation of the ST API, it can't detect when you click on an entry with the mouse - see https://github.com/SublimeTextIssues/Core/issues/1166), and if the text/character immediately before the caret matches one of the autocompletion triggers defined in the settings, then it will show the autocomplete popup again.
You can try out this package. This package indexes your .less and .scss (or .sass) and caches your mixins, variables, class or id names and autocompletes both on html and css. It autocompletes your less and sass mixins with mixin arguments. It also supports emmet completions and gets your css classes on popup window. -
https://github.com/subhaze/CSS-Extended/

Customshapes in Limejs

I want to know the custom shape creation in html5 using LimeJS.Could anyone tell me how to create a custom shape like comment in a game using LimeJS for html5.
for images
var gameMap = new lime.Sprite().setSize(400,300).setFill('images/bk.jpg').setPosition(0,0).setAnchorPoint(0,0);
for custom shapes we have to fill with different points
You essentially create a custom sprite, and render the UI appropriately, which could be a combination of elements. The shell needs to be:
test.board = function() {
goog.base(this);
}
goog.inherits(test.board, lime.Sprite);
Text input isn't direct; here is an article on text input: https://groups.google.com/forum/?fromgroups=#!topic/limejs/txaxgK3eXQg. You can use a label, and attach to the key press event. I don't know if this works for canvas rendering...