One common piece of feedback I receive about GC is that the settings window behaves really odd and is glitchy. I think this is clear to anyone who opens the window for the first time. I have a few suggestions that I think would greatly improve the UX of these web views when they have to function as windows.
-
Allow web views to be positioned like normal windows
Right now, web views have to be either completely above or completely below all apps. This makes little sense when a title bar and window controls are enabled and frequently trips users up.
-
Add an option to pre-load a web view when BTT starts instead of when it is first called on
This prevents the awful and very glitchy transparent window as long as you don’t open the web view too quickly after BTT starts.
-
Add a new BG option: Translucent vibrant background
I’ve recreated the macOS vibrancy effect used in sidebars etc in CSS, but it is insanely glitchy when used in combination with the transparent BG option. It would be easier and much MUCH more performant if the web view itself had the translucent BG and was rendering my web content on top. When combined with the above solution this will completely eliminate all flashing in web views.
-
Add the option to position the window controls
This may already be there and I just don’t know how to do it.
Together, I think these things will make web views behave a lot more reliably 
You can set a different window level so that it behaves like a normal window. If you enable the show dock icon option and set the window level to 0 it should behave like any other window
I don’t think preloading is a good idea, this would mean that goldenchaos would always use a lot of memory and CPU for rendering even though you probably only use the settings view very rarely. Instead it might be a good idea to use some JavaScript to delay the heavy lifting so that it can render the UI quickly and then do the work.
Unfortunately webviews are very limited in regards to window backgrounds, I think the current solution is the only feasible that gives at least some flexibility. Even now it already needs to rely on using private API to enable transparent backgrounds... But I’ll check, it seems there have been some improvements in Big Sur.
What do you mean by positioning window controls?
-
good to know! I wonder if there could be a way to set a custom dock icon for my settings window instead of using BTT’s icon?
-
I was imagining it would only load once when BTT starts in order to cache itself, not run continuously in the background.
-
Please keep me updated about this!
-
By window controls I mean the traffic lights, sorry haha. I’m updating the design of my settings window and don’t want to use a title bar, I’d rather have the traffic lights float directly on top of the sidebar a la Messages. But I have to then apply my own drop shadow in CSS, which pushes the traffic lights outside the bounds of my faux CSS “window”. Is there a CSS class I can use to position the traffic lights manually with a div?
Finally, one more positioning suggestion I forgot to ask for: Always show under custom menu bar icon. is this possible? I’m basically thinking of reconfiguring the settings window into a settings menu bar popover that can be pulled out into a window (or as close as I can get to that). So I would love to have the option to have my web view positioned like a faux context menu for GC’s menu bar icon.
I was able to just make my own traffic lights in CSS, not sure why I didn't think to do that 
Check out the new styles!
