Skip to content
This repository has been archived by the owner on Dec 7, 2023. It is now read-only.

Keyboard Shortcuts #15

Open
JeanMertz opened this issue Jun 13, 2019 · 4 comments
Open

Keyboard Shortcuts #15

JeanMertz opened this issue Jun 13, 2019 · 4 comments
Milestone
v1.0.0

Comments

@JeanMertz
Copy link
Contributor

The application should be usable (and feel natural) when only using the keyboard as an input device.

Right now, a few shortcuts are implemented

  • F for search field focus
  • ENTER in pipeline view to run pipeline
  • ESC in pipeline view to return to home screen

These should be expanded to make the entire UI easily navigable. Also, ? should bring up a keyboard shortcuts cheat sheet view.
@JeanMertz
Copy link
Contributor Author

JeanMertz commented Jul 6, 2019 •
edited
Loading

Tracking a list of potential shortcuts.

Home
F / / search field focus with current value selected
ESC unfocus/blur search field
? show contextual help overview (including available shortcuts)
1...9 open pipeline corresponding to the location in the result list
↓ / ↑ select the next/previous pipeline in the list of results

Pipeline Details
ENTER run pipeline
ESC return to home page
? show contextual help overview (including available shortcuts)

@jewilmeer
Copy link

/ is a common default to focus the search field. Maybe the arrow keys could focus the pipelines, and move to the next pipeline?

@JeanMertz
Copy link
Contributor Author

Great ideas! I added them to the list 👍

I've got a new web-client version ready to push which makes supporting this way simpler, so I suspect this can be added very soon already.

JeanMertz added a commit that referenced this issue Jul 8, 2019
@JeanMertz
feat(web): rewrite web client implementation
2d9bc81 
The goal of this rewrite is to make the code more composable to make it
easier to add new functionality in the future.

Here's a list of the most relevant changes:

* Use a declarative component-based UI with a virtual DOM to separate
  rendering logic from the business logic.

* Add a router to support deep-linking to specific tasks.

* Reduce Wasm binary from ~2 MB to ~450 kB (uncompressed).

* Add local session caching to reduce the number of network requests.

* Remove atomic-based CSS classes in favor of semantic classes.

* Rename all occurrences of "task" with "job" and "pipeline" with
  "task" (this change will be applied to the other crates as well).

* Minor visual changes.

This commit (partially) resolves the following issues:

* #14
* #15
* #18
* #27
@JeanMertz
Copy link
Contributor Author

This can now be implemented more easily since 2d9bc81.

Specifically, here's the infrastructure needed to make this work:

automaat/src/web-client/src/service/shortcut.rs

Lines 1 to 5 in 2d9bc81

//! The shortcut service can act on keyboard input to perform specific actions.
//!
//! In a sense, this is closely related to the `Router`, whereas the router acts
//! on path changes and updates the models, this service acts on keystrokes and
//! updates the models.

@JeanMertz JeanMertz added this to the v1.0.0 milestone Jul 11, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
v1.0.0
Development

No branches or pull requests
2 participants
@jewilmeer @JeanMertz