Extra control placement 3039 #13104
Extra control placement 3039 #13104
Conversation
…+ top and bottom. Working with some bugs (e.g scale control + any other control causes other control to distort)
…oes clockwise starting from top left until center left
|
|
|
Sorry for the late response — this PR is on our mind and we'll look at it closer after we're done with the current v3.3 release. 🙏 |
|
No problem, thanks for the update! |
| @@ -83,7 +83,7 @@ import type {ContextOptions} from '../gl/context.js'; | |||
| import * as TP from '../tracked-parameters/tracked_parameters.js'; | |||
| import * as TPM from '../tracked-parameters/tracked_parameters_mock.js'; | |||
|
|
|||
| export type ControlPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'; | |||
| export type ControlPosition = 'top-left' | 'top-center' | 'top-right' | 'right-center' | 'bottom-right' | 'bottom-center' | 'bottom-left' | 'left-center'; | |||
There was a problem hiding this comment.
It seems like left-center and right-center are flipped relative to the others. Unless there's good precedent elsewhere, would putting the vertical positioning consistently first be easier to remember?
PR suggestion:
| top-left | top-center | top-right |
| left-center | right-center | |
| bottom-left | bottom-center | bottom-right |
Maybe easier to remember:
| top-left | top-center | top-right |
| center-left | center-right | |
| bottom-left | bottom-center | bottom-right |
There was a problem hiding this comment.
It's a bit of a tossup because I wanted to avoid having "center" show up as both the first and last word. Maybe make "bottom-center" into "center-bottom" too (as well as with "top-center")? Or maybe make those two "bottom-middle" and "top-middle"?
| Suggestion 1 | ||
|---|---|---|
| top-left | center-top | top-right |
| center-left | center-right | |
| bottom-left | center-bottom | bottom-right |
| Suggestion 2 | ||
|---|---|---|
| top-left | top-middle | top-right |
| center-left | center-right | |
| bottom-left | bottom-middle | bottom-right |
I don't know which is best, seems like there are only tradeoffs unless we bite the bullet with my suggestion 2 and have "middle" and "center" refer to different axes
There was a problem hiding this comment.
That makes sense. I know I'm engaging in some drive-by nitpicking; it just reminds me of properties I have to look up every single time, e.g. flexbox alignment vs. justification and SVG alignment-baseline center vs. central vs. middle. So I don't have a strong stance, just that some amount of logic, precedent, or memorability would be a nice goal.
There was a problem hiding this comment.
I'm not sure I like this, but what about:
| Suggestion 3 | ||
|---|---|---|
| top-left | top | top-right |
| left | right | |
| bottom-left | bottom | bottom-right |
There was a problem hiding this comment.
That could work and I'm leaning towards it the most. Thanks for this suggestion
This closes the good first issue #3039 (Allow controls to be placed at top-center, bottom-center, left-center, and right-center)
example pictures showcasing all four new positions:
Multiple ctrls will have margins between themselves like the already existing positions. However, depending on their widths in the top and bottom center they can look weird (smaller elements floating left).
I ordered the positions code in the css and map.js files by going from top-left to center-left clockwise listing each position too.