Yabai Mutli Man [WIP]

[bradennapier]

Would love your thoughts overall and if you have any dieas! Styling sketchbyar kind of sucks...

So I have 4 monitors and have always had issues finding windows and such after awhile and it would get unorganized.

Often I'd end up with more spaces than I need on this or that monitor.

I decided to enforce this:

• it is impossible to have less than 4 spaces per monitor (it will we create it)
  They are labeled $display_1, ... (even if their ID or index is diff?
• every display is labeled in my case both portrait and landscape monitors

I don't often care about basics title management I can just drag and drop ... but

1. Wanting to move focused window to its own space

2. Wanting to swap entire spaces with spaces on another monitor (my presenter superpower lol)

3. Knowing what apps are on what displays AND spaces

4. Displays may have more than 4 spaces and any native full screen spaces are automatically created and not allowed to be sent to etc but in this case my full screen slack just shows up like this:

---

I made a few solutions. One I have a typescript super search module I hope to publish that connected to the yabai socket for speedy comm m/. It has a snapshot and ttl system
I don't use this that much here but it is pretty awesome allowing for things like "send all code apps one per monitor" or w/e

---

So this is setup per monitor.

• Far left lists all spaces. It shows which are visible, which are focused , and how many windows each space has on it

• (1^1) === space 1 has 1 window on it right now etc
• Each displays 1st space is oshortcut to 1

1. Clicking on a space navigates and focuses it immediately

2. Ctrl clicking it moves focused window to that window

3. Alt clicking it (as long as it's a diff display) will swap the focused space and all windows with the clicked one and rotate it if needed (portrait vs landscape).

4. Every window for a space is rendered with overflow scroll on hover. It shows icon , the space it's on, if it's visible , and if it's focused.

• clicking on it focuses that space and window
• portrait does some optimization to maek sure overflow doesn thappen by right aligning the windows:

6. Latest and greatest: Each monitor has a button to give the entire overview in case they need it for some reason.

This shows my portrait monitor , the windows on each space, and focus/visible states. I can control and move things easily as mentioned above.

If I am trying to aggregate for example want to get all my coding sessions on various spaces after they get jumpbled I can just flip on the display all monitors :

Green means its visible to me via one of my screens and yellow means its confisered focused :)

Note that displaying all desktops and spaces only shows those that aren't empty because i dont wanna deal with scroll event bs or try to find out a new way to do it :)

---

Here is my monitor layout for now as the new Web API's show. Usually I have portrait on left/right and landscape in middle bottom top but i came into a second top quality mac monitor so... what can ya do

(You can play with that if you have multi monitor... pretty cool idea to build web apps that can dot this!: https://v0-screen-details-demo.vercel.app/)