Switch to ags as bar and notification daemon
parent
73d50fe80f
commit
41b104b9a7
|
|
@ -1,3 +1,5 @@
|
|||
import { GTK_ALIGN_CENTER, GTK_ALIGN_FILL } from '../constants.js'
|
||||
|
||||
const mpris = await Service.import("mpris")
|
||||
const players = mpris.bind("players")
|
||||
|
||||
|
|
@ -17,22 +19,130 @@ function lengthStr(length) {
|
|||
|
||||
/** @param {import('types/service/mpris').MprisPlayer} player */
|
||||
function Player(player) {
|
||||
return Widget.Label({ label: `${player.name}: ${player.cover_path}` })
|
||||
// return Widget.Overlay({
|
||||
// child: Widget.Box({
|
||||
// class_name: "img",
|
||||
// vpack: "start",
|
||||
// css: player.bind("cover_path").transform(p => `background-image: url('${p}');`),
|
||||
// }),
|
||||
// overlays: [
|
||||
// Widget.Label({ label: player.name }),
|
||||
// ],
|
||||
// })
|
||||
const artists = player.bind("track_artists").transform(a => a.join(", "))
|
||||
|
||||
const playPause = Widget.Button({
|
||||
className: "play-pause",
|
||||
onClicked: () => player.playPause(),
|
||||
visible: player.bind("can_play"),
|
||||
child: Widget.Icon({
|
||||
icon: player.bind("play_back_status").transform(s => {
|
||||
switch (s) {
|
||||
case "Playing": return PAUSE_ICON
|
||||
case "Paused":
|
||||
case "Stopped": return PLAY_ICON
|
||||
}
|
||||
}),
|
||||
}),
|
||||
})
|
||||
|
||||
const prev = Widget.Button({
|
||||
onClicked: () => player.previous(),
|
||||
visible: player.bind("can_go_prev"),
|
||||
child: Widget.Icon(PREV_ICON),
|
||||
})
|
||||
|
||||
const next = Widget.Button({
|
||||
onClicked: () => player.next(),
|
||||
visible: player.bind("can_go_next"),
|
||||
child: Widget.Icon(NEXT_ICON),
|
||||
})
|
||||
|
||||
const positionSlider = Widget.Slider({
|
||||
className: "position",
|
||||
drawValue: false,
|
||||
onChange: ({ value }) => player.position = value * player.length,
|
||||
visible: player.bind("length").as(l => l > 0),
|
||||
setup: self => {
|
||||
function update() {
|
||||
const value = player.position / player.length
|
||||
self.value = value > 0 ? value : 0
|
||||
}
|
||||
self.hook(player, update)
|
||||
self.hook(player, update, "position")
|
||||
self.poll(1000, update)
|
||||
},
|
||||
})
|
||||
|
||||
const positionLabel = Widget.Label({
|
||||
className: "position",
|
||||
hpack: "start",
|
||||
setup: self => {
|
||||
const update = (_, time) => {
|
||||
self.label = lengthStr(time || player.position)
|
||||
self.visible = player.length > 0
|
||||
}
|
||||
|
||||
self.hook(player, update, "position")
|
||||
self.poll(1000, update)
|
||||
},
|
||||
})
|
||||
|
||||
const lengthLabel = Widget.Label({
|
||||
className: "length",
|
||||
hpack: "end",
|
||||
visible: player.bind("length").transform(l => l > 0),
|
||||
label: player.bind("length").transform(lengthStr),
|
||||
})
|
||||
|
||||
return Widget.Overlay({
|
||||
className: "player",
|
||||
child: Widget.Box({
|
||||
className: "bg-img",
|
||||
vpack: "start",
|
||||
css: player.bind("cover_path").transform(p => `background-image: url('${p}');`),
|
||||
}),
|
||||
overlays: [
|
||||
Widget.Box({
|
||||
className: "bg-cover"
|
||||
}),
|
||||
Widget.Box({
|
||||
className: "overlay",
|
||||
vertical: true,
|
||||
halign: GTK_ALIGN_CENTER,
|
||||
children: [
|
||||
Widget.Box({
|
||||
className: "info",
|
||||
vertical: true,
|
||||
children: [
|
||||
Widget.Label({ className: "title", label: player.bind("track_title") }),
|
||||
Widget.Label({ className: "album", label: player.bind("track_album") }),
|
||||
Widget.Label({ className: "artist", label: artists }),
|
||||
],
|
||||
}),
|
||||
Widget.Box({
|
||||
vexpand: true,
|
||||
}),
|
||||
Widget.CenterBox({
|
||||
className: "controls",
|
||||
startWidget: positionLabel,
|
||||
centerWidget: Widget.Box({
|
||||
halign: GTK_ALIGN_CENTER,
|
||||
spacing: 20,
|
||||
children: [
|
||||
prev,
|
||||
playPause,
|
||||
next,
|
||||
],
|
||||
}),
|
||||
endWidget: lengthLabel,
|
||||
}),
|
||||
positionSlider,
|
||||
],
|
||||
})
|
||||
],
|
||||
})
|
||||
}
|
||||
|
||||
function MediaContent() {
|
||||
const currentIdx = Variable(0);
|
||||
const currentPlayer = Utils.merge([currentIdx.bind(), players], (currentIdx, players) => {
|
||||
const idx = Math.min(currentIdx, players.length - 1);
|
||||
return players[idx];
|
||||
})
|
||||
|
||||
return Widget.Box({
|
||||
children: players.as(p => p.map(Player)),
|
||||
children: currentPlayer.as(p => [Player(p)]),
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,59 @@
|
|||
.media > box {
|
||||
border-radius: 5px;
|
||||
|
||||
background-color: transparent;
|
||||
color: @ctp-text;
|
||||
}
|
||||
|
||||
.media .player .bg-img {
|
||||
border-radius: 5px;
|
||||
min-width: 400px;
|
||||
min-height: 200px;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.media .player .bg-cover {
|
||||
background: linear-gradient(alpha(@ctp-base, 0.5), @ctp-base);
|
||||
}
|
||||
|
||||
.media .player .overlay {
|
||||
border-radius: 5px;
|
||||
min-width: 400px;
|
||||
}
|
||||
|
||||
.media .player .info {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.media .player .controls {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.media .player .info .title {
|
||||
font-size: 1.2em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.media .player scale.position {
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.media .player scale.position trough {
|
||||
min-height: 4px;
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
background-color: @ctp-overlay0;
|
||||
}
|
||||
|
||||
.media .player scale.position highlight {
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
background-color: @ctp-lavender;
|
||||
}
|
||||
|
||||
.media .player scale.position slider {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
@import url("colors.css");
|
||||
@import url("notifications/style.css");
|
||||
@import url("media/style.css");
|
||||
|
||||
|
||||
.bar > box {
|
||||
|
|
@ -10,7 +11,6 @@
|
|||
color: @ctp-text;
|
||||
}
|
||||
|
||||
|
||||
.clock .time {
|
||||
font-weight: bold;
|
||||
font-size: 1em;
|
||||
|
|
@ -20,10 +20,3 @@
|
|||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.media > box {
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
|
||||
background-color: alpha(@ctp-base, 0.95);
|
||||
color: @ctp-text;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@
|
|||
|
||||
autoStart = [
|
||||
# Bar
|
||||
"${pkgs.dunst}/bin/dunst"
|
||||
"${pkgs.ags}/bin/ags"
|
||||
"${pkgs.firefox}/bin/firefox"
|
||||
"${pkgs.discord}/bin/discord"
|
||||
];
|
||||
|
|
@ -119,96 +119,6 @@
|
|||
wallpaperFolder = "/home/kalle/Pictures/Wallpapers";
|
||||
};
|
||||
|
||||
services.dunst = {
|
||||
enable = true;
|
||||
settings = {
|
||||
global = {
|
||||
monitor = 0;
|
||||
follow = "none";
|
||||
width = 300;
|
||||
height = 300;
|
||||
origin = "top-left";
|
||||
offset = "10x10";
|
||||
scale = 0;
|
||||
notification_limit = 20;
|
||||
progress_bar = true;
|
||||
progress_bar_height = 10;
|
||||
progress_bar_frame_width = 0;
|
||||
progress_bar_min_width = 150;
|
||||
progress_bar_max_width = 300;
|
||||
progress_bar_corner_radius = 0;
|
||||
icon_corner_radius = 0;
|
||||
indicate_hidden = "yes";
|
||||
transparency = "0.3";
|
||||
separator_height = 2;
|
||||
padding = 8;
|
||||
horizontal_padding = 8;
|
||||
text_icon_padding = 0;
|
||||
frame_width = 0;
|
||||
frame_color = "#aaaaaa";
|
||||
gap_size = 10;
|
||||
separator_color = "frame";
|
||||
sort = "yes";
|
||||
font = "Monospace 8";
|
||||
line_height = 0;
|
||||
markup = "full";
|
||||
format = "<b>%s</b>\n%b";
|
||||
alignment = "left";
|
||||
vertical_alignment = "center";
|
||||
show_age_threshold = 60;
|
||||
ellipsize = "middle";
|
||||
ignore_newline = "no";
|
||||
stack_duplicates = true;
|
||||
hide_duplicate_count = false;
|
||||
show_indicators = "yes";
|
||||
enable_recursive_icon_lookup = true;
|
||||
icon_theme = "Adwaita";
|
||||
icon_position = "left";
|
||||
min_icon_size = 32;
|
||||
max_icon_size = 128;
|
||||
icon_path = "/usr/share/icons/gnome/16x16/status/:/usr/share/icons/gnome/16x16/devices/";
|
||||
sticky_history = "yes";
|
||||
history_length = 20;
|
||||
dmenu = "/usr/bin/dmenu -p dunst:";
|
||||
browser = "/usr/bin/xdg-open";
|
||||
always_run_script = true;
|
||||
title = "Dunst";
|
||||
class = "Dunst";
|
||||
corner_radius = 0;
|
||||
ignore_dbusclose = false;
|
||||
force_xwayland = false;
|
||||
force_xinerama = false;
|
||||
mouse_left_click = "close_current";
|
||||
mouse_middle_click = "do_action, close_current";
|
||||
mouse_right_click = "close_all";
|
||||
};
|
||||
|
||||
experimental = {
|
||||
per_monitor_dpi = false;
|
||||
};
|
||||
|
||||
|
||||
urgency_low = {
|
||||
background = "#222222";
|
||||
foreground = "#888888";
|
||||
timeout = 10;
|
||||
};
|
||||
|
||||
urgency_normal = {
|
||||
background = "#285577";
|
||||
foreground = "#ffffff";
|
||||
timeout = 10;
|
||||
};
|
||||
|
||||
urgency_critical = {
|
||||
background = "#900000";
|
||||
foreground = "#ffffff";
|
||||
frame_color = "#ff0000";
|
||||
timeout = 0;
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
nixpkgs = {
|
||||
overlays = with outputs.overlays; [
|
||||
nvim-plugins
|
||||
|
|
@ -229,7 +139,6 @@
|
|||
home.packages = with pkgs; [
|
||||
discord
|
||||
vesktop
|
||||
firefox
|
||||
chromium
|
||||
httpie
|
||||
kate
|
||||
|
|
@ -242,15 +151,21 @@
|
|||
difftastic
|
||||
sops
|
||||
(obsidian.override {
|
||||
electron = pkgs.electron_29-bin;
|
||||
electron = electron_29-bin;
|
||||
})
|
||||
unzip
|
||||
vlc
|
||||
feishin
|
||||
|
||||
cachix
|
||||
];
|
||||
|
||||
programs.home-manager.enable = true;
|
||||
|
||||
programs.firefox = {
|
||||
enable = true;
|
||||
nativeMessagingHosts = [ pkgs.plasma-browser-integration ];
|
||||
};
|
||||
|
||||
gtk = {
|
||||
enable = true;
|
||||
|
|
|
|||
Loading…
Reference in New Issue