Implemented Wallpaper Selector and Matugen's Wallpaper based auto-theming. (#73)

* Implement matugen - WIP

* Added matugen

* Add types and cleanup code

* Matugen implementation updates and added more options such as scheme and contrast.

* Code cleanup and matugen settings renamed for clarity.

* Makon maroon a primary matugen color.

* Updates to handle variations of matugen colors

* Finalizing matugen and wrapping up variations.

* Minor styling updates of the settings dialog.

* Do a swww dependency check.

* Dependency logic update

* Switch shouldn't double trigger notifications now when checking dependency.

* Logic was inverted

* Add matugen to dependency checker.

* Fixed dependency checking conditional

* Update dependency list in readme and check for matugen before doing matugen operations

* Styling fixes

* OSD Fix

* Remove unused code from wallpaper service.

* Color fixes for matugen.

* Nix updates for new dependencies

* Change default wallpaper to empty.

* Added custom notification service for startup, cleaned up code and updated readme.
This commit is contained in:
Jas Singh
2024-08-07 21:43:31 -07:00
committed by GitHub
parent d743c98a6a
commit f5b75edbed
31 changed files with 1315 additions and 197 deletions

View File

@@ -83,6 +83,7 @@ export default () => RegularWindow({
win.set_default_size(200, 300)
},
child: Widget.Box({
class_name: "settings-dialog-box",
vertical: true,
children: [
Header(),

View File

@@ -11,7 +11,7 @@ export const BarGeneral = () => {
Header('General Settings'),
Option({ opt: options.theme.font.name, title: 'Font', type: 'font' }),
Option({ opt: options.theme.font.size, title: 'Font Size', type: 'string' }),
Option({ opt: options.theme.font.weight, title: 'Font Weight', subtitle: "100, 200, 300, etc.", type: 'number', increment: 100, min: 100, max: 900}),
Option({ opt: options.theme.font.weight, title: 'Font Weight', subtitle: "100, 200, 300, etc.", type: 'number', increment: 100, min: 100, max: 900 }),
Option({ opt: options.terminal, title: 'Terminal', subtitle: "Tools such as 'btop' will open in this terminal", type: 'string' }),
Header('On Screen Display'),

View File

@@ -14,7 +14,7 @@ export const BarTheme = () => {
Header('General'),
Option({ opt: options.theme.bar.transparent, title: 'Transparent', type: 'boolean' }),
Option({ opt: options.theme.bar.background, title: 'Background Color', type: 'color' }),
Option({ opt: options.theme.bar.buttons.monochrome, title: 'Use Global Colors', type: 'boolean' }),
Option({ opt: options.theme.bar.buttons.monochrome, title: 'Use Global Colors', type: 'boolean', disabledBinding: options.theme.matugen }),
Option({ opt: options.theme.bar.buttons.background, title: 'Button Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.hover, title: 'Button Hover', type: 'color' }),
Option({ opt: options.theme.bar.buttons.text, title: 'Button Text', type: 'color' }),

View File

@@ -11,8 +11,10 @@ import { NotificationsMenuTheme } from "./menus/notifications";
import { SystrayMenuTheme } from "./menus/systray";
import { VolumeMenuTheme } from "./menus/volume";
import { OsdTheme } from "./osd/index";
import { Matugen } from "./menus/matugen";
type Page = "General Settings"
| "Matugen Settings"
| "Bar"
| "Notifications"
| "OSD"
@@ -30,6 +32,7 @@ const CurrentPage = Variable<Page>("General Settings");
const pagerMap: Page[] = [
"General Settings",
"Matugen Settings",
"Bar",
"Notifications",
"OSD",
@@ -75,6 +78,7 @@ export const ThemesMenu = () => {
class_name: "themes-menu-stack",
children: {
"General Settings": MenuTheme(),
"Matugen Settings": Matugen(),
"Bar": BarTheme(),
"Notifications": NotificationsTheme(),
"OSD": OsdTheme(),

View File

@@ -13,7 +13,8 @@ export const MenuTheme = () => {
vertical: true,
children: [
Header('General'),
Option({ opt: options.theme.bar.menus.monochrome, title: 'Use Global Colors', type: 'boolean' }),
Option({ opt: options.theme.bar.menus.monochrome, title: 'Use Global Colors', type: 'boolean', disabledBinding: options.theme.matugen }),
Option({ opt: options.wallpaper.image, title: 'Wallpaper', subtitle: options.wallpaper.image.bind("value"), type: 'wallpaper' }),
Option({ opt: options.theme.bar.menus.background, title: 'Background Color', type: 'color' }),
Option({ opt: options.theme.bar.menus.cards, title: 'Cards', type: 'color' }),
Option({ opt: options.theme.bar.menus.card_radius, title: 'Card Radius', type: 'string' }),

View File

@@ -0,0 +1,53 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import options from "options";
export const Matugen = () => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page paged-container",
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Matugen Settings'),
Option({ opt: options.theme.matugen, title: 'Enable Matugen', subtitle: 'WARNING: THIS WILL REPLACE YOUR CURRENT COLOR SCHEME!!!', type: 'boolean', dependencies: ["matugen", "swww"] }),
Option({ opt: options.theme.matugen_settings.mode, title: 'Matugen Theme', type: 'enum', enums: ["light", "dark"] }),
Option({
opt: options.theme.matugen_settings.scheme_type,
title: 'Matugen Scheme',
type: 'enum',
enums: [
"content",
"expressive",
"fidelity",
"fruit-salad",
"monochrome",
"neutral",
"rainbow",
"tonal-spot"
]
}),
Option({
opt: options.theme.matugen_settings.variation,
title: 'Matugen Variation',
type: 'enum',
enums: [
"standard_1",
"standard_2",
"standard_3",
"monochrome_1",
"monochrome_2",
"monochrome_3",
"vivid_1",
"vivid_2",
"vivid_3",
]
}),
Option({ opt: options.theme.matugen_settings.contrast, title: 'Contrast', subtitle: 'Range: -1 to 1 (Default: 0)', type: 'float' }),
]
})
})
}

View File

@@ -3,6 +3,8 @@ import Gdk from "gi://Gdk"
import icons from "lib/icons"
import { RowProps } from "lib/types/options"
import { Variable } from "types/variable";
import Wallpaper from "services/Wallpaper";
import { dependencies as checkDependencies } from "lib/utils";
const EnumSetter = (opt: Opt<string>, values: string[]) => {
const lbl = Widget.Label({ label: opt.bind().as(v => `${v}`) })
@@ -33,7 +35,9 @@ export const Inputter = <T>({
enums,
max = 1000000,
min = 0,
increment = 1
increment = 1,
disabledBinding,
dependencies,
}: RowProps<T>,
className: string,
isUnsaved: Variable<boolean>
@@ -130,15 +134,35 @@ export const Inputter = <T>({
]
case "enum": return self.child = EnumSetter(opt as unknown as Opt<string>, enums!)
case "boolean": return self.child = Widget.Switch()
.on("notify::active", self => opt.value = self.active as T)
.hook(opt, self => self.active = opt.value as boolean)
case "boolean": return self.child = Widget.Switch({
sensitive: disabledBinding !== undefined ? disabledBinding.bind("value").as(disabled => !disabled) : true,
})
.on("notify::active", self => {
if (disabledBinding !== undefined && disabledBinding.value) {
return;
}
if (self.active && dependencies !== undefined && !dependencies.every(d => checkDependencies(d))) {
self.active = false;
return;
}
opt.value = self.active as T
})
.hook(opt, self => {
self.active = opt.value as boolean
})
case "img": return self.child = Widget.FileChooserButton({
class_name: "image-chooser",
on_file_set: ({ uri }) => { opt.value = uri!.replace("file://", "") as T },
})
case "wallpaper": return self.child = Widget.FileChooserButton({
on_file_set: ({ uri }) => {
opt.value = uri!.replace("file://", "") as T;
Wallpaper.set(uri!.replace("file://", ""));
},
})
case "font": return self.child = Widget.FontButton({
show_size: false,
use_size: false,

View File

@@ -3,12 +3,6 @@ import { Inputter } from "./Inputter";
import icons from "lib/icons";
import { RowProps } from "lib/types/options";
type Option = {
title: string,
subtitle: string,
}
export const Option = <T>(props: RowProps<T>, className: string = '') => {
const isUnsaved = Variable(false);

View File

@@ -1,6 +1,9 @@
import options from "options";
const { show_numbered, show_icons } = options.bar.workspaces;
const { monochrome: monoBar } = options.theme.bar.buttons;
const { monochrome: monoMenu } = options.theme.bar.menus;
const { matugen } = options.theme;
show_numbered.connect("changed", ({ value }) => {
if (value === true) {
@@ -13,3 +16,10 @@ show_icons.connect("changed", ({ value }) => {
show_numbered.value = false;
}
})
matugen.connect("changed", ({ value }) => {
if (value === true) {
monoBar.value = false;
monoMenu.value = false;
}
})