rm ags
This commit is contained in:
45
flake.lock
generated
45
flake.lock
generated
@@ -1,48 +1,5 @@
|
|||||||
{
|
{
|
||||||
"nodes": {
|
"nodes": {
|
||||||
"ags": {
|
|
||||||
"inputs": {
|
|
||||||
"astal": [
|
|
||||||
"astal"
|
|
||||||
],
|
|
||||||
"nixpkgs": [
|
|
||||||
"nixpkgs"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"locked": {
|
|
||||||
"lastModified": 1775689345,
|
|
||||||
"narHash": "sha256-tM3s7CX+tgxlYW0Sk3nzVThg2MHn08foIuMxABupxIs=",
|
|
||||||
"owner": "aylur",
|
|
||||||
"repo": "ags",
|
|
||||||
"rev": "bbee2f18939f1ec7ff720e717cf305e73635628f",
|
|
||||||
"type": "github"
|
|
||||||
},
|
|
||||||
"original": {
|
|
||||||
"owner": "aylur",
|
|
||||||
"repo": "ags",
|
|
||||||
"type": "github"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"astal": {
|
|
||||||
"inputs": {
|
|
||||||
"nixpkgs": [
|
|
||||||
"nixpkgs"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"locked": {
|
|
||||||
"lastModified": 1780295699,
|
|
||||||
"narHash": "sha256-gt9jeb/HOoiUSOTnE5I9K/B9LEbjJW5k37Xq99HOf/Q=",
|
|
||||||
"owner": "aylur",
|
|
||||||
"repo": "astal",
|
|
||||||
"rev": "271851bbc07748100382ae7caf6ef71c70c01bfc",
|
|
||||||
"type": "github"
|
|
||||||
},
|
|
||||||
"original": {
|
|
||||||
"owner": "aylur",
|
|
||||||
"repo": "astal",
|
|
||||||
"type": "github"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"base16-schemes": {
|
"base16-schemes": {
|
||||||
"flake": false,
|
"flake": false,
|
||||||
"locked": {
|
"locked": {
|
||||||
@@ -297,8 +254,6 @@
|
|||||||
},
|
},
|
||||||
"root": {
|
"root": {
|
||||||
"inputs": {
|
"inputs": {
|
||||||
"ags": "ags",
|
|
||||||
"astal": "astal",
|
|
||||||
"darwin": "darwin",
|
"darwin": "darwin",
|
||||||
"hardware": "hardware",
|
"hardware": "hardware",
|
||||||
"home-manager": "home-manager",
|
"home-manager": "home-manager",
|
||||||
|
|||||||
11
flake.nix
11
flake.nix
@@ -34,17 +34,6 @@
|
|||||||
url = "github:nix-community/nixos-vscode-server";
|
url = "github:nix-community/nixos-vscode-server";
|
||||||
inputs.nixpkgs.follows = "nixpkgs";
|
inputs.nixpkgs.follows = "nixpkgs";
|
||||||
};
|
};
|
||||||
|
|
||||||
astal = {
|
|
||||||
url = "github:aylur/astal";
|
|
||||||
inputs.nixpkgs.follows = "nixpkgs";
|
|
||||||
};
|
|
||||||
|
|
||||||
ags = {
|
|
||||||
url = "github:aylur/ags";
|
|
||||||
inputs.nixpkgs.follows = "nixpkgs";
|
|
||||||
inputs.astal.follows = "astal";
|
|
||||||
};
|
|
||||||
};
|
};
|
||||||
|
|
||||||
outputs = inputs:
|
outputs = inputs:
|
||||||
|
|||||||
@@ -1,57 +0,0 @@
|
|||||||
{ inputs, lib, config, pkgs, ... }:
|
|
||||||
let
|
|
||||||
colorsScss = ''
|
|
||||||
$base00: #${config.colorScheme.palette.base00};
|
|
||||||
$base01: #${config.colorScheme.palette.base01};
|
|
||||||
$base02: #${config.colorScheme.palette.base02};
|
|
||||||
$base03: #${config.colorScheme.palette.base03};
|
|
||||||
$base04: #${config.colorScheme.palette.base04};
|
|
||||||
$base05: #${config.colorScheme.palette.base05};
|
|
||||||
$base06: #${config.colorScheme.palette.base06};
|
|
||||||
$base07: #${config.colorScheme.palette.base07};
|
|
||||||
$base08: #${config.colorScheme.palette.base08};
|
|
||||||
$base09: #${config.colorScheme.palette.base09};
|
|
||||||
$base0A: #${config.colorScheme.palette.base0A};
|
|
||||||
$base0B: #${config.colorScheme.palette.base0B};
|
|
||||||
$base0C: #${config.colorScheme.palette.base0C};
|
|
||||||
$base0D: #${config.colorScheme.palette.base0D};
|
|
||||||
$base0E: #${config.colorScheme.palette.base0E};
|
|
||||||
$base0F: #${config.colorScheme.palette.base0F};
|
|
||||||
|
|
||||||
|
|
||||||
$fg: $base07;
|
|
||||||
$bg0: $base00;
|
|
||||||
$bg1: $base01;
|
|
||||||
|
|
||||||
$border-color: $base03;
|
|
||||||
$border-color-focus: $base04;
|
|
||||||
$border-radius: ${config.colorScheme.palette.border-radius}px;
|
|
||||||
$border-width: ${config.colorScheme.palette.border-width}px;
|
|
||||||
|
|
||||||
$gaps-screen: ${config.colorScheme.palette.gaps-screen}px;
|
|
||||||
$gaps-window: ${config.colorScheme.palette.gaps-window}px;
|
|
||||||
'';
|
|
||||||
configDir = pkgs.runCommandLocal "ags-config" {} ''
|
|
||||||
mkdir -p "$out"
|
|
||||||
cp -r ${lib.cleanSource ./src}/. "$out/"
|
|
||||||
mkdir -p "$out/css"
|
|
||||||
cat > "$out/css/_colors.scss" <<'EOF'
|
|
||||||
${colorsScss}
|
|
||||||
EOF
|
|
||||||
'';
|
|
||||||
in {
|
|
||||||
|
|
||||||
imports = [ inputs.ags.homeManagerModules.default ];
|
|
||||||
config = lib.mkIf (config.usercfg.wm == "Wayland") {
|
|
||||||
programs.ags = {
|
|
||||||
enable = true;
|
|
||||||
configDir = configDir;
|
|
||||||
extraPackages = with pkgs; [
|
|
||||||
inputs.astal.packages.${pkgs.system}.battery
|
|
||||||
fzf
|
|
||||||
bluez
|
|
||||||
custom.amdgpu_top
|
|
||||||
];
|
|
||||||
};
|
|
||||||
};
|
|
||||||
}
|
|
||||||
@@ -1,768 +0,0 @@
|
|||||||
import app from "ags/gtk4/app"
|
|
||||||
import { Astal } from "ags/gtk4"
|
|
||||||
import { createState, onCleanup } from "ags"
|
|
||||||
import { readFileAsync } from "ags/file"
|
|
||||||
import { execAsync } from "ags/process"
|
|
||||||
import { createPoll } from "ags/time"
|
|
||||||
import Gdk from "gi://Gdk?version=4.0"
|
|
||||||
import GLib from "gi://GLib"
|
|
||||||
import Gtk from "gi://Gtk?version=4.0"
|
|
||||||
|
|
||||||
import style from "./style.scss"
|
|
||||||
|
|
||||||
type Workspace = {
|
|
||||||
id: number
|
|
||||||
occupied: boolean
|
|
||||||
focused: boolean
|
|
||||||
}
|
|
||||||
|
|
||||||
type BatteryState = {
|
|
||||||
available: boolean
|
|
||||||
percent: number
|
|
||||||
status: string
|
|
||||||
remaining: string
|
|
||||||
icon: string
|
|
||||||
}
|
|
||||||
|
|
||||||
type SystemState = {
|
|
||||||
cpu: number
|
|
||||||
gpu: number
|
|
||||||
memory: number
|
|
||||||
memoryText: string
|
|
||||||
battery: BatteryState
|
|
||||||
}
|
|
||||||
|
|
||||||
type ConnectivityState = {
|
|
||||||
wifi: {
|
|
||||||
label: string
|
|
||||||
detail: string
|
|
||||||
icon: string
|
|
||||||
}
|
|
||||||
ethernet: {
|
|
||||||
label: string
|
|
||||||
detail: string
|
|
||||||
icon: string
|
|
||||||
}
|
|
||||||
bluetooth: {
|
|
||||||
label: string
|
|
||||||
detail: string
|
|
||||||
icon: string
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
type ClockState = {
|
|
||||||
hour: string
|
|
||||||
minute: string
|
|
||||||
month: string
|
|
||||||
year: string
|
|
||||||
}
|
|
||||||
|
|
||||||
const SYSTEM_INIT: SystemState = {
|
|
||||||
cpu: 0,
|
|
||||||
gpu: 0,
|
|
||||||
memory: 0,
|
|
||||||
memoryText: "0 / 0 GiB",
|
|
||||||
battery: {
|
|
||||||
available: false,
|
|
||||||
percent: 0,
|
|
||||||
status: "No battery",
|
|
||||||
remaining: "",
|
|
||||||
icon: "",
|
|
||||||
},
|
|
||||||
}
|
|
||||||
|
|
||||||
const CONNECTIVITY_INIT: ConnectivityState = {
|
|
||||||
wifi: {
|
|
||||||
label: "Wi-Fi",
|
|
||||||
detail: "Unavailable",
|
|
||||||
icon: "",
|
|
||||||
},
|
|
||||||
ethernet: {
|
|
||||||
label: "Ethernet",
|
|
||||||
detail: "Disconnected",
|
|
||||||
icon: "",
|
|
||||||
},
|
|
||||||
bluetooth: {
|
|
||||||
label: "Bluetooth",
|
|
||||||
detail: "Off",
|
|
||||||
icon: "",
|
|
||||||
},
|
|
||||||
}
|
|
||||||
|
|
||||||
const CLOCK_INIT: ClockState = {
|
|
||||||
hour: "--",
|
|
||||||
minute: "--",
|
|
||||||
month: "--",
|
|
||||||
year: "--",
|
|
||||||
}
|
|
||||||
|
|
||||||
let previousCpuSample: { total: number; idle: number } | null = null
|
|
||||||
const [powerMenuVisible, setPowerMenuVisible] = createState(false)
|
|
||||||
|
|
||||||
function attachHover(widget: Gtk.Widget, onEnter: () => void, onLeave: () => void) {
|
|
||||||
const controller = new Gtk.EventControllerMotion()
|
|
||||||
controller.connect("enter", onEnter)
|
|
||||||
controller.connect("leave", onLeave)
|
|
||||||
widget.add_controller(controller)
|
|
||||||
}
|
|
||||||
|
|
||||||
function clampPercent(value: number) {
|
|
||||||
if (!Number.isFinite(value)) {
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
|
|
||||||
return Math.max(0, Math.min(100, Math.round(value)))
|
|
||||||
}
|
|
||||||
|
|
||||||
async function commandOrEmpty(command: string | string[]) {
|
|
||||||
try {
|
|
||||||
return (await execAsync(command)).trim()
|
|
||||||
} catch {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function readText(path: string) {
|
|
||||||
try {
|
|
||||||
return (await readFileAsync(path)).trim()
|
|
||||||
} catch {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function readNumber(path: string) {
|
|
||||||
const value = Number(await readText(path))
|
|
||||||
return Number.isFinite(value) ? value : 0
|
|
||||||
}
|
|
||||||
|
|
||||||
function run(command: string) {
|
|
||||||
execAsync(["bash", "-lc", command]).catch((error) => console.error(error))
|
|
||||||
}
|
|
||||||
|
|
||||||
function focusWorkspace(id: number) {
|
|
||||||
run(`hyprctl dispatch workspace ${id}`)
|
|
||||||
}
|
|
||||||
|
|
||||||
function mediaAction(action: string) {
|
|
||||||
run(`playerctl ${action}`)
|
|
||||||
}
|
|
||||||
|
|
||||||
async function readWeather() {
|
|
||||||
const line = await commandOrEmpty([
|
|
||||||
"bash",
|
|
||||||
"-lc",
|
|
||||||
"curl -fsS 'https://wttr.in/?format=%l:+%C+%t' 2>/dev/null | head -n1",
|
|
||||||
])
|
|
||||||
|
|
||||||
return line || "Weather unavailable"
|
|
||||||
}
|
|
||||||
|
|
||||||
function renderCalendar(now: Date) {
|
|
||||||
const monthLabel = now.toLocaleString("en-US", { month: "short" }).toUpperCase()
|
|
||||||
const year = now.getFullYear()
|
|
||||||
const header = `${monthLabel} ${year}`
|
|
||||||
const weekdays = "MO TU WE TH FR SA SU"
|
|
||||||
const first = new Date(year, now.getMonth(), 1)
|
|
||||||
const lastDay = new Date(year, now.getMonth() + 1, 0).getDate()
|
|
||||||
const offset = (first.getDay() + 6) % 7
|
|
||||||
const slots = Array.from({ length: offset + lastDay }, (_, index) =>
|
|
||||||
index < offset ? " " : String(index - offset + 1).padStart(2, " "),
|
|
||||||
)
|
|
||||||
|
|
||||||
const rows = []
|
|
||||||
for (let index = 0; index < slots.length; index += 7) {
|
|
||||||
rows.push(slots.slice(index, index + 7).join(" "))
|
|
||||||
}
|
|
||||||
|
|
||||||
return [header, weekdays, ...rows].join("\n").replace(/ /g, "\u2007")
|
|
||||||
}
|
|
||||||
|
|
||||||
function workspaceIcon(workspace: Workspace) {
|
|
||||||
if (workspace.focused) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (workspace.occupied) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
function wifiIcon(detail: string) {
|
|
||||||
if (detail === "Off") {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
const strength = Number(detail.split("%", 1)[0])
|
|
||||||
|
|
||||||
if (!Number.isFinite(strength) || strength <= 0) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (strength < 25) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (strength < 50) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (strength < 75) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
function batteryIcon(percent: number, status: string) {
|
|
||||||
if (status === "Charging") {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 10) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 20) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 30) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 40) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 50) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 60) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 70) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 80) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
if (percent <= 90) {
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
return ""
|
|
||||||
}
|
|
||||||
|
|
||||||
function formatHours(hours: number) {
|
|
||||||
const totalMinutes = Math.max(0, Math.round(hours * 60))
|
|
||||||
const hh = String(Math.floor(totalMinutes / 60)).padStart(2, "0")
|
|
||||||
const mm = String(totalMinutes % 60).padStart(2, "0")
|
|
||||||
return `${hh}:${mm}`
|
|
||||||
}
|
|
||||||
|
|
||||||
async function readWorkspaces() {
|
|
||||||
const [workspacesRaw, monitorsRaw] = await Promise.all([
|
|
||||||
commandOrEmpty(["hyprctl", "-j", "workspaces"]),
|
|
||||||
commandOrEmpty(["hyprctl", "-j", "monitors"]),
|
|
||||||
])
|
|
||||||
|
|
||||||
const workspaces = workspacesRaw ? JSON.parse(workspacesRaw) : []
|
|
||||||
const monitors = monitorsRaw ? JSON.parse(monitorsRaw) : []
|
|
||||||
const focused = monitors.find((monitor: any) => monitor.focused)?.activeWorkspace?.id ?? 1
|
|
||||||
const occupied = new Set(
|
|
||||||
workspaces
|
|
||||||
.map((workspace: any) => Number(workspace.id))
|
|
||||||
.filter((id: number) => Number.isFinite(id) && id > 0),
|
|
||||||
)
|
|
||||||
|
|
||||||
return Array.from({ length: 10 }, (_, index) => {
|
|
||||||
const id = index + 1
|
|
||||||
|
|
||||||
return {
|
|
||||||
id,
|
|
||||||
occupied: occupied.has(id),
|
|
||||||
focused: focused === id,
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
async function readSystem() {
|
|
||||||
const [statRaw, meminfoRaw, gpuRaw] = await Promise.all([
|
|
||||||
readText("/proc/stat"),
|
|
||||||
readText("/proc/meminfo"),
|
|
||||||
commandOrEmpty(["amdgpu_top", "-J", "-n", "1"]),
|
|
||||||
])
|
|
||||||
|
|
||||||
let cpu = 0
|
|
||||||
const statLine = statRaw.split("\n")[0] ?? ""
|
|
||||||
const cpuValues = statLine
|
|
||||||
.split(/\s+/)
|
|
||||||
.slice(1)
|
|
||||||
.map((value) => Number(value))
|
|
||||||
.filter((value) => Number.isFinite(value))
|
|
||||||
|
|
||||||
if (cpuValues.length >= 4) {
|
|
||||||
const total = cpuValues.reduce((sum, value) => sum + value, 0)
|
|
||||||
const idle = (cpuValues[3] ?? 0) + (cpuValues[4] ?? 0)
|
|
||||||
|
|
||||||
if (previousCpuSample) {
|
|
||||||
const totalDelta = total - previousCpuSample.total
|
|
||||||
const idleDelta = idle - previousCpuSample.idle
|
|
||||||
|
|
||||||
if (totalDelta > 0) {
|
|
||||||
cpu = clampPercent(((totalDelta - idleDelta) / totalDelta) * 100)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
previousCpuSample = { total, idle }
|
|
||||||
}
|
|
||||||
|
|
||||||
const memTotal = Number(meminfoRaw.match(/^MemTotal:\s+(\d+)/m)?.[1] ?? 0)
|
|
||||||
const memAvailable = Number(meminfoRaw.match(/^MemAvailable:\s+(\d+)/m)?.[1] ?? 0)
|
|
||||||
const memUsed = Math.max(0, memTotal - memAvailable)
|
|
||||||
const memory = memTotal > 0 ? clampPercent((memUsed / memTotal) * 100) : 0
|
|
||||||
const memoryText = `${(memUsed / 1024 / 1024).toFixed(1)} / ${(memTotal / 1024 / 1024).toFixed(1)} GiB`
|
|
||||||
|
|
||||||
let gpu = 0
|
|
||||||
|
|
||||||
if (gpuRaw) {
|
|
||||||
try {
|
|
||||||
const gpuData = JSON.parse(gpuRaw)
|
|
||||||
const device = gpuData.devices?.[0] ?? {}
|
|
||||||
|
|
||||||
gpu =
|
|
||||||
clampPercent(
|
|
||||||
Number(
|
|
||||||
device.gpu_activity?.GFX?.value ??
|
|
||||||
device.GRBM2?.["Command Processor - Graphics"]?.value ??
|
|
||||||
device.GRBM2?.["CommandProcessor-Graphics"]?.value ??
|
|
||||||
0,
|
|
||||||
),
|
|
||||||
) || 0
|
|
||||||
} catch {
|
|
||||||
gpu = 0
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const batteryPresent = Boolean(await readText("/sys/class/power_supply/BAT0/status"))
|
|
||||||
let battery = SYSTEM_INIT.battery
|
|
||||||
|
|
||||||
if (batteryPresent) {
|
|
||||||
const [status, percent, powerNow, energyNow, energyFull] = await Promise.all([
|
|
||||||
readText("/sys/class/power_supply/BAT0/status"),
|
|
||||||
readNumber("/sys/class/power_supply/BAT0/capacity"),
|
|
||||||
readNumber("/sys/class/power_supply/BAT0/power_now"),
|
|
||||||
readNumber("/sys/class/power_supply/BAT0/energy_now"),
|
|
||||||
readNumber("/sys/class/power_supply/BAT0/energy_full"),
|
|
||||||
])
|
|
||||||
|
|
||||||
let remaining = status
|
|
||||||
|
|
||||||
if (powerNow > 0 && energyNow > 0 && energyFull > 0) {
|
|
||||||
const hours =
|
|
||||||
status === "Charging"
|
|
||||||
? (energyFull - energyNow) / powerNow
|
|
||||||
: status === "Discharging"
|
|
||||||
? energyNow / powerNow
|
|
||||||
: 0
|
|
||||||
|
|
||||||
if (hours > 0) {
|
|
||||||
remaining = `${formatHours(hours)} ${status === "Charging" ? "to full" : "left"}`
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
battery = {
|
|
||||||
available: true,
|
|
||||||
percent: clampPercent(percent),
|
|
||||||
status,
|
|
||||||
remaining,
|
|
||||||
icon: batteryIcon(percent, status),
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
cpu,
|
|
||||||
gpu,
|
|
||||||
memory,
|
|
||||||
memoryText,
|
|
||||||
battery,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function readConnectivity() {
|
|
||||||
const deviceStatus = await commandOrEmpty(["nmcli", "-t", "-f", "DEVICE,TYPE,STATE,CONNECTION", "device", "status"])
|
|
||||||
const devices = deviceStatus
|
|
||||||
.split("\n")
|
|
||||||
.map((line) => line.trim())
|
|
||||||
.filter(Boolean)
|
|
||||||
.map((line) => {
|
|
||||||
const [device, type, state, connection] = line.split(":")
|
|
||||||
return { device, type, state, connection }
|
|
||||||
})
|
|
||||||
|
|
||||||
const wifiDevice = devices.find((device) => device.type === "wifi")
|
|
||||||
const ethernetDevice = devices.find((device) => device.type === "ethernet")
|
|
||||||
|
|
||||||
let wifi = CONNECTIVITY_INIT.wifi
|
|
||||||
|
|
||||||
if (wifiDevice) {
|
|
||||||
if (wifiDevice.state === "connected") {
|
|
||||||
const wifiList = await commandOrEmpty([
|
|
||||||
"nmcli",
|
|
||||||
"-t",
|
|
||||||
"-f",
|
|
||||||
"IN-USE,SIGNAL,SSID",
|
|
||||||
"device",
|
|
||||||
"wifi",
|
|
||||||
"list",
|
|
||||||
"--rescan",
|
|
||||||
"no",
|
|
||||||
])
|
|
||||||
const activeLine =
|
|
||||||
wifiList
|
|
||||||
.split("\n")
|
|
||||||
.map((line) => line.trim())
|
|
||||||
.find((line) => line.startsWith("*:")) ?? ""
|
|
||||||
const [, signalRaw = "0", ssid = wifiDevice.connection] = activeLine.split(":")
|
|
||||||
const signal = clampPercent(Number(signalRaw))
|
|
||||||
|
|
||||||
wifi = {
|
|
||||||
label: "Wi-Fi",
|
|
||||||
detail: `${signal}% ${ssid || wifiDevice.connection}`,
|
|
||||||
icon: wifiIcon(`${signal}%`),
|
|
||||||
}
|
|
||||||
} else if (wifiDevice.state === "disconnected") {
|
|
||||||
wifi = {
|
|
||||||
label: "Wi-Fi",
|
|
||||||
detail: "Idle",
|
|
||||||
icon: "",
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const ethernet =
|
|
||||||
ethernetDevice && ethernetDevice.state === "connected"
|
|
||||||
? {
|
|
||||||
label: "Ethernet",
|
|
||||||
detail: ethernetDevice.connection || ethernetDevice.device,
|
|
||||||
icon: "",
|
|
||||||
}
|
|
||||||
: CONNECTIVITY_INIT.ethernet
|
|
||||||
|
|
||||||
const bluetoothShow = await commandOrEmpty(["bash", "-lc", "bluetoothctl show 2>/dev/null || true"])
|
|
||||||
const bluetoothDevices = await commandOrEmpty([
|
|
||||||
"bash",
|
|
||||||
"-lc",
|
|
||||||
"bluetoothctl devices Connected 2>/dev/null | cut -d' ' -f3- || true",
|
|
||||||
])
|
|
||||||
const bluetoothPowered = /Powered:\s+yes/.test(bluetoothShow)
|
|
||||||
const connectedDevices = bluetoothDevices.split("\n").map((line) => line.trim()).filter(Boolean)
|
|
||||||
|
|
||||||
const bluetooth = bluetoothPowered
|
|
||||||
? {
|
|
||||||
label: "Bluetooth",
|
|
||||||
detail: connectedDevices[0] ?? "Ready",
|
|
||||||
icon: connectedDevices.length > 0 ? "" : "",
|
|
||||||
}
|
|
||||||
: CONNECTIVITY_INIT.bluetooth
|
|
||||||
|
|
||||||
return {
|
|
||||||
wifi,
|
|
||||||
ethernet,
|
|
||||||
bluetooth,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function Section(props: { title: string; className?: string; children?: JSX.Element | Array<JSX.Element> }) {
|
|
||||||
return (
|
|
||||||
<box class={`section ${props.className ?? ""}`} orientation={Gtk.Orientation.VERTICAL}>
|
|
||||||
<label class="section-title" xalign={0} label={props.title} />
|
|
||||||
<box class="section-body" orientation={Gtk.Orientation.VERTICAL} spacing={0}>
|
|
||||||
{props.children}
|
|
||||||
</box>
|
|
||||||
</box>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function StatRow(props: {
|
|
||||||
icon: any
|
|
||||||
label: any
|
|
||||||
value: any
|
|
||||||
fraction?: any
|
|
||||||
visible?: any
|
|
||||||
}) {
|
|
||||||
return (
|
|
||||||
<box class="stat-row" orientation={Gtk.Orientation.VERTICAL} visible={props.visible ?? true}>
|
|
||||||
<box class="stat-head" orientation={Gtk.Orientation.VERTICAL} spacing={4}>
|
|
||||||
<label class="stat-icon" label={props.icon} />
|
|
||||||
</box>
|
|
||||||
<levelbar class="stat-bar" minValue={0} maxValue={1} value={props.fraction ?? 0} />
|
|
||||||
</box>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function StatusRow(props: { icon: any; label: any; detail: any }) {
|
|
||||||
return (
|
|
||||||
<box class="status-row">
|
|
||||||
<label class="status-icon" label={props.icon} />
|
|
||||||
</box>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function ActionButton(props: { icon: string; tooltip: string; command: string }) {
|
|
||||||
return (
|
|
||||||
<button class="action-button" tooltipText={props.tooltip} onClicked={() => run(props.command)}>
|
|
||||||
<label class="action-icon" label={props.icon} />
|
|
||||||
</button>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function WorkspacesSection() {
|
|
||||||
const workspaces = createPoll<Workspace[]>([], 1500, readWorkspaces)
|
|
||||||
const workspaceIds = Array.from({ length: 10 }, (_, index) => index + 1)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Section title="Desktops" className="desktops-section">
|
|
||||||
<box class="workspace-stack" orientation={Gtk.Orientation.VERTICAL} spacing={2}>
|
|
||||||
{workspaceIds.map((id) => {
|
|
||||||
const workspace = workspaces(
|
|
||||||
(items) => items.find((item) => item.id === id) ?? { id, occupied: false, focused: false },
|
|
||||||
)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<button
|
|
||||||
class={workspace((item) =>
|
|
||||||
item.focused
|
|
||||||
? "workspace-button focused"
|
|
||||||
: item.occupied
|
|
||||||
? "workspace-button occupied"
|
|
||||||
: "workspace-button",
|
|
||||||
)}
|
|
||||||
tooltipText={`Workspace ${id}`}
|
|
||||||
onClicked={() => focusWorkspace(id)}
|
|
||||||
>
|
|
||||||
<label class="workspace-icon" label={workspace((item) => workspaceIcon(item))} />
|
|
||||||
</button>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
</box>
|
|
||||||
</Section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function MediaSection() {
|
|
||||||
return (
|
|
||||||
<Section title="Media">
|
|
||||||
<box class="media-controls" orientation={Gtk.Orientation.VERTICAL} spacing={4}>
|
|
||||||
<button class="mini-button" tooltipText="Previous" onClicked={() => mediaAction("previous")}>
|
|
||||||
<label label="" />
|
|
||||||
</button>
|
|
||||||
<button class="mini-button" tooltipText="Play / Pause" onClicked={() => mediaAction("play-pause")}>
|
|
||||||
<label label="" />
|
|
||||||
</button>
|
|
||||||
<button class="mini-button" tooltipText="Next" onClicked={() => mediaAction("next")}>
|
|
||||||
<label label="" />
|
|
||||||
</button>
|
|
||||||
</box>
|
|
||||||
</Section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function SystemSection() {
|
|
||||||
const system = createPoll<SystemState>(SYSTEM_INIT, 2500, readSystem)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Section title="System">
|
|
||||||
<StatRow
|
|
||||||
icon=""
|
|
||||||
label="CPU"
|
|
||||||
value={system((value) => `${value.cpu}%`)}
|
|
||||||
fraction={system((value) => value.cpu / 100)}
|
|
||||||
/>
|
|
||||||
<StatRow
|
|
||||||
icon=""
|
|
||||||
label="GPU"
|
|
||||||
value={system((value) => `${value.gpu}%`)}
|
|
||||||
fraction={system((value) => value.gpu / 100)}
|
|
||||||
/>
|
|
||||||
<StatRow
|
|
||||||
icon=""
|
|
||||||
label="RAM"
|
|
||||||
value={system((value) => `${value.memory}%`)}
|
|
||||||
fraction={system((value) => value.memory / 100)}
|
|
||||||
/>
|
|
||||||
<StatRow
|
|
||||||
icon={system((value) => value.battery.icon)}
|
|
||||||
label={system((value) => value.battery.status)}
|
|
||||||
value={system((value) => `${value.battery.percent}%`)}
|
|
||||||
fraction={system((value) => value.battery.percent / 100)}
|
|
||||||
visible={system((value) => value.battery.available)}
|
|
||||||
/>
|
|
||||||
</Section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function ConnectivitySection() {
|
|
||||||
const connectivity = createPoll<ConnectivityState>(CONNECTIVITY_INIT, 5000, readConnectivity)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Section title="Network">
|
|
||||||
<StatusRow
|
|
||||||
icon={connectivity((value) => value.wifi.icon)}
|
|
||||||
label={connectivity((value) => value.wifi.label)}
|
|
||||||
detail={connectivity((value) => value.wifi.detail)}
|
|
||||||
/>
|
|
||||||
<StatusRow
|
|
||||||
icon={connectivity((value) => value.bluetooth.icon)}
|
|
||||||
label={connectivity((value) => value.bluetooth.label)}
|
|
||||||
detail={connectivity((value) => value.bluetooth.detail)}
|
|
||||||
/>
|
|
||||||
<StatusRow
|
|
||||||
icon={connectivity((value) => value.ethernet.icon)}
|
|
||||||
label={connectivity((value) => value.ethernet.label)}
|
|
||||||
detail={connectivity((value) => value.ethernet.detail)}
|
|
||||||
/>
|
|
||||||
</Section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function WidgetsSection() {
|
|
||||||
return (
|
|
||||||
<Section title="Widgets">
|
|
||||||
<box class="action-row" orientation={Gtk.Orientation.VERTICAL} spacing={4}>
|
|
||||||
<ActionButton icon="" tooltip="Launcher" command="wofi --show drun" />
|
|
||||||
<ActionButton icon="" tooltip="Terminal" command="kitty" />
|
|
||||||
<ActionButton icon="" tooltip="Mute speakers" command="wpctl set-mute @DEFAULT_AUDIO_SINK@ toggle" />
|
|
||||||
<ActionButton icon="" tooltip="Mute microphone" command="wpctl set-mute @DEFAULT_AUDIO_SOURCE@ toggle" />
|
|
||||||
</box>
|
|
||||||
</Section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function ClockPowerSection() {
|
|
||||||
const clock = createPoll<ClockState>(CLOCK_INIT, 1000, () => {
|
|
||||||
const now = GLib.DateTime.new_now_local()
|
|
||||||
|
|
||||||
return {
|
|
||||||
hour: now.format("%H") ?? "--",
|
|
||||||
minute: now.format("%M") ?? "--",
|
|
||||||
month: now.format("%m") ?? "--",
|
|
||||||
year: now.format("%y") ?? "--",
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const [clockHovered, setClockHovered] = createState(false)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Section title="Time / Power" className="clock-section">
|
|
||||||
<button
|
|
||||||
class="clock-trigger"
|
|
||||||
tooltipText="Open power menu"
|
|
||||||
onClicked={() => setPowerMenuVisible(true)}
|
|
||||||
$={(self) => attachHover(self, () => setClockHovered(true), () => setClockHovered(false))}
|
|
||||||
>
|
|
||||||
<label
|
|
||||||
class="clock-time"
|
|
||||||
justify={Gtk.Justification.CENTER}
|
|
||||||
label={clock((value) =>
|
|
||||||
clockHovered() ? `${value.month}\n${value.year}` : `${value.hour}\n${value.minute}`,
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
</Section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function PowerMenu({ gdkmonitor }: { gdkmonitor: Gdk.Monitor }) {
|
|
||||||
const weather = createPoll("Weather unavailable", 900000, readWeather)
|
|
||||||
const calendar = createPoll(renderCalendar(new Date()), 60000, () => renderCalendar(new Date()))
|
|
||||||
const { TOP, BOTTOM, LEFT, RIGHT } = Astal.WindowAnchor
|
|
||||||
|
|
||||||
return (
|
|
||||||
<window
|
|
||||||
visible={powerMenuVisible}
|
|
||||||
name="ags-power-menu"
|
|
||||||
namespace="ags-power-menu"
|
|
||||||
gdkmonitor={gdkmonitor}
|
|
||||||
application={app}
|
|
||||||
layer={Astal.Layer.OVERLAY}
|
|
||||||
keymode={Astal.Keymode.ON_DEMAND}
|
|
||||||
exclusivity={Astal.Exclusivity.IGNORE}
|
|
||||||
anchor={TOP | BOTTOM | LEFT | RIGHT}
|
|
||||||
margin={0}
|
|
||||||
>
|
|
||||||
<overlay hexpand vexpand>
|
|
||||||
<button class="power-backdrop" hexpand vexpand onClicked={() => setPowerMenuVisible(false)} />
|
|
||||||
<box type="overlay" class="power-menu" orientation={Gtk.Orientation.VERTICAL} halign={Gtk.Align.CENTER} valign={Gtk.Align.CENTER}>
|
|
||||||
<label class="power-weather" wrap justify={Gtk.Justification.CENTER} label={weather((value) => value)} />
|
|
||||||
<label class="power-calendar" justify={Gtk.Justification.LEFT} xalign={0} label={calendar((value) => value)} />
|
|
||||||
<box class="power-actions" spacing={8}>
|
|
||||||
<ActionButton icon="" tooltip="Lock" command="swaylock" />
|
|
||||||
<ActionButton icon="" tooltip="Suspend" command="systemctl suspend" />
|
|
||||||
<ActionButton icon="" tooltip="Reboot" command="systemctl reboot" />
|
|
||||||
<ActionButton icon="" tooltip="Power off" command="systemctl poweroff" />
|
|
||||||
</box>
|
|
||||||
</box>
|
|
||||||
</overlay>
|
|
||||||
</window>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function RightBar({ gdkmonitor }: { gdkmonitor: Gdk.Monitor }) {
|
|
||||||
let window: Astal.Window
|
|
||||||
const { TOP, BOTTOM, RIGHT } = Astal.WindowAnchor
|
|
||||||
|
|
||||||
onCleanup(() => {
|
|
||||||
window.destroy()
|
|
||||||
})
|
|
||||||
|
|
||||||
return (
|
|
||||||
<window
|
|
||||||
$={(self) => (window = self)}
|
|
||||||
visible
|
|
||||||
name={`ags-right-bar-${gdkmonitor.connector}`}
|
|
||||||
namespace="ags-right-bar"
|
|
||||||
gdkmonitor={gdkmonitor}
|
|
||||||
application={app}
|
|
||||||
anchor={TOP | BOTTOM | RIGHT}
|
|
||||||
exclusivity={Astal.Exclusivity.EXCLUSIVE}
|
|
||||||
marginRight={0}
|
|
||||||
marginTop={0}
|
|
||||||
marginBottom={0}
|
|
||||||
>
|
|
||||||
<box class="bar-shell" orientation={Gtk.Orientation.VERTICAL}>
|
|
||||||
<WorkspacesSection />
|
|
||||||
<MediaSection />
|
|
||||||
<SystemSection />
|
|
||||||
<ConnectivitySection />
|
|
||||||
<WidgetsSection />
|
|
||||||
<box vexpand />
|
|
||||||
<ClockPowerSection />
|
|
||||||
</box>
|
|
||||||
</window>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
app.start({
|
|
||||||
css: style,
|
|
||||||
gtkTheme: "Adwaita",
|
|
||||||
main() {
|
|
||||||
const [monitor] = app.get_monitors()
|
|
||||||
|
|
||||||
if (!monitor) {
|
|
||||||
throw new Error("No monitor available for AGS bar")
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<RightBar gdkmonitor={monitor} />
|
|
||||||
<PowerMenu gdkmonitor={monitor} />
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
})
|
|
||||||
@@ -1,176 +0,0 @@
|
|||||||
@use "sass:color";
|
|
||||||
@use "./css/_colors.scss" as *;
|
|
||||||
|
|
||||||
* {
|
|
||||||
color: $fg;
|
|
||||||
font-family: "IBM Plex Sans", "Symbols Nerd Font Mono";
|
|
||||||
font-size: 13px;
|
|
||||||
}
|
|
||||||
|
|
||||||
window {
|
|
||||||
background: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bar-shell {
|
|
||||||
min-width: 42px;
|
|
||||||
padding: 4px 0 4px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.section {
|
|
||||||
background: rgba(color.channel($bg1, "red", $space: rgb), color.channel($bg1, "green", $space: rgb), color.channel($bg1, "blue", $space: rgb), 0.92);
|
|
||||||
border: $border-width solid $border-color;
|
|
||||||
border-right: 0;
|
|
||||||
border-radius: $border-radius 0 0 $border-radius;
|
|
||||||
margin-bottom: 4px;
|
|
||||||
padding: 6px 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.section:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.section-title {
|
|
||||||
min-height: 0;
|
|
||||||
font-size: 0;
|
|
||||||
margin-bottom: 0;
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.section-body {
|
|
||||||
min-width: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.workspace-stack {
|
|
||||||
min-width: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.workspace-button,
|
|
||||||
.mini-button,
|
|
||||||
.action-button,
|
|
||||||
.clock-trigger {
|
|
||||||
background: transparent;
|
|
||||||
border: 0;
|
|
||||||
border-radius: calc($border-radius - 2px);
|
|
||||||
box-shadow: none;
|
|
||||||
min-height: 0;
|
|
||||||
min-width: 0;
|
|
||||||
padding: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.workspace-button:hover,
|
|
||||||
.mini-button:hover,
|
|
||||||
.action-button:hover,
|
|
||||||
.clock-trigger:hover {
|
|
||||||
background: rgba(color.channel($base03, "red", $space: rgb), color.channel($base03, "green", $space: rgb), color.channel($base03, "blue", $space: rgb), 0.35);
|
|
||||||
}
|
|
||||||
|
|
||||||
.workspace-button.focused {
|
|
||||||
background: rgba(color.channel($base0D, "red", $space: rgb), color.channel($base0D, "green", $space: rgb), color.channel($base0D, "blue", $space: rgb), 0.16);
|
|
||||||
}
|
|
||||||
|
|
||||||
.workspace-button.occupied .workspace-icon {
|
|
||||||
color: $base05;
|
|
||||||
}
|
|
||||||
|
|
||||||
.workspace-button.focused .workspace-icon {
|
|
||||||
color: $base0D;
|
|
||||||
}
|
|
||||||
|
|
||||||
.workspace-icon,
|
|
||||||
.action-icon {
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.media-controls,
|
|
||||||
.action-row {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-row {
|
|
||||||
margin-bottom: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-row:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-icon,
|
|
||||||
.status-icon {
|
|
||||||
color: $base0A;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-head,
|
|
||||||
.status-row {
|
|
||||||
min-width: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-bar {
|
|
||||||
margin-top: 3px;
|
|
||||||
min-height: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-bar trough {
|
|
||||||
background: rgba(red($base02), green($base02), blue($base02), 0.85);
|
|
||||||
border-radius: 99px;
|
|
||||||
min-height: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-bar block.filled {
|
|
||||||
background: $base0D;
|
|
||||||
border-radius: 99px;
|
|
||||||
min-height: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.clock-section {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.clock-trigger {
|
|
||||||
padding: 6px 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.clock-time {
|
|
||||||
color: $base0E;
|
|
||||||
font-family: "IBM Plex Mono", "Symbols Nerd Font Mono";
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 800;
|
|
||||||
min-width: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.power-backdrop {
|
|
||||||
background: rgba(color.channel($base00, "red", $space: rgb), color.channel($base00, "green", $space: rgb), color.channel($base00, "blue", $space: rgb), 0.42);
|
|
||||||
border: 0;
|
|
||||||
border-radius: 0;
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.power-menu {
|
|
||||||
background: rgba(color.channel($bg1, "red", $space: rgb), color.channel($bg1, "green", $space: rgb), color.channel($bg1, "blue", $space: rgb), 0.94);
|
|
||||||
border: $border-width solid $border-color-focus;
|
|
||||||
border-radius: 18px;
|
|
||||||
min-width: 320px;
|
|
||||||
padding: 20px 22px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.power-weather {
|
|
||||||
color: $base0C;
|
|
||||||
font-size: 15px;
|
|
||||||
font-weight: 700;
|
|
||||||
margin-bottom: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.power-calendar {
|
|
||||||
font-family: "IBM Plex Mono", "Symbols Nerd Font Mono";
|
|
||||||
font-size: 13px;
|
|
||||||
margin-bottom: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.power-actions {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.power-actions .action-button {
|
|
||||||
padding: 8px;
|
|
||||||
}
|
|
||||||
@@ -1 +1 @@
|
|||||||
{ ... }: { imports = [ ./dunst ./eww ./kanshi ./waylock ./wofi ./ags ]; }
|
{ ... }: { imports = [ ./dunst ./eww ./kanshi ./waylock ./wofi ]; }
|
||||||
|
|||||||
@@ -24,7 +24,6 @@
|
|||||||
|
|
||||||
|
|
||||||
startupScript = pkgs.writeShellScriptBin "hyprland-start" ''
|
startupScript = pkgs.writeShellScriptBin "hyprland-start" ''
|
||||||
ags-run &
|
|
||||||
awww-daemon &
|
awww-daemon &
|
||||||
|
|
||||||
sleep 2
|
sleep 2
|
||||||
|
|||||||
Reference in New Issue
Block a user