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

Merge branch 'Jas-SinghFSU:master' into master

Browse Source
This commit is contained in:
Ludovic Ortega
2024-10-26 17:57:28 +02:00
committed by GitHub
parent b59dc01e9e bf6fc3dbea
commit 7a7a70d559
23 changed files with 1010 additions and 670 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
customModules/cpu/computeCPU.ts
View File

@@ -4,6 +4,7 @@ import GTop from 'gi://GTop';
let previousCpuData = new GTop.glibtop_cpu();
GTop.glibtop_get_cpu(previousCpuData);
// FIX: Consolidate with Cpu service class
export const computeCPU = (): number => {
const currentCpuData = new GTop.glibtop_cpu();
GTop.glibtop_get_cpu(currentCpuData);

1
customModules/ram/computeRam.ts
View File

@@ -4,6 +4,7 @@ import { divide } from 'customModules/utils';
import { GenericResourceData } from 'lib/types/customModules/generic';
import { Variable as VariableType } from 'types/variable';
// FIX: Consolidate with Ram service class
export const calculateRamUsage = (round: VariableType<boolean>): GenericResourceData => {
try {
const [success, meminfoBytes] = GLib.file_get_contents('/proc/meminfo');

1
customModules/storage/computeStorage.ts
View File

@@ -5,6 +5,7 @@ import { divide } from 'customModules/utils';
import { Variable as VariableType } from 'types/variable';
import { GenericResourceData } from 'lib/types/customModules/generic';
// FIX: Consolidate with Storage service class
export const computeStorage = (round: VariableType<boolean>): GenericResourceData => {
try {
const currentFsUsage = new GTop.glibtop_fsusage();

2
customModules/utils.ts
View File

@@ -159,7 +159,7 @@ export const renderResourceLabel = (lblType: ResourceLabelType, rmUsg: GenericRe
B: (size: number): number => size,
};
// Get them datas in proper GiB, MiB, KiB, TiB, or bytes
// Get the data in proper GiB, MiB, KiB, TiB, or bytes
const totalSizeFormatted = autoFormatSize(total, round);
// get the postfix: one of [TiB, GiB, MiB, KiB, B]
const postfix = getPostfix(total);

1
lib/icons.ts
View File

@@ -41,7 +41,6 @@ export default {
time: 'hourglass-symbolic',
toolbars: 'toolbars-symbolic',
warning: 'dialog-warning-symbolic',
avatar: 'avatar-default-symbolic',
arrow: {
right: 'pan-end-symbolic',
left: 'pan-start-symbolic',

2
lib/types/customModules/generic.d.ts vendored
View File

@@ -6,7 +6,7 @@ export type GenericResourceMetrics = {
percentage: number;
};
type GenericResourceData = ResourceUsage & {
export type GenericResourceData = GenericResourceMetrics & {
free: number;
};

2
modules/bar/utils.ts
View File

@@ -25,7 +25,7 @@ export const openMenu = async (clicked: Button<Child, Attribute>, event: Gdk.Eve
/*
* NOTE: We have to make some adjustments so the menu pops up relatively
* to the center of the button clicked. We don't want the menu to spawn
* offcenter dependending on which edge of the button you click on.
* offcenter depending on which edge of the button you click on.
* -------------
* To fix this, we take the x coordinate of the click within the button's bounds.
* If you click the left edge of a 100 width button, then the x axis will be 0

1
modules/icons/index.ts
View File

@@ -41,7 +41,6 @@ export default {
time: 'hourglass-symbolic',
toolbars: 'toolbars-symbolic',
warning: 'dialog-warning-symbolic',
avatar: 'avatar-default-symbolic',
arrow: {
right: 'pan-end-symbolic',
left: 'pan-start-symbolic',

219
modules/menus/dashboard/stats/index.ts
View File

@@ -1,67 +1,36 @@
import options from 'options';
import Ram from 'services/Ram';
import { GPU_Stat } from 'lib/types/gpustat';
import { dependencies } from 'lib/utils';
import { BoxWidget } from 'lib/types/widget';
import { GenericResourceMetrics } from 'lib/types/customModules/generic';
import Cpu from 'services/Cpu';
import Storage from 'services/Storage';
import { renderResourceLabel } from 'customModules/utils';
const { terminal } = options;
const { enable_gpu } = options.menus.dashboard.stats;
const { enable_gpu, interval } = options.menus.dashboard.stats;
const ramService = new Ram();
const cpuService = new Cpu();
const storageService = new Storage();
ramService.setShouldRound(true);
storageService.setShouldRound(true);
interval.connect('changed', () => {
ramService.updateTimer(interval.value);
cpuService.updateTimer(interval.value);
storageService.updateTimer(interval.value);
});
const handleClick = (): void => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${terminal} -e btop"`).catch((err) => `Failed to open btop: ${err}`);
};
const Stats = (): BoxWidget => {
const divide = ([total, free]: number[]): number => free / total;
const formatSizeInGB = (sizeInKB: number): number => Number((sizeInKB / 1024 ** 2).toFixed(2));
const cpu = Variable(0, {
poll: [
2000,
'top -b -n 1',
(out): number => {
if (typeof out !== 'string') {
return 0;
}
const cpuOut = out.split('\n').find((line) => line.includes('Cpu(s)'));
if (cpuOut === undefined) {
return 0;
}
const freeCpu = parseFloat(cpuOut.split(/\s+/)[1].replace(',', '.'));
return divide([100, freeCpu]);
},
],
});
const ram = Variable(
{ total: 0, used: 0, percentage: 0 },
{
poll: [
2000,
'free',
(out): GenericResourceMetrics => {
if (typeof out !== 'string') {
return { total: 0, used: 0, percentage: 0 };
}
const ramOut = out.split('\n').find((line) => line.includes('Mem:'));
if (ramOut === undefined) {
return { total: 0, used: 0, percentage: 0 };
}
const [totalRam, usedRam] = ramOut.split(/\s+/).splice(1, 2).map(Number);
return {
percentage: divide([totalRam, usedRam]),
total: formatSizeInGB(totalRam),
used: formatSizeInGB(usedRam),
};
},
],
},
);
const gpu = Variable(0);
const GPUStat = Widget.Box({
@@ -118,28 +87,18 @@ const Stats = (): BoxWidget => {
return (self.children = [
Widget.Button({
on_primary_click: terminal.bind('value').as((term) => {
return (): void => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${term} -e btop"`).catch(
(err) => `Failed to open btop: ${err}`,
);
};
}),
on_primary_click: () => {
handleClick();
},
child: Widget.Label({
class_name: 'txt-icon',
label: '󰢮',
}),
}),
Widget.Button({
on_primary_click: terminal.bind('value').as((term) => {
return (): void => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${term} -e btop"`).catch(
(err) => `Failed to open btop: ${err}`,
);
};
}),
on_primary_click: () => {
handleClick();
},
child: Widget.LevelBar({
class_name: 'stats-bar',
hexpand: true,
@@ -170,40 +129,6 @@ const Stats = (): BoxWidget => {
}),
});
const storage = Variable(
{ total: 0, used: 0, percentage: 0 },
{
poll: [
2000,
'df -B1 /',
(out): GenericResourceMetrics => {
if (typeof out !== 'string') {
return { total: 0, used: 0, percentage: 0 };
}
const dfOut = out.split('\n').find((line) => line.startsWith('/'));
if (dfOut === undefined) {
return { total: 0, used: 0, percentage: 0 };
}
const parts = dfOut.split(/\s+/);
const size = parseInt(parts[1], 10);
const used = parseInt(parts[2], 10);
const sizeInGB = formatSizeInGB(size);
const usedInGB = formatSizeInGB(used);
return {
total: Math.floor(sizeInGB / 1000),
used: Math.floor(usedInGB / 1000),
percentage: divide([size, used]),
};
},
],
},
);
return Widget.Box({
class_name: 'dashboard-card stats-container',
vertical: true,
@@ -220,35 +145,25 @@ const Stats = (): BoxWidget => {
vpack: 'center',
children: [
Widget.Button({
on_primary_click: terminal.bind('value').as((term) => {
return () => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${term} -e btop"`).catch(
(err) => `Failed to open btop: ${err}`,
);
};
}),
on_primary_click: () => {
handleClick();
},
child: Widget.Label({
class_name: 'txt-icon',
label: '',
}),
}),
Widget.Button({
on_primary_click: terminal.bind('value').as((term) => {
return () => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${term} -e btop"`).catch(
(err) => `Failed to open btop: ${err}`,
);
};
}),
on_primary_click: () => {
handleClick();
},
child: Widget.LevelBar({
class_name: 'stats-bar',
hexpand: true,
vpack: 'center',
bar_mode: 'continuous',
max_value: 1,
value: cpu.bind('value'),
value: cpuService.cpu.bind('value').as((cpuUsage) => Math.round(cpuUsage) / 100),
}),
}),
],
@@ -256,7 +171,7 @@ const Stats = (): BoxWidget => {
Widget.Label({
hpack: 'end',
class_name: 'stat-value cpu',
label: cpu.bind('value').as((v) => `${Math.floor(v * 100)}%`),
label: cpuService.cpu.bind('value').as((cpuUsage) => `${Math.round(cpuUsage)}%`),
}),
],
}),
@@ -269,33 +184,25 @@ const Stats = (): BoxWidget => {
hexpand: true,
children: [
Widget.Button({
on_primary_click: terminal.bind('value').as((term) => {
return () => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${term} -e btop"`).catch(
(err) => `Failed to open btop: ${err}`,
);
};
}),
on_primary_click: () => {
handleClick();
},
child: Widget.Label({
class_name: 'txt-icon',
label: '',
}),
}),
Widget.Button({
on_primary_click: terminal.bind('value').as((term) => {
return () => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${term} -e btop"`).catch(
(err) => `Failed to open btop: ${err}`,
);
};
}),
on_primary_click: () => {
handleClick();
},
child: Widget.LevelBar({
class_name: 'stats-bar',
hexpand: true,
vpack: 'center',
value: ram.bind('value').as((v) => v.percentage),
value: ramService.ram.bind('value').as((ramUsage) => {
return ramUsage.percentage / 100;
}),
}),
}),
],
@@ -303,7 +210,9 @@ const Stats = (): BoxWidget => {
Widget.Label({
hpack: 'end',
class_name: 'stat-value ram',
label: ram.bind('value').as((v) => `${v.used}/${v.total} GB`),
label: ramService.ram
.bind('value')
.as((ramUsage) => `${renderResourceLabel('used/total', ramUsage, true)}`),
}),
],
}),
@@ -317,33 +226,25 @@ const Stats = (): BoxWidget => {
vpack: 'center',
children: [
Widget.Button({
on_primary_click: terminal.bind('value').as((term) => {
return () => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${term} -e btop"`).catch(
(err) => `Failed to open btop: ${err}`,
);
};
}),
on_primary_click: () => {
handleClick();
},
child: Widget.Label({
class_name: 'txt-icon',
label: '󰋊',
}),
}),
Widget.Button({
on_primary_click: terminal.bind('value').as((term) => {
return () => {
App.closeWindow('dashboardmenu');
Utils.execAsync(`bash -c "${term} -e btop"`).catch(
(err) => `Failed to open btop: ${err}`,
);
};
}),
on_primary_click: () => {
handleClick();
},
child: Widget.LevelBar({
class_name: 'stats-bar',
hexpand: true,
vpack: 'center',
value: storage.bind('value').as((v) => v.percentage),
value: storageService.storage
.bind('value')
.as((storageUsage) => storageUsage.percentage / 100),
}),
}),
],
@@ -351,7 +252,9 @@ const Stats = (): BoxWidget => {
Widget.Label({
hpack: 'end',
class_name: 'stat-value storage',
label: storage.bind('value').as((v) => `${v.used}/${v.total} GB`),
label: storageService.storage
.bind('value')
.as((storageUsage) => `${renderResourceLabel('used/total', storageUsage, true)}`),
}),
],
}),

2
modules/menus/shared/dropdown/index.ts
View File

@@ -8,7 +8,7 @@ import { globalEventBoxes } from 'globals/dropdown';
const { location } = options.theme.bar;
// NOTE: We make the window visible for 2 seconds (on startup) so the child
// elements can allocat their proper dimensions.
// elements can allocate their proper dimensions.
// Otherwise the width that we rely on for menu positioning is set improperly
// for the first time we open a menu of each type.
const initRender = Variable(true);

22
options.ts
View File

@@ -387,6 +387,8 @@ const options = mkOptions(OPTIONS, {
enabled: opt(colors.lavender),
disabled: opt(tertiary_colors.surface0),
puck: opt(secondary_colors.surface1),
radius: opt('0.2em'),
slider_radius: opt('0.2em'),
},
check_radio_button: {
background: opt(colors.surface1),
@@ -411,6 +413,8 @@ const options = mkOptions(OPTIONS, {
background: opt(tertiary_colors.surface2),
backgroundhover: opt(colors.surface1),
puck: opt(colors.overlay0),
slider_radius: opt('0.3rem'),
progress_radius: opt('0.3rem'),
},
dropdownmenu: {
background: opt(colors.crust),
@@ -1060,12 +1064,13 @@ const options = mkOptions(OPTIONS, {
logout: opt('hyprctl dispatch exit'),
shutdown: opt('systemctl poweroff'),
avatar: {
image: opt('avatar-default-symbolic'),
image: opt('$HOME/.face.icon'),
name: opt<'system' | string>('system'),
},
},
stats: {
enabled: opt(true),
interval: opt(2000),
enable_gpu: opt(false),
},
controls: {
@@ -1113,29 +1118,29 @@ const options = mkOptions(OPTIONS, {
left: {
directory1: {
label: opt('󰉍 Downloads'),
command: opt('bash -c "dolphin $HOME/Downloads/"'),
command: opt('bash -c "xdg-open $HOME/Downloads/"'),
},
directory2: {
label: opt('󰉏 Videos'),
command: opt('bash -c "dolphin $HOME/Videos/"'),
command: opt('bash -c "xdg-open $HOME/Videos/"'),
},
directory3: {
label: opt('󰚝 Projects'),
command: opt('bash -c "dolphin $HOME/Projects/"'),
command: opt('bash -c "xdg-open $HOME/Projects/"'),
},
},
right: {
directory1: {
label: opt('󱧶 Documents'),
command: opt('bash -c "dolphin $HOME/Documents/"'),
command: opt('bash -c "xdg-open $HOME/Documents/"'),
},
directory2: {
label: opt('󰉏 Pictures'),
command: opt('bash -c "dolphin $HOME/Pictures/"'),
command: opt('bash -c "xdg-open $HOME/Pictures/"'),
},
directory3: {
label: opt('󱂵 Home'),
command: opt('bash -c "dolphin $HOME/"'),
command: opt('bash -c "xdg-open $HOME/"'),
},
},
},
@@ -1159,8 +1164,7 @@ const options = mkOptions(OPTIONS, {
scalingPriority: opt<ScalingPriority>('gdk'),
terminal: opt('kitty'),
terminal: opt('$TERM'),
tear: opt(false),
wallpaper: {

2
package.json
View File

@@ -1,7 +1,7 @@
{
"name": "hyprpanel",
"version": "1.0.0",
"description": "A customizble panel built for Hyprland.",
"description": "A customizable panel built for Hyprland.",
"main": "config.js",
"directories": {
"lib": "lib"

950
scss/style/menus/dashboard.scss
View File

@@ -1,386 +1,592 @@
.dashboard-menu-content * {
font-size: $font-size * $bar-menus-menu-dashboard-scaling * 0.01;
font-size: $font-size * $bar-menus-menu-dashboard-scaling * 0.01;
}
.dashboard-content-items {
margin-left: 0.50em;
min-width: 28.5em;
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-dashboard-background-color);
border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-dashboard-border-color);
border-radius: $bar-menus-border-radius;
opacity: $bar-menus-opacity * 0.01;
button {
border-radius: 0.4em;
}
.dashboard-card {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-dashboard-card-color);
margin: 1.3em;
border-radius: $bar-menus-card_radius;
padding: 1.5em;
}
.profile-picture-container {
margin-right: 0.65em;
margin-bottom: 0.65em;
.profile-picture {
min-width: $bar-menus-menu-dashboard-profile-size;
min-height: $bar-menus-menu-dashboard-profile-size;
border-radius: $bar-menus-menu-dashboard-profile-radius;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.profile-name {
font-size: 1.5em;
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-profile-name);
margin-top: 0.75em;
}
}
.power-menu-container {
margin-left: 0em;
margin-bottom: 0.65em;
.dashboard-button {
min-width: 3em;
min-height: 2.5em;
&:not(:last-child) {
margin-bottom: 0.75em;
}
label {
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-shortcuts-text);
font-size: 1.7em;
}
&.shutdown {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-shutdown);
label {
font-size: 1.9em;
}
}
&.restart {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-restart);
label {
font-size: 1.9em;
}
}
&.lock {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-logout);
}
&.sleep {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-sleep);
}
&:hover {
&.shutdown {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-shutdown), 0.5);
}
&.restart {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-restart), 0.5);
}
&.lock {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-logout), 0.5);
}
&.sleep {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-sleep), 0.5);
}
}
}
}
.shortcuts-container {
font-size: 1em;
.dashboard-card {
padding: 1.5em;
button {
min-height: 2.5em;
min-width: 2.5em;
}
}
.card-button-section-container.visible {
margin-right: 1.5em;
}
.top-button.paired {
margin-bottom: 1.5em;
}
.container {
margin-top: 0em;
margin-bottom: 0.65em;
&.most-used {
margin-right: 0.65em;
}
&.utilities.paired {
margin-left: 0em;
}
button {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-background);
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-shortcuts-text);
min-height: 3em;
label {
font-size: 1.5em;
}
&.record.active {
background: $red;
&:hover {
background: transparentize($red, 0.5);
}
}
&:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-background), 0.5);
}
}
}
}
.controls-container {
margin-bottom: 0.65em;
&.dashboard-card {
margin-top: 0em;
}
margin-left: 0.5em;
min-width: 28.5em;
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-dashboard-background-color);
border: $bar-menus-border-size solid
if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-dashboard-border-color);
border-radius: $bar-menus-border-radius;
opacity: $bar-menus-opacity * 0.01;
button {
padding: 0em;
min-height: 3em;
min-width: 3.8em;
label {
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-controls-wifi-text);
font-size: 1.6em;
}
&:not(:last-child) {
margin-right: 1em;
}
&.wifi {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background);
}
&.bluetooth {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background);
}
&.notifications {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background);
}
&.playback {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background);
}
&.input {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background);
}
&.wifi:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background), 0.5);
}
&.bluetooth:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background), 0.5);
}
&.notifications:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background), 0.5);
}
&.playback:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background), 0.5);
}
&.input:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background), 0.5);
}
&.disabled {
background: if($bar-menus-monochrome, $bar-menus-buttons-disabled, $bar-menus-menu-dashboard-controls-disabled);
&.wifi:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background), 0.5);
}
&.bluetooth:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background), 0.5);
}
&.notifications:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background), 0.5);
}
&.playback:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background), 0.5);
}
&.input:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background), 0.5);
}
}
}
}
.directories-container {
&.dashboard-card {
margin-top: 0em;
margin-bottom: 0.65em;
padding-left: 1.5em;
padding-right: 0em;
border-radius: 0.4em;
}
.directory-link {
padding: 0.5em 0em;
min-width: 9em;
&:last-child {
margin-bottom: 0em;
}
label {
font-size: 1.3em;
}
&.right.top {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-top-color);
}
&.right.middle {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-middle-color);
}
&.right.bottom {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-bottom-color);
}
&.left.top {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-top-color);
}
&.left.middle {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-middle-color);
}
&.left.bottom {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-bottom-color);
}
&:hover {
opacity: 0.5;
}
}
}
.stats-container {
margin-top: 0em;
.stat {
label {
margin-right: 0.75em;
font-size: 1.3em;
min-width: 1.65em;
}
&.cpu label {
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-cpu-icon);
}
&.ram label {
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-ram-icon);
}
&.gpu label {
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-gpu-icon);
}
&.storage label {
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-disk-icon);
}
.stats-bar {
levelbar * {
transition: 200ms;
}
trough {
min-height: 1.05em;
}
block {
border-radius: 0.4em;
&.empty {
background: if($bar-menus-monochrome, $bar-menus-progressbar-background, $bar-menus-menu-dashboard-monitors-bar_background);
}
&.filled {
padding-left: 0.85em;
}
}
}
&.cpu .stats-bar block.filled {
background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-cpu-bar);
}
&.ram .stats-bar block.filled {
background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-ram-bar);
}
&.gpu .stats-bar block.filled {
background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-gpu-bar);
}
&.storage .stats-bar block.filled {
background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-disk-bar);
}
.dashboard-card {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-dashboard-card-color);
margin: 0em 1.3em;
border-radius: $bar-menus-card_radius;
padding: 1.5em;
}
.stat-value {
margin-bottom: 0.75em;
font-size: 0.9em;
.profile-picture-container {
margin-right: 0.65em;
&.cpu {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-cpu-label);
}
.profile-picture {
min-width: $bar-menus-menu-dashboard-profile-size;
min-height: $bar-menus-menu-dashboard-profile-size;
border-radius: $bar-menus-menu-dashboard-profile-radius;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
&.ram {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-ram-label);
}
&.gpu {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-gpu-label);
}
&.storage {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-disk-label);
}
.profile-name {
font-size: 1.5em;
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-profile-name);
margin-top: 0.75em;
}
}
.power-menu-container {
margin-left: 0em;
.dashboard-button {
min-width: 3em;
min-height: 2.5em;
&:not(:last-child) {
margin-bottom: 0.75em;
}
label {
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-shortcuts-text);
font-size: 1.7em;
}
&.shutdown {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-powermenu-shutdown
);
label {
font-size: 1.9em;
}
}
&.restart {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-powermenu-restart
);
label {
font-size: 1.9em;
}
}
&.lock {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-powermenu-logout
);
}
&.sleep {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-powermenu-sleep
);
}
&:hover {
&.shutdown {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-powermenu-shutdown
),
0.5
);
}
&.restart {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-powermenu-restart
),
0.5
);
}
&.lock {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-powermenu-logout
),
0.5
);
}
&.sleep {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-powermenu-sleep
),
0.5
);
}
}
}
}
.shortcuts-container {
font-size: 1em;
.dashboard-card {
padding: 1.5em;
button {
min-height: 2.5em;
min-width: 2.5em;
}
}
.card-button-section-container.visible {
margin-right: 1.5em;
}
.top-button.paired {
margin-bottom: 1.5em;
}
.container {
margin-top: 0em;
&.most-used {
margin-right: 0.65em;
}
&.utilities.paired {
margin-left: 0em;
}
button {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-shortcuts-background
);
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-shortcuts-text);
min-height: 3em;
label {
font-size: 1.5em;
}
&.record.active {
background: $red;
&:hover {
background: transparentize($red, 0.5);
}
}
&:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-shortcuts-background
),
0.5
);
}
}
}
}
.controls-container {
&.dashboard-card {
margin-top: 0em;
}
button {
padding: 0em;
min-height: 3em;
min-width: 3.8em;
label {
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-controls-wifi-text);
font-size: 1.6em;
}
&:not(:last-child) {
margin-right: 1em;
}
&.wifi {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-wifi-background
);
}
&.bluetooth {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-bluetooth-background
);
}
&.notifications {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-notifications-background
);
}
&.playback {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-volume-background
);
}
&.input {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-input-background
);
}
&.wifi:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-wifi-background
),
0.5
);
}
&.bluetooth:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-bluetooth-background
),
0.5
);
}
&.notifications:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-notifications-background
),
0.5
);
}
&.playback:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-volume-background
),
0.5
);
}
&.input:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-input-background
),
0.5
);
}
&.disabled {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-disabled,
$bar-menus-menu-dashboard-controls-disabled
);
&.wifi:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-wifi-background
),
0.5
);
}
&.bluetooth:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-bluetooth-background
),
0.5
);
}
&.notifications:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-notifications-background
),
0.5
);
}
&.playback:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-volume-background
),
0.5
);
}
&.input:hover {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-controls-input-background
),
0.5
);
}
}
}
}
.directories-container {
&.dashboard-card {
margin-top: 0em;
padding-left: 1.5em;
padding-right: 0em;
}
.directory-link {
padding: 0.5em 0em;
min-width: 9em;
&:last-child {
margin-bottom: 0em;
}
label {
font-size: 1.3em;
}
&.right.top {
color: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-directories-right-top-color
);
}
&.right.middle {
color: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-directories-right-middle-color
);
}
&.right.bottom {
color: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-directories-right-bottom-color
);
}
&.left.top {
color: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-directories-left-top-color
);
}
&.left.middle {
color: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-directories-left-middle-color
);
}
&.left.bottom {
color: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-dashboard-directories-left-bottom-color
);
}
&:hover {
opacity: 0.5;
}
}
}
.stats-container {
margin-top: 0em;
.stat {
label {
margin-right: 0.75em;
font-size: 1.3em;
min-width: 1.65em;
}
&.cpu label {
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-cpu-icon);
}
&.ram label {
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-ram-icon);
}
&.gpu label {
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-gpu-icon);
}
&.storage label {
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-disk-icon);
}
.stats-bar {
levelbar * {
transition: 200ms;
}
trough {
min-height: 1.05em;
}
block {
border-radius: 0.4em;
&.empty {
background: if(
$bar-menus-monochrome,
$bar-menus-progressbar-background,
$bar-menus-menu-dashboard-monitors-bar_background
);
}
&.filled {
padding-left: 0.85em;
}
}
}
&.cpu .stats-bar block.filled {
background: if(
$bar-menus-monochrome,
$bar-menus-progressbar-foreground,
$bar-menus-menu-dashboard-monitors-cpu-bar
);
}
&.ram .stats-bar block.filled {
background: if(
$bar-menus-monochrome,
$bar-menus-progressbar-foreground,
$bar-menus-menu-dashboard-monitors-ram-bar
);
}
&.gpu .stats-bar block.filled {
background: if(
$bar-menus-monochrome,
$bar-menus-progressbar-foreground,
$bar-menus-menu-dashboard-monitors-gpu-bar
);
}
&.storage .stats-bar block.filled {
background: if(
$bar-menus-monochrome,
$bar-menus-progressbar-foreground,
$bar-menus-menu-dashboard-monitors-disk-bar
);
}
}
.stat-value {
margin-bottom: 0.5em;
font-size: 0.9em;
&.cpu {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-cpu-label);
}
&.ram {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-ram-label);
}
&.gpu {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-gpu-label);
}
&.storage {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-disk-label);
}
}
}
}
}
.dashboard-content-items > :not(:first-child):not(:last-child) {
margin-top: 0;
margin-bottom: 0.65em;
}
.dashboard-content-items > :first-child {
margin-top: 1.3em;
margin-bottom: 0.65em;
}
.dashboard-content-items > :last-child {
margin-top: 0;
margin-bottom: 1.3em;
}
.dashboard-content-items > :only-child {
margin-top: 1.3em;
margin-bottom: 1.3em;
}

245
scss/style/menus/media.scss
View File

@@ -1,126 +1,145 @@
.menu-items.media {
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-media-background-color);
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-media-border-color);
opacity: $bar-menus-opacity * 0.01;
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-media-background-color);
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-media-border-color);
opacity: $bar-menus-opacity * 0.01;
}
.menu-items-container.media {
* {
font-size: $font-size * $bar-menus-menu-media-scaling * 0.01;
}
min-width: 23em * $bar-menus-menu-media-scaling * 0.01;
min-height: 10em * $bar-menus-menu-media-scaling * 0.01;
.menu-section-container {
margin: 1em 0em;
}
.menu-items-section {
border-radius: $bar-menus-card_radius;
padding: 0em;
}
.menu-content {
border-radius: 0.4em;
background-size: cover;
background-position: center;
}
.media-content {
margin: 1em;
}
.media-indicator-current-song-name {
margin-bottom: 0.75rem;
}
.media-indicator-current-song-author {
margin-bottom: 0.75rem;
}
.media-indicator-current-song-name-label {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-media-song);
font-size: 1.35em;
}
.media-indicator-current-song-author-label {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-media-artist);
font-size: 1em;
}
.media-indicator-current-song-album-label {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-media-album);
font-size: 1em;
}
.media-indicator-current-controls {
margin-top: 1.5rem;
margin-bottom: 0.5rem;
}
.media-indicator-control-button {
margin: 0rem 0.5rem;
}
.media-indicator-control-button {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-background);
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-media-buttons-text);
min-height: 1.8em;
min-width: 2.5em;
border-radius: 0.2rem;
&.disabled {
background: if($bar-menus-monochrome, $bar-menus-buttons-disabled, $bar-menus-menu-media-buttons-inactive);
* {
font-size: $font-size * $bar-menus-menu-media-scaling * 0.01;
}
&.enabled {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-background);
min-width: 23em * $bar-menus-menu-media-scaling * 0.01;
min-height: 10em * $bar-menus-menu-media-scaling * 0.01;
&:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-background), 0.5);
}
.menu-section-container {
margin: 1em 0em;
}
&.active {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-enabled);
.menu-items-section {
border-radius: $bar-menus-card_radius;
padding: 0em;
}
.menu-content {
border-radius: 0.4em;
background-size: cover;
background-position: center;
}
.media-content {
margin: 1em;
}
.media-indicator-current-song-name {
margin-bottom: 0.75rem;
}
.media-indicator-current-song-author {
margin-bottom: 0.75rem;
}
.media-indicator-current-song-name-label {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-media-song);
font-size: 1.35em;
}
.media-indicator-current-song-author-label {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-media-artist);
font-size: 1em;
}
.media-indicator-current-song-album-label {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-media-album);
font-size: 1em;
}
.media-indicator-current-controls {
margin-top: 1.5rem;
margin-bottom: 0.5rem;
}
.media-indicator-control-button {
margin: 0rem 0.5rem;
}
.media-indicator-control-button {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-background);
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-media-buttons-text);
min-height: 1.8em;
min-width: 2.5em;
border-radius: 0.2rem;
&.disabled {
background: if($bar-menus-monochrome, $bar-menus-buttons-disabled, $bar-menus-menu-media-buttons-inactive);
}
&.enabled {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-background);
&:hover {
background: transparentize(
if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-background),
0.5
);
}
&.active {
background: if(
$bar-menus-monochrome,
$bar-menus-buttons-default,
$bar-menus-menu-media-buttons-enabled
);
&:hover {
background: transparentize(
if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-enabled),
0.5
);
}
}
}
}
image {
font-size: 1.1em;
}
.menu-slider.media.progress {
margin-top: 1em;
margin-bottom: 1em;
trough {
background: if(
$bar-menus-monochrome,
$bar-menus-slider-background,
$bar-menus-menu-media-slider-background
);
border-radius: $bar-menus-slider-progress-radius;
highlight,
progress {
border-radius: $bar-menus-slider-progress-radius;
min-height: 0.85em;
background: if($bar-menus-monochrome, $bar-menus-slider-primary, $bar-menus-menu-media-slider-primary);
}
}
slider {
background: if($bar-menus-monochrome, $bar-menus-slider-puck, $bar-menus-menu-media-slider-puck);
}
&:hover {
background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-media-buttons-enabled), 0.5);
trough {
background: transparentize(
if(
$bar-menus-monochrome,
$bar-menus-slider-backgroundhover,
$bar-menus-menu-media-slider-backgroundhover
),
0.3
);
}
}
}
}
}
image {
font-size: 1.1em;
}
.menu-slider.media.progress {
margin-top: 1em;
margin-bottom: 1em;
trough {
background: if($bar-menus-monochrome, $bar-menus-slider-background, $bar-menus-menu-media-slider-background);
border-radius: 0.2em;
highlight,
progress {
border-radius: 0.2em;
min-height: .85em;
background: if($bar-menus-monochrome, $bar-menus-slider-primary, $bar-menus-menu-media-slider-primary);
}
}
slider {
background: if($bar-menus-monochrome, $bar-menus-slider-puck, $bar-menus-menu-media-slider-puck);
}
&:hover {
trough {
background: transparentize(if($bar-menus-monochrome, $bar-menus-slider-backgroundhover, $bar-menus-menu-media-slider-backgroundhover), 0.3);
}
}
}
}

12
scss/style/menus/menu.scss
View File

@@ -1,12 +1,12 @@
.menu-slider {
trough {
border-radius: 0.3rem;
border-radius: $bar-menus-slider-progress-radius;
background: $surface0;
highlight,
progress {
background: $peach;
border-radius: 0.3rem;
border-radius: $bar-menus-slider-progress-radius;
}
}
@@ -16,7 +16,7 @@
min-height: 0.6rem;
min-width: 0.6rem;
border: 0rem solid transparent;
border-radius: 0.3rem;
border-radius: $bar-menus-slider-slider-radius;
}
&:hover {
@@ -34,7 +34,7 @@
.menu-switch {
font-size: 1.3em;
background-color: $surface0;
border-radius: 0.2em;
border-radius: $bar-menus-switch-radius;
&:checked {
background: $sky;
@@ -44,7 +44,7 @@
highlight,
progress {
background-color: $peach;
border-radius: 0.3em;
border-radius: $bar-menus-switch-radius;
}
}
@@ -54,7 +54,7 @@
min-height: 1em;
min-width: 1em;
border: 0em solid transparent;
border-radius: 0.2em;
border-radius: $bar-menus-switch-slider-radius;
margin: 0.1em 0.15em;
}

4
scss/style/notifications/popups.scss
View File

@@ -24,8 +24,8 @@
.notification-card-image {
border-radius: 0.4em;
min-width: 1.5em;
min-height: 1.5em;
min-width: 2.5em;
min-height: 2.5em;
padding: 0.85em 0.85em;
background-size: contain;
background-repeat: no-repeat;

41
services/Cpu.ts Normal file
View File

@@ -0,0 +1,41 @@
// TODO: Convert to a real service
// @ts-expect-error: This import is a special directive that tells the compiler to use the GTop library
import GTop from 'gi://GTop';
import { pollVariable } from 'customModules/PollVar';
class Cpu {
private updateFrequency = Variable(2000);
public cpu = Variable(0);
private previousCpuData = new GTop.glibtop_cpu();
constructor() {
GTop.glibtop_get_cpu(this.previousCpuData);
this.calculateUsage = this.calculateUsage.bind(this);
pollVariable(this.cpu, [], this.updateFrequency.bind('value'), this.calculateUsage);
}
public calculateUsage(): number {
const currentCpuData = new GTop.glibtop_cpu();
GTop.glibtop_get_cpu(currentCpuData);
// Calculate the differences from the previous to current data
const totalDiff = currentCpuData.total - this.previousCpuData.total;
const idleDiff = currentCpuData.idle - this.previousCpuData.idle;
const cpuUsagePercentage = totalDiff > 0 ? ((totalDiff - idleDiff) / totalDiff) * 100 : 0;
this.previousCpuData = currentCpuData;
return cpuUsagePercentage;
}
public updateTimer(timerInMs: number): void {
this.updateFrequency.value = timerInMs;
}
}
export default Cpu;

73
services/Ram.ts Normal file
View File

@@ -0,0 +1,73 @@
// TODO: Convert to a real service
const GLib = imports.gi.GLib;
import { pollVariable } from 'customModules/PollVar';
import { GenericResourceData } from 'lib/types/customModules/generic';
class Ram {
private updateFrequency = Variable(2000);
private shouldRound = false;
public ram = Variable<GenericResourceData>({ total: 0, used: 0, percentage: 0, free: 0 });
constructor() {
this.calculateUsage = this.calculateUsage.bind(this);
pollVariable(this.ram, [], this.updateFrequency.bind('value'), this.calculateUsage);
}
public calculateUsage(): GenericResourceData {
try {
const [success, meminfoBytes] = GLib.file_get_contents('/proc/meminfo');
if (!success || !meminfoBytes) {
throw new Error('Failed to read /proc/meminfo or file content is null.');
}
const meminfo = new TextDecoder('utf-8').decode(meminfoBytes);
const totalMatch = meminfo.match(/MemTotal:\s+(\d+)/);
const availableMatch = meminfo.match(/MemAvailable:\s+(\d+)/);
if (!totalMatch || !availableMatch) {
throw new Error('Failed to parse /proc/meminfo for memory values.');
}
const totalRamInBytes = parseInt(totalMatch[1], 10) * 1024;
const availableRamInBytes = parseInt(availableMatch[1], 10) * 1024;
let usedRam = totalRamInBytes - availableRamInBytes;
usedRam = isNaN(usedRam) || usedRam < 0 ? 0 : usedRam;
return {
percentage: this.divide([totalRamInBytes, usedRam]),
total: totalRamInBytes,
used: usedRam,
free: availableRamInBytes,
};
} catch (error) {
console.error('Error calculating RAM usage:', error);
return { total: 0, used: 0, percentage: 0, free: 0 };
}
}
public setShouldRound(round: boolean): void {
this.shouldRound = round;
}
private divide([total, used]: number[]): number {
const percentageTotal = (used / total) * 100;
if (this.shouldRound) {
return total > 0 ? Math.round(percentageTotal) : 0;
}
return total > 0 ? parseFloat(percentageTotal.toFixed(2)) : 0;
}
updateTimer(timerInMs: number): void {
this.updateFrequency.value = timerInMs;
}
}
export default Ram;

61
services/Storage.ts Normal file
View File

@@ -0,0 +1,61 @@
// TODO: Convert to a real service
// @ts-expect-error: This import is a special directive that tells the compiler to use the GTop library
import GTop from 'gi://GTop';
import { pollVariable } from 'customModules/PollVar';
import { GenericResourceData } from 'lib/types/customModules/generic';
class Storage {
private updateFrequency = Variable(2000);
private shouldRound = false;
public storage = Variable<GenericResourceData>({ total: 0, used: 0, percentage: 0, free: 0 });
constructor() {
this.calculateUsage = this.calculateUsage.bind(this);
pollVariable(this.storage, [], this.updateFrequency.bind('value'), this.calculateUsage);
}
public calculateUsage(): GenericResourceData {
try {
const currentFsUsage = new GTop.glibtop_fsusage();
GTop.glibtop_get_fsusage(currentFsUsage, '/');
const total = currentFsUsage.blocks * currentFsUsage.block_size;
const available = currentFsUsage.bavail * currentFsUsage.block_size;
const used = total - available;
return {
total,
used,
free: available,
percentage: this.divide([total, used]),
};
} catch (error) {
console.error('Error calculating Storage usage:', error);
return { total: 0, used: 0, percentage: 0, free: 0 };
}
}
public setShouldRound(round: boolean): void {
this.shouldRound = round;
}
private divide([total, used]: number[]): number {
const percentageTotal = (used / total) * 100;
if (this.shouldRound) {
return total > 0 ? Math.round(percentageTotal) : 0;
}
return total > 0 ? parseFloat(percentageTotal.toFixed(2)) : 0;
}
public updateTimer(timerInMs: number): void {
this.updateFrequency.value = timerInMs;
}
}
export default Storage;

2
widget/settings/pages/config/bar/index.ts
View File

@@ -283,7 +283,7 @@ export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
title: 'Monitor Specific',
subtitle:
'Only workspaces applicable to the monitor will be displayed.\n' +
"Works in conjuction with 'Total Workspaces'.",
"Works in conjunction with 'Total Workspaces'.",
type: 'boolean',
}),
Option({

18
widget/settings/pages/config/menus/dashboard.ts
View File

@@ -16,7 +16,12 @@ export const DashboardMenuSettings = (): Scrollable<Child, Attribute> => {
vertical: true,
children: [
Header('Power Menu'),
Option({ opt: options.menus.dashboard.powermenu.avatar.image, title: 'Profile Image', type: 'img' }),
Option({
opt: options.menus.dashboard.powermenu.avatar.image,
title: 'Profile Image',
type: 'img',
subtitle: "By default, uses '~/.face.icon'",
}),
Option({
opt: options.menus.dashboard.powermenu.avatar.name,
title: 'Profile Name',
@@ -43,8 +48,10 @@ export const DashboardMenuSettings = (): Scrollable<Child, Attribute> => {
Option({ opt: options.menus.dashboard.powermenu.reboot, title: 'Reboot Command', type: 'string' }),
Option({ opt: options.menus.dashboard.powermenu.logout, title: 'Logout Command', type: 'string' }),
Option({ opt: options.menus.dashboard.powermenu.sleep, title: 'Sleep Command', type: 'string' }),
Header('Controls'),
Option({ opt: options.menus.dashboard.controls.enabled, title: 'Enabled', type: 'boolean' }),
Header('Resource Usage Metrics'),
Option({ opt: options.menus.dashboard.stats.enabled, title: 'Enabled', type: 'boolean' }),
Option({
@@ -53,6 +60,15 @@ export const DashboardMenuSettings = (): Scrollable<Child, Attribute> => {
subtitle: "NOTE: This is currently only available for NVidia GPUs and requires 'python-gpustat'.",
type: 'boolean',
}),
Option({
opt: options.menus.dashboard.stats.interval,
title: 'Update Interval',
subtitle: 'The frequency at which to poll system metrics.',
type: 'number',
min: 100,
increment: 500,
}),
Header('Shortcuts'),
Option({ opt: options.menus.dashboard.shortcuts.enabled, title: 'Enabled', type: 'boolean' }),
Option({

16
widget/settings/pages/theme/menus/index.ts
View File

@@ -91,6 +91,12 @@ export const MenuTheme = (): Scrollable<Child, Attribute> => {
Header('Switch'),
Option({ opt: options.theme.bar.menus.switch.enabled, title: 'Enabled', type: 'color' }),
Option({ opt: options.theme.bar.menus.switch.disabled, title: 'Disabled', type: 'color' }),
Option({ opt: options.theme.bar.menus.switch.radius, title: 'Switch Radius', type: 'string' }),
Option({
opt: options.theme.bar.menus.switch.slider_radius,
title: 'Switch Puck Radius',
type: 'string',
}),
Option({ opt: options.theme.bar.menus.switch.puck, title: 'Puck', type: 'color' }),
Header('Check/Radio Buttons'),
@@ -123,6 +129,16 @@ export const MenuTheme = (): Scrollable<Child, Attribute> => {
title: 'Background (Hover)',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.slider.slider_radius,
title: 'Slider Puck Radius',
type: 'string',
}),
Option({
opt: options.theme.bar.menus.slider.progress_radius,
title: 'Slider/Progress Bar Radius',
type: 'string',
}),
Option({ opt: options.theme.bar.menus.slider.puck, title: 'Puck', type: 'color' }),
Header('Dropdown Menu'),

2
widget/settings/pages/theme/menus/media.ts
View File

@@ -73,7 +73,7 @@ export const MediaMenuTheme = (): Scrollable<Child, Attribute> => {
}),
Option({
opt: options.theme.bar.menus.menu.media.slider.backgroundhover,
title: 'Backround (Hover)',
title: 'Background (Hover)',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.media.slider.puck, title: 'Puck', type: 'color' }),