From 1e232e455cfa75621264a0b90b783b21ebd5ea87 Mon Sep 17 00:00:00 2001 From: Nolan Lawson Date: Mon, 4 Nov 2019 04:03:09 -0800 Subject: [PATCH] fix: support KaiOS arrow navigation on public pages (#12251) --- .../mastodon/load_keyboard_extensions.js | 16 ++++++++++++++++ app/javascript/packs/public.js | 10 +++++++--- package.json | 1 + yarn.lock | 5 +++++ 4 files changed, 29 insertions(+), 3 deletions(-) create mode 100644 app/javascript/mastodon/load_keyboard_extensions.js diff --git a/app/javascript/mastodon/load_keyboard_extensions.js b/app/javascript/mastodon/load_keyboard_extensions.js new file mode 100644 index 000000000..2dd0e45fa --- /dev/null +++ b/app/javascript/mastodon/load_keyboard_extensions.js @@ -0,0 +1,16 @@ +// On KaiOS, we may not be able to use a mouse cursor or navigate using Tab-based focus, so we install +// special left/right focus navigation keyboard listeners, at least on public pages (i.e. so folks +// can at least log in using KaiOS devices). + +function importArrowKeyNavigation() { + return import(/* webpackChunkName: "arrow-key-navigation" */ 'arrow-key-navigation'); +} + +export default function loadKeyboardExtensions() { + if (/KAIOS/.test(navigator.userAgent)) { + return importArrowKeyNavigation().then(arrowKeyNav => { + arrowKeyNav.register(); + }); + } + return Promise.resolve(); +} diff --git a/app/javascript/packs/public.js b/app/javascript/packs/public.js index ed713f335..6a7f8831d 100644 --- a/app/javascript/packs/public.js +++ b/app/javascript/packs/public.js @@ -2,6 +2,7 @@ import escapeTextContentForBrowser from 'escape-html'; import loadPolyfills from '../mastodon/load_polyfills'; import ready from '../mastodon/ready'; import { start } from '../mastodon/common'; +import loadKeyboardExtensions from '../mastodon/load_keyboard_extensions'; start(); @@ -259,6 +260,9 @@ function main() { }); } -loadPolyfills().then(main).catch(error => { - console.error(error); -}); +loadPolyfills() + .then(main) + .then(loadKeyboardExtensions) + .catch(error => { + console.error(error); + }); diff --git a/package.json b/package.json index 8341ba228..62929ad0a 100644 --- a/package.json +++ b/package.json @@ -73,6 +73,7 @@ "@babel/runtime": "^7.5.4", "@clusterws/cws": "^0.15.2", "array-includes": "^3.0.3", + "arrow-key-navigation": "^1.0.2", "autoprefixer": "^9.6.1", "axios": "^0.19.0", "babel-loader": "^8.0.6", diff --git a/yarn.lock b/yarn.lock index c9bd6ae74..35eb1ec33 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1657,6 +1657,11 @@ arrify@^1.0.1: resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d" integrity sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0= +arrow-key-navigation@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/arrow-key-navigation/-/arrow-key-navigation-1.0.2.tgz#c1b5886240819db6c0b2b84702de1313786ce53e" + integrity sha512-Wj67sJpfK7vrj0/aOstIsRMsUQtpVODBTQDcRaDvvPZdzZMotj8oYGsEsoYiDohShDlDU6ywVkHLtXGH4TfEtQ== + asap@~2.0.3: version "2.0.6" resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"