LESA/custum-hyprpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Organize settings dialog code for extensability and add menu transitions to dialog. (#455)

Browse Source
This commit is contained in:
Jas Singh
2024-11-08 00:44:33 -08:00
committed by GitHub
parent d5f112e418
commit 9133834b85
8 changed files with 109 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
widget/settings/SettingsDialog.ts
View File

@@ -1,17 +1,16 @@
import RegularWindow from 'widget/RegularWindow';
import icons from 'lib/icons';
import options from 'options';
import { ThemesMenu } from './pages/theme/index';
import { SettingsMenu } from './pages/config/index';
import './side_effects';
import { GBox, GCenterBox } from 'lib/types/widget';
import Gtk from 'types/@girs/gtk-3.0/gtk-3.0';
import { pageList } from 'widget/settings/helpers';
import { SettingsPage, settingsPages } from './settingsPages';
type Page = 'Configuration' | 'Theming';
const { transition, transitionTime } = options.menus;
const CurrentPage = Variable<Page>('Configuration');
const pagerMap: Page[] = ['Configuration', 'Theming'];
const CurrentPage = Variable<SettingsPage>('Configuration');
const LastPage = Variable<SettingsPage>('Configuration');
const Header = (): GCenterBox =>
Widget.CenterBox({
@@ -44,7 +43,7 @@ const PageContainer = (): GBox => {
class_name: 'option-pages-container',
hpack: 'center',
hexpand: true,
children: pagerMap.map((page) => {
children: pageList(settingsPages).map((page) => {
return Widget.Button({
xalign: 0,
hpack: 'center',
@@ -52,17 +51,19 @@ const PageContainer = (): GBox => {
(v) => `pager-button ${v === page ? 'active' : ''} category`,
),
label: page,
on_primary_click: () => (CurrentPage.value = page),
on_primary_click: () => {
LastPage.value = CurrentPage.value;
CurrentPage.value = page;
},
});
}),
}),
Widget.Stack({
vexpand: false,
transition: transition.bind('value'),
transitionDuration: transitionTime.bind('value'),
class_name: 'themes-menu-stack',
children: {
Configuration: SettingsMenu(),
Theming: ThemesMenu(),
},
children: settingsPages,
shown: CurrentPage.bind('value'),
}),
],

3
widget/settings/helpers.ts Normal file
View File

@@ -0,0 +1,3 @@
export const pageList = <T extends object>(obj: T): Array<keyof T> => {
return Object.keys(obj) as Array<keyof T>;
};

4
widget/settings/pages/config/general/index.ts
View File

@@ -72,9 +72,9 @@ export const BarGeneral = (): Scrollable<Child, Attribute> => {
opt: options.menus.transitionTime,
title: 'Menu Transition Duration',
type: 'number',
min: 100,
min: 0,
max: 10000,
increment: 100,
increment: 25,
}),
Header('Scaling'),

27
widget/settings/pages/config/helpers.ts Normal file
View File

@@ -0,0 +1,27 @@
import { BarGeneral } from './general/index';
import { BarSettings } from './bar/index';
import { ClockMenuSettings } from './menus/clock';
import { DashboardMenuSettings } from './menus/dashboard';
import { NotificationSettings } from './notifications/index';
import { OSDSettings } from './osd/index';
import { CustomModuleSettings } from 'customModules/config';
import { PowerMenuSettings } from './menus/power';
import { MediaMenuSettings } from './menus/media';
import { BluetoothMenuSettings } from './menus/bluetooth';
import { VolumeMenuSettings } from './menus/volume';
export const configPages = {
General: BarGeneral(),
Bar: BarSettings(),
'Media Menu': MediaMenuSettings(),
Notifications: NotificationSettings(),
OSD: OSDSettings(),
Volume: VolumeMenuSettings(),
'Clock Menu': ClockMenuSettings(),
'Dashboard Menu': DashboardMenuSettings(),
'Custom Modules': CustomModuleSettings(),
'Bluetooth Menu': BluetoothMenuSettings(),
'Power Menu': PowerMenuSettings(),
} as const;
export type ConfigPage = keyof typeof configPages;

61
widget/settings/pages/config/index.ts
View File

@@ -1,44 +1,11 @@
import { BarGeneral } from './general/index';
import { BarSettings } from './bar/index';
import { ClockMenuSettings } from './menus/clock';
import { DashboardMenuSettings } from './menus/dashboard';
import { NotificationSettings } from './notifications/index';
import { OSDSettings } from './osd/index';
import { CustomModuleSettings } from 'customModules/config';
import { PowerMenuSettings } from './menus/power';
import options from 'options';
import { GBox } from 'lib/types/widget';
import { MediaMenuSettings } from './menus/media';
import { BluetoothMenuSettings } from './menus/bluetooth';
import { VolumeMenuSettings } from './menus/volume';
import { ConfigPage, configPages } from './helpers';
import { pageList } from 'widget/settings/helpers';
type Page =
| 'General'
| 'Bar'
| 'Clock Menu'
| 'Dashboard Menu'
| 'Media Menu'
| 'Power Menu'
| 'Bluetooth Menu'
| 'Volume'
| 'Notifications'
| 'OSD'
| 'Custom Modules';
const { transition, transitionTime } = options.menus;
const CurrentPage = Variable<Page>('General');
const pagerMap: Page[] = [
'General',
'Bar',
'Notifications',
'OSD',
'Media Menu',
'Power Menu',
'Bluetooth Menu',
'Volume',
'Clock Menu',
'Dashboard Menu',
'Custom Modules',
];
const CurrentPage = Variable<ConfigPage>('General');
export const SettingsMenu = (): GBox => {
return Widget.Box({
@@ -48,7 +15,7 @@ export const SettingsMenu = (): GBox => {
class_name: 'option-pages-container',
hpack: 'center',
hexpand: true,
children: pagerMap.map((page) => {
children: pageList(configPages).map((page) => {
return Widget.Button({
hpack: 'center',
class_name: CurrentPage.bind('value').as((v) => `pager-button ${v === page ? 'active' : ''}`),
@@ -59,20 +26,10 @@ export const SettingsMenu = (): GBox => {
}),
Widget.Stack({
vexpand: true,
transition: transition.bind('value'),
transitionDuration: transitionTime.bind('value'),
class_name: 'themes-menu-stack',
children: {
General: BarGeneral(),
Bar: BarSettings(),
'Media Menu': MediaMenuSettings(),
Notifications: NotificationSettings(),
OSD: OSDSettings(),
Volume: VolumeMenuSettings(),
'Clock Menu': ClockMenuSettings(),
'Dashboard Menu': DashboardMenuSettings(),
'Custom Modules': CustomModuleSettings(),
'Bluetooth Menu': BluetoothMenuSettings(),
'Power Menu': PowerMenuSettings(),
},
children: configPages,
shown: CurrentPage.bind('value'),
}),
],

37
widget/settings/pages/theme/helpers.ts Normal file
View File

@@ -0,0 +1,37 @@
import { BarTheme } from './bar/index';
import { NotificationsTheme } from './notifications/index';
import { BatteryMenuTheme } from './menus/battery';
import { BluetoothMenuTheme } from './menus/bluetooth';
import { ClockMenuTheme } from './menus/clock';
import { DashboardMenuTheme } from './menus/dashboard';
import { MenuTheme } from './menus/index';
import { MediaMenuTheme } from './menus/media';
import { NetworkMenuTheme } from './menus/network';
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';
import { CustomModuleTheme } from 'customModules/theme';
import { PowerMenuTheme } from './menus/power';
export const themePages = {
'General Settings': MenuTheme(),
'Matugen Settings': Matugen(),
Bar: BarTheme(),
Notifications: NotificationsTheme(),
OSD: OsdTheme(),
'Battery Menu': BatteryMenuTheme(),
'Bluetooth Menu': BluetoothMenuTheme(),
'Clock Menu': ClockMenuTheme(),
'Dashboard Menu': DashboardMenuTheme(),
'Media Menu': MediaMenuTheme(),
'Network Menu': NetworkMenuTheme(),
'Notifications Menu': NotificationsMenuTheme(),
'System Tray': SystrayMenuTheme(),
'Volume Menu': VolumeMenuTheme(),
'Power Menu': PowerMenuTheme(),
'Custom Modules': CustomModuleTheme(),
} as const;
export type ThemePage = keyof typeof themePages;

81
widget/settings/pages/theme/index.ts
View File

@@ -1,59 +1,11 @@
import { BarTheme } from './bar/index';
import { NotificationsTheme } from './notifications/index';
import { BatteryMenuTheme } from './menus/battery';
import { BluetoothMenuTheme } from './menus/bluetooth';
import { ClockMenuTheme } from './menus/clock';
import { DashboardMenuTheme } from './menus/dashboard';
import { MenuTheme } from './menus/index';
import { MediaMenuTheme } from './menus/media';
import { NetworkMenuTheme } from './menus/network';
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';
import { CustomModuleTheme } from 'customModules/theme';
import { PowerMenuTheme } from './menus/power';
import options from 'options';
import { GBox } from 'lib/types/widget';
import { ThemePage, themePages } from './helpers';
import { pageList } from 'widget/settings/helpers';
type Page =
| 'General Settings'
| 'Matugen Settings'
| 'Bar'
| 'Notifications'
| 'OSD'
| 'Battery Menu'
| 'Bluetooth Menu'
| 'Clock Menu'
| 'Dashboard Menu'
| 'Media Menu'
| 'Network Menu'
| 'Notifications Menu'
| 'System Tray'
| 'Volume Menu'
| 'Power Menu'
| 'Custom Modules';
const { transition, transitionTime } = options.menus;
const CurrentPage = Variable<Page>('General Settings');
const pagerMap: Page[] = [
'General Settings',
'Matugen Settings',
'Bar',
'Notifications',
'OSD',
'Battery Menu',
'Bluetooth Menu',
'Clock Menu',
'Dashboard Menu',
'Media Menu',
'Network Menu',
'Notifications Menu',
'System Tray',
'Volume Menu',
'Power Menu',
'Custom Modules',
];
const CurrentPage = Variable<ThemePage>('General Settings');
export const ThemesMenu = (): GBox => {
return Widget.Box({
@@ -66,7 +18,7 @@ export const ThemesMenu = (): GBox => {
vertical: true,
children: [0, 1, 2].map((section) => {
return Widget.Box({
children: pagerMap.map((page, index) => {
children: pageList(themePages).map((page, index) => {
if (index >= section * 6 && index < section * 6 + 6) {
return Widget.Button({
hpack: 'center',
@@ -85,25 +37,10 @@ export const ThemesMenu = (): GBox => {
}),
Widget.Stack({
vexpand: true,
transition: transition.bind('value'),
transitionDuration: transitionTime.bind('value'),
class_name: 'themes-menu-stack',
children: {
'General Settings': MenuTheme(),
'Matugen Settings': Matugen(),
Bar: BarTheme(),
Notifications: NotificationsTheme(),
OSD: OsdTheme(),
'Battery Menu': BatteryMenuTheme(),
'Bluetooth Menu': BluetoothMenuTheme(),
'Clock Menu': ClockMenuTheme(),
'Dashboard Menu': DashboardMenuTheme(),
'Media Menu': MediaMenuTheme(),
'Network Menu': NetworkMenuTheme(),
'Notifications Menu': NotificationsMenuTheme(),
'System Tray': SystrayMenuTheme(),
'Volume Menu': VolumeMenuTheme(),
'Power Menu': PowerMenuTheme(),
'Custom Modules': CustomModuleTheme(),
},
children: themePages,
shown: CurrentPage.bind('value'),
}),
],

9
widget/settings/settingsPages.ts Normal file
View File

@@ -0,0 +1,9 @@
import { SettingsMenu } from './pages/config/index';
import { ThemesMenu } from './pages/theme/index';
export const settingsPages = {
Configuration: SettingsMenu(),
Theming: ThemesMenu(),
} as const;
export type SettingsPage = keyof typeof settingsPages;