[Web, iOS, Android] Undisplayed diacritic fix #1407

jahorton · 2018-12-07T07:44:13Z

Addresses the web and web-based mobile app components of #1070.

rfaramir · 2018-12-07T17:33:45Z

Looking for test cases for you... Lorna found one on iPad:
lorna [11:29 AM]
IPad running 9.3.5 the keycap does not display, but when touched the output displays. This sil_tawallammat or Tamajaq, Tawallammat is the language. This is U+2D7F and on the web keyboard is is RALT 7 and on touch it is two to the right of the spacebar.
Her Android did not show the problem (Khmer Angkor or Tawallammat), just the iPad.

mcdurdin

This looks really good.

Given the fairly broad impact this change has, I'd like to make sure we capture before-and-after screenshots in this PR. can we make sure we test against:

iOS 10, iOS 12
Android 4.4, 5.0, latest-you-can-get
Safari, Chrome, Firefox on target platforms

There will need to be a related PR for the popup keys on Android and iOS in the native apps given those are not implemented by KMW.

I understand that this doesn't touch the desktop OSK? Is that listed as a separate piece of work?

web/source/kmwkeyboards.ts

mcdurdin · 2018-12-09T19:36:22Z

web/source/kmwkeyboards.ts

@@ -784,6 +784,11 @@ namespace com.keyman {
      return ((lg == 'cmn') || (lg == 'jpn') || (lg == 'kor'));
    }

