chore: mid-sprint merge of master to staging for A18S16

.github/workflows/add-to-keyman-project.yml

@@ -0,0 +1,19 @@
+name: Add new issues and pull requests to projects
+
+on:
+  pull_request:
+    types:
+      - opened
+  issues:
+    types:
+      - opened
+
+jobs:
+  add-to-project:
+    name: Add new issues and pull requests to project
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/[email protected]
+        with:
+          project-url: https://github.com/orgs/keymanapp/projects/1
+          github-token: ${{ secrets.ADD_TO_PROJECT_PAT }}

_includes/2020/KeymanWebHost.php

@@ -0,0 +1,23 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Keyman\Site\com\keyman;
+
+class KeymanWebHost {
+  static function getKeymanWebUrlBase() {
+    global $KeymanHosts;
+    $json = @file_get_contents("{$KeymanHosts->api_keyman_com}/version/web");
+    if($json) {
+      $json = json_decode($json);
+    }
+    if($json && property_exists($json, 'version')) {
+      $build = $json->version;
+    } else {
+      // If the get-version API fails, we'll use the latest known stable version
+      $build = "17.0.332";
+    }
+
+    return "{$KeymanHosts->s_keyman_com}/kmw/engine/$build";
+  }
+}

_includes/includes/ui/keyboard-details.php

@@ -6,6 +6,7 @@
   require_once('includes/appstore.php');
 
   use \DateTime;
+  use \Keyman\Site\com\keyman\KeymanWebHost;
   use \Keyman\Site\Common\KeymanHosts;
 
   define('GITHUB_ROOT', 'https://github.com/keymanapp/keyboards/tree/master/');
@@ -67,7 +68,9 @@ public static function render_keyboard_details($id, $tier = 'stable', $landingPa
 
       self::LoadData();
       self::WriteTitle();
+      self::WriteDescription();
       self::WriteDownloadBoxes();
+      self::WriteKeymanWebBox();
       self::WriteKeyboardDetails();
       if(!empty(self::$deprecatedBy)) echo "</div></div>";
     }
@@ -119,11 +122,11 @@ protected static function download_box($platform) {
       }
     }
 
