Multiple diacritics

[Kampmarsvin]

Hi.
I am working on an ancient greek keyboard based on your keyboard, and I need to be able to add multiple diacritics at the same time. For instance, I need to be able to write this: ᾁ
I also need to have a combination of s + space og s + question mark, since in ancient greek if s is final it changes its appearance. Maybe a regex can solve the problem, but I don't know how

[Mottie]

Hi @Kampmarsvin!

I found this site showing ancient greek letters, and wow there are a lot. So, instead of making diacritics, maybe the alt keys popup extension would work better in your case - here is a demo I put together with all the ancient greek letters I found.

/* add some custom popups */
$.extend($.keyboard.altKeys, {
  // letters copied from http://www.lexilogos.com/keyboard/greek_ancient.htm
  'Α': 'Ἀ Ἁ Ἂ Ἃ Ἄ Ἅ Ἆ Ἇ Ὰ ᾼ ᾈ ᾉ ᾊ ᾋ ᾌ ᾍ ᾎ ᾏ Ᾰ Ᾱ',
  'α': 'ἀ ἁ ἂ ἃ ἄ ἅ ἆ ἇ ὰ ᾶ ᾳ ᾀ ᾁ ᾂ ᾃ ᾄ ᾅ ᾆ ᾇ ᾲ ᾷ ᾴ ᾰ ᾱ',
  'Β': 'β ϐ',
  'Ε': 'Έ Ἐ Ἑ Ἒ Ἓ Ἔ Ἕ Ὲ',
  'ε': 'έ ἐ ἑ ἒ ἓ ἔ ἕ ὲ',
  'Η': 'Ή Ἠ Ἡ Ἢ Ἣ Ἤ Ἥ Ἦ Ἧ Ὴ ῌ ᾘ ᾙ ᾚ ᾛ ᾜ ᾝ ᾞ ᾟ',
  'η': 'ή ἠ ἡ ἢ ἣ ἤ ἥ ἦ ἧ ὴ ῆ ῃ ᾐ ᾑ ᾒ ᾓ ᾔ ᾕ ᾖ ᾗ ῂ ῇ ῄ',
  'Ι': 'Ί Ἰ Ἱ Ἲ Ἳ Ἴ Ἵ Ἶ Ἷ Ὶ Ῐ Ῑ',
  'ι': 'ί ἰ ἱ ἲ ἳ ἴ ἵ ἶ ἷ ὶ ῖ ῗ ῒ ΐ ῐ ῑ',
  'Ο': 'Ό Ὀ Ὁ Ὂ Ὃ Ὄ Ὅ Ὸ',
  'ο': 'ό ὀ ὁ ὂ ὃ ὄ ὅ ὸ',
  'Ρ': 'Ῥ',
  'ρ': 'ῥ ῤ',
  'Σ': 'σ ς',
  'Υ': 'Ύ Ὑ Ὓ Ὕ Ὗ Ὺ Ῠ Ῡ',
  'υ': 'ύ ὐ ὑ ὒ ὓ ὔ ὕ ὖ ὗ ὺ ῦ ῧ ῢ ΰ ῠ ῡ',
  'Φ': 'φ ϕ',
  'Ω': 'Ὠ Ὡ Ὢ Ὣ Ὤ Ὥ Ὦ Ὧ Ὼ Ώ ῼ ᾨ ᾩ ᾪ ᾫ ᾬ ᾭ ᾮ ᾯ',
  'ω': 'ώ ὠ ὡ ὢ ὣ ὤ ὥ ὦ ὧ ὼ ῶ ῳ ᾠ ᾡ ᾢ ᾣ ᾤ ᾥ ᾦ ᾧ ῲ ῷ ῴ'
});

$(function() {
  $('#keyboard').keyboard({
    layout: 'ms-Greek (220)',
    // disable key repeat
    repeatRate: 0
  }).addAltKeyPopup({
    // time to hold down a button in ms to trigger a popup
    holdTime: 500,
    // event triggered when popup is visible
    // access the overlay from keyboard.altKeyPopup_$overlay
    // or the keys container from keyboard.altKeyPopup_$overlay.find('.ui-keyboard-popup')
    // or the keys from keyboard.altKeyPopup_$overlay.find('.ui-keyboard-button')
    popupVisible: 'popup-visible'
  });
});

If you really want to make diacritics work, then it gets a bit more complicated with regular expressions. I can set up an example if you want.

[Kampmarsvin]

Hi Mottie
Thanks a lot for your example. You may be right. It may be better to go with your approach, however, I am curious as to whether I can make it map to the physical keybaord as well? If it doesn't work with mapped keys, then I am definitely going to need the regex.
But maybe I could use both solutions at the same time. This would truly be user friendly

[Mottie]

To map the keys you'll need to create a custom layout... check out the mapped keys demo. Click on the "Custom: Mapped Keys" title then scroll down to see the code. And still no regex needed ;)

[Kampmarsvin]

Sorry I didn't make myself clear. I am already using mapping, and it works fine, but how do I make the use of the pop-up extention through the mapped keys? is this possible?

[Mottie]

Hmm, I haven't tried using those two methods together before... I did some testing and right now, I plan on fixing this, it appears that you'll need to use the entire string used for mapping. For example, if the custom keyboard has this defined:

"α(a):testing_1_2_3"

then the alt keys will need to duplicate that entire string to get it to work

