From 22fb9257430e5a8bee44c21af1c35a217efd620b Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 30 Sep 2019 16:04:06 +0100 Subject: [PATCH 1/2] Stop using deprecated KeyboardEvent properties Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/Keyboard.js | 12 +++++++++++- src/components/structures/LoggedInView.js | 18 ++++++++++-------- 2 files changed, 21 insertions(+), 9 deletions(-) diff --git a/src/Keyboard.js b/src/Keyboard.js index fb7d692ce3..c7de04f454 100644 --- a/src/Keyboard.js +++ b/src/Keyboard.js @@ -58,7 +58,17 @@ export const KeyCode = { KEY_X: 88, KEY_Y: 89, KEY_Z: 90, - KEY_BACKTICK: 223, + KEY_BACKTICK: 223, // DO NOT USE THIS: browsers disagree on backtick 192 vs 223 +}; + +export const Key = { + HOME: "Home", + End: "End", + PAGE_UP: "PageUp", + PAGE_DOWN: "PageDown", + BACKTICK: "`", + + K: "k", }; export function isOnlyCtrlOrCmdKeyEvent(ev) { diff --git a/src/components/structures/LoggedInView.js b/src/components/structures/LoggedInView.js index bcbf9f8155..5529fb8f32 100644 --- a/src/components/structures/LoggedInView.js +++ b/src/components/structures/LoggedInView.js @@ -22,7 +22,7 @@ import createReactClass from 'create-react-class'; import PropTypes from 'prop-types'; import { DragDropContext } from 'react-beautiful-dnd'; -import { KeyCode, isOnlyCtrlOrCmdKeyEvent } from '../../Keyboard'; +import { Key, isOnlyCtrlOrCmdKeyEvent } from '../../Keyboard'; import PageTypes from '../../PageTypes'; import CallMediaHandler from '../../CallMediaHandler'; import { fixupColorFonts } from '../../utils/FontManager'; @@ -353,23 +353,23 @@ const LoggedInView = createReactClass({ const hasModifier = ev.altKey || ev.ctrlKey || ev.metaKey || ev.shiftKey || ev.key === "Alt" || ev.key === "Control" || ev.key === "Meta" || ev.key === "Shift"; - switch (ev.keyCode) { - case KeyCode.PAGE_UP: - case KeyCode.PAGE_DOWN: + switch (ev.key) { + case Key.PAGE_UP: + case Key.PAGE_DOWN: if (!hasModifier) { this._onScrollKeyPressed(ev); handled = true; } break; - case KeyCode.HOME: - case KeyCode.END: + case Key.HOME: + case Key.END: if (ev.ctrlKey && !ev.shiftKey && !ev.altKey && !ev.metaKey) { this._onScrollKeyPressed(ev); handled = true; } break; - case KeyCode.KEY_K: + case Key.K: if (ctrlCmdOnly) { dis.dispatch({ action: 'focus_room_filter', @@ -377,7 +377,9 @@ const LoggedInView = createReactClass({ handled = true; } break; - case KeyCode.KEY_BACKTICK: + case Key.BACKTICK: + if (ev.key !== "`") break; + // Ideally this would be CTRL+P for "Profile", but that's // taken by the print dialog. CTRL+I for "Information" // was previously chosen but conflicted with italics in From 2621ad1b43cf4b6129d3611eaadc063518d8a225 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 30 Sep 2019 16:04:43 +0100 Subject: [PATCH 2/2] Group room tiles in room sub list in the room list for ARIA Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/RoomSubList.js | 8 ++++---- src/components/views/elements/AccessibleButton.js | 2 +- src/components/views/rooms/RoomList.js | 2 +- src/components/views/rooms/RoomTile.js | 15 +++++++++++++++ src/i18n/strings/en_EN.json | 3 +++ 5 files changed, 24 insertions(+), 6 deletions(-) diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index 5a90beb06f..f1057819ff 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -307,11 +307,11 @@ const RoomSubList = createReactClass({ }); if (isCollapsed) { - return
+ return
{this._getHeaderJsx(isCollapsed)}
; } else if (this._canUseLazyListRendering()) { - return
+ return
{this._getHeaderJsx(isCollapsed)} this.makeRoomTile(r)); const tiles = roomTiles.concat(this.props.extraTiles); - return
+ return
{this._getHeaderJsx(isCollapsed)} { tiles } @@ -340,7 +340,7 @@ const RoomSubList = createReactClass({ } return ( -
+
{ this._getHeaderJsx(isCollapsed) } { content }
diff --git a/src/components/views/elements/AccessibleButton.js b/src/components/views/elements/AccessibleButton.js index a43e2ff26a..bfc3e45246 100644 --- a/src/components/views/elements/AccessibleButton.js +++ b/src/components/views/elements/AccessibleButton.js @@ -68,7 +68,7 @@ export default function AccessibleButton(props) { delete restProps.inputRef; restProps.tabIndex = restProps.tabIndex || "0"; - restProps.role = "button"; + restProps.role = restProps.role || "button"; restProps.className = (restProps.className ? restProps.className + " " : "") + "mx_AccessibleButton"; if (kind) { diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js index da2d11f34b..6c031563cd 100644 --- a/src/components/views/rooms/RoomList.js +++ b/src/components/views/rooms/RoomList.js @@ -805,7 +805,7 @@ module.exports = createReactClass({ const subListComponents = this._mapSubListProps(subLists); return ( -
{ subListComponents }
diff --git a/src/components/views/rooms/RoomTile.js b/src/components/views/rooms/RoomTile.js index 2ec5384b93..a7ba744e47 100644 --- a/src/components/views/rooms/RoomTile.js +++ b/src/components/views/rooms/RoomTile.js @@ -33,6 +33,7 @@ import AccessibleButton from '../elements/AccessibleButton'; import ActiveRoomObserver from '../../../ActiveRoomObserver'; import RoomViewStore from '../../../stores/RoomViewStore'; import SettingsStore from "../../../settings/SettingsStore"; +import {_t} from "../../../languageHandler"; module.exports = createReactClass({ displayName: 'RoomTile', @@ -368,6 +369,8 @@ module.exports = createReactClass({ const RoomAvatar = sdk.getComponent('avatars.RoomAvatar'); + let ariaLabel = name; + let dmIndicator; if (this._isDirectMessageRoom(this.props.room.roomId)) { dmIndicator = ; } + if (notifBadges && mentionBadges && !isInvite) { + ariaLabel += " " + _t("It has %(count)s unread messages including mentions.", { + count: notificationCount, + }); + } else if (notifBadges) { + ariaLabel += " " + _t("It has %(count)s unread messages.", { count: notificationCount }); + } else if (mentionBadges && !isInvite) { + ariaLabel += " " + _t("It has unread mentions."); + } + return
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index c23cd6d324..a03b654a3e 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -949,6 +949,9 @@ "Securely back up your keys to avoid losing them. Learn more.": "Securely back up your keys to avoid losing them. Learn more.", "Not now": "Not now", "Don't ask me again": "Don't ask me again", + "It has %(count)s unread messages including mentions.|other": "It has %(count)s unread messages including mentions.", + "It has %(count)s unread messages.|other": "It has %(count)s unread messages.", + "It has unread mentions.": "It has unread mentions.", "Add a topic": "Add a topic", "Upgrading this room will shut down the current instance of the room and create an upgraded room with the same name.": "Upgrading this room will shut down the current instance of the room and create an upgraded room with the same name.", "This room has already been upgraded.": "This room has already been upgraded.",