feat(transparent-player): new plugin for Acrylic, Mica or Tabbed effects

[frostybiscuit]

Transparent Player plugin

I've added a new plugin called "Transparent Player" with the intention of allowing the use of Acrylic, Mica and Tabbed effects for the Electron window.

Options

• Opacity
  • Allowing to set the opacity of the apps background-color from 10-100%
• Type
  • Allows the user to select effects from "Acrylic", "Mica" and "Tabbed" without the need of reloading the app

Known limitations

• As of now this will only work for Windows 11 22H2 and above. Support for MacOS is possible, but I don't have a device to test this on.
• The transparency for Acrylic is only visible when the window is currently in focus. This is a limitation by Windows and can only be "fixed" by using a third party application like "Mica for Everyone".

Preview

Acrylic (10%)

Acrylic (50%)

Acrylic (100%) - basically fully opaque

Mica

Tabbed

Disabled

Notes

• The plugin can be fully disabled, but the initial settings need to be set to an active material in order for it to work properly (I chose Mica for least intrusion, but it should never be visible to the user unless they enable this plugin).
• I had to set the initial "backgroundColor" for the electron window instance to a transparent black for the effects to function, because this cannot be changed properly during runtime. The transparent background will never be visible without my plugin, since the website itself has a background-color set.

Closes #3629

[frostybiscuit]

@JellyBrick Not sure what went wrong with the build here, but considering it hit a timeout, I guess it could have been a hiccup during the build? ¯_(ツ)_/¯

Could I kindly ask you to re-trigger the build? That is, if the whole concept of this plugin even matches with your vision for the app of course!

[ArjixWasTaken]

@frostybiscuit

don't sweat it about the CI errors
also, there is no vision for the app, any idea that is shared by many people and doesn't negatively impact others will probably end up getting accepted

[ArjixWasTaken]

The plugin can be fully disabled, but the initial settings need to be set to an active material in order for it to work properly (I chose Mica for least intrusion, but it should never be visible to the user unless they enable this plugin).

I'd suggest marking the plugin as restartNeeded: true, and only add an initial active material if the plugin is enabled.

[ArjixWasTaken]

Also, according to the docs, dynamically changing the material is exclusive to windows.

Dunno if the exclusivity also applies to the initial property of backgroundMaterial, but I also can't find it in the docs.

[frostybiscuit]

@ArjixWasTaken Thanks for looking into it, very much appreciated!

I initially tried not having a backgroundMaterial set unless the plugin is initialised, but then the whole effect would not work at all, not even with restartNeeded set to true.

I would prefer this approach myself and tried around for a few days, but didn't find any working solution (other than loading a config before the initial window config) so I thought Mica being a native effect on W11 which can be disabled on OS level should have very little if any performance impact on the Users.

That said, I can continue to find a proper and clean solution to have unchanged initial settings until the plugin is enabled!

[frostybiscuit]

Ignore this PR for now until I found a solution to not have any backgroundMaterial set initially, because I assume that there could be an issue on macOS running electron with this setting applied, even if only for the headless instance for testing.

[ArjixWasTaken]

The config is available on index.ts
https://github.com/frostybiscuit/youtube-music/blob/feature/transparent-player-plugin/src/index.ts#L132-L138

you just have to write the json path

[frostybiscuit]

@ArjixWasTaken I guess the test error was caused by the fact that the initial window options had a backgroundMaterial on macOS, even if the value was undefined. Now the builds run through, but in general the plugin only works on Windows for now.

I know that macOS also has a way to get this working, using "vibrancy", but I don't have a macOS device to test that on my end, so I wouldn't feel too comfortable testing this, but I'd be fine adapting the plugin itself accordingly to set the correct values.
As for Linux, I can't find a way to guarantee that it will work, especially since it is also distro dependent.

Would it be acceptable to have this as a Windows-only plugin for now, or should we first make sure that at least macOS is supported as well before continuing?

[ArjixWasTaken]

On that topic, I'd like to make a suggestion

@JellyBrick currently, for platform-dependent plugins, we have an imho ugly way of disabling them on unsupported platforms.

e.g. https://github.com/th-ch/youtube-music/blob/master/src/index.ts#L64-L69

I suggest we introduce a way for a plugin to declare that it supports specific platforms.
e.g. using an enum

export default createPlugin({
  platform: Platform.Windows | Platform.Darwin
});

In my opinion, declarative is better than imperative

---

@frostybiscuit it's totally fine to release your plugin for a specific platform, getting the plugin merged means that other people may contribute their own platform in a separate PR

[frostybiscuit]

I suggest we introduce a way for a plugin to declare that it supports specific platforms. e.g. using an enum

export default createPlugin({
  platform: Platform.Windows | Platform.Darwin
});

Fully agree that initializing plugins only if they support the current platform is supported makes most sense! For now I would maybe add "(Windows)" to the plugin label, unless you say that it isn't necessary.

Also, if you need a helping hand with the platform specific initialization, feel free to reach out, I would gladly help with that!

[ArjixWasTaken]

For now I would maybe add "(Windows)" to the plugin label, unless you say that it isn't necessary.

The plugin should be completely hidden from the user if their platform is not supported, as long as it's properly dealt with.
e.g. https://github.com/th-ch/youtube-music/blob/master/src/index.ts#L64-L69

[frostybiscuit]

Gotcha! I will tackle this tomorrow

[frostybiscuit]

@ArjixWasTaken The plugin is now fully removed on non-windows devices and the config is only touched after the plugin was enabled. Let me know if you want anything else adapted!