Persian Textbox

Hey...
Please take a look to these input boxes


At the first look, they are simple inputs. But they are not.
Try to write something on them. Yes the language will switch to Persian mode automatically. But your O.S. keyboard language stays on its old state.
Know press Alt+Ctrl. The language will change(if not try more and more until success).
Here I'm going to describe how I did this.
On the first step you should include the related js file like this:

<script type="text/javascript" src="persiankeyboard.js"></script>

Then your inputs should handle onkeydown and onkeypress javascript events(the read parts) like this:

<input type="text" onkeydown="switchTextLang(this, event)" dir="rtl" onkeypress="keyEnterToPersian(this, event)" lang="fa"/>
<textarea onkeydown="switchTextLang(this, event)" dir="rtl" onkeypress="keyEnterToPersian(this, event)" rows="10" lang="fa" cols="10"></textarea>

The last step is optional but I recommend you to do it to feel better. Its better to set dir and lang fields of your inputs(the yellow parts).
OK that's it. You have Persian input box.
Know the script logic:
The script logic is so simple. It contains three major functions.

• keyEnterToPersian
  this function converts the input key to Persian character. There is an array containing Persian character key code in hexadecimal ordering by their equivalent English character key code. Please take a look to the array:
  var keys = [
0x0020, 0x0021, 0x061B, 0x066B, 0xFDFC, 0x066A, 0x060C, 0x06AF,
0x0029, 0x0028, 0x002A, 0x002B, 0x0648, 0x002D, 0x002E, 0x002F,
0x06F0, 0x06F1, 0x06F2, 0x06F3, 0x06F4, 0x06F5, 0x06F6, 0x06F7,
0x06F8, 0x06F9, 0x003A, 0x06A9, 0x003E, 0x003D, 0x003C, 0x061F,
0x066C, 0x0624, 0x200C, 0x0698, 0x064A, 0x064D, 0x0625, 0x0623,
0x0622, 0x0651, 0x0629, 0x00BB, 0x00AB, 0x0621, 0x0654, 0x005D,
0x005B, 0x0652, 0x064B, 0x0626, 0x064F, 0x064E, 0x0670, 0x064C,
0x0653, 0x0650, 0x0643, 0x062C, 0x005C, 0x0686, 0x00D7, 0x0640,
0x200D, 0x0634, 0x0630, 0x0632, 0x06CC, 0x062B, 0x0628, 0x0644,
0x0627, 0x0647, 0x062A, 0x0646, 0x0645, 0x067E, 0x062F, 0x062E,
0x062D, 0x0636, 0x0642, 0x0633, 0x0641, 0x0639, 0x0631, 0x0635,
0x0637, 0x063A, 0x0638, 0x007D, 0x007C, 0x007B, 0x007E];
  The equivalent Persian key code of input key code is "keys[key - 32]". Because the key code range that we should handle them are between 32(space) up to 127 which will be 0 up to 95 in array index.
• pnhMozStringInsert
  This function is for Mozilla browsers to substitute the input key with its equivalent Persian character in the right position. It will find selection start and end and scroll top and left(for textarea) to insert the substituted character in the right position. In IE browsers we can set the calculated Persian key code directly in "event.keyCode" and it works. I did it in keyEnterToPersian function.
• switchTextLang
  This function sets input language state. This will switch the language by handling Alt+Ctrl key down. It do it on this way:
  var event = document.all ? window.event : event;
if (event.ctrlKey && event.altKey)
.... 

You can download the client side sample from here.
I hope to solve end user Farsi typing of Persian developer problem by creating this tool.
Enjoy yourselves.

all rights reserved by Mostafa Rastgar and Programmer Assistant weblog