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

Implement layout options

Browse Source
This commit is contained in:
Jas Singh
2024-07-24 09:46:38 -07:00
parent e90fd7cd29
commit 21393c122a
37 changed files with 1288 additions and 644 deletions
Download Patch File Download Diff File Expand all files Collapse all files

163
modules/bar/Bar.ts
View File

@@ -9,71 +9,122 @@ import { Bluetooth } from "./bluetooth/index.js";
import { BatteryLabel } from "./battery/index.js";
import { Clock } from "./clock/index.js";
import { SysTray } from "./systray/index.js";
const hyprland = await Service.import("hyprland");
import { BarItemBox as WidgetContainer } from "../shared/barItemBox.js";
import options from "options";
const { start, center, end } = options.bar.layout;
const { layouts } = options.bar;
export type BarWidget = keyof typeof widget;
type Section = "battery"
| "dashboard"
| "workspaces"
| "windowtitle"
| "media"
| "notifications"
| "volume"
| "network"
| "bluetooth"
| "clock"
| "systray";
type Layout = {
left: Section[],
middle: Section[],
right: Section[],
}
type BarLayout = {
[key: string]: Layout
}
const getModulesForMonitor = (monitor: number, curLayouts: BarLayout) => {
const foundMonitor = Object.keys(curLayouts).find(mon => mon === monitor.toString());
const defaultSetup: Layout = {
left: [
"dashboard",
"workspaces",
"windowtitle"
],
middle: [
"media"
],
right: [
"volume",
"network",
"bluetooth",
"battery",
"systray",
"clock",
"notifications"
]
}
if (foundMonitor === undefined) {
return defaultSetup;
}
return curLayouts[foundMonitor];
}
const widget = {
battery: () => WidgetContainer(BatteryLabel()),
dashboard: () => WidgetContainer(Menu()),
workspaces: (monitor) => WidgetContainer(Workspaces(monitor, 10)),
windowtitle: () => WidgetContainer(ClientTitle()),
media: () => WidgetContainer(Media()),
notifications: () => WidgetContainer(Notifications()),
volume: () => WidgetContainer(Volume()),
network: () => WidgetContainer(Network()),
bluetooth: () => WidgetContainer(Bluetooth()),
clock: () => WidgetContainer(Clock()),
systray: () => WidgetContainer(SysTray()),
battery: () => WidgetContainer(BatteryLabel()),
dashboard: () => WidgetContainer(Menu()),
workspaces: (monitor: number) => WidgetContainer(Workspaces(monitor, 10)),
windowtitle: () => WidgetContainer(ClientTitle()),
media: () => WidgetContainer(Media()),
notifications: () => WidgetContainer(Notifications()),
volume: () => WidgetContainer(Volume()),
network: () => WidgetContainer(Network()),
bluetooth: () => WidgetContainer(Bluetooth()),
clock: () => WidgetContainer(Clock()),
systray: () => WidgetContainer(SysTray()),
};
export const Bar = (monitor: number) => {
return Widget.Window({
name: `bar-${monitor}`,
class_name: "bar",
monitor,
visible: true,
anchor: ["top", "left", "right"],
exclusivity: "exclusive",
child: Widget.CenterBox({
visible: true,
startWidget: Widget.Box({
class_name: "box-left",
spacing: 5,
hexpand: true,
setup: self => {
self.children = start.value.map(w => widget[w](monitor));
self.hook(start, (self) => {
self.children = start.value.map(w => widget[w](monitor));
})
},
}),
centerWidget: Widget.Box({
class_name: "box-center",
hpack: "center",
spacing: 5,
setup: self => {
self.children = center.value.map(w => widget[w](monitor));
self.hook(center, (self) => {
self.children = center.value.map(w => widget[w](monitor));
})
},
}),
endWidget: Widget.Box({
class_name: "box-right",
hpack: "end",
spacing: 5,
setup: self => {
self.children = end.value.map(w => widget[w](monitor));
self.hook(end, (self) => {
self.children = end.value.map(w => widget[w](monitor));
})
},
}),
})
});
return Widget.Window({
name: `bar-${monitor}`,
class_name: "bar",
monitor,
visible: true,
anchor: ["top", "left", "right"],
exclusivity: "exclusive",
child: Widget.CenterBox({
css: 'padding: 1px',
startWidget: Widget.Box({
class_name: "box-left",
hexpand: true,
setup: self => {
self.hook(layouts, (self) => {
const foundLayout = getModulesForMonitor(monitor, layouts.value as BarLayout)
self.children = foundLayout.left.filter(mod => Object.keys(widget).includes(mod)).map(w => widget[w](monitor));
})
},
}),
centerWidget: Widget.Box({
class_name: "box-center",
hpack: "center",
setup: self => {
self.hook(layouts, (self) => {
const foundLayout = getModulesForMonitor(monitor, layouts.value as BarLayout)
self.children = foundLayout.middle.filter(mod => Object.keys(widget).includes(mod)).map(w => widget[w](monitor));
})
},
}),
endWidget: Widget.Box({
class_name: "box-right",
hpack: "end",
setup: self => {
self.hook(layouts, (self) => {
const foundLayout = getModulesForMonitor(monitor, layouts.value as BarLayout)
self.children = foundLayout.right.filter(mod => Object.keys(widget).includes(mod)).map(w => widget[w](monitor));
})
},
}),
})
});
};

