nurpax / petmate

PETSCII editor with Electron/React/Redux
MIT License
182 stars 14 forks source link

Keyboard shortcuts for the tools #54

Closed Viza74 closed 6 years ago

Viza74 commented 6 years ago

what the title says. :)

Primarily for the draw and colorize tools.

nurpax commented 6 years ago

Marking this with "keyboard" label. There are many keyboard shortcut related issues.

I added a wiki for designing keyboard shortcuts: https://github.com/nurpax/petmate/wiki/Keyboard-shortcut-design

Should try to design all the shortcuts comprehensively so that they feel consistent. If we add them one by one, it might get messy and inconsistent.

Viza74 commented 6 years ago

Suggestions: wasd - move in character palette qe - move in color palette

For the tools one simple possibility to simply use the number keys (TIC80 and I think maybe Pico8 does this). Conviniently close to wasd hand position, and don't have think too much. :) 1 - draw 2 - colorize 3 - change char only (ok, this is not a tool yet, but should be :) ) 4 - brush Some alternatives: For draw: "p" as pen. That is a bit too far away from wasd though. Could be "b" as brush. The placement of this is ok, but needs renaming the current brush tool to avoid confusion. For brush: Obviously "b". If "b" used for the re-named draw, then "c" as in "Clone stamp", or "v" - I don't have a name for it, but it nicely sits between "b" and "c" :) For colorize: Obviously "c". If "c" is used for the re-named brush, then "r" as in "Recolor" For change char only: "x" as in "eXchange char" - a bit far-fetched name, but the hotkey is close to the natural resting pos of the hand... And also because "c" as in "change" or as in "char" is probably already taken. :)

I would not add a hotkey for the clear canvas tool to prevent accidental activation, and because it is a very rarely used function anyway - or if I really must assign something then some two- or even three key combination like cmd+shift+del.

Oh, and for the mouse: right click for pick in whatever primary mode is the program in (=if right clicked in draw mode, then pick char and color too, if right clicked in colorize mode then picks only color, if right clicked in char only mode picks only char. Hmm, maybe it doesn't even matter, and can always pick everything - if the program is in an another mode, it still effectivly acts as only picking that part...) If the right lick detection is problematic (I guess it is probably just some small thing preventing from working, as it is sounds it shouldn't be problematic, but I don't really know js/react whatever it is used for this) alt+ left click could work the same. Maybe pick could even got its own icon in the toolbar as a pipetta/eyedropper. That also can use the alt key as a momentary toggle, or can get it's own hotkey. "i" is the default in photoshop and I guess in other drawing programs. But I never use it actually (only the alt+left click variation).

Viza74 commented 6 years ago

Ohh, one more thing: the current "brush" tool functionality could be very naturally moved to right mouse too, because it is actualy some kind of "pick up". Like "shift + right mouse drag" selects brush, and automatically swiches to brush mode. And as I mentioned in some other issue, I would like to see a "move" version of the brush tool, which clears the area of the original selection, that could be "cmd+right mouse drag"

nurpax commented 6 years ago

I was going to suggest:

Agreed that clear canvas doesn't need a shortcut. In fact I will most likely replace it with "clear rect" to fill a rectangle.

Suggestions:
wasd - move in character palette
qe - move in color palette

For the record, the above are the way it works in Git HEAD (IIRC in 0.2.0 too for wasd).

Esshahn commented 6 years ago

Agreed that clear canvas doesn't need a shortcut.

But it deserves an entry in the menu

Viza74 commented 6 years ago

(I don't understand why this would renaming the brush tool) Because IMO what is called "draw" in petmate is called "brush" in every other drawing program. At least the functionality maps best for "brush" in other programs. What is called "brush" in petmate is "clone", or "copy-paste" in other programs IMO. Maybe when there will be a brush palette to store and choose multiple brushes from the canvas it will deserve the "brush" name, but right now it is closer to copy-paste. But there is definitely a gray area here in overlapping functionality, so it doesn't really matter...

Agreed that clear canvas doesn't need a shortcut. But it deserves an entry in the menu

You two seems to be strangely attached to that clear canvas tool... :) I don't really understand why, though. IMO thats a very rarely used option (maybe usefull during program testing, but in real world use?) I can't recall any drawing program that's show an instant "clear canvas" functionality this prominently. But anyway, I don't want to take away your favorite tool :) I do not mind if thats sit there, I just think it is way less important than top spot in the toolbar...

Esshahn commented 6 years ago

Not toolbar. The menu.

Viza74 commented 6 years ago

Ohh, ok, I misunderstood. The menu could be ok. In the "edit" menu. But IMO the right click menu of the screen thumbnails would be the most natural place to put the clear canvas function (as it is a screen-wide function). But the edit menu is also retty good

(Somewhat off-topic here, but the thumbnail right-click menu is a bit too hidden - i think the best would be a small drop-down arrow on thumbnail hover to access that menu.)

nurpax commented 6 years ago

I guess it never occurred to me that 'brush' might not be the best name for that feature. We can try to come up with a better name for it.

However, I have several good changes lined up for the next release, so I'll go ahead and implement shortcuts as in my above reply. We can change them then once this discussion concludes. It's better we have the shortcuts in there -- other use patterns depend on them.

nurpax commented 6 years ago

I added two sets for tool selection:

Both do the same. Give it a try and see which feels better. I'll make a build in the next 10 mins.

Unfortunately I still couldn't get right click to work reliably on Electron. I can attach an event handler for "context menu" and get the events.. but a right click also issues a left-click (!), at least on my Mac where I need to press ctrl-left-click to pop the context menu. Not sure if this would work with a real mouse and/or on Windows.

Would it be a totally bad idea to use say COMMAND-leftclick instead of right click?

nurpax commented 6 years ago

0.2.3 contains the shortcuts. Up in the usual location.

Viza74 commented 6 years ago

I suggested alt+left click, because thats the color picker in Photoshop.

nurpax commented 6 years ago

So alt-left to pick char and color under cursor?

Also add a picker icon in the left menu bar, selectable with a shortcut ('i' and maybe '4' if I'm reading right from above)?

The icon probably wouldn't be used much as alt-left would be quicker, but I'd like these features to be somehow visible in the UI. Easier to get started this way rather than rely only on invisible keyboard shortcuts.

Viza74 commented 6 years ago

Yes.

In other news: I tried 0.2.3 and happy to report that the hotkeys made the program approximately 1.493 bazillion times more useable. :)

Also, I just realized that I can "abuse" the brush tool to simulate "pick" behaviour (with the somewhat strange shortcut -> "Esc" to pick) which added another 0.793 bazillion to the useablity multiplier. :)

nurpax commented 6 years ago

Alt-left-click is in 0.2.4. This should be another c*bazillion productivity improvement :)

Viza74 commented 6 years ago

Yepp, helps a lot too.

One small issue: if in brush mode, and alt-click pick a character, the app should switch back to draw mode (as it does when selecting from the character palette in brush mode). Also it should switch to draw mode from colorize mode too if selecting something from the character palette. But not on alt-pick.

nurpax commented 6 years ago

Implemented @Viza74 's last suggestion too