eww: better lyrics

eww/.gitignore

@@ -0,0 +1 @@
+*.log

eww/Lyrics/eww.scss

@@ -14,17 +14,32 @@
     min-width: 500px;
 }
 
+.lyrics-box-single {
+    margin: 10px;
+    min-width: 300px;
+}
+
 .lyrics-text {
     color: $fg;
-    font-size: 16px;
+    font-size: 15px;
     font-family: 'Maple Mono Normal NF CN', 'Maple Mono CN', monospace;
 }
 
+.lyrics-text-single {
+    color: $fg;
+    font-size: 14px;
+    font-family: 'Noto Sans', sans-serif;
+}
+
 .control-box {
-    margin: 10px;
+    padding: 6px;
     min-height: 90px;
 }
 
+.control-box-single {
+    min-height: 40px;
+}
+
 .offset-minus,
 .offset-reset,
 .offset-plus,
@@ -32,15 +47,26 @@
     padding: 0px 6px;
     margin: 0px 4px 0px 4px;
     font-family: 'MesloLGM Nerd Font Mono';
+    font-size: 25px;
+    min-width: 16px;
+}
+
+.offset-minus-single,
+.offset-plus-single {
+    padding: 0px 6px;
+    margin: 0;
+    font-family: 'MesloLGM Nerd Font Mono';
     font-size: 20px;
     min-width: 16px;
 }
 
-.offset-minus {
+.offset-minus,
+.offset-minus-single {
     color: $blue;
 }
 
-.offset-plus {
+.offset-plus,
+.offset-plus-single {
     color: $yellow;
 }
 

eww/Lyrics/eww.yuck

@@ -1,4 +1,5 @@
-(defpoll lyriclines :interval "500ms" "Lyrics/scripts/lyric-lines.sh")
+(defpoll lyriclines :interval "500ms" "~/.local/bin/spotify-lyrics print -l 3 -f \"$HOME/.local/state/eww/lyrics/offset\" 2> temp.log")
+(deflisten lyricline "~/.local/bin/spotify-lyrics listen -l 1 -f \"$HOME/.local/state/eww/lyrics/offset\" 2> temp.log")
 
 (defwidget lyrics []
   (box :class "lyrics-window" :space-evenly "false" :orientation "h"
@@ -22,10 +23,36 @@
   )
 )
 
+(defwidget lyrics-single []
+  (box :class "lyrics-window" :space-evenly "false" :orientation "h"
+    (box :class "lyrics-box-single" :vexpand "false" :hexpand "false" :valign "center" :space-evenly "false" :orientation "v"
+      (label :class "lyrics-text-single"
+             :vexpand "false" :hexpand "false" :space-evenly "false"
+             :halign "start"
+             :text lyricline
+      )
+    )
+    (box :class "control-box-single" :vexpand "false" :hexpand "false" :space-evenly "true" :orientation "v"
+      (box :class "control-row-1-single" :space-evenly "false" :orientation "h"
+        (button :class "offset-minus-single" :onclick "Lyrics/scripts/lyric-offset.py -500" "󰓅")
+        (button :class "offset-plus-single" :onclick "Lyrics/scripts/lyric-offset.py +500" "󰾆")
+      )
+    )
+  )
+)
+
 (defwindow lyrics
     :windowtype "normal"
-    :wm-ignore false
+    :wm-ignore true
     :monitor 0
     :geometry (geometry :anchor "top center")
     (lyrics)
+)
+
+(defwindow lyrics-single
+    :windowtype "normal"
+    :wm-ignore true
+    :monitor 0
+    :geometry (geometry :anchor "top right")
+    (lyrics-single)
 )

eww/Lyrics/scripts/lyric-clear.sh

@@ -2,5 +2,5 @@
 
 killall spotify-lyrics
 sleep 0.1
-spotify-lyrics clear
+"$HOME/.local/bin/spotify-lyrics" clear
 notify-send -a "spotify-lyrics" "Lyrics Cleared" "The lyrics have been cleared."

eww/Lyrics/scripts/lyric-lines.sh

@@ -1,13 +0,0 @@
-#!/bin/sh
-
-STATE_DIR="$HOME/.local/state/eww/lyrics"
-if [ ! -d $STATE_DIR ]; then
-    mkdir -p $STATE_DIR
-fi
-
-OFFSET_FILE="$STATE_DIR/offset"
-if [ ! -f "$OFFSET_FILE" ]; then
-    echo "0" > "$OFFSET_FILE"
-fi
-
-spotify-lyrics print -l 3 -O $(cat "$OFFSET_FILE")

eww/Lyrics/scripts/lyric-offset.py

@@ -7,7 +7,7 @@ STATE_FILE_NAME = "offset"
 
 def notify_send(title, message):
     import subprocess
-    subprocess.run(["notify-send", "-a", APP_NAME, title, message], check=True)
+    subprocess.run(["notify-send", "-t", "1000", "-a", APP_NAME, title, message], check=True)
 
 
 def main():

eww/Main/eww.scss

@@ -17,6 +17,7 @@
     padding: 20px 10px 20px 10px;
     border-radius: 15px;
     color: $fg;
+    box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
 }
 
 .time {
@@ -36,6 +37,7 @@
     margin: 20px 20px 0px 0px;
     padding: 20px 10px 10px 20px;
     border-radius: 15px;
+    box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
 }
 
 .weather-desc {
@@ -67,6 +69,7 @@
     margin: 20px 20px 0px 20px;
     padding: 20px 35px 20px 25px;
     border-radius: 15px;
+    box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
 }
 
 .stats-header {
@@ -119,6 +122,7 @@
     margin: 20px 20px 0px 0px;
     padding: 20px 35px 20px 25px;
     border-radius: 15px;
+    box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
 }
 
 .fortune-header {
@@ -142,6 +146,7 @@
     border-radius: 17px;
     background-position: center;
     margin: 20px 0px 0px 20px;
+    box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
 }
 
 .music-title {
@@ -217,6 +222,7 @@
     padding: 0px 23px 0px 23px;
     border-radius: 15px;
     text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);
+    box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
 }
 
 .music-next,
@@ -240,6 +246,7 @@
     background-color: $gray-alt;
     border-radius: 15px;
     padding: 15px 20px 15px 20px;
+    box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
 }
 
 .profile-img {
@@ -248,7 +255,7 @@
     background-size: cover;
     background-position: center;
     min-width: 90px;
-    box-shadow: 0px 0px 30px rgba(0, 0, 0, 1);
+    box-shadow: 0px 0px 10px rgba(0, 0, 0, 1);
 }
 
 .profile-stuff {

eww/eww.scss

@@ -11,7 +11,7 @@ $blue: #89b4fa;
 $purple: #cba6f7;
 $cyan: #89dceb;
 $gray: #585b70;
-$gray-alt: #313244;
+$gray-alt: #292a3c;
 $lavender: #b4befe;
 $sapphire: #74c7ec;
 $teal: #94e2d5;