Numbers localization in Web applications

Question

How can I set the variant of Arabic numeral without changing character codes ?

Eastern Arabic      ۰   ۱   ۲   ۳   ٦   ٥   ٤   ۷   ۸   ۹
Persian variant              


        

Answer 1

I have been working on a general web page localization technique that does more than just numbers (its similar to .po files)

The localization files are simple (the strings can contain html if needed)

/* Localization file - save as document_url.lang.js ... index.html.en.js: */
items=[
{"id":"string1","value":"Localized text of string1 here."},
{"id":"string2", "value":"۰ ۱ ۲ ۳ ۴ ۵ ۶ ۷ ۸ ۹ "}
];
rtl=false; /* set to true for rtl languages */

This format is useful to separate out for translators (or mechanical turk)

and a basic page template

This is the default text of string1.
0 1 2 3 4 5 6 7 8 9 

I tried to keep it pretty simple, yet cover as many locales as possible so additional css is likely required (I have to admit a lack of exposure to rtl languages, so many more styles may need to be set)

I do have font checking code that would be useful if you know what fonts support your character codes well

function hasFont(f){
    var s=document.createElement("span")
    s.style.fontSize="72px"
    s.innerHTML="MWMWM"
    s.style.visibility="hidden"
    s.style.fontFamily=[(f=="monospace")?'':'monospace','sans-serif','serif']
    document.body.appendChild(s)
    var w=s.offsetWidth
    s.style.fontFamily=[f,'monospace','sans-serif','serif']
    document.body.lastChild=s
    return s.offsetWidth!=w
}

usage: if(hasFont("myfont"))myelement.style.fontFamily="myfont"