<html>
<head>
<base href="https://bugs.documentfoundation.org/">
</head>
<body>
<p>
<div>
<b><a class="bz_bug_link
bz_status_NEW "
title="NEW - iPad Hardware-Keyboard in iOS App"
href="https://bugs.documentfoundation.org/show_bug.cgi?id=124905#c3">Comment # 3</a>
on <a class="bz_bug_link
bz_status_NEW "
title="NEW - iPad Hardware-Keyboard in iOS App"
href="https://bugs.documentfoundation.org/show_bug.cgi?id=124905">bug 124905</a>
from <span class="vcard"><a class="email" href="mailto:tml@iki.fi" title="Tor Lillqvist <tml@iki.fi>"> <span class="fn">Tor Lillqvist</span></a>
</span></b>
<pre>At least part of the problem seems to be that loleaflet uses a HTML text input
field that it gives the focus to enable the on-screen keyboard, even of there
iOS a hardware keyboard (and no on-screen keyboard will pop up). The cursor
keys are then handled inside that text input field (even if the field does not
have any contents) and not passed on as JavaScript events. If the text input
field does not have focus, the cursor keys arrive as keyboard events with key
property "ArrowDown", "ArrowLeft" etc.
Here is a useful tiny test HTML page I use to experiment with:
<span class="quote">> <html>
> <head>
> <title>
> Title
> </title>
>
> <script>
> var keyeventhandler = function(e) {
> console.log(e.type + ' "' + e.key + '" ' + e.keyCode + ' ' + e.charCode);
> if (e.type === 'keydown' && e.key === 'f')
> window['inputfield'].focus();
> else if (e.type === 'keydown' && e.key === 'b')
> window['inputfield'].blur();
> }
>
> var textinputeventhandler = function(e) {
> console.log('textInput: "' + e.data + '"');
> }
>
> var inputeventhandler = function(e) {
> console.log(e.inputType);
> }
>
> var compeventhandler = function(e) {
> console.log(e.type + ' "' + e.data + '"');
> }
>
> var clipboardeventhandler = function(e) {
> console.log(e.type);
> }
>
> window.addEventListener('keydown', keyeventhandler);
> window.addEventListener('keypress', keyeventhandler);
> window.addEventListener('keyup', keyeventhandler);
>
> window.addEventListener('textInput', textinputeventhandler);
>
> window.addEventListener('input', inputeventhandler);
>
> window.addEventListener('compositionstart', compeventhandler);
> window.addEventListener('compositionupdate', compeventhandler);
> window.addEventListener('compositionend', compeventhandler);
>
> window.addEventListener('copy', clipboardeventhandler);
> window.addEventListener('paste', clipboardeventhandler);
>
> </script>
>
> </head>
> <body>
> Body.
> <input id="inputfield" type="text">
> </body>
> </html></span ></pre>
</div>
</p>
<hr>
<span>You are receiving this mail because:</span>
<ul>
<li>You are the assignee for the bug.</li>
</ul>
</body>
</html>