Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tabbed columns #1085

Merged
merged 33 commits into from
Feb 10, 2025
Merged

Tabbed columns #1085

merged 33 commits into from
Feb 10, 2025

Conversation

YaLTeR
Copy link
Owner

@YaLTeR YaLTeR commented Feb 4, 2025

Tabbed display mode for columns. Implements #933 / #876.

This is a WIP draft meant to gather feedback and figure out how exactly this should work. I know animations are broken, I'll deal with them later.

UX-wise, there's a single new bind:

Mod+W { toggle-column-tabbed-display; }

It toggles the focused column between normal and tabbed display mode. Everything else works the same way. Tabbed columns can be fullscreen with multiple windows, unlike normal columns.

The tab indicator is vertical and isn't included in the column size. I'm considering adding settings for both of those so you can have a more traditional horizontal tab bar at the top, maybe also with window titles as another setting.

By default, the tab indicator occupies 50% of the window height and has a gap. After going through several defaults here, this setup seems to be the only one that doesn't look broken for any kind of window: arbitrary shape, CSD with rounded corners, no-CSD with square or rounded corners. The requirement for the default is that it looks decent with everything.

You can override the active/inactive colors with layout settings and window rules. If you don't, then the tab indicator will try to sample colors and gradients from the window's border or focus ring, whichever is enabled:

I'm mainly looking for UX and design feedback here:

  • Are there better defaults?
    • Keep in mind they should look decent with: CSD rounded corners, arbitrary window shape, SSD rect corners, SSD rounded corners.
  • Do the settings make sense?
  • What behavior do you want that is currently missing? (E.g. "include tab indicator in column size"; still looking for a clear name for this one.)
    • I got feedback that it should be possible to have a tab bar with readable window titles to tell apart several tabbed PDF files. My current idea to achieve this is adding settings for: "draw tab indicator at the top", "include it in column size", "draw titles in tab indicator".
    • That said, I'd like to avoid a million settings that implement half of CSS.

@YaLTeR YaLTeR mentioned this pull request Feb 4, 2025
@VaclavC
Copy link

VaclavC commented Feb 4, 2025

I would like to have indicator on the top, with text titles, you have it covered by this proposal. And I would like it arranged from left, not centered, if possible.

Also, will it work with focus ring disabled?

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 4, 2025

Also, will it work with focus ring disabled?

Yes. It only fetches default colors from these, otherwise it's a separate thing.

@VaclavC
Copy link

VaclavC commented Feb 4, 2025

Great. I have no further ideas, it seems configurable as necessary to me.

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 4, 2025

And I would like it arranged from left, not centered, if possible.

Do you mean, like, left-aligned and not full-length? Because I imagine you'd just make it full-length (you already can with length total-proportion=1.0), at which point it will be the same as left-aligned since it matches the window size.

@VaclavC
Copy link

VaclavC commented Feb 4, 2025

I should read the proposal more thoroughly. You take proportion of available size and split it between tab indicators then. I had indicator sizes based on text content width in my mind. With that it would be nice to have it left aligned. But it should follow rounded corners setting then ... It is more complicated than it looks.

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 4, 2025

I had indicator sizes based on text content width in my mind.

Usually one way or another, you want tabs to be equal length. (See tabs in browsers etc., they are all the same length.)

@VaclavC
Copy link

VaclavC commented Feb 4, 2025

Yes, that's true. Let forget that. But I would like to have it on 100% width then.

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 5, 2025

New stuff:

  • layout default-column-display "tabbed"
  • hide-when-single-tab
  • position "top"/right/bottom
  • gap can go negative

@YaLTeR YaLTeR force-pushed the 🔢 branch 2 times, most recently from 42b0461 to f4e9732 Compare February 5, 2025 14:28
@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 5, 2025

Pushed (to main but useful for tabs): focus-window-top/bottom/down-or-top/up-or-bottom and focus-window-in-column [index].

@druskus20
Copy link

A big enough gap overflows over the next window. Maybe this is okay.

image

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 5, 2025

It's intended, yes. This needs the aforementioned "include tab indicator in column size" setting

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 6, 2025

Updates:

  • some animation fixes though not all
  • interactive move into a tabbed column now works correctly
  • default-column-display window rule

