plankanban / planka

The realtime kanban board for workgroups built with React and Redux.
https://planka.app
GNU Affero General Public License v3.0
7.77k stars 721 forks source link

[Feature Request] Keyboard Shortcuts #23

Open raman325 opened 4 years ago

raman325 commented 4 years ago

This has to be one of the best Trello clones I have seen to date, well done! I was wondering if you were planning to support Trello's keyboard shortcuts as well? https://trello.com/shortcuts

nickbe commented 4 years ago

It's at least an idea to think about in the future. Right now there are other priorities. But I'll add that to the list of more important suggestions right away.

svogt commented 3 years ago

Hi, first of all, thanks for an awesome looking Trello clone. This is the no #1 reason for me to not switch over yet. I wonder (as I'm not a JS dev, nor experienced with React) is this hard to implement or does it take much time / effort? It really seems to be a quick win as the basic "actions" are already there, they somehow "just" need to be mapped to a keyboard shortcut.

Glokta0 commented 3 years ago

+1 from here :) It looks like a really neat and excellent (and secure) tool! But shortcuts make it so much more efficient (even though I wouldn't say that Trellos shortcuts utilize their max potential). Thanks again for creating this tool!

nickbe commented 3 years ago

Personally I'm against keyboard shortcuts. As far as I'm concerned shortcuts never work as expected, because most of us have system wide shortcuts already capturing keys. Example Ctrl+n is taken as default by 3 programs here. Two of them cannot be configured otherwise.

But Maks will surely decide wether it's easy to implement or not.

svogt commented 3 years ago

Personally I'm against keyboard shortcuts. As far as I'm concerned shortcuts never work as expected, because most of us have system wide shortcuts already capturing keys. Example Ctrl+n is taken as default by 3 programs here. Two of them cannot be configured otherwise.

But Maks will surely decide wether it's easy to implement or not.

Well, have you checked Trellos shortcuts? They work without any prefix, just normal letters and you can navigate through cards or hover with the mouse over the card. I don't see how those could conflict with any system wide shortcuts... They only work if you have focus on the current browser tab.

Other webtools like Gerrit or Discourse do it the same...

GrahamJenkins commented 2 years ago

Hey, checking out this project. First off, wow, it looks uncannily like Trello :-D I'm a long time user but have been looking for self hosted alternatives. I'm planning on launching this to give it a shot. Good work so far!

I wanted to add my +1 to keyboard shortcuts. I took a look at the demo and it's pretty nice. However, when I reached for my commonly used shortcuts, they were sadly missing. I would love to see this feature added when able. That said, while I don't develop in React, I might be able to hack together some of the functionality in the future. Any pointers welcome!

I will update this issue if/when I (or one of my devs) start development.

GrahamJenkins commented 2 years ago

Update: I am starting to use Planka for personal/business use. While development has not started, I'm trying to assign some "free" developer time towards implementing at least a barebones functionality for this. Fork: https://github.com/TheGeekyNinja/planka @nickbe is there anyone that you know who could point us in the right direction/preferred method to implement:

  1. Single key, event handle
  2. Card manipulation functions

The preferred solution would probably go something like this:

  1. Track a cardID whenever one is hovered over. Set it to null on blur
  2. Define a shortcuts object that maps keycodes to functions
  3. Functions to handle each keyboard shortcut
  4. Event handler

To be clear, I have not jumped into the code, and I have no clue when the team will have time/if it will happen yet. But this is something that I personally will put funding into to make happen.

meltyshev commented 2 years ago

Hi @GrahamJenkins!

Planka uses react-beautiful-dnd for drag & drop and it looks like it already has keyboard events support: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/about/accessibility.md (but this is only for moving cards). Probably have to try to turn them on somehow or fix them if they don't work properly.

For custom shortcuts I would suggest to add a component (for example BoardShortcuts), listen events there (with some shortcuts hook) and trigger redux actions. Of course a hovered card should be stored in the redux state, perhaps in the Board model.

If you need help, you can contact me anytime via Telegram.

GrahamJenkins commented 2 years ago

Hi @GrahamJenkins!

Planka uses react-beautiful-dnd for drag & drop and it looks like it already has keyboard events support: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/about/accessibility.md (but this is only for moving cards). Probably have to try to turn them on somehow or fix them if they don't work properly.

For custom shortcuts I would suggest to add a component (for example BoardShortcuts), listen events there (with some shortcuts hook) and trigger redux actions. Of course a hovered card should be stored in the redux state, perhaps in the Board model.

If you need help, you can contact me anytime via Telegram.

Thanks for the info, sent you a short book on Telegram, but having some devs take a crack at this right now, will report back when we have something to share.

ctheune commented 5 months ago

I'm currently giving Planka a look as I'm really missing trello. The Trello keyboard shortcuts are definitely a big thing that I'm missing right away regarding smoothness of workflows.

The biggest one I'm missing is to hover over a card and:

When doing large board cleanups this is a big big help to avoid massive click orgies