speechsynthesisutterance doesn't read arabic? - javascript

I wanted to implement a tex to speech on my web app, I tested it on other languages (french and english)
and the text converted to speech just fine ,but when i set the language to arabic
utterThis.lang = 'ar-AE';
I hear nothing, doesnt javascript detect arabic letters?
here is the code i tried
const synth = window.speechSynthesis;
const utterThis = new SpeechSynthesisUtterance(resultText);
const speechHandler = () => {
utterThis.lang = 'ar-AE';
synth.speak(utterThis);
}

The lang property accepts a BCP 47 language tag, according to the Mozilla Developer Network (here).
I'm not too familiar with BCP 47 language tags, but it looks like ar-AE is an ISO language code whereas ar-SA is the only Arabic BCP 47 language tag.

Related

Javascript detect if native emoji is supported

I would like to detect if native emoji is supported.
Only if it does not, I will then load emoji font to save bandwidth and also make the application look more native.
However, as I search through the Internet, I only found someone using userAgent to check if emoji is supported or not.
For example, the below code is from https://github.com/github/g-emoji-element/blob/master/emoji-detection.js,
export function isEmojiSupported(): boolean {
const onWindows7 = /\bWindows NT 6.1\b/.test(navigator.userAgent)
const onWindows8 = /\bWindows NT 6.2\b/.test(navigator.userAgent)
const onWindows81 = /\bWindows NT 6.3\b/.test(navigator.userAgent)
const onFreeBSD = /\bFreeBSD\b/.test(navigator.userAgent)
const onLinux = /\bLinux\b/.test(navigator.userAgent)
return !(onWindows7 || onWindows8 || onWindows81 || onLinux || onFreeBSD)
}
Though the regular expression may not be perfect, as Firefox in Windows 7 does support Emoji as from http://caniemoji.com/.
However, as different browser or libraries may have different set of emoji, some emoji may render perfectly in one browser, and some just not render very well.
So is there a better method other than using userAgent to check if Emoji is supported?
Rather than trying to detect, I would suggest loading the font with all the glyphs you want, and using font-display: swap in your CSS.
Then, your page can still be shown while the loading of this extra font is still occurring.
See also: https://css-tricks.com/font-display-masses/
There used to be a technique to measure the width of an element containing text in 2 different fonts to see if a font is supported by seeing if a fallback font was used.
A similar technique can be used with emojis by taking advantage of emoji sequences that collapse onto a single emoji.
If a browser supports emojis it will render 1 glyph for emojis that are made up of 2 sequences. If it doesn't, it will render 2 glyphs.
var trinidad = String.fromCodePoint(0x1F1F9, 0x1F1F9);
var hammerpick = String.fromCodePoint(0x2692);
function getWidth(s) {
var n = document.body.appendChild(document.createElement("span"));
n.appendChild(document.createTextNode(s));
var w = n.offsetWidth;
n.parentNode.removeChild(n);
return w;
}
console.log(getWidth(trinidad) === getWidth(hammerpick) ? "supported": "not supported");

Google Vision API applied to identifying a javascript function

I am trying to create an application that read an image containing a simple Javascript code -- ex: a const a = 123; console.log(a); -- and execute this code afterwards.
For that, I am trying to use Google Vision API. My main problem so far is that some special characters (=, =>, ;) are not being recognized correctly.
Some examples:
const a = 123 is converted to const a -123
const a = '123' is converted to const a 123
I saw this question, and it seems that I can insert some special chars to be recognized, but I do not know where.
Is there a way to improve the recognition for this context?

Complete list of all different Intl.NumberFormats

I'm looking for a complete list of all the different Intl.NumberFormats.
The Intl.NumberFormat page shows 3 different formats.
ja-JP -> "¥123,457"
de-DE -> 123.456,79 €
en-IN -> 1,23,000
Is this all? Or is there more?
Intl was introduced here https://hacks.mozilla.org/2014/12/introducing-the-javascript-internationalization-api/ with these takeaways:
There's no official list, since "The api is best-effort"
By default, browsers accepts ALL correctly formatted codes (BCP 47 is mentioned and then finds the best fit
You might specify lookup only to disable the best fit algorithm, and then you could get a list of all countries and language codes and that way run through all combinations for a specific browser on a specific OS with a specific list of installed languages but I guess that's not what you want to hear if you're building a web project. But you might want to make use of supportedLocalesOf to have something locally relevant to choose from.
Under the hood browsers typically use ICU or similar
tl;dr: So if you send in your best guess at a valid locale, the best fit algorithm will get you something usable!
Valid locale?
According to the documentation and my earlier research, the Intl javascript API expects you to format your locale codes according to BCP 47.
Go through this it has all the format available
Some of popular locales:
pl_PL = 1 205,34 zł
en_US = $1,205.34
en_GB = £1,205.34
en_IE = €1,205.34
de_DE = 1.205,34 €
fr_FR = 1 205,34 €
br_FR = € 1 205,34
ja_JP = ¥1,205
pt_TL = 1 205,34 US$
fr_CA = 1 205,34 $
en_CA = $1,205.34
And for All possible locales visit:
https://gist.github.com/ncreated/9934896
en-IE = €1,205.34
ro-MD = 1.205,34 MDL
br = ¤ 1 205,34
en-GY = $1,205
es-GT = Q1,205.34
All Locale Visit : https://gist.github.com/raushankrjha/d1c7e35cf87e69aa8b4208a8171a8416
All different formats available worldwide.
$c = '{
"en_EN": "$100,000.00",
"de_DE": "100.000,00 $",
"af_AF": "$ 100,000.00",
"am_AM": "US$100,000.00",
"ar_AR": "١٠٠٬٠٠٠٫٠٠ US$",
"bn_BN": "১,০০,০০০.০০US$",
"bg_BG": "100000,00 щ.д.",
"ca_CA": "100.000,00 USD",
"cs_CS": "100 000,00 US$",
"nl_NL": "US$ 100.000,00",
"et_ET": "100 000,00 $",
"fr_FR": "100 000,00 $US",
"he_HE": "‏100,000.00 $",
"hi_HI": "$1,00,000.00",
"it_IT": "100.000,00 US$",
"nb_NB": "USD 100 000,00",
"ms_MS": "USD100,000.00",
"id_ID": "US$100.000,00",
"pl_PL": "100 000,00 USD"}';

