Feature: Keyboard shortcuts - cockpit-project/cockpit GitHub Wiki

Links

Purpose

Allow people to quickly and easily navigate Cockpit without using a mouse.

Audience

This serves two audiences:

  1. Improve accessibility for those who have motor control issues
    • not everyone can use a mouse effectively or easily
    • anyone can easily injure their wrist or fingers — or perhaps might've cut their mouse clicking finger instead of a carrot while making dinner
  2. Optimize cockpit for administrators who often use their keyboard more than their mouse
    • our audience has a higher percentage of people who use command prompts, vim, emacs, and rely on keyboard shortcuts in applications and desktop environments

Challanges

  • Cross-platform issues (command versus control on Macs)
  • OS / Desktop / Browser keyboard grabbing (some hotkeys are reserved)

Goals

  • Familiarity
    • try to rely on shortcuts that are similar to desktop applications when possible — sometimes these can be the same exact shortcuts, but other times, due to challenges above, they might have to be only similar
  • Memorability
    • Shortcuts should be tested, feel natural, and easy to remember
  • Access all of Cockpit via the keyboard in a non-convoluted way
    • That is, one shouldn't have to tab around to everything; some parts of Cockpit should have specific hotkeys

Proposed keyboard shortcuts

  • Alt-Esc: Task killer
  • ???: Navigation
  • ???: Host selector
  • ???: Header bar
  • ???: Top-left menu
  • ???: Dashboard
  • ???: Sign out

(Please add more here)

Decided-upon keyboard shortcuts

These shortcuts should be tested across supported platforms (OS & Browser) and agreed upon by the team.

  • ...

(There's nothing yet. TBD)

Implementation

  1. Figure out keyboard shortcuts for important parts of Cockpit (not everything will have a shortcut, but it should be possible to get to all parts of Cockpit with the keyboard, often with a shortcut and tabbing around and/or arrow keys)
  2. Common way to register keyboard shortcuts
  3. Keyboard shortcut dialog
    • Displays available keyboard shortcuts
    • Should have its own shortcut

Item number 1 will have to be repeated several times for different parts of Cockpit, as deemed necessary — especially when new features arise or the UI changes.

Existing implementations elsewhere

GNOME keyboard shortcut dialog

[Insert GNOME keyboard shortcut dialog photos here]

Resources

(Note: As far as libraries go, Mousetrap is the most mature and well supported.)

JavaScript

React

Reference

Discussion

This effort will be ongoing and require effort from many people in the team at one point or another.