nixos-configs/config/eww/playerinfo/playerinfo.yuck

(defpoll player :interval "1s" "echo spotify")
(defpoll music_cover :interval "1s" "$EWW_PATH/music.sh cover") ;done
(defvar music_accent "rgb(0,0,0)") ;done
(defvar button_accent "rgb(0,0,0)") ;done
(defvar button_text "rgb(255,255,255)") ;done
(defpoll music_status :interval "1s" "playerctl -p spotify status")
(defpoll title :interval "1s" "playerctl -p spotify metadata title")
(defpoll artist :interval "1s" "playerctl -p spotify metadata artist")
(defvar button_height "42")
(defpoll shuffle_status :interval "1s" "playerctl -p spotify shuffle")
(defpoll repeat_icon :interval "1s" "$EWW_PATH/music.sh loop_status")
(defvar song_pos "0")
(defpoll song_length :interval "1s" "$EWW_PATH/music.sh length")

(defwidget playerinfo []
  (centerbox  :class "playerinfo"
        :style "background: radial-gradient(circle, rgba(0, 0, 0, 0.4) 30%, ${music_accent}), url(\"${music_cover}\"); 
                background-size: cover;
                background-position: center;"
        :orientation "v"
    (box  :class "top"
          :halign "start"
          :valign "start"
          :style "color: ${button_accent};"
        "${player == 'spotify' ? '' : '爵' }"
    )
    (box  :class "center"
          :orientation "h"
          :space-evenly false
      (box  :class "metadata"
            :orientation "v"
            :halign "start"
            :valign "center"
            :hexpand true
        (label :limit-width 25 :halign "start" :text title :class "title")
        (label :limit-width 25 :halign "start" :text artist :class "artist")
      )
      (centerbox :orientation "v"
        (label)
        (eventbox :class "pausebutton ${music_status == 'Playing' ? 'playing' : 'paused'}"
                  :halign "left"
                  :style "background-color: ${button_accent}; 
                          color: ${button_text};"
                  :onclick "playerctl -p spotify play-pause"
                  :cursor "pointer"
                  :onhover "eww update button_height=41"
                  :onhoverlost "eww update button_height=42"
          
          (label  :text "${music_status == 'Playing' ? ' ' : ''}" 
                  :width button_height
                  :height button_height
          )
        )
        (label)
      )
    )
    (box  :class "bottom"
          :style "color: ${button_accent};"
          :space-evenly false
          :spacing 0
      (eventbox :valign "end"
                :halign "start"
                :onclick "playerctl -p spotify previous & $EWW_PATH/music.sh cover"
                :class "previousbutton"
                :width 40
                :cursor "pointer"
              "󰒮"
      )
      (eventbox :cursor "pointer"
                :class "song-pos"
                :hexpand true
        (scale :value song_pos
               :min 0
               :max song_length
               :orientation "h"
               :onchange "playerctl -p spotify position {}"
               :css "highlight { background-color: ${button_accent}; }
                     slider { background-color: ${button_accent}; }
                     trough { background-color: rgba(${button_accent}, 0.4); }"
        )
      )
      (box :valign "end"
           :halign "end"
                
        (eventbox :onclick "playerctl -p spotify next & $EWW_PATH/music.sh cover"
                  :class "nextbutton"
                  :width 40
                  :cursor "pointer"
                "󰒭"
        )
        (eventbox :onclick "playerctl -p spotify shuffle toggle"
                  :class "shuffle"
                  :width 40
                  :cursor "pointer"
                "${shuffle_status == 'On' ? '󰒝' : '󰒞'}"
        )
        (eventbox :onclick "$EWW_PATH/music.sh loop"
                  :class "repeat"
                  :width 40
                  :cursor "pointer"
                "${repeat_icon}"
        )
      )
    )
  )
)
(defwindow playerinfo
  :monitor 0
  :stacking "overlay"
  :exclusive "ignore"
  :focusable "false"
  :geometry (geometry :x "800px"
                      :y "10px"
                      :width "0px"
                      :height "0px"
                      :anchor "top left"
            )
  (playerinfo)
)