pinyin support?

[Nevergonnachange]

Hi,

I've set up a website using this keypad. I want the user to be able to use pinyin to input chinise.

Now once i've got the keypad up and runing the following happens:

1. i press a key on my real keyboard windows recognizes that i'm using pinyin
2. i press a key on the virtual keypad windows doesnt recognize that i'm using pinyin

It appers windows doesnt notice that i pressed a button on the virtual keypad (no keypress gets simulated??). Is there a way i can "let windows know" that a key got pressed? Such as simulating a real keypress?

Thank in advance
Robin

[Mottie]

Hi @Nevergonnachange!

I think you will need to create a layout that remaps the keyboard. Hmm, I thought I had that documented properly, but it seems to be missing. Basically, if you look at this example

// Custom: Mapped keys
// ********************
$('#map').keyboard({
    layout : 'custom',
    customLayout: {
        'default' : [ 
            // "n(a):title/tooltip"; n = new key, (a) = actual key, ":label" = title/tooltip (use an underscore "_" in place of a space " ")
            '\u03b1(a):lower_case_alpha_(type_a) \u03b2(b):lower_case_beta_(type_b) \u03be(c):lower_case_xi_(type_c) \u03b4(d):lower_case_delta_(type_d) \u03b5(e):lower_case_epsilon_(type_e) \u03b6(f):lower_case_zeta_(type_f) \u03b3(g):lower_case_gamma_(type_g)', // lower case Greek
            '{shift} {accept} {cancel}'
        ],
        'shift' : [
            '\u0391(A):alpha \u0392(B):beta \u039e(C):xi \u0394(D):delta \u0395(E):epsilon \u03a6(F):phi \u0393(G):gamma', // upper case Greek
            '{shift} {accept} {cancel}'
        ]
    },
    usePreview: false // no preveiw
});

You will notice that each key is defined as follows:

 "n(a):title_or_tooltip"

Where

• n (required) is the new key
• (a) (required to remap) is the key that is pressed, or physical keyboard key
• :title_or_tooltip (optional) is the content that is added to the virtual keyboard title (use an underscore "_" in place of a space " ")

I would appreciate it if you could share your resulting layout so that it may benefit others, but that is your choice ;)

---

I do have two additional Chinese layouts in the works, which I don't know if you would find useful; but I would appreciate any feedback!

/* Chinese Bopomofo IME Keyboard Layout
 * generated from http://www.microsoft.com/resources/msdn/goglobal/keyboards/kbdTCBO.html
 */
$.keyboard.layouts['Chinese Bopomofo IME'] = {
    "name" : "Chinese Bopomofo IME",
    "lang" : ["zh"],
    "default" : [
        "\u20AC \u3105 \u3109 \u02C7 \u02CB \u3113 \u02CA \u02D9 \u311A \u311E \u3122 \u3126 \u003D {bksp}",
        "{tab} \u3106 \u310A \u310D \u3110 \u3114 \u3117 \u3127 \u311B \u311F \u3123 \u005B \u005D \u005C",
        "{lock} \u3107 \u310B \u310E \u3111 \u3115 \u3118 \u3128 \u311C \u3120 \u3124 \u0027 {enter}",
        "{shift} \u3108 \u310C \u310F \u3112 \u3116 \u3119 \u3129 \u311D \u3121 \u3125 {shift}",
        "{accept} {alt} {space} {alt} {cancel}"
    ],
    "shift" : [
        "\u007E \u0021 \u0040 \u0023 \u0024 \u0025 \u005E \u0026 \u002A \u0029 \u0028 \u005F \u002B {bksp}",
        "{tab} \u0071 \u0077 \u0065 \u0072 \u0074 \u0079 \u0075 \u0069 \u006F \u0070 \u007B \u007D \u007C",
        "{lock} \u0061 \u0073 \u0064 \u0066 \u0067 \u0068 \u006A \u006B \u006C \u003A \u0022 {enter}",
        "{shift} \u007A \u0078 \u0063 \u0076 \u0062 \u006E \u006D \u003C \u003E \u003F {shift}",
        "{accept} {alt} {space} {alt} {cancel}"
    ],
    'alt' : [
        "` 1 2 3 4 5 6 7 8 9 0 - = {bksp}",
        "{tab} q w e r t y u i o p [ ] \\",
        "a s d f g h j k l ; ' {enter}",
        "{shift} z x c v b n m , . / {shift}",
        "{accept} {alt} {space} {alt} {cancel}"
    ],
    'alt-shift' : [
        "~ ! @ # $ % ^ & * ( ) _ + {bksp}",
        "{tab} Q W E R T Y U I O P { } |",
        'A S D F G H J K L : " {enter}',
        "{shift} Z X C V B N M < > ? {shift}",
        "{accept} {alt} {space} {alt} {cancel}"
    ]
};

/* Chinese ChaJei IME Keyboard Layout
 * generated from http://www.microsoft.com/resources/msdn/goglobal/keyboards/kbdTCCJ.html
 */
