feat: Eww bar capture control

wayland/eww
Leni Aniva 2024-06-02 14:57:12 -07:00
parent c601a17ae9
commit aecf181eac
Signed by: aniva
GPG Key ID: 4D9B1C8D10EA4C50
3 changed files with 175 additions and 165 deletions

View File

@ -18,35 +18,49 @@ $media-progress-bg: #333333;
$media: rgba(224, 232, 224, 0.7); $media: rgba(224, 232, 224, 0.7);
$media-paused: rgba(224, 200, 200, 0.7); $media-paused: rgba(224, 200, 200, 0.7);
$tray_bg: rgba(204, 204, 204, 0.1); // Dims the desktop background so status icons can be seen against darker wallpapers
$status_bg: rgba(0, 0, 0, 0.3);
$tray_bg: rgba(204, 204, 204, 0.1);
$tray: #c9cbff; $tray: #c9cbff;
$keyboard: #f2cdcd; $keyboard: #f2cdcd;
$language: #e8a2af; $language: #e8a2af;
$idle_inhibitor: #f28fad; $idle_inhibitor: #f28fad;
$audio: #fae3b0; $audio: #fae3b0;
$backlight: #f8bd96; $network: #f8bd96;
$bluetooth: #caa9c7; $backlight: #bd93f9;
$network: #bd93f9;
$cpu_bg: #333333; $cpu_bg: #333333;
$cpu: #96cdfb; $cpu: #96cdfb;
$memory_bg: #333333; $memory_bg: #333333;
$memory: #88bbeb; // previously bluetooth colour
$memory: #caa9c7;
//$memory: #88bbeb;
$temperature: #ddb6f2; $temperature: #ddb6f2;
$temperature_critical: #ff6666; $temperature_critical: #ff6666;
$battery: #b6b2b3; $battery: #b6b2b3;
//* { all: unset; } // Styles all scales
scale trough {
all: unset;
background-color: #333333;
border-radius: 5px;
min-height: 80px;
min-width: 2px;
//margin: .3rem 0 .3rem 0;
}
trough highlight {
all: unset;
background-color: #eeeeee;
border-radius: 5px;
}
trough slider {
background-color: transparent;
border-width: 0px;
border-radius: 10px;
}
.vbar { .vbar {
background-color: transparent; background-color: transparent;
margin-left: 5px;
font-size: 15px;
font-family: monospace;
}
.hbar {
background-color: transparent;
margin-top: 5px;
font-size: 15px; font-size: 15px;
font-family: monospace; font-family: monospace;
} }
@ -58,7 +72,7 @@ $battery: #b6b2b3;
.launcher { .launcher {
all: unset; all: unset;
font-size: 40px; font-size: 40px;
margin: -2px -5px 5px -3px; margin: -2px -5px 5px 0px;
} }
box .workspaces { box .workspaces {
@ -88,6 +102,10 @@ box .workspaces {
} }
} }
box .status {
background-color: $status_bg;
}
box .weather { box .weather {
color: $weather; color: $weather;
margin-left: 2px; margin-left: 2px;
@ -118,100 +136,67 @@ box .weather {
color: mix($weather_end, $weather, 100%); color: mix($weather_end, $weather, 100%);
} }
} }
//.audio-scale .audio .audio-icon { .audio {
// background-color: transparent;
// color: $audio;
//}
scale {
border-radius: 5px;
min-height: 80px;
min-width: 10px;
margin: .3rem 0 .3rem 0;
}
.volume-icon {
margin: 2pt 0 2pt 0;
color: $audio;
}
box .cpu {
background-color: $cpu_bg;
color: $cpu;
padding: 5pt;
}
box .memory {
background-color: $memory_bg;
color: $memory;
padding: 5pt;
}
box .clock {
background-color: transparent; background-color: transparent;
border-radius: 5; .icon {
color: $clock; color: $audio;
padding: 2pt 2pt 2pt 2pt; }
color: $audio;
border-left: 2px solid $audio;
margin-bottom: 1px;
margin-top: 1px;
} }
.media { .media {
font-family: "Noto Serif"; font-family: "Noto Serif";
padding-left: 5px;
padding-right: 5px;
min-height: 15px; min-height: 15px;
min-width: 15px; min-width: 15px;
color: $media; color: $media;
border: none; border: none;
}
.media-playing { .media-text-playing {
background-color: $media-progress-bg; padding-left: 10px;
color: $media; }
} .media-text-paused {
.media-paused { padding-left: 10px;
background-color: $media-progress-bg; color: $media-paused;
color: $media-paused; }
} .media-playing {
.media-text-paused { background-color: $media-progress-bg;
color: $media-paused; color: $media;
} }
.status { .media-paused {
font-family: monospace; background-color: $media-progress-bg;
color: $media-paused;
}
} }
box .cpu {
.progress {
background-color: $cpu_bg;
}
color: $cpu;
border-left: 2px solid $cpu;
margin-bottom: 1px;
margin-top: 1px;
}
box .memory {
.progress {
background-color: $memory_bg;
}
color: $memory;
border-left: 2px solid $memory;
margin-bottom: 1px;
margin-top: 1px;
}
box .clock {
background-color: transparent;
color: $clock;
margin-top: 1px;
border-left: 2px solid $clock;
}
.systray { .systray {
background-color: $tray_bg; //background-color: $tray_bg;
color: $tray; color: $tray;
} border-left: 2px dotted $tray;
// Styles on classes (see eww.yuck for more information)
.status slider {
all: unset;
color: #ffd5cd;
}
.metric scale trough highlight {
all: unset;
background-color: #D35D6E;
color: #000000;
border-radius: 10px;
}
.metric scale trough {
all: unset;
background-color: #4e4e4e;
border-radius: 50px;
min-height: 3px;
min-width: 50px;
margin-left: 10px;
margin-right: 20px;
}
.metric scale trough highlight {
all: unset;
background-color: #D35D6E;
color: #000000;
border-radius: 10px;
}
.metric scale trough {
all: unset;
background-color: #4e4e4e;
border-radius: 50px;
min-height: 3px;
min-width: 50px;
margin-left: 10px;
margin-right: 20px;
} }