-    protected static function WriteWebBoxes() {
+    protected static function WriteWebBoxes($useDescription) {
       global $embed_target;
       global $KeymanHosts;
       if (isset(self::$keyboard->platformSupport->desktopWeb) && self::$keyboard->platformSupport->desktopWeb != 'none' && empty(self::$deprecatedBy)) {
-          if(empty(self::$bcp47)) {
+        if(empty(self::$bcp47)) {
           if (isset(self::$keyboard->languages)) {
             if (is_array(self::$keyboard->languages)) {
               if (count(self::$keyboard->languages) > 0) {
@@ -141,12 +144,19 @@ protected static function WriteWebBoxes() {
         }
         if (!isset($lang)) $lang = 'en';
         $url = "{$KeymanHosts->keymanweb_com}/#$lang,Keyboard_" . self::$keyboard->id;
-        $description = htmlentities(self::$keyboard->name);
-          return <<<END
+        if($useDescription) {
+          $description = htmlentities(self::$keyboard->name);
+          $description = "<div class=\"download-description\">Use $description in your web browser. No need to install anything.</div>";
+          $linktext = 'Use keyboard online';
+        } else {
+          $description = '';
+          $linktext = 'Full online editor';
+        }
+        return <<<END
           <div class="download download-web">
-          <a class="download-link" $embed_target href='$url'>Use keyboard online</a>
-          <div class="download-description">Use $description in your web browser. No need to install anything.</div>
-        </div>
+            <a class="download-link" $embed_target href='$url'>$linktext</a>
+            $description
+          </div>
 END;
       }
       return FALSE;
@@ -369,24 +379,95 @@ protected static function WriteDownloadBoxes() {
       }
 
       if ($embed == 'none') {
-        $webtext = self::WriteWebBoxes();
-        if ($webtext) {
-          echo $webtext;
+        if(self::GetWebDeviceFromPageDevice() == null) {
+          $webtext = self::WriteWebBoxes(true);
+          if ($webtext) {
+            // If we have a web keyboard, and we are not embedded, and this is a
+            // mobile device, then show the link to keymanweb.com
+            echo $webtext;
+          }
         }
-
         if(empty(self::$deprecatedBy)) {
           self::WriteQRCode('other');
         }
       }
     }
 
+    protected static function GetWebDeviceFromPageDevice() {
+      global $pageDevice;
+      switch($pageDevice) {
+        case 'Windows': return 'windows';
+        case 'mac':     return 'macosx';
+        case 'Linux':   return 'linux';
+      }
+      return null;
+    }
+
+    protected static function WriteKeymanWebBox() {
+      global $embed;
+
+      // don't show if we are embedded into a Keyman app
+      if($embed != 'none') {
+        return;
+      }
+
+      // only show if we have a web keyboard and we are not deprecated
+      if(!isset(self::$keyboard->platformSupport->desktopWeb) ||
+          self::$keyboard->platformSupport->desktopWeb == 'none' ||
+          !empty(self::$deprecatedBy)) {
+        return;
+      }
+
+      // only inject on desktop platforms
+      $webDevice = self::GetWebDeviceFromPageDevice();
+      if(!$webDevice) {
+        return;
+      }
+
+      $webtext = self::WriteWebBoxes(false);
+      $cdnUrlBase = KeymanWebHost::getKeymanWebUrlBase();
+      ?>
+        <h2 id='try-header' class='red underline'>Try this keyboard</h2>
+        <div id='try-box'>
+          <input type='text' id='try-keyboard'>
+          <div id='osk-host'></div>
+          <div id='try-keymanweb-link'><?= $webtext ?></div>
+        </div>
+        <script src='<?=$cdnUrlBase?>/keymanweb.js'></script>
+        <script>
+          (function() {
+            keyman.init({attachType:'manual'}).then(
+              function() {
+                keyman.attachToControl(document.getElementById('try-keyboard'));
+
+                // Create a new on screen keyboard view and tell KeymanWeb that
+                // we are using the targetDevice for context input.
+                const targetDevice = {
+                  browser: 'chrome', formFactor: 'desktop', OS: '<?=$webDevice?>',
+                  touchable: false, dimensions: [640, 300] };
+                newOSK = new keyman.views.InlinedOSKView(keyman, { device: targetDevice });  // Note: KeymanWeb internal API
+                keyman.core.contextDevice = targetDevice;  // Note: KeymanWeb internal API
+                keyman.osk = newOSK;  // Note: undocumented KeymanWeb API
+                newOSK.setSize(targetDevice.dimensions[0]+'px', targetDevice.dimensions[1]+'px');
+                document.getElementById('osk-host').appendChild(newOSK.element);
+              }
+            );
+            keyman.addKeyboards('<?= self::$id ?>');
+          })();
+        </script>
+      <?php
+    }
+
+    protected static function WriteDescription() {
+      echo "<p>" . self::$description . "</p>";
+    }
+
     protected static function WriteKeyboardDetails() {
       global $embed_target, $session_query_q, $KeymanHosts;
 
       // this is html, trusted in database
       ?>
       <h2 class='red underline'>Keyboard Details</h2>
-      <p><?= self::$description ?></p>
       <div class='cols' id='keyboard-details-col'>
         <div class='col'>
 
@@ -518,11 +599,13 @@ protected static function WriteKeyboardDetails() {
                         echo " <a id='expand-languages' href='#expand-languages'>Expand $count more &gt;&gt;</a>";
                         echo "<a id='collapse-languages' href='#collapse-languages'>&lt;&lt; Collapse</a> <span class='expand-languages'>";
                       }
-                      echo
-                        "<a href='/keyboards?q=l:id:".htmlspecialchars(rawurlencode($bcp47)).
-                        "' title='".htmlspecialchars($bcp47).": ".htmlspecialchars($detail->displayName)."'>" .
-                        (!strcasecmp($bcp47, self::$bcp47) ? "<mark>".htmlspecialchars($detail->languageName)."</mark>" : htmlspecialchars($detail->languageName)).
-                        "</a> ";
+                      if (property_exists($detail, 'languageName')) {
+                        echo
+                          "<a href='/keyboards?q=l:id:".htmlspecialchars(rawurlencode($bcp47)).
+                          "' title='".htmlspecialchars($bcp47).": ".htmlspecialchars($detail->displayName)."'>" .
+                          (!strcasecmp($bcp47, self::$bcp47) ? "<mark>".htmlspecialchars($detail->languageName)."</mark>" : htmlspecialchars($detail->languageName)).
+                          "</a> ";
+                      }
                       $n++;
                     }
                     if($n >= 3) {

cdn/dev/keyboard-search/search.css

@@ -314,6 +314,44 @@ p#permalink {
   font-size: 8pt;
 }
 
+/* Try this keyboard */
+
+#try-box {
+  display: none;
+  margin: 0px 0px 16px 16px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+html[data-platform~='windows linux macos'] #try-header,
+html[data-platform~='windows linux macos'] #try-box {
+  display: block;
+}
+
+#try-keyboard {
+  font-size: 1.5em;
+  width: 632px;
+  height: 44px;
+  margin: 0 auto 8px auto;
+  display: block;
+}
+
+#osk-host {
+  width: 640px;
+  height: 300px;
+}
+
+#osk-host .kmw-key-square {
+  /* Note: this is a hack to override the incorrect z-index that KMW is using for embedded OSK */
+  z-index: auto;
+}
+
+#try-keymanweb-link {
+  margin-top: 8px;
+  display: block;
+}
+
 /* Download boxes */
 
 .download {

developer/keymanweb/index.php

@@ -2,6 +2,7 @@
   require_once('includes/template.php');
   require_once __DIR__ . '/../../_includes/autoload.php';
   use Keyman\Site\Common\KeymanHosts;
+  use Keyman\Site\com\keyman\KeymanWebHost;
 
   // Required
   head([
@@ -10,18 +11,7 @@
     'showMenu' => true
   ]);
 
-  $json = @file_get_contents("{$KeymanHosts->api_keyman_com}/version/web");
-  if($json) {
-    $json = json_decode($json);
-  }
-  if($json && property_exists($json, 'version')) {
-    $build = $json->version;
-  } else {
-    // If the get-version API fails, we'll use the latest known stable version
-    $build = "16.0.145";
-  }
-
-  $cdnUrlBase = "{$KeymanHosts->s_keyman_com}/kmw/engine/$build";
+  $cdnUrlBase = KeymanWebHost::getKeymanWebUrlBase();
 ?>
 <script src='<?=cdn('js/clipboard.min.js')?>'></script>
 <script src='<?=cdn('js/prism.js')?>'></script>
@@ -42,18 +32,15 @@
 &lt;script src='<?=$cdnUrlBase?>/keymanweb.js'&gt;&lt;/script&gt;
 &lt;script src='<?=$cdnUrlBase?>/kmwuitoggle.js'&gt;&lt;/script&gt;
 &lt;script&gt;
-  (function(kmw) {
-    kmw.init({attachType:'auto'});
-    kmw.addKeyboards('@en'); // Loads default English keyboard from Keyman Cloud (CDN)
-    kmw.addKeyboards('@th'); // Loads default Thai keyboard from Keyman Cloud (CDN)
-  })(keyman);
+  (function() {
+    keyman.init({attachType:'auto'});
+    keyman.addKeyboards('@en'); // Loads default English keyboard from Keyman Cloud (CDN)
+    keyman.addKeyboards('@th'); // Loads default Thai keyboard from Keyman Cloud (CDN)
+  })();
 &lt;/script&gt;
 </code></pre>
 </div>
 
-<p>Upgrade Note: with KeymanWeb <?= $stable_version; ?>, the unminified version is no longer served from our CDN.
-Instead, we use source maps to make the full source available in web developer tools.</p>
-
 <h3>Live Examples</h3>
 
 <ul>

go/.htaccess

@@ -8,7 +8,8 @@ RedirectMatch "/go/(([1-9][0-9])([.]?)([0-9]))/developer-help-(mobile|packages)(
 # Download redirects for keyboard permalinks (TODO: these three rules need refresh)
 
 # download-kmp
-RedirectMatch "/go/keyboard/([^/?]+)/download/kmp$" "/keyboards/download?id=$1&platform=windows&mode=standalone"
+# Modified to match download-package below
+RewriteRule "^keyboard/([^/]+)/download/kmp$" "package/download.php?type=keyboard&id=$1" [END,QSA]
 
 #download-exe
 RedirectMatch "/go/keyboard/([^/?]+)/download/exe$" "/keyboards/download?id=$1&platform=windows&mode=bundle"

keyboards/h/amharic/index.php

@@ -5,13 +5,13 @@
 
   // Required
   head([
-    'title' =>'Keyman for Amharic | አማርኛ ይጻፉ',
+    'title' =>'Amharic Keyboard for Keyman | አማርኛ ይጻፉ',
     'description' => 'Free and open source Amharic and Ethiopic keyboard layouts for Windows, macOS, Linux, Android, iOS and web',
     'css' => ['template.css','index.css'],
     'showMenu' => true
   ]);
 ?>
-<h2 class="red underline large">Keyman for Amharic | <span lang="am" class="lang-example large">አማርኛ ይጻፉ</span></h2>
+<h1 class="red underline large">Amharic Keyboard for Keyman | <span lang="am" class="lang-example large">አማርኛ ይጻፉ</span></h1>
 <p>
   Type in Amharic on iPhone, iPad, Windows, macOS, Linux, and Android. Our Amharic keyboard works with Microsoft Word, Photoshop, Facebook, Twitter, email and thousands of other applications.
 </p>

keyboards/h/burmese/index.php

@@ -5,7 +5,7 @@
   use Keyman\Site\Common\KeymanHosts;
 
   $head_options = [
-    'title' =>'Burmese Keyboards',
+    'title' =>'Burmese Keyboards for Keyman',
     'description' => 'Free and open source Burmese (Myanmar) keyboard layouts for Windows, macOS, Linux, Android, iOS and web. Based on WinMyanmar and Myanmar3 layouts'
   ];
 
@@ -29,7 +29,7 @@
     <img title="Mandalay Hill 3 &mdash; Image Courtesy of Stefan Fussan" src="<?= cdn('img/Mandalay_Hill_3.jpg') ?>"
          id="photo" style='float:right; margin: 8px 0px 8px 24px; width: 50%' />
 
-    <h1 class="red">Burmese Keyboards</h1>
+    <h1 class="red">Burmese Keyboards for Keyman</h1>
     <p>Type Burmese in all your favourite applications from your own hardware keyboard.</p>
     <p>These <a href='http://www.unicode.org/standard/WhatIsUnicode.html'>Unicode</a>
       layouts run on Keyman for Windows in any Unicode compliant Windows application. They allow intuitive typing of Burmese-script languages.</p>

keyboards/h/cameroon/index.php

@@ -5,7 +5,7 @@
   use Keyman\Site\Common\KeymanHosts;
 
   $head_options = [
-    'title' =>'Cameroon Keyboards',
+    'title' =>'Cameroon Keyboards for Keyman',
     'description' => 'Free and open source Cameroon keyboard layouts for Windows, macOS, Linux, Android, iOS and web. Available for QWERTY (US) and AZERTY (French) layouts.'
   ];
 
@@ -29,7 +29,7 @@
     <img title="Mont Mbapit14 &mdash; Image Courtesy of Noel Coston" src="<?= cdn('img/Mont_Mbapit14.jpg') ?>"
          id="photo" style='float:right; margin: 8px 0px 8px 24px; width: 50%' />
 
-    <h1 class="red underline">Cameroon Keyboards</h1>
+    <h1 class="red underline">Cameroon Keyboards for Keyman</h1>
 
     <p>
       Choose from our selection of Cameroon keyboards to match your physical hardware: QWERTY (US Keyboard) or AZERTY (French Keyboard).<br/><br/>

keyboards/h/greek/index.php

@@ -5,7 +5,7 @@
   use Keyman\Site\Common\KeymanHosts;
 
   $head_options = [
-    'title' =>'Classical Greek Keyboards',
+    'title' =>'Classical Greek Keyboards for Keyman',
     'description' => 'Free and open source Classical (Biblical) and Polytonic Greek keyboard layouts for Windows, macOS, Linux, Android, iOS and web.'
   ];
 
@@ -149,7 +149,7 @@
 
 </style>
 
-<h2 class="red underline">Classical Greek Keyboards</h2>
+<h1 class="red underline">Classical Greek Keyboards for Keyman</h1>
 <p class='info'>
   Need to type in Biblical or Classical Greek? Choose from our selection of Polytonic Greek keyboards. These
   <a href='http://www.unicode.org/standard/WhatIsUnicode.html' target='_blank'>Unicode</a> keyboards run on Keyman for Windows in any Unicode Windows application.