diff --git a/Cargo.toml b/Cargo.toml index de80fcc..a17c1bb 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -4,8 +4,8 @@ version = "0.2.4" edition = "2021" description = "Minimal status bar and notification daemon for Hyprland on Wayland" license = "MIT" -authors = ["Breadway "] -repository = "https://github.com/Breadway/breadbar" +authors = ["Breadway "] +repository = "https://git.breadway.dev/Breadway/breadbar" keywords = ["wayland", "hyprland", "bar", "status-bar", "gtk4"] categories = ["gui"] diff --git a/assets/Bluetooth Settings.svg b/assets/Bluetooth Settings.svg new file mode 100644 index 0000000..c176fff --- /dev/null +++ b/assets/Bluetooth Settings.svg @@ -0,0 +1 @@ + diff --git a/assets/Brightness.svg b/assets/Brightness.svg new file mode 100644 index 0000000..8afaa73 --- /dev/null +++ b/assets/Brightness.svg @@ -0,0 +1 @@ + diff --git a/assets/Lock.svg b/assets/Lock.svg new file mode 100644 index 0000000..0be852f --- /dev/null +++ b/assets/Lock.svg @@ -0,0 +1 @@ + diff --git a/assets/Next.svg b/assets/Next.svg new file mode 100644 index 0000000..44d5519 --- /dev/null +++ b/assets/Next.svg @@ -0,0 +1 @@ + diff --git a/assets/Pause.svg b/assets/Pause.svg new file mode 100644 index 0000000..3ff4ce2 --- /dev/null +++ b/assets/Pause.svg @@ -0,0 +1 @@ + diff --git a/assets/Play.svg b/assets/Play.svg new file mode 100644 index 0000000..2821df0 --- /dev/null +++ b/assets/Play.svg @@ -0,0 +1 @@ + diff --git a/assets/Previous.svg b/assets/Previous.svg new file mode 100644 index 0000000..23ce806 --- /dev/null +++ b/assets/Previous.svg @@ -0,0 +1 @@ + diff --git a/assets/Restart.svg b/assets/Restart.svg new file mode 100644 index 0000000..b8b9c76 --- /dev/null +++ b/assets/Restart.svg @@ -0,0 +1 @@ + diff --git a/assets/Shutdown.svg b/assets/Shutdown.svg new file mode 100644 index 0000000..787d1a3 --- /dev/null +++ b/assets/Shutdown.svg @@ -0,0 +1 @@ + diff --git a/assets/Sleep.svg b/assets/Sleep.svg new file mode 100644 index 0000000..a49d306 --- /dev/null +++ b/assets/Sleep.svg @@ -0,0 +1 @@ + diff --git a/assets/Volume.svg b/assets/Volume.svg new file mode 100644 index 0000000..3ffce7f --- /dev/null +++ b/assets/Volume.svg @@ -0,0 +1 @@ + diff --git a/assets/icons-needed.txt b/assets/icons-needed.txt deleted file mode 100644 index e228054..0000000 --- a/assets/icons-needed.txt +++ /dev/null @@ -1,48 +0,0 @@ -SVG icons needed for breadbar -============================== -24ร—24 viewBox. Use `currentColor` for all fill/stroke so icons recolour -automatically with the bar theme. Drop finished files in this directory. - - -Control panel โ€” slider row icons ---------------------------------- -Volume.svg - Speaker / soundwave icon for the volume slider row. - Currently placeholder: ๐Ÿ”Š emoji label. - Usage: control panel, left of volume slider. - -Brightness.svg - Sun / light bulb icon for the brightness slider row. - Currently placeholder: โ˜€ emoji label. - Usage: control panel, left of brightness slider. - - -Power section buttons ------------------------ -Lock.svg - Padlock icon โ€” triggers hyprlock (lock screen). - Currently placeholder: ๐Ÿ”’ - -Sleep.svg - Crescent moon or Zzz icon โ€” triggers systemctl suspend. - Currently placeholder: ๐Ÿ’ค - -Restart.svg - Circular arrow icon โ€” triggers systemctl reboot. - Currently placeholder: ๐Ÿ”„ - -Shutdown.svg - Power symbol (โป) icon โ€” triggers systemctl poweroff. - Currently placeholder: โป - - -How to wire up icons once SVGs are ready ------------------------------------------ -Each power button and slider row icon is currently a gtk4::Label with an emoji. -To replace with an SVG: - - 1. Add the SVG to this directory. - 2. In main.rs, replace the emoji Label with: - gtk4::Image::from_paintable(Some(&svg_texture(asset!("Icon Name.svg")))) - 3. For slider rows, replace the icon_lbl in build_slider_row() calls, - or add an overload that takes an image widget instead of a string. diff --git a/packaging/arch/PKGBUILD b/packaging/arch/PKGBUILD index bb55a53..e8570e0 100644 --- a/packaging/arch/PKGBUILD +++ b/packaging/arch/PKGBUILD @@ -1,11 +1,11 @@ -# Maintainer: Breadway +# Maintainer: Breadway pkgname=breadbar pkgver=0.2.0 pkgrel=1 pkgdesc="Minimal status bar and notification daemon for Hyprland" arch=('x86_64') -url="https://github.com/Breadway/breadbar" +url="https://git.breadway.dev/Breadway/breadbar" license=('MIT') # Some Rust deps (ring/mlua) build vendored C/asm into static archives; makepkg's # default -flto=auto emits GCC LTO bitcode the Rust (lld) link cannot read, diff --git a/src/bar/bluetooth.rs b/src/bar/bluetooth.rs new file mode 100644 index 0000000..422b298 --- /dev/null +++ b/src/bar/bluetooth.rs @@ -0,0 +1,123 @@ +use crate::{App, AppInput}; +use relm4::ComponentSender; +use std::fs; + +#[derive(Debug, Clone)] +pub struct BtDevice { + pub address: String, + pub name: String, + pub connected: bool, + pub paired: bool, +} + +#[derive(Debug, Clone)] +pub struct BtPopoverData { + pub powered: bool, + pub devices: Vec, +} + +/// Same rfkill scan `bar::stats` uses for the bar icon โ€” kept independent +/// (rather than shared) since it's a two-line read and pulling in a shared +/// helper isn't worth the coupling. +fn powered() -> bool { + fs::read_dir("/sys/class/rfkill") + .into_iter() + .flatten() + .filter_map(|e| e.ok()) + .any(|e| { + let p = e.path(); + fs::read_to_string(p.join("type")) + .map(|t| t.trim() == "bluetooth") + .unwrap_or(false) + && fs::read_to_string(p.join("state")) + .map(|s| s.trim() == "1") + .unwrap_or(false) + }) +} + +async fn fetch_devices() -> Vec { + try_fetch_devices().await.unwrap_or_default() +} + +async fn try_fetch_devices() -> Option> { + let conn = zbus::Connection::system().await.ok()?; + let mgr = zbus::fdo::ObjectManagerProxy::builder(&conn) + .destination("org.bluez") + .ok()? + .path("/") + .ok()? + .build() + .await + .ok()?; + let objects = mgr.get_managed_objects().await.ok()?; + + let mut devices: Vec = objects + .values() + .filter_map(|ifaces| ifaces.get("org.bluez.Device1")) + .filter_map(|props| { + let paired = props + .get("Paired") + .and_then(|v| bool::try_from(v.clone()).ok()) + .unwrap_or(false); + if !paired { + return None; + } + let address = props + .get("Address") + .and_then(|v| String::try_from(v.clone()).ok())?; + let name = props + .get("Alias") + .or_else(|| props.get("Name")) + .and_then(|v| String::try_from(v.clone()).ok()) + .unwrap_or_else(|| address.clone()); + let connected = props + .get("Connected") + .and_then(|v| bool::try_from(v.clone()).ok()) + .unwrap_or(false); + Some(BtDevice { address, name, connected, paired }) + }) + .collect(); + + devices.sort_by(|a, b| b.connected.cmp(&a.connected).then(a.name.cmp(&b.name))); + Some(devices) +} + +pub fn spawn_popover_load(sender: ComponentSender) { + relm4::spawn(async move { + let devices = fetch_devices().await; + sender.input(AppInput::BtPopoverData(BtPopoverData { + powered: powered(), + devices, + })); + }); +} + +/// Fire-and-forget: toggle the adapter's rfkill soft-block. +pub fn spawn_set_powered(on: bool) { + relm4::spawn(async move { + let _ = tokio::process::Command::new("rfkill") + .args([if on { "unblock" } else { "block" }, "bluetooth"]) + .output() + .await; + }); +} + +/// Fire-and-forget: connect a paired device by address via `bluetoothctl`. +pub fn spawn_connect(address: String) { + relm4::spawn(async move { + let _ = tokio::process::Command::new("bluetoothctl") + .args(["connect", &address]) + .output() + .await; + }); +} + +/// Fire-and-forget: disconnect a device by address via `bluetoothctl`. +pub fn spawn_disconnect(address: String) { + relm4::spawn(async move { + let _ = tokio::process::Command::new("bluetoothctl") + .args(["disconnect", &address]) + .output() + .await; + }); +} diff --git a/src/bar/mod.rs b/src/bar/mod.rs index 2563f23..e006a63 100644 --- a/src/bar/mod.rs +++ b/src/bar/mod.rs @@ -1,3 +1,4 @@ +pub mod bluetooth; pub mod clock; pub mod control; pub mod media; diff --git a/src/bar/stats.rs b/src/bar/stats.rs index 3991324..764d758 100644 --- a/src/bar/stats.rs +++ b/src/bar/stats.rs @@ -37,11 +37,22 @@ pub const BT_CONNECTED: &str = include_str!(concat!( "/assets/Bluetooth Connected.svg" )); +pub const ICON_VOLUME: &str = include_str!(concat!(env!("CARGO_MANIFEST_DIR"), "/assets/Volume.svg")); +pub const ICON_BRIGHTNESS: &str = include_str!(concat!(env!("CARGO_MANIFEST_DIR"), "/assets/Brightness.svg")); +pub const ICON_LOCK: &str = include_str!(concat!(env!("CARGO_MANIFEST_DIR"), "/assets/Lock.svg")); +pub const ICON_SLEEP: &str = include_str!(concat!(env!("CARGO_MANIFEST_DIR"), "/assets/Sleep.svg")); +pub const ICON_RESTART: &str = include_str!(concat!(env!("CARGO_MANIFEST_DIR"), "/assets/Restart.svg")); +pub const ICON_SHUTDOWN: &str = include_str!(concat!(env!("CARGO_MANIFEST_DIR"), "/assets/Shutdown.svg")); +pub const ICON_BT_SETTINGS: &str = include_str!(concat!(env!("CARGO_MANIFEST_DIR"), "/assets/Bluetooth Settings.svg")); + #[derive(Debug)] pub struct Stats { pub cpu: String, + pub cpu_pct: f32, pub mem: String, + pub mem_pct: f32, pub power: String, + pub power_watts: f32, pub bat: String, pub bat_icon: &'static str, pub ac_connected: bool, @@ -99,7 +110,8 @@ fn read_cpu() -> f32 { (dtotal - didle) as f32 / dtotal as f32 * 100.0 } -fn read_ram() -> u64 { +/// Returns (used_kb, total_kb). +fn read_ram() -> (u64, u64) { let text = fs::read_to_string("/proc/meminfo").unwrap_or_default(); let mut total = 0u64; let mut avail = 0u64; @@ -121,7 +133,7 @@ fn read_ram() -> u64 { break; } } - total.saturating_sub(avail) + (total.saturating_sub(avail), total) } fn bat_path() -> Option<&'static PathBuf> { @@ -392,8 +404,14 @@ fn read_crumbs_profile() -> Option { pub async fn poll() -> Stats { let cpu = read_cpu(); - let mem = read_ram(); - let power = read_power().map_or_else(|| "โ€”W".into(), |w| format!("{w:.1}W")); + let (mem, mem_total) = read_ram(); + let mem_pct = if mem_total > 0 { + mem as f32 / mem_total as f32 * 100.0 + } else { + 0.0 + }; + let power_watts = read_power(); + let power = power_watts.map_or_else(|| "โ€”W".into(), |w| format!("{w:.1}W")); let pct = read_battery(); let bat = pct.map_or_else(|| "โ€”".into(), |p| format!("{p}%")); let bat_icon = pct.map_or(BAT_MID, bat_level_icon); @@ -426,12 +444,15 @@ pub async fn poll() -> Stats { let (net_rx_kbs, net_tx_kbs) = read_net_throughput(); Stats { cpu: format!("{cpu:.0}%"), + cpu_pct: cpu, mem: if mem >= 1024 * 1024 { format!("{:.1}G", mem as f32 / (1024.0 * 1024.0)) } else { format!("{}M", mem / 1024) }, + mem_pct, power, + power_watts: power_watts.unwrap_or(0.0), bat, bat_icon, ac_connected, diff --git a/src/main.rs b/src/main.rs index 2767846..c42b87c 100644 --- a/src/main.rs +++ b/src/main.rs @@ -9,6 +9,12 @@ mod notifications; mod osd; mod theme; +/// Thresholds above which the bar's CPU/RAM/power-draw readouts appear at +/// all โ€” see `AppInput::StatsUpdate`. Below these, the bar stays quiet. +const CPU_ATTENTION_THRESHOLD: f32 = 70.0; +const MEM_ATTENTION_THRESHOLD: f32 = 80.0; +const POWER_ATTENTION_THRESHOLD: f32 = 30.0; + use gtk4::prelude::*; use gtk4_layer_shell::{Edge, Layer, LayerShell}; use hyprland::data::Workspace; @@ -29,6 +35,14 @@ pub struct App { clock_lbl: gtk4::Label, // โ”€โ”€ Stats bar โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ + // The system-stats trio (CPU/RAM/power draw) only shows up when a value + // crosses a "you probably want to know about this" threshold โ€” otherwise + // the bar stays quiet. See AppInput::StatsUpdate. + system_stats_box: gtk4::Box, + system_sep: gtk4::Separator, + cpu_pair: gtk4::Box, + mem_pair: gtk4::Box, + pwr_pair: gtk4::Box, cpu_lbl: gtk4::Label, mem_lbl: gtk4::Label, pwr_lbl: gtk4::Label, @@ -43,16 +57,20 @@ pub struct App { wifi_textures: std::collections::HashMap, // โ”€โ”€ WiFi popover โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ - wifi_popover_box: gtk4::Box, + wifi_pane: gtk4::Box, crumbs_status: Option, wifi_popover_data: Option, wifi_profile: Option, current_ssid: String, + // โ”€โ”€ Bluetooth popover โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ + bt_pane: gtk4::Box, + bt_popover_data: Option, + // โ”€โ”€ Media โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ media_widget: gtk4::Box, media_track_lbl: gtk4::Label, - media_play_btn: gtk4::Button, + media_play_icon: gtk4::Image, media_last: Option, media_paused_at: Option, @@ -66,10 +84,14 @@ pub struct App { panel_sink_signal: Option, panel_sinks: Vec, panel_cpu_lbl: gtk4::Label, + panel_mem_lbl: gtk4::Label, + panel_pwr_lbl: gtk4::Label, panel_gpu_lbl: gtk4::Label, panel_net_lbl: gtk4::Label, // โ”€โ”€ Tray โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ + tray_section: gtk4::Box, + tray_sep: gtk4::Separator, tray_box: gtk4::Box, tray_items: std::collections::HashMap, } @@ -84,6 +106,7 @@ pub enum AppInput { CrumbsStatus(bar::wifi::CrumbsStatus), WifiPopoverData(bar::wifi::WifiPopoverData), SetProfile(String), + BtPopoverData(bar::bluetooth::BtPopoverData), MediaUpdate(bar::media::MediaState), ControlPanelData(bar::control::ControlPanelData), } @@ -176,39 +199,15 @@ impl SimpleComponent for App { let wifi_img = gtk4::Image::from_paintable(Some(&svg_texture(asset!("WiFi Connecting.svg")))); - let wifi_pair = gtk4::Box::new(gtk4::Orientation::Horizontal, 0); - wifi_pair.add_css_class("stat-pair"); - wifi_pair.add_css_class("wifi-pair"); wifi_img.add_css_class("stat-icon"); - wifi_pair.append(&wifi_img); - wifi_pair.append(&wifi_lbl); - let wifi_popover_box = gtk4::Box::new(gtk4::Orientation::Vertical, 0); - wifi_popover_box.add_css_class("wifi-popover-inner"); - wifi_popover_box.set_margin_top(4); - wifi_popover_box.set_margin_bottom(4); - wifi_popover_box.set_margin_start(4); - wifi_popover_box.set_margin_end(4); + // Content pane only โ€” this becomes a tab inside the merged + // connectivity popover built alongside the Bluetooth pane below, + // once bt_img exists too. See "Connectivity popover" further down. + let wifi_pane = gtk4::Box::new(gtk4::Orientation::Vertical, 0); let loading_lbl = gtk4::Label::new(Some("Scanningโ€ฆ")); loading_lbl.add_css_class("wifi-popover-loading"); - wifi_popover_box.append(&loading_lbl); - - let wifi_popover = gtk4::Popover::new(); - wifi_popover.add_css_class("wifi-popover"); - wifi_popover.set_child(Some(&wifi_popover_box)); - wifi_popover.set_parent(&wifi_pair); - - let wpop = wifi_popover.clone(); - let gesture = gtk4::GestureClick::new(); - gesture.connect_released(move |_, _, _, _| { - if wpop.is_visible() { wpop.popdown(); } else { wpop.popup(); } - }); - wifi_pair.add_controller(gesture); - - let sender_wp = sender.clone(); - wifi_popover.connect_show(move |_| { - bar::wifi::spawn_popover_load(sender_wp.clone()); - }); + wifi_pane.append(&loading_lbl); // โ”€โ”€ Media widget (center) โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ let media_widget = gtk4::Box::new(gtk4::Orientation::Horizontal, 4); @@ -235,18 +234,26 @@ impl SimpleComponent for App { media_controls_box.set_margin_start(4); media_controls_box.set_margin_end(4); - let prev_btn = gtk4::Button::with_label("โฎ"); + let prev_btn = gtk4::Button::new(); + prev_btn.set_child(Some(>k4::Image::from_paintable(Some(&svg_texture( + asset!("Previous.svg"), + ))))); prev_btn.add_css_class("flat"); prev_btn.add_css_class("media-btn"); prev_btn.connect_clicked(|_| bar::media::spawn_cmd("previous")); - let media_play_btn = gtk4::Button::with_label("โธ"); + let media_play_icon = gtk4::Image::from_paintable(Some(&svg_texture(asset!("Pause.svg")))); + let media_play_btn = gtk4::Button::new(); + media_play_btn.set_child(Some(&media_play_icon)); media_play_btn.add_css_class("flat"); media_play_btn.add_css_class("media-btn"); media_play_btn.add_css_class("media-play-btn"); media_play_btn.connect_clicked(|_| bar::media::spawn_cmd("play-pause")); - let next_btn = gtk4::Button::with_label("โญ"); + let next_btn = gtk4::Button::new(); + next_btn.set_child(Some(>k4::Image::from_paintable(Some(&svg_texture( + asset!("Next.svg"), + ))))); next_btn.add_css_class("flat"); next_btn.add_css_class("media-btn"); next_btn.connect_clicked(|_| bar::media::spawn_cmd("next")); @@ -280,9 +287,22 @@ impl SimpleComponent for App { // โ”€โ”€ Stats box (right side) โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ let stats_box = gtk4::Box::new(gtk4::Orientation::Horizontal, 0); stats_box.add_css_class("stats-box"); - stats_box.append(&stat_pair(asset!("CPU.svg"), &cpu_lbl)); - stats_box.append(&stat_pair(asset!("RAM Usage.svg"), &mem_lbl)); - stats_box.append(&stat_pair(asset!("Power Draw.svg"), &pwr_lbl)); + + // CPU/RAM/power draw: hidden by default (see StatsUpdate), so this + // whole sub-group โ€” plus its separator โ€” collapses away when quiet. + let cpu_pair = stat_pair(asset!("CPU.svg"), &cpu_lbl); + let mem_pair = stat_pair(asset!("RAM Usage.svg"), &mem_lbl); + let pwr_pair = stat_pair(asset!("Power Draw.svg"), &pwr_lbl); + let system_stats_box = gtk4::Box::new(gtk4::Orientation::Horizontal, 0); + system_stats_box.append(&cpu_pair); + system_stats_box.append(&mem_pair); + system_stats_box.append(&pwr_pair); + system_stats_box.set_visible(false); + stats_box.append(&system_stats_box); + let system_sep = gtk4::Separator::new(gtk4::Orientation::Vertical); + system_sep.add_css_class("bar-sep"); + system_sep.set_visible(false); + stats_box.append(&system_sep); let bat_box = gtk4::Box::new(gtk4::Orientation::Horizontal, 0); bat_box.add_css_class("stat-pair"); @@ -296,28 +316,121 @@ impl SimpleComponent for App { stats_box.append(&bat_box); bt_img.add_css_class("bt-icon"); - bt_img.add_css_class("clickable"); - let bt_gesture = gtk4::GestureClick::new(); - bt_gesture.connect_released(|_, _, _, _| { - relm4::spawn(async { - let _ = tokio::process::Command::new("blueman-manager").spawn(); - }); + + // Content pane only โ€” same deal as wifi_pane above. + let bt_pane = gtk4::Box::new(gtk4::Orientation::Vertical, 0); + let bt_loading_lbl = gtk4::Label::new(Some("Loadingโ€ฆ")); + bt_loading_lbl.add_css_class("wifi-popover-loading"); + bt_pane.append(&bt_loading_lbl); + + // โ”€โ”€ Connectivity popover โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ + // WiFi and Bluetooth share one popover with one anatomy (same CSS + // classes throughout the two panes) instead of two near-identical + // popups behind two separate icons. A small tab row switches between + // them; both fetches kick off on open so switching tabs afterward is + // instant. The two panes live in a Stack rather than plain sibling + // Boxes with manual visibility toggling, which left stale width + // behind on reopen. + // + // hhomogeneous/vhomogeneous are ON (GTK's default), even though that + // means the popover is always sized to the *larger* of the two panes + // (visible empty space under the shorter one) โ€” the alternative, + // sizing to just the active pane, means the popup has to resize + // itself in place when you switch tabs while it's open. Under + // gtk4-layer-shell that in-place resize doesn't reliably reach the + // compositor as a proper xdg_popup reposition; switching from the + // shorter tab to the taller one after a close/reopen cycle made the + // whole popover silently vanish instead of growing. A constant + // footprint sidesteps the resize entirely. + let content_stack = gtk4::Stack::new(); + content_stack.set_hhomogeneous(true); + content_stack.set_vhomogeneous(true); + // Reserve enough room up front for the tallest realistic content + // (WiFi tab with a handful of nearby networks). Homogeneous sizing + // alone still lets the *first* real data load (Scanningโ€ฆ โ†’ populated + // list) trigger a live resize while the popup is mapped, which hits + // the same reposition fragility as the tab-switch case โ€” claiming + // the space before anything is shown avoids that resize too. + content_stack.set_size_request(220, 420); + content_stack.add_named(&wifi_pane, Some("wifi")); + content_stack.add_named(&bt_pane, Some("bluetooth")); + content_stack.set_visible_child_name("wifi"); + + let wifi_tab_btn = gtk4::ToggleButton::with_label("Wi-Fi"); + wifi_tab_btn.add_css_class("popover-tab"); + wifi_tab_btn.set_active(true); + let bt_tab_btn = gtk4::ToggleButton::with_label("Bluetooth"); + bt_tab_btn.add_css_class("popover-tab"); + bt_tab_btn.set_group(Some(&wifi_tab_btn)); + + let tab_row = gtk4::Box::new(gtk4::Orientation::Horizontal, 4); + tab_row.add_css_class("popover-tab-row"); + tab_row.append(&wifi_tab_btn); + tab_row.append(&bt_tab_btn); + + let stack_for_wifi = content_stack.clone(); + wifi_tab_btn.connect_toggled(move |btn| { + if btn.is_active() { + stack_for_wifi.set_visible_child_name("wifi"); + } + }); + let stack_for_bt = content_stack.clone(); + bt_tab_btn.connect_toggled(move |btn| { + if btn.is_active() { + stack_for_bt.set_visible_child_name("bluetooth"); + } + }); + + let connectivity_inner = gtk4::Box::new(gtk4::Orientation::Vertical, 0); + connectivity_inner.add_css_class("wifi-popover-inner"); + connectivity_inner.append(&tab_row); + connectivity_inner.append(>k4::Separator::new(gtk4::Orientation::Horizontal)); + connectivity_inner.append(&content_stack); + + let connectivity_popover = gtk4::Popover::new(); + connectivity_popover.add_css_class("wifi-popover"); + connectivity_popover.set_child(Some(&connectivity_inner)); + + let connectivity_pair = gtk4::Box::new(gtk4::Orientation::Horizontal, 0); + connectivity_pair.add_css_class("stat-pair"); + connectivity_pair.add_css_class("wifi-pair"); + connectivity_pair.append(&bt_img); + connectivity_pair.append(&wifi_img); + connectivity_pair.append(&wifi_lbl); + // Anchored to wifi_lbl specifically, not the connectivity_pair row โ€” + // a Popover parented to a multi-child Box via set_parent() balloons + // that Box's own allocation after a popupโ†’popdownโ†’popup cycle (its + // width roughly quadrupled in testing, shoving every bar item to its + // left further left). Anchoring to a single leaf widget instead + // sidesteps whatever GTK4/gtk4-layer-shell interaction causes that; + // the click target below still covers the whole row regardless. + connectivity_popover.set_parent(&wifi_lbl); + stats_box.append(&connectivity_pair); + + let cpop = connectivity_popover.clone(); + let gesture = gtk4::GestureClick::new(); + gesture.connect_released(move |_, _, _, _| { + if cpop.is_visible() { cpop.popdown(); } else { cpop.popup(); } + }); + connectivity_pair.add_controller(gesture); + + let sender_conn = sender.clone(); + connectivity_popover.connect_show(move |_| { + bar::wifi::spawn_popover_load(sender_conn.clone()); + bar::bluetooth::spawn_popover_load(sender_conn.clone()); }); - bt_img.add_controller(bt_gesture); - stats_box.append(&bt_img); - stats_box.append(&wifi_pair); // โ”€โ”€ Control panel popover โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ let panel_inner = gtk4::Box::new(gtk4::Orientation::Vertical, 0); panel_inner.add_css_class("control-panel-inner"); // Volume row - let vol_row = build_slider_row("๐Ÿ”Š", 0.0, 1.5, 0.02); + let vol_row = build_slider_row(bar::stats::ICON_VOLUME, 0.0, 1.5, 0.02); let panel_vol_slider = vol_row.1.clone(); panel_inner.append(&vol_row.0); // Brightness row - let bright_row = build_slider_row("โ˜€", 0.0, 1.0, 0.02); + let bright_row = build_slider_row(bar::stats::ICON_BRIGHTNESS, 0.0, 1.0, 0.02); let panel_bright_slider = bright_row.1.clone(); panel_inner.append(&bright_row.0); @@ -331,6 +444,14 @@ impl SimpleComponent for App { panel_cpu_lbl.add_css_class("control-panel-stat"); panel_cpu_lbl.set_xalign(0.0); + let panel_mem_lbl = gtk4::Label::new(Some("RAM โ€”")); + panel_mem_lbl.add_css_class("control-panel-stat"); + panel_mem_lbl.set_xalign(0.0); + + let panel_pwr_lbl = gtk4::Label::new(Some("PWR โ€”")); + panel_pwr_lbl.add_css_class("control-panel-stat"); + panel_pwr_lbl.set_xalign(0.0); + let panel_gpu_lbl = gtk4::Label::new(Some("GPU โ€”")); panel_gpu_lbl.add_css_class("control-panel-stat"); panel_gpu_lbl.set_xalign(0.0); @@ -340,6 +461,8 @@ impl SimpleComponent for App { panel_net_lbl.set_xalign(0.0); stats_section.append(&panel_cpu_lbl); + stats_section.append(&panel_mem_lbl); + stats_section.append(&panel_pwr_lbl); stats_section.append(&panel_gpu_lbl); stats_section.append(&panel_net_lbl); panel_inner.append(&stats_section); @@ -377,9 +500,14 @@ impl SimpleComponent for App { tray_box.add_css_class("tray-box"); tray_section.append(&tray_header); tray_section.append(&tray_box); + // Collapsed (along with its separator) until an SNI app actually + // registers โ€” an empty "Apps" section heading is dead weight. + tray_section.set_visible(false); panel_inner.append(&tray_section); - panel_inner.append(>k4::Separator::new(gtk4::Orientation::Horizontal)); + let tray_sep = gtk4::Separator::new(gtk4::Orientation::Horizontal); + tray_sep.set_visible(false); + panel_inner.append(&tray_sep); // Power section let power_section = gtk4::Box::new(gtk4::Orientation::Vertical, 4); @@ -391,13 +519,14 @@ impl SimpleComponent for App { let power_row = gtk4::Box::new(gtk4::Orientation::Horizontal, 4); power_row.add_css_class("power-row"); - for (label, cmd) in [ - ("๐Ÿ”’", vec!["hyprlock"]), - ("๐Ÿ’ค", vec!["systemctl", "suspend"]), - ("๐Ÿ”„", vec!["systemctl", "reboot"]), - ("โป", vec!["systemctl", "poweroff"]), + for (icon_svg, cmd) in [ + (bar::stats::ICON_LOCK, vec!["hyprlock"]), + (bar::stats::ICON_SLEEP, vec!["systemctl", "suspend"]), + (bar::stats::ICON_RESTART, vec!["systemctl", "reboot"]), + (bar::stats::ICON_SHUTDOWN, vec!["systemctl", "poweroff"]), ] { - let btn = gtk4::Button::with_label(label); + let btn = gtk4::Button::new(); + btn.set_child(Some(>k4::Image::from_paintable(Some(&svg_texture(icon_svg))))); btn.add_css_class("flat"); btn.add_css_class("power-btn"); btn.connect_clicked(move |_| { @@ -463,6 +592,11 @@ impl SimpleComponent for App { button_map: std::collections::HashMap::new(), time_str: bar::clock::current(), clock_lbl, + system_stats_box, + system_sep, + cpu_pair, + mem_pair, + pwr_pair, cpu_lbl, mem_lbl, pwr_lbl, @@ -475,14 +609,16 @@ impl SimpleComponent for App { wifi_lbl, wifi_img, wifi_textures, - wifi_popover_box, + wifi_pane, crumbs_status: None, wifi_popover_data: None, wifi_profile: None, current_ssid: "โ€”".to_string(), + bt_pane, + bt_popover_data: None, media_widget, media_track_lbl, - media_play_btn, + media_play_icon, media_last: None, media_paused_at: None, control_popover, @@ -494,8 +630,12 @@ impl SimpleComponent for App { panel_sink_signal: None, panel_sinks: vec![], panel_cpu_lbl, + panel_mem_lbl, + panel_pwr_lbl, panel_gpu_lbl, panel_net_lbl, + tray_section, + tray_sep, tray_box, tray_items: std::collections::HashMap::new(), }; @@ -539,6 +679,20 @@ impl SimpleComponent for App { self.cpu_lbl.set_label(&stats.cpu); self.mem_lbl.set_label(&stats.mem); self.pwr_lbl.set_label(&stats.power); + + // Bar information diet: CPU/RAM/power draw only surface once + // they're actually worth knowing about, individually, so a + // hot CPU doesn't drag an idle RAM/power reading along with it. + let cpu_hot = stats.cpu_pct > CPU_ATTENTION_THRESHOLD; + let mem_hot = stats.mem_pct > MEM_ATTENTION_THRESHOLD; + let pwr_hot = stats.power_watts > POWER_ATTENTION_THRESHOLD; + self.cpu_pair.set_visible(cpu_hot); + self.mem_pair.set_visible(mem_hot); + self.pwr_pair.set_visible(pwr_hot); + let any_hot = cpu_hot || mem_hot || pwr_hot; + self.system_stats_box.set_visible(any_hot); + self.system_sep.set_visible(any_hot); + self.bat_lbl.set_label(&stats.bat); if let Some(tex) = self.bat_textures.get(&(stats.bat_icon.as_ptr() as usize)) { self.bat_img.set_paintable(Some(tex)); @@ -574,6 +728,11 @@ impl SimpleComponent for App { }; self.panel_cpu_lbl.set_label(&cpu_str); + self.panel_mem_lbl + .set_label(&format!("RAM {:.0}% {}", stats.mem_pct, stats.mem)); + self.panel_pwr_lbl + .set_label(&format!("PWR {}", stats.power)); + let gpu_str = match (stats.gpu_usage, stats.gpu_temp) { (Some(u), Some(t)) => format!("GPU {u}% {t:.0}ยฐC"), (Some(u), None) => format!("GPU {u}%"), @@ -603,19 +762,34 @@ impl SimpleComponent for App { btn.connect_clicked(move |_| bar::tray::spawn_activate(id_click.clone())); self.tray_box.append(&btn); self.tray_items.insert(id, btn); + self.tray_section.set_visible(true); + self.tray_sep.set_visible(true); } AppInput::TrayUpdate(bar::tray::TrayUpdate::Remove { id }) => { if let Some(btn) = self.tray_items.remove(&id) { self.tray_box.remove(&btn); } + let has_items = !self.tray_items.is_empty(); + self.tray_section.set_visible(has_items); + self.tray_sep.set_visible(has_items); } AppInput::CrumbsStatus(status) => { self.crumbs_status = Some(status); + // CrumbsStatus and WifiPopoverData arrive independently (different + // pollers); whichever lands second must still repaint the header โ€” + // otherwise it only shows up if CrumbsStatus happens to win the race. + if self.wifi_popover_data.is_some() { + self.rebuild_wifi_popover(&sender); + } } AppInput::WifiPopoverData(data) => { self.wifi_popover_data = Some(data); self.rebuild_wifi_popover(&sender); } + AppInput::BtPopoverData(data) => { + self.bt_popover_data = Some(data); + self.rebuild_bt_popover(); + } AppInput::SetProfile(name) => { self.wifi_profile = Some(name); self.apply_wifi_label(); @@ -628,8 +802,12 @@ impl SimpleComponent for App { format!("{} ยท {}", state.artist, state.title) }; self.media_track_lbl.set_label(&label); - self.media_play_btn - .set_label(if state.playing { "โธ" } else { "โ–ถ" }); + let icon_svg = if state.playing { + asset!("Pause.svg") + } else { + asset!("Play.svg") + }; + self.media_play_icon.set_paintable(Some(&svg_texture(icon_svg))); if state.playing { self.media_paused_at = None; @@ -717,8 +895,8 @@ impl App { } fn rebuild_wifi_popover(&mut self, sender: &ComponentSender) { - while let Some(child) = self.wifi_popover_box.first_child() { - self.wifi_popover_box.remove(&child); + while let Some(child) = self.wifi_pane.first_child() { + self.wifi_pane.remove(&child); } if let Some(st) = &self.crumbs_status { @@ -755,15 +933,15 @@ impl App { status_lbl.set_xalign(0.0); header.append(&status_lbl); - self.wifi_popover_box.append(&header); - self.wifi_popover_box + self.wifi_pane.append(&header); + self.wifi_pane .append(>k4::Separator::new(gtk4::Orientation::Horizontal)); } let Some(data) = &self.wifi_popover_data else { let lbl = gtk4::Label::new(Some("Scanningโ€ฆ")); lbl.add_css_class("wifi-popover-loading"); - self.wifi_popover_box.append(&lbl); + self.wifi_pane.append(&lbl); return; }; @@ -772,7 +950,7 @@ impl App { ph.set_xalign(0.0); ph.set_margin_top(6); ph.set_margin_bottom(2); - self.wifi_popover_box.append(&ph); + self.wifi_pane.append(&ph); for (name, active) in &data.profiles { let row = gtk4::Button::new(); @@ -796,18 +974,18 @@ impl App { bar::wifi::spawn_profile_set(name_clone.clone()); close_parent_popover(btn); }); - self.wifi_popover_box.append(&row); + self.wifi_pane.append(&row); } if !data.scan.is_empty() { - self.wifi_popover_box + self.wifi_pane .append(>k4::Separator::new(gtk4::Orientation::Horizontal)); let nh = gtk4::Label::new(Some("Nearby")); nh.add_css_class("wifi-popover-section"); nh.set_xalign(0.0); nh.set_margin_top(6); nh.set_margin_bottom(2); - self.wifi_popover_box.append(&nh); + self.wifi_pane.append(&nh); for entry in &data.scan { let row = gtk4::Button::new(); @@ -847,25 +1025,120 @@ impl App { } close_parent_popover(btn); }); - self.wifi_popover_box.append(&row); + self.wifi_pane.append(&row); + } + } + } + + fn rebuild_bt_popover(&mut self) { + while let Some(child) = self.bt_pane.first_child() { + self.bt_pane.remove(&child); + } + + let Some(data) = &self.bt_popover_data else { + let lbl = gtk4::Label::new(Some("Loadingโ€ฆ")); + lbl.add_css_class("wifi-popover-loading"); + self.bt_pane.append(&lbl); + return; + }; + + // Power toggle row + let toggle_row = gtk4::Box::new(gtk4::Orientation::Horizontal, 8); + toggle_row.set_margin_bottom(4); + let toggle_lbl = gtk4::Label::new(Some("Bluetooth")); + toggle_lbl.add_css_class("wifi-popover-ssid"); + toggle_lbl.set_hexpand(true); + toggle_lbl.set_xalign(0.0); + let toggle_switch = gtk4::Switch::new(); + toggle_switch.set_active(data.powered); + toggle_switch.set_valign(gtk4::Align::Center); + toggle_switch.connect_state_set(|_, on| { + bar::bluetooth::spawn_set_powered(on); + gtk4::glib::Propagation::Proceed + }); + toggle_row.append(&toggle_lbl); + toggle_row.append(&toggle_switch); + self.bt_pane.append(&toggle_row); + self.bt_pane + .append(>k4::Separator::new(gtk4::Orientation::Horizontal)); + + if !data.powered { + let lbl = gtk4::Label::new(Some("Bluetooth is off")); + lbl.add_css_class("wifi-popover-loading"); + self.bt_pane.append(&lbl); + } else if data.devices.is_empty() { + let lbl = gtk4::Label::new(Some("No paired devices")); + lbl.add_css_class("wifi-popover-loading"); + self.bt_pane.append(&lbl); + } else { + let dh = gtk4::Label::new(Some("Paired")); + dh.add_css_class("wifi-popover-section"); + dh.set_xalign(0.0); + dh.set_margin_top(2); + dh.set_margin_bottom(2); + self.bt_pane.append(&dh); + + for dev in &data.devices { + let row = gtk4::Button::new(); + row.add_css_class("flat"); + row.add_css_class("wifi-popover-row"); + if dev.connected { + row.add_css_class("wifi-popover-row-active"); + } + let lbl = gtk4::Label::new(Some(&format!( + "{}{}", + if dev.connected { "โ— " } else { " " }, + dev.name, + ))); + lbl.set_xalign(0.0); + row.set_child(Some(&lbl)); + + let address = dev.address.clone(); + let connected = dev.connected; + row.connect_clicked(move |_| { + if connected { + bar::bluetooth::spawn_disconnect(address.clone()); + } else { + bar::bluetooth::spawn_connect(address.clone()); + } + }); + self.bt_pane.append(&row); } } - self.wifi_popover_box.set_visible(true); + self.bt_pane + .append(>k4::Separator::new(gtk4::Orientation::Horizontal)); + let settings_row = gtk4::Button::new(); + settings_row.add_css_class("flat"); + settings_row.add_css_class("wifi-popover-row"); + let settings_box = gtk4::Box::new(gtk4::Orientation::Horizontal, 4); + let settings_icon = gtk4::Image::from_paintable(Some(&svg_texture(bar::stats::ICON_BT_SETTINGS))); + settings_icon.add_css_class("stat-icon"); + settings_box.append(&settings_icon); + settings_box.append(>k4::Label::new(Some("Bluetooth settings"))); + settings_row.set_child(Some(&settings_box)); + settings_row.connect_clicked(|_| { + relm4::spawn(async { + let _ = tokio::process::Command::new("blueman-manager").spawn(); + }); + }); + self.bt_pane.append(&settings_row); } } // โ”€โ”€ Helpers โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ -fn build_slider_row(icon: &str, min: f64, max: f64, step: f64) -> (gtk4::Box, gtk4::Scale) { +fn build_slider_row(icon_svg: &str, min: f64, max: f64, step: f64) -> (gtk4::Box, gtk4::Scale) { let row = gtk4::Box::new(gtk4::Orientation::Horizontal, 8); row.add_css_class("control-panel-row"); row.set_margin_top(2); row.set_margin_bottom(2); - let icon_lbl = gtk4::Label::new(Some(icon)); - icon_lbl.add_css_class("control-panel-row-icon"); - icon_lbl.set_width_chars(2); + // Rendered larger than the standard 16px stat/section icons: these are + // the two things in the panel you actually drag, so they should read as + // primary controls rather than blend in with passive readouts. + let icon = gtk4::Image::from_paintable(Some(&svg_texture_sized(icon_svg, 20))); + icon.add_css_class("control-panel-row-icon"); let slider = gtk4::Scale::with_range(gtk4::Orientation::Horizontal, min, max, step); slider.set_draw_value(false); @@ -873,7 +1146,7 @@ fn build_slider_row(icon: &str, min: f64, max: f64, step: f64) -> (gtk4::Box, gt slider.set_width_request(180); slider.add_css_class("control-panel-slider"); - row.append(&icon_lbl); + row.append(&icon); row.append(&slider); (row, slider) } @@ -984,12 +1257,21 @@ fn stat_pair(icon_svg: &str, label: >k4::Label) -> gtk4::Box { pair } -fn svg_texture(svg_src: &str) -> gtk4::gdk::Texture { +pub(crate) fn svg_texture(svg_src: &str) -> gtk4::gdk::Texture { + svg_texture_sized(svg_src, 16) +} + +/// Same as `svg_texture` but rendered at an explicit pixel size โ€” used to give +/// primary/interactive icons (e.g. sliders you actually drag) more visual +/// weight than passive informational ones, which otherwise all read as the +/// same flat 16px stroke glyph once emoji stopped providing accidental variety. +pub(crate) fn svg_texture_sized(svg_src: &str, px: u32) -> gtk4::gdk::Texture { use resvg::{tiny_skia, usvg}; let fg = theme::fg_color(); + let dim = format!(r#"width="{px}" height="{px}""#); let svg = svg_src .replace("currentColor", &fg) - .replace(r#"width="24" height="24""#, r#"width="16" height="16""#); + .replace(r#"width="24" height="24""#, &dim); let tree = usvg::Tree::from_str(&svg, &usvg::Options::default()).expect("parse svg"); let size = tree.size().to_int_size(); let (w, h) = (size.width(), size.height()); diff --git a/src/notifications/mod.rs b/src/notifications/mod.rs index b6c60b2..21561d6 100644 --- a/src/notifications/mod.rs +++ b/src/notifications/mod.rs @@ -11,10 +11,29 @@ pub enum NotifEvent { summary: String, body: String, timeout_ms: u32, + urgency: Urgency, }, Close(u32), } +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum Urgency { + Low, + Normal, + Critical, +} + +impl Urgency { + /// CSS class suffix for `.notification-card.urgency-`. + pub fn css_class(self) -> Option<&'static str> { + match self { + Urgency::Low => None, + Urgency::Normal => Some("urgency-normal"), + Urgency::Critical => Some("urgency-critical"), + } + } +} + struct NotifServer { tx: mpsc::Sender, next_id: AtomicU32, @@ -32,7 +51,7 @@ impl NotifServer { summary: &str, body: &str, _actions: Vec, - _hints: std::collections::HashMap, + hints: std::collections::HashMap, expire_timeout: i32, ) -> u32 { let id = if replaces_id != 0 { @@ -45,6 +64,12 @@ impl NotifServer { } else { expire_timeout as u32 }; + // Spec: hints["urgency"] is a byte, 0=low, 1=normal, 2=critical (default normal). + let urgency = match hints.get("urgency").and_then(|v| u8::try_from(v.clone()).ok()) { + Some(0) => Urgency::Low, + Some(2) => Urgency::Critical, + _ => Urgency::Normal, + }; let _ = self .tx .send(NotifEvent::Show { @@ -53,6 +78,7 @@ impl NotifServer { summary: summary.to_string(), body: body.to_string(), timeout_ms, + urgency, }) .await; id diff --git a/src/notifications/popup.rs b/src/notifications/popup.rs index c8a7e50..3e058cd 100644 --- a/src/notifications/popup.rs +++ b/src/notifications/popup.rs @@ -4,7 +4,7 @@ use gtk4::prelude::*; use gtk4_layer_shell::{Edge, Layer, LayerShell}; use tokio::sync::mpsc::Receiver; -use super::NotifEvent; +use super::{NotifEvent, Urgency}; type Cards = Rc>>; @@ -27,12 +27,13 @@ pub async fn run(mut rx: Receiver) { summary, body, timeout_ms, + urgency, } => { // Replace existing card with same id (replaces_id case) if let Some(old) = cards.borrow_mut().remove(&id) { cards_box.remove(&old); } - let card = make_card(&app_name, &summary, &body); + let card = make_card(&app_name, &summary, &body, urgency); cards_box.prepend(&card); cards.borrow_mut().insert(id, card.clone()); window.set_visible(true); @@ -75,11 +76,17 @@ fn create_window() -> gtk4::Window { window } -fn make_card(app_name: &str, summary: &str, body: &str) -> gtk4::Box { +fn make_card(app_name: &str, summary: &str, body: &str, urgency: Urgency) -> gtk4::Box { let card = gtk4::Box::new(gtk4::Orientation::Vertical, 4); card.add_css_class("notification-card"); + if let Some(class) = urgency.css_class() { + card.add_css_class(class); + } - if !app_name.is_empty() { + // Senders often set the title/summary to their own app name (e.g. a bare + // "Spotify" notification) โ€” showing app_name above an identical summary + // is pure repetition, so skip the app label in that case. + if !app_name.is_empty() && !app_name.eq_ignore_ascii_case(summary) { let lbl = gtk4::Label::new(Some(app_name)); lbl.add_css_class("notification-app"); lbl.set_xalign(0.0); diff --git a/src/osd.rs b/src/osd.rs index 55106ec..d7520fc 100644 --- a/src/osd.rs +++ b/src/osd.rs @@ -122,40 +122,39 @@ fn brightness_watcher(tx: mpsc::Sender) { async fn run_osd(mut rx: mpsc::Receiver) { let window = create_window(); - let container = gtk4::Box::new(gtk4::Orientation::Vertical, 6); - container.set_margin_top(12); - container.set_margin_bottom(12); - container.set_margin_start(16); - container.set_margin_end(16); + let container = gtk4::Box::new(gtk4::Orientation::Horizontal, 0); + container.set_margin_top(10); + container.set_margin_bottom(10); + container.set_margin_start(14); + container.set_margin_end(14); window.set_child(Some(&container)); - let header = gtk4::Box::new(gtk4::Orientation::Horizontal, 0); - let kind_lbl = gtk4::Label::new(Some("Volume")); - kind_lbl.add_css_class("osd-kind"); - kind_lbl.set_hexpand(true); - kind_lbl.set_xalign(0.0); - let pct_lbl = gtk4::Label::new(Some("0%")); - pct_lbl.add_css_class("osd-pct"); - header.append(&kind_lbl); - header.append(&pct_lbl); - container.append(&header); + let icon = gtk4::Image::from_paintable(Some(&crate::svg_texture( + crate::bar::stats::ICON_VOLUME, + ))); + icon.add_css_class("osd-icon"); + container.append(&icon); let pbar = gtk4::ProgressBar::new(); pbar.add_css_class("osd-bar"); + pbar.set_hexpand(true); + pbar.set_valign(gtk4::Align::Center); container.append(&pbar); let dismiss_token = Rc::new(Cell::new(0u32)); while let Some(event) = rx.recv().await { - let (kind, pct) = match event { - OsdEvent::Volume { pct, muted } => { - (if muted { "Volume (Muted)" } else { "Volume" }, pct) - } - OsdEvent::Brightness { pct } => ("Brightness", pct), + let (icon_svg, pct, muted) = match event { + OsdEvent::Volume { pct, muted } => (crate::bar::stats::ICON_VOLUME, pct, muted), + OsdEvent::Brightness { pct } => (crate::bar::stats::ICON_BRIGHTNESS, pct, false), }; - kind_lbl.set_label(kind); - pct_lbl.set_label(&format!("{pct}%")); + icon.set_paintable(Some(&crate::svg_texture(icon_svg))); + if muted { + icon.add_css_class("osd-icon-muted"); + } else { + icon.remove_css_class("osd-icon-muted"); + } pbar.set_fraction(pct as f64 / 100.0); window.set_visible(true); @@ -179,6 +178,6 @@ fn create_window() -> gtk4::Window { window.set_layer(Layer::Overlay); window.set_anchor(Edge::Bottom, true); window.set_margin(Edge::Bottom, 80); - window.set_default_width(280); + window.set_default_width(180); window } diff --git a/src/theme.rs b/src/theme.rs index dc7e149..6cee541 100644 --- a/src/theme.rs +++ b/src/theme.rs @@ -14,71 +14,89 @@ fn load_css() -> String { // card) and child labels inherit it, so text stays legible whatever lightness // pywal hands a given slot. `on_*` are luminance-picked ink (black/white) for // that background โ€” the pywal hues themselves are untouched. + // + // Shared tokens: one radius and one padding rhythm reused across every + // popover/card/OSD surface so they read as one design system rather than + // four different ones. `radius_pill` is only for the tiny transient OSD. + let radius = "10px"; + let radius_sm = "6px"; + let radius_pill = "20px"; + let pad = "10px"; + format!( "window.breadbar {{ background-color: {bg_rgba}; color: {on_bg}; border-radius: 0; }}\ - .workspace-btn {{ background: transparent; opacity: 0.45;\ - border-radius: 0; border: none; outline: none; box-shadow: none;\ - min-width: 24px; padding: 4px 8px; }}\ + .workspace-btn {{ background: transparent; opacity: 0.45; color: {on_bg};\ + border-radius: {radius_sm}; border: none; outline: none; box-shadow: none;\ + min-width: 20px; margin: 5px 2px; padding: 2px 9px; }}\ .workspace-btn:hover {{ opacity: 0.8; }}\ - .workspace-btn.active {{ background: {accent}; color: {on_accent}; opacity: 1; }}\ + .workspace-btn.active {{ background: alpha({accent}, 0.18); color: {accent}; opacity: 1; }}\ .stats-box {{ margin-right: 8px; }}\ .stat-pair {{ margin-right: 14px; }}\ .stat-icon {{ margin-right: 2px; }}\ .bt-icon {{ margin-right: 14px; }}\ + separator.bar-sep {{ min-height: 14px; margin: 0 8px 0 0; background: alpha({on_bg}, 0.14); }}\ window.breadbar-notification {{ background-color: alpha({bg_plain}, 0.95); color: {on_bg}; }}\ - .notification-card {{ background: {surface}; color: {on_surface}; border-radius: 8px;\ - padding: 12px; margin-bottom: 8px; }}\ + .notification-card {{ background: {surface}; color: {on_surface}; border-radius: {radius};\ + padding: {pad}; margin-bottom: 8px; border-left: 3px solid transparent; }}\ + .notification-card.urgency-critical {{ border-left-color: {critical}; }}\ + .notification-card.urgency-normal {{ border-left-color: {accent}; }}\ .notification-summary {{ font-weight: bold; }}\ .notification-app {{ opacity: 0.6; }}\ - window.breadbar-osd {{ background-color: alpha({bg_plain}, 0.95); color: {on_bg}; border-radius: 8px; }}\ - .osd-kind {{ opacity: 0.75; font-size: 12px; }}\ - .osd-pct {{ font-weight: bold; font-size: 12px; }}\ - progressbar.osd-bar {{ min-height: 8px; }}\ - progressbar.osd-bar trough {{ background-image: none; background-color: {trough}; border-radius: 4px; min-height: 8px; }}\ - progressbar.osd-bar trough progress {{ background-image: none; background-color: {accent}; border-radius: 4px; min-height: 8px; }}\ + window.breadbar-osd {{ background-color: alpha({bg_plain}, 0.95); color: {on_bg}; border-radius: {radius_pill}; }}\ + .osd-icon {{ opacity: 0.85; margin-right: 8px; }}\ + .osd-icon-muted {{ opacity: 0.35; }}\ + progressbar.osd-bar {{ min-height: 6px; }}\ + progressbar.osd-bar trough {{ background-image: none; background-color: {trough}; border-radius: 3px; min-height: 6px; }}\ + progressbar.osd-bar trough progress {{ background-image: none; background-color: {accent}; border-radius: 3px; min-height: 6px; }}\ .clickable {{ cursor: pointer; }}\ - .wifi-pair {{ border-radius: 4px; padding: 0 2px; }}\ + .wifi-pair {{ border-radius: {radius_sm}; padding: 0 2px; }}\ .wifi-pair:hover {{ background: alpha({on_bg}, 0.12); }}\ - .wifi-popover-inner {{ min-width: 180px; padding: 2px; }}\ + .wifi-popover-inner {{ min-width: 200px; padding: {pad}; }}\ + .popover-tab-row {{ margin-bottom: {pad}; }}\ + .popover-tab {{ background: transparent; color: {on_bg}; border: none; box-shadow: none;\ + outline: none; border-radius: {radius_sm}; padding: 4px 10px; font-size: 11px;\ + font-weight: bold; opacity: 0.55; }}\ + .popover-tab:hover {{ opacity: 0.8; }}\ + .popover-tab:checked {{ background: alpha({accent}, 0.18); color: {accent}; opacity: 1; }}\ .wifi-popover-ssid {{ font-weight: bold; font-size: 13px; }}\ .wifi-popover-ip {{ opacity: 0.6; font-size: 11px; }}\ .wifi-popover-status {{ font-size: 11px; margin-top: 2px; }}\ .wifi-popover-section {{ font-size: 10px; font-weight: bold; opacity: 0.5; letter-spacing: 0.08em; }}\ .wifi-popover-row {{ background: transparent; border: none; box-shadow: none;\ - border-radius: 4px; padding: 2px 6px; }}\ + border-radius: {radius_sm}; padding: 4px 6px; }}\ .wifi-popover-row:hover {{ background: alpha({on_bg}, 0.08); }}\ .wifi-popover-row-active {{ color: {accent}; }}\ .wifi-popover-row-unsaved {{ opacity: 0.4; }}\ .wifi-popover-loading {{ opacity: 0.5; padding: 8px; }}\ window.wifi-add-dialog {{ background-color: {bg_rgba}; color: {on_bg}; min-width: 240px; }}\ - .media-widget {{ border-radius: 4px; padding: 0 6px; cursor: pointer; }}\ + .media-widget {{ border-radius: {radius_sm}; padding: 0 6px; cursor: pointer; }}\ .media-widget:hover {{ background: alpha({on_bg}, 0.10); }}\ .media-indicator {{ font-size: 11px; opacity: 0.7; margin-right: 2px; }}\ .media-track-lbl {{ font-size: 12px; }}\ .media-controls {{ padding: 2px; }}\ - .media-btn {{ font-size: 16px; min-width: 36px; padding: 2px 8px; }}\ - .control-panel-btn {{ font-size: 14px; padding: 0 6px; margin-left: 6px; border-radius: 4px; }}\ + .media-btn {{ min-width: 32px; padding: 4px 8px; }}\ + .control-panel-btn {{ padding: 0 6px; margin-left: 6px; border-radius: {radius_sm}; }}\ .control-panel {{ }}\ - .control-panel-inner {{ min-width: 240px; padding: 8px; }}\ + .control-panel-inner {{ min-width: 220px; padding: {pad}; }}\ .control-panel-row {{ margin: 4px 0; }}\ - .control-panel-row-icon {{ opacity: 0.75; }}\ + .control-panel-row-icon {{ opacity: 1; margin-right: 4px; }}\ .control-panel-slider {{ margin: 0; }}\ - .control-panel-stats {{ margin: 8px 0; }}\ + .control-panel-stats {{ margin: {pad} 0; }}\ .control-panel-stat {{ font-size: 12px; opacity: 0.85; margin: 1px 0; }}\ - .control-panel-section {{ margin: 6px 0; }}\ + .control-panel-section {{ margin: {pad} 0; }}\ .control-panel-section-header {{ font-size: 10px; font-weight: bold; opacity: 0.5;\ letter-spacing: 0.08em; margin-bottom: 4px; }}\ .control-panel-sink-dropdown {{ }}\ .power-row {{ margin-top: 2px; }}\ - .power-btn {{ font-size: 16px; min-width: 44px; padding: 4px; border-radius: 6px; }}\ + .power-btn {{ min-width: 40px; padding: 8px; border-radius: {radius_sm}; }}\ separator {{ margin: 4px 0; }}", bg_plain = p.background, bg_rgba = hex_to_rgba(&p.background, 0.92), surface = p.color0, accent = p.color4, + critical = p.color1, on_bg = ink_on(&p.background), on_surface = ink_on(&p.color0), - on_accent = ink_on(&p.color4), trough = hex_to_rgba(&p.color4, 0.25), ) }