Javascript text file encoding with Arabic and English for macro file

I am trying to export a text file using JavaScript to be used as macro for Microsoft Dynamics GP.
The problem is Arabic letters don't render correctly when I try to use the macro in GP.
For example "النسر" would render as "ط§ظ„ظ†ط³ط±"
My JavaScript code uses FileSaver.js
var file = new Blob([text], {type:"text/plain;charset=utf-8;"});
saveAs(file, filename);
One solution I found was that after downloading the file I save it with ANSI encoding. But if I changed my charset in the JavaScript Blob object to "ansi" or "Windows-1252" or "cp-1252" it doesn't work.
Note: I am using Chrome on Windows 7
From my experience I have found that Dynamics GP macros uses ANSI.
You will first need to encode your text to ANSI that includes arabic (windows-1256/CP1256).
I used this js library to encode the text:
https://github.com/mathiasbynens/windows-1256
var text= windows1256.encode(text);
Then you will need to convert it to 8 bit unsigned integers and export it using a Blob.
var uint8 = new Uint8Array(text.length);
for (var i = 0; i < uint8.length; i++)
{
uint8[i] = text.charCodeAt(i);
}
var file = new Blob([uint8], {type: 'text/plain;charset=windows-1256'});
I know this answer is too late but I hope it helps.
I know this is super old but I am almost positive, unless something has changed recently, that GP database is all non-unicode. This is not going to work for you.

is there any builtin javascript string hash function in newest browsers?

Everytime a new versions of browsers show up I hear about new stuff being added, like say webGL and other technologies that no one really knows if they catch up.
But I wonder if someone ever thought about such basic stuff in JS like hashing functions (MD5,SHA1 and the like).
By newest browsers I mean today's development versions too like Opera 12, Chrome 17 or Firefox 10.
Looking now for solution I found this comment on another thread here: https://stackoverflow.com/questions/7204097/short-hashing-function-for-javascript (Do you know that javascript objects already are hashtables ?). So what are these 'hashtables' ? Does it mean that I can make any string into a hash, but not an established one like md5 or sha1 but some JS build in specific ?
basically what I need to do is:
var txt="Hello world!";
var hash = txt.toSha1();
For anybody still looking for this information. There is a WebCrypto API which appears to have been finalised at the beginning of 2017.
To use it in a browser, you can find it at window.crypto.subtle which contains methods for encryption, digests etc. Documentation on the available functions here.
Paul Johnston has implemented the following algorithms in javascript
MD5, RIPEMD-160, SHA-1, SHA-256 and sha-512
You can find the source code and some examples here:
http://pajhome.org.uk/crypt/md5/
I hope this is what you were looking for.
async function sha256(source) {
const sourceBytes = new TextEncoder().encode(source);
const digest = await crypto.subtle.digest("SHA-256", sourceBytes);
const resultBytes = [...new Uint8Array(digest)];
return resultBytes.map(x => x.toString(16).padStart(2, '0')).join("");
}
Note: This answer was written in 2014 when the Web Cryptography API was not available. Do not use this in the context where cryptographic security is needed. This may be useful when you need a simple reversible encryption with "builtin" support.
When I need simple client side hashing without external libraries I use the browsers' built in atob() and btoa() functions.
window.btoa() creates a base-64 encoded ASCII string from a "string" of binary data.
function utf8_to_b64( str ) {
return window.btoa(encodeURIComponent( escape( str )));
}
The window.atob() function decodes a string of data which has been encoded using base-64 encoding.
function b64_to_utf8( str ) {
return unescape(decodeURIComponent(window.atob( str )));
}
http://caniuse.com/#search=btoa and http://caniuse.com/#search=atob shows it is hugely supported by the modern browsers
Example taken from https://developer.mozilla.org/en-US/docs/Web/API/window.btoa

Categories