fix(a11y) fix ambiguous label on toggle buttons

This commit is contained in:
Emmanuel Pelletier 2022-10-20 11:51:36 +02:00
parent 9f101ca55e
commit e03dad140b
14 changed files with 63 additions and 146 deletions

View File

@ -1085,11 +1085,20 @@
"cc": "Toggle subtitles",
"chat": "Open / Close chat",
"clap": "Clap",
"closeChat": "Close chat",
"closeMoreActions": "Close more actions menu",
"closeParticipantsPane": "Close participants pane",
"collapse": "Collapse",
"document": "Toggle shared document",
"documentClose": "Close shared document",
"documentOpen": "Open shared document",
"download": "Download our apps",
"embedMeeting": "Embed meeting",
"endConference": "End meeting for all",
"enterFullScreen": "View full screen",
"enterTileView": "Enter tile view",
"exitFullScreen": "Exit full screen",
"exitTileView": "Exit tile view",
"expand": "Expand",
"feedback": "Leave feedback",
"fullScreen": "Toggle full screen",
@ -1097,6 +1106,7 @@
"grantModerator": "Grant Moderator Rights",
"hangup": "Leave the meeting",
"help": "Help",
"hideWhiteboard": "Hide whiteboard",
"invite": "Invite people",
"kick": "Kick participant",
"laugh": "Laugh",
@ -1106,21 +1116,23 @@
"lobbyButton": "Enable/disable lobby mode",
"localRecording": "Toggle local recording controls",
"lockRoom": "Toggle meeting password",
"lowerHand": "Lower your hand",
"moreActions": "More actions",
"moreActionsMenu": "More actions menu",
"moreOptions": "Show more options",
"mute": "Mute / Unmute",
"mute": "Mute",
"muteEveryone": "Mute everyone",
"muteEveryoneElse": "Mute everyone else",
"muteEveryoneElsesVideoStream": "Stop everyone else's video",
"muteEveryonesVideoStream": "Stop everyone's video",
"noiseSuppression": "Noise suppression",
"participants": "Participants",
"openChat": "Open chat",
"participants": "Open participants pane",
"pip": "Toggle Picture-in-Picture mode",
"privateMessage": "Send private message",
"profile": "Edit your profile",
"raiseHand": "Raise / Lower your hand",
"reactionsMenu": "Open / Close reactions menu",
"raiseHand": "Raise your hand",
"reactionsMenu": "Reactions menu",
"recording": "Toggle recording",
"remoteMute": "Mute participant",
"remoteVideoMute": "Disable camera of participant",
@ -1128,20 +1140,24 @@
"selectBackground": "Select Background",
"selfView": "Toggle self view",
"shareRoom": "Invite someone",
"shareYourScreen": "Start / Stop sharing your screen",
"shareYourScreen": "Start sharing your screen",
"shareaudio": "Share audio",
"sharedvideo": "Toggle video sharing",
"sharedvideo": "Share video",
"shortcuts": "Toggle shortcuts",
"show": "Show on stage",
"showWhiteboard": "Show whiteboard",
"silence": "Silence",
"speakerStats": "Toggle participants statistics",
"stopScreenSharing": "Stop sharing your screen",
"stopSharedVideo": "Stop video",
"surprised": "Surprised",
"tileView": "Toggle tile view",
"toggleCamera": "Toggle camera",
"toggleFilmstrip": "Toggle filmstrip",
"unmute": "Unmute",
"videoblur": "Toggle video blur",
"videomute": "Start / Stop camera",
"whiteboard": "Show / Hide whiteboard"
"videomute": "Stop camera",
"videounmute": "Start camera"
},
"addPeople": "Add people to your call",
"audioOnlyOff": "Disable low bandwidth mode",
@ -1154,6 +1170,7 @@
"chat": "Open / Close chat",
"clap": "Clap",
"closeChat": "Close chat",
"closeParticipantsPane": "Close participants pane",
"closeReactionsMenu": "Close reactions menu",
"disableNoiseSuppression": "Disable noise suppression",
"disableReactionSounds": "You can disable reaction sounds for this meeting",
@ -1186,7 +1203,7 @@
"lowerYourHand": "Lower your hand",
"moreActions": "More actions",
"moreOptions": "More options",
"mute": "Mute / Unmute",
"mute": "Mute",
"muteEveryone": "Mute everyone",
"muteEveryonesVideo": "Disable everyone's camera",
"noAudioSignalDesc": "If you did not purposely mute it from system settings or hardware, consider switching the device.",
@ -1203,7 +1220,7 @@
"pip": "Enter Picture-in-Picture mode",
"privateMessage": "Send private message",
"profile": "Edit your profile",
"raiseHand": "Raise / Lower your hand",
"raiseHand": "Raise your hand",
"raiseYourHand": "Raise your hand",
"reactionBoo": "Send boo reaction",
"reactionClap": "Send clap reaction",
@ -1230,8 +1247,10 @@
"talkWhileMutedPopup": "Trying to speak? You are muted.",
"tileViewToggle": "Toggle tile view",
"toggleCamera": "Toggle camera",
"unmute": "Unmute",
"videoSettings": "Video settings",
"videomute": "Start / Stop camera"
"videomute": "Stop camera",
"videounmute": "Start camera"
},
"transcribing": {
"ccButtonTooltip": "Start / Stop subtitles",

View File

@ -24,30 +24,13 @@ type Props = AbstractButtonProps & {
* Implementation of a button for accessing chat pane.
*/
class ChatButton extends AbstractButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.chat';
accessibilityLabel = 'toolbar.accessibilityLabel.openChat';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.closeChat';
icon = IconMessage;
label = 'toolbar.openChat';
toggledLabel = 'toolbar.closeChat';
/**
* Retrieves tooltip dynamically.
*/
get tooltip() {
if (this._isToggled()) {
return 'toolbar.closeChat';
}
return 'toolbar.openChat';
}
/**
* Required by linter due to AbstractButton overwritten prop being writable.
*
* @param {string} _value - The value.
*/
set tooltip(_value) {
// Unused.
}
tooltip = 'toolbar.openChat';
toggledTooltip = 'toolbar.closeChat';
/**
* Indicates whether this button is in toggled state or not.

View File

@ -27,30 +27,13 @@ type Props = AbstractButtonProps & {
* Implements an {@link AbstractButton} to open the chat screen on mobile.
*/
class SharedDocumentButton extends AbstractButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.document';
accessibilityLabel = 'toolbar.accessibilityLabel.documentOpen';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.documentClose';
icon = IconShareDoc;
label = 'toolbar.documentOpen';
toggledLabel = 'toolbar.documentClose';
/**
* Dynamically retrieves tooltip based on sharing state.
*/
get tooltip() {
if (this._isToggled()) {
return 'toolbar.documentClose';
}
return 'toolbar.documentOpen';
}
/**
* Required by linter due to AbstractButton overwritten prop being writable.
*
* @param {string} _value - The value.
*/
set tooltip(_value) {
// Unused.
}
tooltip = 'toolbar.documentOpen';
toggledTooltip = 'toolbar.documentClose';
/**
* Handles clicking / pressing the button, and opens / closes the appropriate dialog.

View File

@ -24,9 +24,11 @@ type Props = AbstractButtonProps & {
*/
class ParticipantsPaneButton extends AbstractButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.participants';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.closeParticipantsPane';
icon = IconUsers;
label = 'toolbar.participants';
tooltip = 'toolbar.participants';
toggledTooltip = 'toolbar.closeParticipantsPane';
/**
* Indicates whether this button is in toggled state or not.

View File

@ -21,25 +21,12 @@ type Props = AbstractButtonProps & {
*/
class RaiseHandButton extends AbstractButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.raiseHand';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.lowerHand';
icon = IconRaiseHand;
label = 'toolbar.raiseHand';
toggledLabel = 'toolbar.raiseHand';
/**
* Retrieves tooltip dynamically.
*/
get tooltip() {
return 'toolbar.raiseHand';
}
/**
* Required by linter due to AbstractButton overwritten prop being writable.
*
* @param {string} _value - The value.
*/
set tooltip(_value) {
// Unused.
}
toggledLabel = 'toolbar.lowerYourHand';
tooltip = 'toolbar.raiseHand';
toggledTooltip = 'toolbar.lowerYourHand';
/**
* Indicates whether this button is in toggled state or not.

View File

@ -35,29 +35,12 @@ type Props = AbstractButtonProps & {
*/
class SharedVideoButton extends AbstractButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.sharedvideo';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.stopSharedVideo';
icon = IconPlay;
label = 'toolbar.sharedvideo';
toggledLabel = 'toolbar.stopSharedVideo';
/**
* Dynamically retrieves tooltip based on sharing state.
*/
get tooltip() {
if (this._isToggled()) {
return 'toolbar.stopSharedVideo';
}
return 'toolbar.sharedvideo';
}
/**
* Required by linter due to AbstractButton overwritten prop being writable.
*
* @param {string} _value - The icon value.
*/
set tooltip(_value) {
// Unused.
}
tooltip = 'toolbar.sharedvideo';
toggledTooltip = 'toolbar.stopSharedVideo';
/**
* Handles clicking / pressing the button, and opens a new dialog.

View File

@ -46,8 +46,10 @@ type Props = AbstractButtonProps & {
*/
class AudioMuteButton extends AbstractAudioMuteButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.mute';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.unmute';
label = 'toolbar.mute';
tooltip = 'toolbar.mute';
toggledTooltip = 'toolbar.unmute';
/**
* Initializes a new {@code AudioMuteButton} instance.

View File

@ -47,8 +47,10 @@ type Props = AbstractButtonProps & {
*/
class VideoMuteButton extends AbstractVideoMuteButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.videomute';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.videounmute';
label = 'toolbar.videomute';
tooltip = 'toolbar.videomute';
toggledTooltip = 'toolbar.videounmute';
/**
* Initializes a new {@code VideoMuteButton} instance.

View File

@ -17,9 +17,12 @@ type Props = AbstractButtonProps & {
* Implementation of a button for toggling fullscreen state.
*/
class FullscreenButton extends AbstractButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.fullScreen';
accessibilityLabel = 'toolbar.accessibilityLabel.enterFullScreen';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.exitFullScreen';
label = 'toolbar.enterFullScreen';
toggledLabel = 'toolbar.exitFullScreen';
tooltip = 'toolbar.enterFullScreen';
toggledTooltip = 'toolbar.exitFullScreen';
/**
* Retrieves icon dynamically.
@ -41,26 +44,6 @@ class FullscreenButton extends AbstractButton<Props, *> {
// Unused.
}
/**
* Retrieves icon dynamically.
*/
get tooltip() {
if (this._isToggled()) {
return 'toolbar.exitFullScreen';
}
return 'toolbar.enterFullScreen';
}
/**
* Required by linter due to AbstractButton overwritten prop being writable.
*
* @param {string} _value - The value.
*/
set tooltip(_value) {
// Unused.
}
/**
* Indicates whether this button is in toggled state or not.
*

View File

@ -30,24 +30,9 @@ class HangupToggleButton extends AbstractButton<Props, any, any> {
label = 'toolbar.hangup';
toggledIcon = IconCloseLarge;
toggledLabel = 'toolbar.hangup';
tooltip = 'toolbar.hangup';
props: Props;
/**
* Retrieves tooltip dynamically.
*/
get tooltip() {
return 'toolbar.hangup';
}
/**
* Required by linter due to AbstractButton overwritten prop being writable.
*
* @param {string} _value - The value.
*/
set tooltip(_value) {
// Unused.
}
/**
* Indicates whether this button is in toggled state or not.
*

View File

@ -26,25 +26,11 @@ type Props = AbstractButtonProps & {
*/
class OverflowToggleButton extends AbstractButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.moreActions';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.closeMoreActions';
icon = IconDotsHorizontal;
label = 'toolbar.moreActions';
toggledLabel = 'toolbar.moreActions';
/**
* Retrieves tooltip dynamically.
*/
get tooltip() {
return 'toolbar.moreActions';
}
/**
* Required by linter due to AbstractButton overwritten prop being writable.
*
* @param {string} _value - The value.
*/
set tooltip(_value) {
// Unused.
}
tooltip = 'toolbar.moreActions';
/**
* Indicates whether this button is in toggled state or not.

View File

@ -31,11 +31,11 @@ type Props = AbstractButtonProps & {
*/
class ShareDesktopButton extends AbstractButton<Props, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.shareYourScreen';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.stopScreenSharing';
label = 'toolbar.startScreenSharing';
icon = IconScreenshare;
toggledIcon = IconStopScreenshare;
toggledLabel = 'toolbar.stopScreenSharing';
tooltip = 'toolbar.accessibilityLabel.shareYourScreen';
/**
* Retrieves tooltip dynamically.

View File

@ -38,7 +38,8 @@ type Props = AbstractButtonProps & {
* @augments AbstractButton
*/
class TileViewButton<P: Props> extends AbstractButton<P, *> {
accessibilityLabel = 'toolbar.accessibilityLabel.tileView';
accessibilityLabel = 'toolbar.accessibilityLabel.enterTileView';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.exitTileView';
icon = IconTileView;
label = 'toolbar.enterTileView';
toggledLabel = 'toolbar.exitTileView';

View File

@ -27,7 +27,8 @@ type Props = AbstractButtonProps & {
* Component that renders a toolbar button for the whiteboard.
*/
class WhiteboardButton extends AbstractButton<Props, any, any> {
accessibilityLabel = 'toolbar.accessibilityLabel.whiteboard';
accessibilityLabel = 'toolbar.accessibilityLabel.showWhiteboard';
toggledAccessibilityLabel = 'toolbar.accessibilityLabel.hideWhiteboard';
icon = IconWhiteboard;
label = 'toolbar.showWhiteboard';
toggledIcon = IconWhiteboardHide;