2
modules/bar/battery/index.js
View File

@@ -2,7 +2,7 @@ const battery = await Service.import("battery");
import { openMenu } from "../utils.js";
import options from "options";
const { show_label } = options.bar.battery;
const { label: show_label } = options.bar.battery;
const BatteryLabel = () => {
const isVis = Variable(battery.available);

418
modules/menus/dashboard/shortcuts/index.js
View File

@@ -4,222 +4,222 @@ import options from "options";
const { left, right } = options.menus.dashboard.shortcuts;
const Shortcuts = () => {
const isRecording = Variable(false, {
poll: [
1000,
`${App.configDir}/services/screen_record.sh status`,
(out) => {
if (out === "recording") {
return true;
}
return false;
},
],
});
const handleClick = (action, resolver, tOut = 250) => {
App.closeWindow("dashboardmenu");
App.toggleWindow("settings-dialog");
setTimeout(() => {
Utils.execAsync(action)
.then((res) => {
if (typeof resolver === "function") {
return resolver(res);
}
return res;
})
.catch((err) => err);
}, tOut);
};
const recordingDropdown = Widget.Menu({
class_name: "dropdown recording",
hpack: "fill",
hexpand: true,
setup: (self) => {
self.hook(hyprland, () => {
const displays = hyprland.monitors.map((mon) => {
return Widget.MenuItem({
label: `Display ${mon.name}`,
on_activate: () => {
App.closeWindow("dashboardmenu");
Utils.execAsync(
`${App.configDir}/services/screen_record.sh start ${mon.name}`,
).catch((err) => console.error(err));
const isRecording = Variable(false, {
poll: [
1000,
`${App.configDir}/services/screen_record.sh status`,
(out) => {
if (out === "recording") {
return true;
}
return false;
},
});
});
],
});
const handleClick = (action, resolver, tOut = 250) => {
App.closeWindow("dashboardmenu");
const apps = hyprland.clients.map((clt) => {
return Widget.MenuItem({
label: `${clt.class.charAt(0).toUpperCase() + clt.class.slice(1)} (Workspace ${clt.workspace.name})`,
on_activate: () => {
App.closeWindow("dashboardmenu");
Utils.execAsync(
`${App.configDir}/services/screen_record.sh start ${clt.focusHistoryID}`,
).catch((err) => console.error(err));
},
});
});
setTimeout(() => {
Utils.execAsync(action)
.then((res) => {
if (typeof resolver === "function") {
return resolver(res);
}
return (self.children = [
...displays,
// Disabled since window recording isn't available on wayland
// ...apps
]);
});
},
});
return res;
})
.catch((err) => err);
}, tOut);
};
return Widget.Box({
class_name: "shortcuts-container",
hpack: "fill",
hexpand: true,
children: [
Widget.Box({
class_name: "container most-used dashboard-card",
const recordingDropdown = Widget.Menu({
class_name: "dropdown recording",
hpack: "fill",
hexpand: true,
setup: (self) => {
self.hook(hyprland, () => {
const displays = hyprland.monitors.map((mon) => {
return Widget.MenuItem({
label: `Display ${mon.name}`,
on_activate: () => {
App.closeWindow("dashboardmenu");
Utils.execAsync(
`${App.configDir}/services/screen_record.sh start ${mon.name}`,
).catch((err) => console.error(err));
},
});
});
const apps = hyprland.clients.map((clt) => {
return Widget.MenuItem({
label: `${clt.class.charAt(0).toUpperCase() + clt.class.slice(1)} (Workspace ${clt.workspace.name})`,
on_activate: () => {
App.closeWindow("dashboardmenu");
Utils.execAsync(
`${App.configDir}/services/screen_record.sh start ${clt.focusHistoryID}`,
).catch((err) => console.error(err));
},
});
});
return (self.children = [
...displays,
// Disabled since window recording isn't available on wayland
// ...apps
]);
});
},
});
return Widget.Box({
class_name: "shortcuts-container",
hpack: "fill",
hexpand: true,
children: [
Widget.Box({
class_name: "card-button-left-section",
vertical: true,
hexpand: true,
children: [
Widget.Button({
tooltip_text: left.shortcut1.tooltip.bind("value"),
class_name: "dashboard-button top-button",
on_primary_click: left.shortcut1.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: left.shortcut1.icon.bind("value"),
}),
}),
Widget.Button({
tooltip_text: left.shortcut2.tooltip.bind("value"),
class_name: "dashboard-button",
on_primary_click: left.shortcut2.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: left.shortcut2.icon.bind("value"),
}),
}),
],
}),
Widget.Box({
vertical: true,
hexpand: true,
children: [
Widget.Button({
tooltip_text: left.shortcut3.tooltip.bind("value"),
class_name: "dashboard-button top-button",
on_primary_click: left.shortcut3.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
hpack: "center",
class_name: "button-label",
label: left.shortcut3.icon.bind("value"),
}),
}),
Widget.Button({
tooltip_text: left.shortcut4.tooltip.bind("value"),
class_name: "dashboard-button",
on_primary_click: left.shortcut4.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: left.shortcut4.icon.bind("value"),
}),
}),
],
}),
Widget.Box({
class_name: "container most-used dashboard-card",
hexpand: true,
children: [
Widget.Box({
class_name: "card-button-left-section",
vertical: true,
hexpand: true,
children: [
Widget.Button({
tooltip_text: left.shortcut1.tooltip.bind("value"),
class_name: "dashboard-button top-button",
on_primary_click: left.shortcut1.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: left.shortcut1.icon.bind("value"),
}),
}),
Widget.Button({
tooltip_text: left.shortcut2.tooltip.bind("value"),
class_name: "dashboard-button",
on_primary_click: left.shortcut2.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: left.shortcut2.icon.bind("value"),
}),
}),
],
}),
Widget.Box({
vertical: true,
hexpand: true,
children: [
Widget.Button({
tooltip_text: left.shortcut3.tooltip.bind("value"),
class_name: "dashboard-button top-button",
on_primary_click: left.shortcut3.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
hpack: "center",
class_name: "button-label",
label: left.shortcut3.icon.bind("value"),
}),
}),
Widget.Button({
tooltip_text: left.shortcut4.tooltip.bind("value"),
class_name: "dashboard-button",
on_primary_click: left.shortcut4.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: left.shortcut4.icon.bind("value"),
}),
}),
],
}),
],
}),
Widget.Box({
class_name: "container utilities dashboard-card",
hexpand: true,
children: [
Widget.Box({
class_name: "card-button-left-section",
vertical: true,
hexpand: true,
children: [
Widget.Button({
tooltip_text: right.shortcut1.tooltip.bind("value"),
class_name: "dashboard-button top-button",
on_primary_click: right.shortcut1.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: right.shortcut1.icon.bind("value"),
}),
}),
Widget.Button({
tooltip_text: "HyprPanel Configuration",
class_name: "dashboard-button",
on_primary_click: () => {
App.closeWindow("dashboardmenu");
App.toggleWindow("settings-dialog");
},
child: Widget.Label({
class_name: "button-label",
label: "󰒓",
}),
}),
],
}),
Widget.Box({
vertical: true,
hexpand: true,
children: [
Widget.Button({
tooltip_text: right.shortcut3.tooltip.bind("value"),
class_name: "dashboard-button top-button",
on_primary_click: right.shortcut3.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: right.shortcut3.icon.bind("value"),
}),
}),
Widget.Button({
tooltip_text: "Record Screen",
class_name: isRecording
.bind("value")
.as((v) => `dashboard-button record ${v ? "active" : ""}`),
setup: (self) => {
self.hook(isRecording, () => {
self.toggleClassName("hover", true);
self.on_primary_click = (_, event) => {
if (isRecording.value === true) {
App.closeWindow("dashboardmenu");
return Utils.execAsync(
`${App.configDir}/services/screen_record.sh stop`,
).catch((err) => console.error(err));
} else {
recordingDropdown.popup_at_pointer(event);
}
};
});
},
child: Widget.Label({
class_name: "button-label",
label: "󰑊",
}),
}),
],
}),
],
}),
],
}),
Widget.Box({
class_name: "container utilities dashboard-card",
hexpand: true,
children: [
Widget.Box({
class_name: "card-button-left-section",
vertical: true,
hexpand: true,
children: [
Widget.Button({
tooltip_text: right.shortcut1.tooltip.bind("value"),
class_name: "dashboard-button top-button",
on_primary_click: right.shortcut1.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: right.shortcut1.icon.bind("value"),
}),
}),
Widget.Button({
tooltip_text: right.shortcut2.tooltip.bind("value"),
class_name: "dashboard-button",
on_primary_click: right.shortcut2.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: right.shortcut2.icon.bind("value"),
}),
}),
],
}),
Widget.Box({
vertical: true,
hexpand: true,
children: [
Widget.Button({
tooltip_text: right.shortcut3.tooltip.bind("value"),
class_name: "dashboard-button top-button",
on_primary_click: right.shortcut3.command
.bind("value")
.as((cmd) => () => handleClick(cmd)),
child: Widget.Label({
class_name: "button-label",
label: right.shortcut3.icon.bind("value"),
}),
}),
Widget.Button({
tooltip_text: "Record Screen",
class_name: isRecording
.bind("value")
.as((v) => `dashboard-button record ${v ? "active" : ""}`),
setup: (self) => {
self.hook(isRecording, () => {
self.toggleClassName("hover", true);
self.on_primary_click = (_, event) => {
if (isRecording.value === true) {
App.closeWindow("dashboardmenu");
return Utils.execAsync(
`${App.configDir}/services/screen_record.sh stop`,
).catch((err) => console.error(err));
} else {
recordingDropdown.popup_at_pointer(event);
}
};
});
},
child: Widget.Label({
class_name: "button-label",
label: "󰑊",
}),
}),
],
}),
],
}),
],
});
});
};
export { Shortcuts };

5
modules/notifications/index.js
View File

@@ -11,13 +11,16 @@ const { position } = options.notifications;
export default () => {
notifs.popupTimeout = 7000;
const getPosition = (pos) => {
return pos.split(" ");
}
return Widget.Window({
name: "notifications-window",
class_name: "notifications-window",
monitor: 2,
layer: "top",
anchor: position.bind("value"),
anchor: position.bind("value").as(v => getPosition(v)),
exclusivity: "ignore",
child: Widget.Box({
class_name: "notification-card-container",