Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2025-01-02 18:39:05 +01:00
Code Issues Packages Projects Releases Wiki Activity

Support window blur in addition to transparency (#161)

Browse Source 
Adds support for window blur via the Vibrancy feature on macOS and the
BackgroundMaterial feature on Windows. The setting has no effect on
Linux. If both transparency and blur are set, transparency will take
precedence.
This commit is contained in:
Evan Simkowitz 2024-07-26 16:18:53 -07:00 committed by GitHub
parent 245394f8e2
commit 72fc42a050
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 18 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
emain/emain.ts
View File

@ -324,8 +324,20 @@ function createBrowserWindow(
autoHideMenuBar: true, autoHideMenuBar: true,
}; };
const isTransparent = settings?.window?.transparent ?? false; const isTransparent = settings?.window?.transparent ?? false;
const isBlur = !isTransparent && (settings?.window?.blur ?? false);
if (isTransparent) { if (isTransparent) {
winOpts.transparent = true; winOpts.transparent = true;
} else if (isBlur) {
switch (unamePlatform) {
case "win32": {
winOpts.backgroundMaterial = "acrylic";
break;
}
case "darwin": {
winOpts.vibrancy = "fullscreen-ui";
break;
}
}
} else { } else {
winOpts.backgroundColor = "#222222"; winOpts.backgroundColor = "#222222";
} }

1
frontend/app/app.less
View File

@ -7,6 +7,7 @@
body { body {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
// backdrop-filter: blur(8px);
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: var(--main-bg-color); background-color: var(--main-bg-color);

6
frontend/app/app.tsx
View File

@ -204,12 +204,12 @@ function switchBlock(tabId: string, offsetX: number, offsetY: number) {
function AppSettingsUpdater() { function AppSettingsUpdater() {
const settings = jotai.useAtomValue(atoms.settingsConfigAtom); const settings = jotai.useAtomValue(atoms.settingsConfigAtom);
React.useEffect(() => { React.useEffect(() => {
let isTransparent = settings?.window?.transparent ?? false; const isTransparentOrBlur = (settings?.window?.transparent || settings?.window?.blur) ?? false;
let opacity = util.boundNumber(settings?.window?.opacity ?? 0.8, 0, 1); const opacity = util.boundNumber(settings?.window?.opacity ?? 0.8, 0, 1);
let baseBgColor = settings?.window?.bgcolor; let baseBgColor = settings?.window?.bgcolor;
console.log("window settings", settings.window); console.log("window settings", settings.window);
if (isTransparent) { if (isTransparentOrBlur) {
document.body.classList.add("is-transparent"); document.body.classList.add("is-transparent");
const rootStyles = getComputedStyle(document.documentElement); const rootStyles = getComputedStyle(document.documentElement);
if (baseBgColor == null) { if (baseBgColor == null) {

1
frontend/types/gotypes.d.ts vendored
View File

@ -516,6 +516,7 @@ declare global {
// wconfig.WindowSettingsType // wconfig.WindowSettingsType
type WindowSettingsType = { type WindowSettingsType = {
transparent: boolean; transparent: boolean;
blur: boolean;
opacity: number; opacity: number;
bgcolor: string; bgcolor: string;
}; };

1
pkg/wconfig/settingsconfig.go
View File

@ -75,6 +75,7 @@ type TermThemesConfigType map[string]TermThemeType
// note we pointers so we preserve nulls // note we pointers so we preserve nulls
type WindowSettingsType struct { type WindowSettingsType struct {
Transparent *bool `json:"transparent"` Transparent *bool `json:"transparent"`
Blur *bool `json:"blur"`
Opacity *float64 `json:"opacity"` Opacity *float64 `json:"opacity"`
BgColor *string `json:"bgcolor"` BgColor *string `json:"bgcolor"`
} }