$.extend($.keyboard.altKeys, {
  'α(a):testing_1_2_3': 'ἀ ἁ ἂ ἃ ἄ ἅ ἆ ἇ ὰ ᾶ ᾳ ᾀ ᾁ ᾂ ᾃ ᾄ ᾅ ᾆ ᾇ ᾲ ᾷ ᾴ ᾰ ᾱ'
});

[Mottie]

Ok, if you use jquery.keyboard.extension-altkeyspopup.js from the master branch, you only need to include the mapped key in the altKeys definition:

$.extend($.keyboard.altKeys, {
  'α': 'ἀ ἁ ἂ ἃ ἄ ἅ ἆ ἇ ὰ ᾶ ᾳ ᾀ ᾁ ᾂ ᾃ ᾄ ᾅ ᾆ ᾇ ᾲ ᾷ ᾴ ᾰ ᾱ'
});

[Kampmarsvin]

That sounds great. I will try this out.

[Kampmarsvin]

No matter what I do, I cannot make the mapped keys activate the popup. Is there something I'm missing?

[Mottie]

Make sure you are using the jquery.keyboard.extension-altkeyspopup.js from the master branch... save it directly from from here.

Here is a demo using that up-to-date extension file... I had to rearrange some letters on the layout to match my U.S. qwerty keyboard ;)

[Kampmarsvin]

Hi Motti
I must be doing something wrong, Your demo doesn't work for me either.
Am I supposed to click some ekstra button at the same time? Or is it simply my computer that plays tricks on me?

[Mottie]

I'm not sure why it isn't working for you. What browser/version are you using?

Oh, wait, do you mean you can't get the alt key popup to open? Hmm, pressing & holding the physical keyboard key probably isn't the ideal way to do that.

Maybe you will need to use regex to make combo keys. Will you need all the diacritics provided by the alt key popup? That's a lot of key combos to get it to work. Maybe I can figure out a better method...

[Kampmarsvin]

1. I tried in several browsers and they are all the newest versions.

2. Yes, that's exactly what I mean.

3. I would like the exact same functionality when using a real keyboard. So, if you can figure out a better solution, that would be really coolI But I think that it would make a lot of sense to activate the popup through holding down the physical key or by holding down some extra button.

[Mottie]

Ok, I just released a new version. The altkeypopup extension now includes physical keyboard interaction.

• Press & hold the physical key to get the popup open.
• Use left arrow (←), right arrow (→), Home, End to navigate.
• Press Enter to select the character.
• Press Esc to cancel.

[Kampmarsvin]

Awesome! Thank you for the time you put into this, and the speed at which you work.

[Kampmarsvin]

I hate to be a bother, but I tried it out, but got all sorts of different outcomes depending on the browser I chose.
In Firefox nothing happens
In Chrome I get a dark layer across the keyboard, but nothing else
In Internet Exploder it crashed with a javascript error

[Mottie]

Hey! Ugh, you're right... I forgot to test the keyboard in Firefox. Oddly, JSHint did not report the issue, so I filed a report.

I'm about to push an update to the master branch. Once we get it to work for you, I'll push a new release.

[Kampmarsvin]

That's awesome

[Kampmarsvin]

Can you set up an ancient greek demo, once it works?

[Mottie]

Ok, the extension just needed one minor tweak to get it to work properly.

http://jsfiddle.net/Mottie/ae1nm557/3/

The problem with the previous demo, and why the popup would open as an empty box, was that the previous demo was defining the altKey as 'α(a):testing_1_2_3', when it should have been using just 'α'.

[Kampmarsvin]

There is still a few bugs though. When using capitalized letters it opens the not capitalized letters popup.
If pressing shift while the keyboard is in capital mode, it opens an empty box in firefox and chrome, but breaks in IE

[Mottie]

Hmm, I guess you need the typing extension as well... http://jsfiddle.net/Mottie/ae1nm557/4/

Load the typing extension file and include .addTyping() at the end of the code.

[Kampmarsvin]

I have tested the keyboard very systematically, and have come to the following conclusion (see the attached file):

And also:
When popup-letter has been picked typing is no longer available on neither virtual nor real keyboard.
If virtual keyboard is already showing capital letters, pressing caps lock (on real keyboard) will change upper case to lower case.

[Mottie]

Hi @Kampmarsvin!

Thanks for all that thorough testing!

The cap lock key does not have a setting that can be checked to test if it is on or off. So the only way to figure out if it is on, is to wait unless a key is pressed on the keyboard, and right now only "a-z" and "A-Z" are tested. I'm sure it could be made more extensive by checking accented character codes.

Anyway, I think I finally found a working solution. It's still not ideal because even with the cap lock set, pressing & releasing shift changes the keyset back to lower case.

[Mottie]

Ok, try the code in that last update.

That last issue you reported with typing after picking an alt key in the popup should have been fixed in the previous update... and it still works for me in this last update.

[Kampmarsvin]

Hi again. I have found a new problem which may only be related to the current demo. Everything seems to work fine until a virtual key is press and held in order to pick a character with diacritics then it is no longer possible to type anything on the physical keyboard

[Kampmarsvin]

Addition: happens only when pop-up value is picked by use of physical keyboard

[Mottie]

It does appear to work intermittently. I'll dig into the issue more when I get some free time.

[Mottie]

@Kampmarsvin Please check the latest updates in the master branch. If everything is working again, I plan on pushing out a new release in the next few days.

[Mottie]

New update available. Hopefully all these issues have been resolved.