From fb7b91699e0ada1fed857b180fa4a6e2a54c2008 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Dias?= Date: Sat, 23 Nov 2024 10:10:28 -0300 Subject: [PATCH] :sparkles: feat: use eww as bar! --- eww/eww.scss | 11 +++ eww/eww.yuck | 51 ++++++++++++++ eww/scripts/display-calendar.sh | 9 +++ eww/scripts/get-volume.sh | 13 ++++ eww/scripts/get-window.sh | 13 ++++ eww/scripts/volume.sh | 18 +++++ eww/styles/bar.scss | 117 ++++++++++++++++++++++++++++++++ eww/styles/calendar.scss | 9 +++ eww/styles/control-center.scss | 5 ++ eww/widgets/audio.yuck | 11 +++ eww/widgets/clock.yuck | 12 ++++ eww/widgets/logo.yuck | 4 ++ eww/widgets/media.yuck | 0 eww/widgets/notifications.yuck | 5 ++ eww/widgets/window.yuck | 10 +++ eww/widgets/workspaces.yuck | 15 ++++ eww/windows/calendar.yuck | 22 ++++++ eww/windows/control-center.yuck | 24 +++++++ 18 files changed, 349 insertions(+) create mode 100644 eww/eww.scss create mode 100644 eww/eww.yuck create mode 100644 eww/scripts/display-calendar.sh create mode 100644 eww/scripts/get-volume.sh create mode 100644 eww/scripts/get-window.sh create mode 100644 eww/scripts/volume.sh create mode 100644 eww/styles/bar.scss create mode 100644 eww/styles/calendar.scss create mode 100644 eww/styles/control-center.scss create mode 100644 eww/widgets/audio.yuck create mode 100644 eww/widgets/clock.yuck create mode 100644 eww/widgets/logo.yuck create mode 100644 eww/widgets/media.yuck create mode 100644 eww/widgets/notifications.yuck create mode 100644 eww/widgets/window.yuck create mode 100644 eww/widgets/workspaces.yuck create mode 100644 eww/windows/calendar.yuck create mode 100644 eww/windows/control-center.yuck diff --git a/eww/eww.scss b/eww/eww.scss new file mode 100644 index 0000000..480d46b --- /dev/null +++ b/eww/eww.scss @@ -0,0 +1,11 @@ + +* { + all: unset; + transition: 120ms linear; + font-size: 12px; +} + +@import "../../.cache/wal/colors.scss"; +@import './styles/bar.scss'; +@import './styles/calendar.scss'; +@import './styles/control-center.scss'; diff --git a/eww/eww.yuck b/eww/eww.yuck new file mode 100644 index 0000000..59253e4 --- /dev/null +++ b/eww/eww.yuck @@ -0,0 +1,51 @@ +; Windows +(include "./windows/calendar.yuck") +(include "./windows/control-center.yuck") + +; Widgets +(include "./widgets/workspaces.yuck") +(include "./widgets/clock.yuck") +(include "./widgets/notifications.yuck") +(include "./widgets/audio.yuck") +(include "./widgets/media.yuck") +(include "./widgets/logo.yuck") +(include "./widgets/window.yuck") + +(defwindow bar + :monitor 0 + :geometry (geometry :width "100%" + :height "44px" + :anchor "top center") + :stacking "fg" + :exclusive true + :namespace "eww-bar" + (centerbox :orientation "h" + (box :class "widgets-left" + :halign "start" + :space-evenly false + (logo) + (workspaces) + ) + (box :class "widgets-center" + :halign "center" + :space-evenly false + (clock) + (window) + ) + (box :class "widgets-right" + :halign "end" + :space-evenly false + (systray :spacing 5 + :orientation "h" + :space-evenly false + :icon-size 14 + :prepend-new true + :class "systray" + ) + (audio) + (notifications) + ) + ) +) + + diff --git a/eww/scripts/display-calendar.sh b/eww/scripts/display-calendar.sh new file mode 100644 index 0000000..e7f5eec --- /dev/null +++ b/eww/scripts/display-calendar.sh @@ -0,0 +1,9 @@ +#!/usr/bin/env bash + +if [[ $(eww get calendar_state) == "show" ]]; then + eww close calendar + eww update calendar_state="hidden" +else + eww open calendar + eww update calendar_state="show" +fi diff --git a/eww/scripts/get-volume.sh b/eww/scripts/get-volume.sh new file mode 100644 index 0000000..6639b00 --- /dev/null +++ b/eww/scripts/get-volume.sh @@ -0,0 +1,13 @@ +#!/usr/bin/env bash + +WP_VOLUME=$(wpctl get-volume @DEFAULT_AUDIO_SINK@ | sed -e 's/^Volume: //') + +formatted_volume() { + if ! [ $WP_VOLUME == "1.00" ]; then + echo "${WP_VOLUME#0.}%" + else + echo "100%" + fi +} + +formatted_volume \ No newline at end of file diff --git a/eww/scripts/get-window.sh b/eww/scripts/get-window.sh new file mode 100644 index 0000000..d01e33d --- /dev/null +++ b/eww/scripts/get-window.sh @@ -0,0 +1,13 @@ +#!/usr/bin/env bash + +ACTIVE_WINDOW=$(hyprctl -j activewindow) +WINDOW_TITLE=$(echo $ACTIVE_WINDOW | jq '.title' | sed -e 's/^\"//' -e 's/\"$//') +WINDOW_CLASS=$(echo $ACTIVE_WINDOW | jq '.class' | sed -e 's/^\"//' -e 's/\"$//') + +if ! [[ $WINDOW_CLASS == "null" ]]; then + echo "$WINDOW_CLASS: $WINDOW_TITLE" + eww update widget_window_visible=true +else + echo "" + eww update widget_window_visible=false +fi diff --git a/eww/scripts/volume.sh b/eww/scripts/volume.sh new file mode 100644 index 0000000..ec82a19 --- /dev/null +++ b/eww/scripts/volume.sh @@ -0,0 +1,18 @@ +#!/usr/bin/env bash + +# Note: $SCROLL is defined by eww + +$DEFAULT_INCREASE='5' + +Guess_increase_decrease() { + local $CURRENT_VOL=$(wpctl get-volume "@DEFAULT_AUDIO_SINK@") +} + +Update_volume() { + local $UPDATED_VOL=$(Guess_increase_decrease) + wpctl set-volume "@DEFAULT_AUDIO_SINK@" "$UPDATED_VOL" +} + +Translate_volume_to_int() { + echo $(wpctl get-volume "@DEFAULT_AUDIO_SINK@" | sed -e "s/^Volume: //" -e "s/^1.//1") +} diff --git a/eww/styles/bar.scss b/eww/styles/bar.scss new file mode 100644 index 0000000..bbbf6e5 --- /dev/null +++ b/eww/styles/bar.scss @@ -0,0 +1,117 @@ + +.bar { + background: transparent; + padding: 4px; +} + +/* Styles .widgets-[left/center/right] */ +.widgets-left, +.widgets-center, +.widgets-right { + background: rgba($background, 0.6); + border-radius: 18px; + padding: 6px; + + & > * { + margin: 0 3px; + } + + & > *:first-child { + margin-left: 0; + } + + & > *:last-child { + margin-right: 0; + } +} + +button { + padding: 6px 10px; + border-radius: 12px; +} + +button:hover { + background: darken($color: $color1, $amount: 5); +} + +button:active { + background: darken($color: $color1, $amount: 20) +} + +button label { + color: $foreground; +} + +menu { + background: $background; + border-radius: 14px; + padding: 2px; + + & > menuitem { + padding: 8px 24px; + border-radius: 5px; + + &:hover { + background: $color1; + } + + &:first-child { + border-top-left-radius: inherit; + border-top-right-radius: inherit; + } + + &:last-child { + border-bottom-left-radius: inherit; + border-bottom-right-radius: inherit; + } + + label { + font-weight: 600; + color: $foreground; + } + } + + & > separator { + background: lighten($color: $background, $amount: 5); + margin: .5px 10px; + padding: 1px 0; + border-radius: 1px; + } +} + +.workspaces { + padding: 2px 6px; + border-radius: 16px; + + & > button { + padding: 0 9px; + border-radius: 50%; + margin: 0 2px; + background: darken($color1, 20); + } + +} +.workspaces button:hover { + color: $color1; +} + +.distro-logo { + padding: 0 16px; + + & label { + font-size: 15px; + } +} + +.systray { + margin: 0 6px; + + & > * > * { + margin: 0 4px + } +} + +.notifications button { + padding-left: 11px; + padding-right: 11px; +} diff --git a/eww/styles/calendar.scss b/eww/styles/calendar.scss new file mode 100644 index 0000000..cc00306 --- /dev/null +++ b/eww/styles/calendar.scss @@ -0,0 +1,9 @@ +.widget-calendar { + padding: 24px; + background: rgba($background, 0.6); + border-radius: 16px; + + & > .title { + background: $color1; + } +} diff --git a/eww/styles/control-center.scss b/eww/styles/control-center.scss new file mode 100644 index 0000000..91dd46b --- /dev/null +++ b/eww/styles/control-center.scss @@ -0,0 +1,5 @@ + +.control-center { + background: green; + border-radius: 16px; +} diff --git a/eww/widgets/audio.yuck b/eww/widgets/audio.yuck new file mode 100644 index 0000000..2fca143 --- /dev/null +++ b/eww/widgets/audio.yuck @@ -0,0 +1,11 @@ + +(defpoll output_volume :interval "500ms" +`echo "$(wpctl get-volume @DEFAULT_AUDIO_SINK@ | sed -e 's/Volume: //' -e 's/^1\./1/' -e 's/^0.//' -e 's/^00/0/')%"`) + +(defwidget audio [] + (eventbox + :onscroll `sh -c "SCROLL='{}'; source './scripts/volume.sh'; Update_volume"` + + (button :class "audio" "󰕾 ${output_volume}") + ) +) diff --git a/eww/widgets/clock.yuck b/eww/widgets/clock.yuck new file mode 100644 index 0000000..84f4dae --- /dev/null +++ b/eww/widgets/clock.yuck @@ -0,0 +1,12 @@ + +(defpoll datetime :interval "10s" +"date +'%A %d, %H:%M'") + +(defvar calendar_state "hidden") + +(defwidget clock [] + (box :class "clock" + (button :onclick "sh ./scripts/display-calendar.sh" + "${datetime}") + ) +) diff --git a/eww/widgets/logo.yuck b/eww/widgets/logo.yuck new file mode 100644 index 0000000..3b14c0f --- /dev/null +++ b/eww/widgets/logo.yuck @@ -0,0 +1,4 @@ +(defwidget logo [] + (button :class "distro-logo" + "") +) diff --git a/eww/widgets/media.yuck b/eww/widgets/media.yuck new file mode 100644 index 0000000..e69de29 diff --git a/eww/widgets/notifications.yuck b/eww/widgets/notifications.yuck new file mode 100644 index 0000000..6ea17df --- /dev/null +++ b/eww/widgets/notifications.yuck @@ -0,0 +1,5 @@ +(defwidget notifications [] + (box :class "notifications" + (button :onclick "swaync-client -t" "") + ) +) diff --git a/eww/widgets/window.yuck b/eww/widgets/window.yuck new file mode 100644 index 0000000..7b97ae2 --- /dev/null +++ b/eww/widgets/window.yuck @@ -0,0 +1,10 @@ + +(defpoll windowInfo :interval "250ms" +"sh ./scripts/get-window.sh") + +(defvar widget_window_visible true) + +(defwidget window [] + (button :visible "${widget_window_visible}" + "${windowInfo}") +) diff --git a/eww/widgets/workspaces.yuck b/eww/widgets/workspaces.yuck new file mode 100644 index 0000000..68ccf44 --- /dev/null +++ b/eww/widgets/workspaces.yuck @@ -0,0 +1,15 @@ + +(deflisten json_workspaces + :initial "[{1: {}, 2:{}}]" +`hyprctl -j workspaces`) + +(defwidget workspaces [] + (eventbox :onscroll "[[ {} =~ up ]] && hyprctl dispatch workspace e+1 || hyprctl dispatch workspace e-1" + (box :class "workspaces" + (for i in json_workspaces + (button :onclick "hyprctl dispatch workspace ${i}" + "${i[0].num}") + ) + ) + ) + ) diff --git a/eww/windows/calendar.yuck b/eww/windows/calendar.yuck new file mode 100644 index 0000000..1f0ad2b --- /dev/null +++ b/eww/windows/calendar.yuck @@ -0,0 +1,22 @@ +(defwindow calendar + :monitor 0 + :geometry (geometry :width 300 + :height 250 + :anchor "top center" + ) + :stacking "fg" + :exclusive false + :namespace "eww-calendar" + (box + (cal) + ) +) + +(defwidget cal [] + (box :class "widget-calendar" + (box :class "month-calendar" + (button :class "day" + 1) + ) + ) +) diff --git a/eww/windows/control-center.yuck b/eww/windows/control-center.yuck new file mode 100644 index 0000000..af75a60 --- /dev/null +++ b/eww/windows/control-center.yuck @@ -0,0 +1,24 @@ +(defwindow control-center [] + :monitor 0 + :geometry (geometry :width "500px" + :height "90%" + :anchor "center right") + :stacking "overlay" + :exclusive false + :namespace "eww-cc" + + (box + (toggles) + ) +) + +(defwidget toggles [] + (box :class "row" + (button :onclick "notify-send 'stop internet!'" + (box + (label :class "title" :text "Internet >") + (label :class "extra" :text "Caique Wifi") + ) + ) + ) +)