View File

@ -1,4 +1,5 @@
(defvar eww "eww --config $HOME/.config/eww/bar") (defvar eww-flags "--config $HOME/.config/eww/bar")
(defvar amixer "amixer -D pulse")
(defwindow vbar (defwindow vbar
:exclusive true :exclusive true
@ -15,7 +16,6 @@
(centerbox (centerbox
:orientation "v" :orientation "v"
(box :orientation "v" :space-evenly false :valign "start" (box :orientation "v" :space-evenly false :valign "start"
;(box :class "launcher" :valign "start" :width "10px" :height "10px" "☯")
(label (label
:class "launcher" :valign "start" :width "20px" :height "20px" :class "launcher" :valign "start" :width "20px" :height "20px"
:unindent true :unindent true
@ -24,14 +24,17 @@
(widget-workspaces) (widget-workspaces)
) )
(widget-media) (widget-media)
(box :orientation "v" :space-evenly false :valign "end" (box
:class "status"
:orientation "v" :space-evenly false :valign "end"
(widget-tray) (widget-tray)
(widget-audio) (widget-volume)
(widget-microphone)
;(widget-temperature)
(widget-cpu) (widget-cpu)
(widget-memory) (widget-memory)
(widget-clock) (widget-clock)
) )
;(widget_status)
)) ))
(defwindow hbar (defwindow hbar
:exclusive true :exclusive true
@ -73,30 +76,6 @@
"scripts/compositor-control active-title") "scripts/compositor-control active-title")
; Weather
(defwidget widget-weather [orientation]
(box
:class "weather"
:orientation orientation
:space-evenly false
:valign "start"
:halign "center"
:spacing 10
(button :onclick "scripts/popup weather" "W")
))
(defpoll weather-text :initial "" :interval "180s"
"curl --max-time 2 wttr.in")
(defwindow weather
:geometry (geometry :x "70px"
:y "50%"
:width "270px"
:height "60px")
(box weather-text))
(defwidget widget-media [] (defwidget widget-media []
(box (box
:class "media" :class "media"
@ -115,11 +94,12 @@
:visible {media-current != "" && media-length != 1} :visible {media-current != "" && media-length != 1}
)) ))
(label (label
:class { media-status == "Paused" ? "media-text-paused" : "media-text-playing" } :class { media-status == "Paused" ? "media-text-paused" : "media-text-playing" }
:angle 270 :angle 270
:xalign 0.5 :xalign 0.5
:yalign 0.5 :yalign 0.5
:justify "center" :justify "center"
:limit-width 120
:text {media-current != "" ? "『${media-current}』" : "『』"}) :text {media-current != "" ? "『${media-current}』" : "『』"})
)) ))
@ -135,55 +115,99 @@
(deflisten media-status :initial "Stopped" (deflisten media-status :initial "Stopped"
"playerctl --follow status") "playerctl --follow status")
(defwidget widget-audio [] (defwidget widget-volume []
(eventbox (eventbox
:class "audio" :onhover "${EWW_EXECUTABLE} ${eww-flags} update show-volume=true"
:onhover "${eww} update show-audio=true" :onhoverlost "${EWW_EXECUTABLE} ${eww-flags} update show-volume=false"
:onhoverlost "${eww} update show-audio=false" :onclick "${amixer} sset Master toggle"
(box (box
:class "audio" :class "audio"
:orientation "v" :orientation "v"
:space-evenly "false" :space-evenly "false"
:spacing "2" :spacing "2"
(revealer :transition "slideup" :reveal show-audio :tooltip "Volume: ${current-volume}%"
(revealer :transition "slideup" :reveal show-volume
(scale (scale
:class "audio-scale" :class "scale"
:value current-volume :value current-volume
:orientation "v" :orientation "v"
:flipped true :flipped true
:marks true :marks true
:tooltip "Volume: ${current-volume}%"
:max 101 :max 101
:min 0 :min 0
:onchange "amixer -D pulse sset Master {}%" )) :onchange "${amixer} sset Master {}%" ))
(label (label
:class "audio-icon" :class "icon"
:width 20 :height 20 :width 20 :height 20
:xalign 0.5 :yalign 0.5 :xalign 0.5 :yalign 0.5
:noindent true :noindent true
:tooltip "Volume: ${current-volume}%" :text { current-volume-state == "off" ? "" : (current-volume > 80 ? "" : "") }))))
:text { current-volume == 0 ? "" : (current-volume > 80 ? "" : "") })))) (defwidget widget-microphone []
(eventbox
:onhover "${EWW_EXECUTABLE} ${eww-flags} update show-microphone=true"
:onhoverlost "${EWW_EXECUTABLE} ${eww-flags} update show-microphone=false"
:onclick "${amixer} sset Capture toggle"
(box
:class "audio"
:orientation "v"
:space-evenly "false"
:spacing "2"
:tooltip "Capture : ${current-microphone}%"
(revealer :transition "slideup" :reveal show-microphone
(scale
:class "scale"
:value current-microphone
:orientation "v"
:flipped true
:marks true
:max 101
:min 0
:onchange "${amixer} sset Capture {}%" ))
(label
:class "icon"
:width 20 :height 20
:xalign 0.5 :yalign 0.5
:noindent true
:text { current-microphone-state == "off" ? "" : "" }))))
(defpoll current-volume :interval "1s" "amixer -D pulse sget Master | grep 'Left:' | awk -F'[][]' '{ print $2 }' | tr -d '%'") (defpoll current-volume :interval "1s" "amixer -D pulse sget Master | grep 'Left:' | awk -F'[][]' '{ print $2 }' | tr -d '%'")
(defvar show-audio false) (defpoll current-volume-state :interval "1s" "amixer -D pulse sget Master | grep 'Left:' | awk -F'[][]' '{ print $4 }'")
(defpoll current-microphone :interval "1s" "amixer -D pulse sget Capture | grep 'Left:' | awk -F'[][]' '{ print $2 }' | tr -d '%'")
(defpoll current-microphone-state :interval "1s" "amixer -D pulse sget Capture | grep 'Left:' | awk -F'[][]' '{ print $4 }'")
(defvar show-volume false)
(defvar show-microphone false)
(defwidget widget-temperature []
(label
:class "temperature"
:width 20
:height 20
:tooltip {EWW_TEMPS}
:text ""
))
(defwidget widget-cpu [] (defwidget widget-cpu []
(circular-progress (box
:class "cpu" :class "cpu"
:orientation "v"
(circular-progress
:class "progress"
:width 20 :width 20
:height 20 :height 20
:thickness 4 :thickness 4
:tooltip {EWW_CPU.cores} :tooltip " ${round(EWW_CPU.avg, 2)}%"
:value {EWW_CPU.avg} :value {EWW_CPU.avg}
)) )))
(defwidget widget-memory [] (defwidget widget-memory []
(circular-progress (box
:class "memory" :class "memory"
:orientation "v"
(circular-progress
:class "progress"
:width 20 :width 20
:height 20 :height 20
:thickness 4 :thickness 4
:tooltip "${EWW_RAM.used_mem} / ${EWW_RAM.total_mem}" :tooltip "${round(100 * EWW_RAM.used_mem / EWW_RAM.total_mem, 2)}%"
:value {EWW_RAM.used_mem_perc} :value {EWW_RAM.used_mem_perc}
)) )))
(defwidget widget-tray [] (defwidget widget-tray []
(systray (systray
:class "systray" :class "systray"
@ -200,7 +224,7 @@
:valign "end" :valign "end"
:spacing 1 :spacing 1
:width 20 :width 20
(box :class "icon" "") ;(box :class "icon" "")
"${clock.m}" "${clock.d}" "${clock.m}" "${clock.d}"
(box :class "icon" "") (box :class "icon" "")
"${clock.H}" "${clock.M}" "${clock.H}" "${clock.M}"
@ -210,7 +234,6 @@
"date '+{\"H\":\"%H\", \"M\":\"%M\", \"d\":\"%d\", \"m\":\"%m\", \"b\":\"%b\", \"Y\":\"%Y\"}'") "date '+{\"H\":\"%H\", \"M\":\"%M\", \"d\":\"%d\", \"m\":\"%m\", \"b\":\"%b\", \"Y\":\"%Y\"}'")
; Calendar ; Calendar
(defwindow calendar (defwindow calendar
@ -236,20 +259,25 @@
(defpoll calendar_year :interval "10h" (defpoll calendar_year :interval "10h"
"date '+%Y'") "date '+%Y'")
(defwidget metric [label value onchange] ; Weather
(defwidget widget-weather [orientation]
(box (box
:orientation "v" :class "weather"
:class "metric" :orientation orientation
:space-evenly false :space-evenly false
(box :class "label" label) :valign "start"
(circular-progress :value value) :halign "center"
;(scale :spacing 10
; :min 0 :max 101 (button :onclick "scripts/popup weather" "W")
; :active {onchange != ""}
; :orientation "v"
; :value value
; :onchange onchange)
)) ))
(defpoll volume :initial 0 :interval "1s" (defpoll weather-text :initial "" :interval "180s"
"scripts/get-volume.sh") "curl --max-time 2 wttr.in")
(defwindow weather
:geometry (geometry :x "70px"
:y "50%"
:width "270px"
:height "60px")
(box weather-text))

View File

@ -1,3 +0,0 @@
#!/bin/bash
amixer -D pulse sget Master | grep 'Left:' | awk -F'[][]' '{ print $2 }' | tr -d '%' | head -1