+    isRTL(k0?: any|KeyboardStub): boolean {


Why type any?

Right. I got a bit lazy and copied isCJK's type definition, which wasn't quite correct. The surprise here is that any is the correct type at present. Line 93 of kmwkeyboards.ts:

activeKeyboard: any; // We might can define a more precise def, though...

It never got a fully-precise refactor, as keyboard objects have a decidedly different structure from their stubs. While we'd obviously like to remedy this eventually, I'm pretty sure that's beyond the scope of this PR.

mcdurdin · 2018-12-09T19:36:58Z

web/source/kmwkeyboards.ts

+    getFont(k0?) {
+      var k = k0 || this.activeKeyboard;
+
+      if(k['KV']) {


What if k0 is undefined and this.activeKeyboard is null?

web/source/kmwosk.ts

jahorton · 2018-12-11T01:39:22Z

This change does affect the desktop OSK, since it's modifying the new parent class method implemented by #1403. You can see a small change before-and-after with Khmer Angkor with Windows 10, actually. (macOS Mojave doesn't appear to need the fix for this specific case.) Using the current version of Chrome (or Firefox)...

Before:

After:

Obviously, the rendering's not exactly perfect, but it does affect the coeung marker's key.

jahorton · 2018-12-11T01:53:55Z

Also, good point about the in-app popup keys.

jahorton · 2018-12-13T02:08:07Z

Looking for test cases for you... Lorna found one on iPad:
lorna [11:29 AM]
IPad running 9.3.5 the keycap does not display, but when touched the output displays. This sil_tawallammat or Tamajaq, Tawallammat is the language. This is U+2D7F and on the web keyboard is is RALT 7 and on touch it is two to the right of the spacebar.
Her Android did not show the problem (Khmer Angkor or Tawallammat), just the iPad.

I can confirm that this fixes this particular case, which also affects iOS 12. Perhaps I don't understand the diacritic correctly, but its resulting layout does look a bit strange. Using the iOS Simulator for "iPad 2 - 9.3":

Before

After

Given how the diacritic displays when used for output, I'm leaning toward saying its display is 'correct', or at least as 'correct' as it can be made, given that it seems to intentionally 'combine' / 'overlay' with the following character. #1421 (the PR actually used for the screenshot - note the 'zwnj' key) doesn't fix this particular case perfectly... at least not yet. Probably something due to the diacritic's nature.

jahorton · 2018-12-13T02:57:13Z

And found a decent enough example for Android, using the cloud-default Thai keyboard (Thai Kedmanee):

Using emulated Android 5.0:

Before

After

While the diacritics did display in the "before" sample, note that they weren't properly aligned within the key - they were effectively being joined to an empty "previous character" of some sort by the renderer, and thus reported text width of zero.

While the keyboard doesn't display properly on Android 4.4 due to not using an SVG font, it amusingly does attempt to use the same solution via font fallback:

The classic Unicode circle does not appear on master, so the solution is clearly attempting to be applied, even while the Thai-specific characters aren't rendering!

jahorton · 2018-12-13T03:07:29Z

From the current version of Safari on macOS Mojave, using Thai Kedmanee:

Before

After

jahorton · 2018-12-13T03:14:18Z

Unfortunately, I can't use the same test for IE. Unlike the others... it appears that its renderer automatically adds \u25cc before the fix.

mcdurdin · 2018-12-19T02:07:30Z

web/source/kmwosk.ts

+    static getTextWidth(text: string, font: string) {
+      // re-use canvas object for better performance
+      var canvas = OSKKey.getTextWidth['canvas'] || (OSKKey.getTextWidth['canvas'] = document.createElement("canvas"));
+      var context = canvas.getContext("2d");


Is it possible and/or desirable to cache context as well?

The code example I drew from didn't seem to think so.

[Web] Keyboard text auto-scaling

keyman-server · 2018-12-19T02:40:50Z

OSK renders for Windows

jahorton added 2 commits December 7, 2018 14:24

Adds a base dotted circle to otherwise undisplayed diacritic key caps.

bcf5e57

Wires in the keyboard's specified visual format font.

6f672c2

jahorton added bug web/ android/ ios/ labels Dec 7, 2018

jahorton added this to the P4S12 milestone Dec 7, 2018

mcdurdin requested changes Dec 9, 2018

View reviewed changes

Fixes a few PR comment issues.

228d85f

mcdurdin mentioned this pull request Dec 11, 2018

Solve problem with rendering diacritics on OSK key caps #1070

Closed

jahorton added 7 commits December 12, 2018 13:00

Fixes key previews, starts dynamic adjustment of key cap font sizing.

c805551

Finishes tweaking key previews.

caee038

Addresses standard key scaling, but runs into code ordering issue.

5957db8

Reworks keyboard font scaling to facilitate key cap scaling.

6215145

Tidies up all the documentation and intermediate notes.

e16c1a7

Oh yeah, history.md.

12fd313

Tidies up a few loose ends.

6984709

jahorton mentioned this pull request Dec 13, 2018

[Web] Keyboard text auto-scaling #1421

Merged

jahorton changed the base branch from web-osk-key-refactor to master December 17, 2018 04:06

Implements test keyboard and fix for 'undefined' font issues.

2c30633

darcywong00 mentioned this pull request Dec 17, 2018

[khmer_angkor] The Subscripts in the Long Press Disappear in iOS11 keymanapp/keyboards#436

Closed

jahorton added 2 commits December 18, 2018 09:19

Adds fallback behavior for missing font size in calculations.

2a4ef5a

Missed a keycap scaling factor for embedded mode.

5bfc521

Addresses PR review comment.

2eb5541

mcdurdin reviewed Dec 19, 2018

View reviewed changes

mcdurdin approved these changes Dec 19, 2018

View reviewed changes

jahorton added 3 commits December 19, 2018 09:28

History.md tweak.

7a98514

Merge pull request #1421 from keymanapp/web-382-keycap-scaling

85c286d

[Web] Keyboard text auto-scaling

Merge branch 'master' into web-1070-diacritic-display

5a1c86b

jahorton merged commit ce0da4f into master Dec 19, 2018

jahorton deleted the web-1070-diacritic-display branch December 19, 2018 02:38

jahorton mentioned this pull request Apr 29, 2020

[iOS] Web-based popup key issues #2990

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Web, iOS, Android] Undisplayed diacritic fix #1407

[Web, iOS, Android] Undisplayed diacritic fix #1407

jahorton commented Dec 7, 2018 •

edited

Loading

rfaramir commented Dec 7, 2018

mcdurdin left a comment

mcdurdin Dec 9, 2018

jahorton Dec 11, 2018

mcdurdin Dec 9, 2018

jahorton commented Dec 11, 2018 •

edited

Loading

jahorton commented Dec 11, 2018

jahorton commented Dec 13, 2018 •

edited

Loading

jahorton commented Dec 13, 2018

jahorton commented Dec 13, 2018

jahorton commented Dec 13, 2018

mcdurdin Dec 19, 2018

jahorton Dec 19, 2018

keyman-server commented Dec 19, 2018

[Web, iOS, Android] Undisplayed diacritic fix #1407

[Web, iOS, Android] Undisplayed diacritic fix #1407

Conversation

jahorton commented Dec 7, 2018 • edited Loading

rfaramir commented Dec 7, 2018

mcdurdin left a comment

Choose a reason for hiding this comment

mcdurdin Dec 9, 2018

Choose a reason for hiding this comment

jahorton Dec 11, 2018

Choose a reason for hiding this comment

mcdurdin Dec 9, 2018

Choose a reason for hiding this comment

jahorton commented Dec 11, 2018 • edited Loading

jahorton commented Dec 11, 2018

jahorton commented Dec 13, 2018 • edited Loading

jahorton commented Dec 13, 2018

jahorton commented Dec 13, 2018

jahorton commented Dec 13, 2018

mcdurdin Dec 19, 2018

Choose a reason for hiding this comment

jahorton Dec 19, 2018

Choose a reason for hiding this comment

keyman-server commented Dec 19, 2018

jahorton commented Dec 7, 2018 •

edited

Loading

jahorton commented Dec 11, 2018 •

edited

Loading

jahorton commented Dec 13, 2018 •

edited

Loading