$.keyboard.layouts['Chinese ChaJei IME'] = {
    "name" : "Chinese ChaJei IME",
    "lang" : ["zh"],
    "default" : [
        "\u20AC \u0031 \u0032 \u0033 \u0034 \u0035 \u0036 \u0037 \u0038 \u0039 \u0030 \u002D \u003D {bksp}",
        "{tab} \u624B \u7530 \u6C34 \u53E3 \u5EFF \u535C \u5C71 \u6208 \u4EBA \u5FC3 \u005B \u005D \u005C",
        "{lock} \u65E5 \u5C38 \u6728 \u706B \u571F \u7AF9 \u5341 \u5927 \u4E2D \u003B \u0027 {enter}",
        "{shift} \uFF3A \u96E3 \u91D1 \u5973 \u6708 \u5F13 \u4E00 \u002C \u002E \u002F {shift}",
        "{accept} {alt} {space} {alt} {cancel}"
    ],
    "shift" : [
        "\u007E \u0021 \u0040 \u0023 \u0024 \u0025 \u005E \u0026 \u002A \u0029 \u0028 \u005F \u002B {bksp}",
        "{tab} \u0071 \u0077 \u0065 \u0072 \u0074 \u0079 \u0075 \u0069 \u006F \u0070 \u007B \u007D \u007C",
        "{lock} \u0061 \u0073 \u0064 \u0066 \u0067 \u0068 \u006A \u006B \u006C \u003A \u0022 {enter}",
        "{shift} \u007A \u0078 \u0063 \u0076 \u0062 \u006E \u006D \u003C \u003E \u003F {shift}",
        "{accept} {alt} {space} {alt} {cancel}"
    ],
    'alt' : [
        "` 1 2 3 4 5 6 7 8 9 0 - = {bksp}",
        "{tab} q w e r t y u i o p [ ] \\",
        "a s d f g h j k l ; ' {enter}",
        "{shift} z x c v b n m , . / {shift}",
        "{accept} {alt} {space} {alt} {cancel}"
    ],
    'alt-shift' : [
        "~ ! @ # $ % ^ & * ( ) _ + {bksp}",
        "{tab} Q W E R T Y U I O P { } |",
        'A S D F G H J K L : " {enter}',
        "{shift} Z X C V B N M < > ? {shift}",
        "{accept} {alt} {space} {alt} {cancel}"
    ]
};

[Mottie]

I actually do have a Pinyin layout available; generated from layouts found on greywyvern.com

/* Pinyin Keyboard Layout (\u62fc\u97f3 (Pinyin)) * generated from http://www.greywyvern.com/code/javascript/keyboard layouts */
jQuery.keyboard.layouts["zh-Latn"] = {
    "name": "Pinyin (\u62fc\u97f3)",
    "normal": ["` 1 2 3 4 5 6 7 8 9 0 - = {b}", "{t} q w e r t y u i o p [ ] \\", "a s d f g h j k l ; ' {enter}", "{s} z x c v b n m , . / {s}", "{space} {alt} {accept}"],
    "shift": ["~ ! @ # $ % ^ & * ( ) _ + {b}", "{t} Q W E R T Y U I O P { } |", "A S D F G H J K L : \" {enter}", "{s} Z X C V B N M < > ? {s}", "{space} {empty} {accept}"],
    "alt": ["\u4e93 \uFF62 \uFF63 \u301D \u301E \u301F \u3008 \u3009 \u302F \u300A \u300B \u300E \u300F {b}", "{t} \u0101 \u00E1 \u01CE \u00E0 \u0113 \u00E9 \u011B \u00E8 \u012B \u00ED \u01D0 \u00EC \u3020", "\u014D \u00F3 \u01D2 \u00F2 \u00fc \u016B \u00FA \u01D4 \u00F9 {empty} {empty} {enter}", "{empty} \u01D6 \u01D8 \u01DA \u01DC {empty} {empty} {empty} \u3001 \u3002 {empty} {empty}", "{space} {alt} {accept}"],
    "lang": ["zh-Latn"]
};

[Nevergonnachange]

Thank you very much for your efforts so far.

Apparently i didn't quite get my question out as i wanted.

My problem is that letters pressed on the on screen keyboard don't get recognized by windows's pinyin. The layout itself doesn't matter way too much. I'm looking for a way to let windows know about my inputs of the on screen keypad.

[Mottie]

I'm not sure what you are trying to do in Windows. I hope you understand that a page in the browser does not have access to the OS for security reasons; but you might be able to convert your page into a Windows app.

[Mottie]

In the last update, I added the converted keyboard layouts from greywyvern.com (demo) which includes the pinyin keyboard layout.

[aravindG92]

Will the pinyin keypad show suggestions similar to this example : https://www.branah.com/chinese

[Mottie]

Hi @aravindG92!

It's unlikely since it would require altering the layout dynamically and someone who knows the language to help write an extension to do it.

[alanzhaonys]

@Mottie The English keyboard layout worked out great for me. Unfortunately, for any of the Chinese layouts, without having character suggestions of combined of keys, the keyboard is pretty much useless. https://www.branah.com/chinese seems to have a great implementation around this. You're right, extension is needed to convert input methods to Chinese characters and provide suggestions. I really like this keyboard and would try to find solutions if possible.

[Mottie]

I don't know Chinese, so it would be difficult and very time consuming for me to build an extension to make character suggestions. Maybe I could build an internal system to make changing keys to provide suggestions easier... I'll put it on my to-do list for version 2.

[alanzhaonys]

That would be awesome. I believe there is way to map PinYin to Chinese characters. For example, user types "ABC", a list of suggestions will show on top, also providing scrolling functionality if list gets long. User keeps type, the list will refresh.

Thank you!