@Supreeeme
Copy link
Contributor

Is there supposed to be some kind of animation for a window moving into a tabbed column? I don't actually know what that should look like, but as it stands they appear to just pop out of existence into the column.

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 6, 2025

I haven't done anims yet

@gkleen
Copy link

gkleen commented Feb 6, 2025

Tabs work great for my workflow – thanks a lot!

The tab indicator […] isn't included in the column size. I'm considering adding [a] setting[…] for [that] […]

👍 for that :)
That is: having an option to have the column width reduced by the indicator width + indicator gap

To get ahead on bikeshedding: how about reduce-column-width below layout » tab-indicator?
Should be clear enough?

I have very narrow gaps and borders and my current solution of having a semi-transparent indicator on top of the window contents works but doesn't really appeal to me – feels wrong to cover parts of the window and to have a tradeoff wrt to visibility of the indicator and usability of the window itself.

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 7, 2025

Alright, big change: added place-within-column, the aforementioned "include in column size" setting. This one affects quite a few places, so please test that it doesn't break.

As a bonus, added gaps-between-tabs.

To get ahead on bikeshedding: how about reduce-column-width below layout » tab-indicator?

Sorry, missed this edit (edits don't send emails unlike new comments). I think place-within-column is more intuitive for the setting you might look for?

@the-fuckin-nobody
Copy link

Just tried it and works great for me. Some additions I would love UI wise are:

  1. ability to make the tab indicators rounded.
  2. Something like this (a frame like thing for tab indicators maybe) would look cool but idk if that's achievable or that's the goal or not?
    image

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 7, 2025

Something like this (a frame like thing for tab indicators maybe) would look cool but idk if that's achievable or that's the goal or not?

This might be a bit too much into the implementing half of css territory

@the-fuckin-nobody
Copy link

Something like this (a frame like thing for tab indicators maybe) would look cool but idk if that's achievable or that's the goal or not?

This might be a bit too much into the implementing half of css territory

Understandable, thanks.

@blepabyte
Copy link

Not strictly tabs-related, but it might fit some workflows to have newly spawned windows be placed into the same column/tab stack; that way, related windows naturally accumulate in larger tab stacks.

For example:

  • Opening a new browser window via Ctrl+N from within Firefox (append below/after active window in same column/stack)
  • Anything opened from an external launcher like wofi (open in new column to the right, as usual)

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 8, 2025

The problem with this is that you can't generally tell these two cases apart.

We'll add some extra logic there.
Lets hidden windows respond to events like resizes immediately. This is mainly
relevant for tabbed columns.

This commit doesn't actually force sending the frame callbacks in case we don't
redraw. We'll see if this is a problem or not.
The gradient area should be relative to each tab's geometry. In most cases
these geometries will all match, but not when some tabs have a different size,
for example when they have a fixed size.
@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 10, 2025

Updates:

With this I'm about ready to merge this PR to get more testing on the main branch. There's no text titles, but they can come later. If there's something else simple I might add it, but I won't block on anything complex.

@the-fuckin-nobody
Copy link

The tab indicator visibility problem seems to be gone:
image

Might also wanna add animations to the tabbed-indicator, when the tabbed-columns are toggled off (Currently the tab indicators just disappear). Apart from this, I don't think anything's lacking (except from those you mentioned ofc)

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 10, 2025

Might also wanna add animations to the tabbed-indicator, when the tabbed-columns are toggled off (Currently the tab indicators just disappear).

Didn't do this because it's generally a harder problem to animate something when it disappears. For switching from tabbed to normal it's easy, but when the whole column is gone (window closing), suddenly you need to come up with a way to draw a thing that no longer exists. So, maybe later.

@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 10, 2025

Also it seems you forgot to activate your Linux

@YaLTeR YaLTeR merged commit 20769b4 into main Feb 10, 2025
22 checks passed
@YaLTeR
Copy link
Owner Author

YaLTeR commented Feb 10, 2025

Thanks everyone for testing!

@YaLTeR YaLTeR deleted the 🔢 branch February 10, 2025 15:29
@the-fuckin-nobody
Copy link

Also it seems you forgot to activate your Linux

I'm too broke to afford linux lol.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

7 participants