(deflisten radio
  :initial '{"is_paused":1,"song":{"artist":"","song":"","image600":""},"radio":0,"stations":[],"media":{"player":"","status":"Stopped","artist":"","title":"","art":""}}'
  "scripts/radio")
(defvar radio-vol 80)
(defvar radio-muted false)

(defwidget radio-win []
  (box :class "sys-win" :orientation "v" :space-evenly false

    ; --- Now Playing ---
    (box :orientation "v" :space-evenly false :class "sys-section"
      (section-header :title "Media" :accent "radio-accent")
      (box :orientation "h" :space-evenly false :valign "center" :spacing 10 :class "radio-now-playing"
        (box :class "radio-art"
          :style "background-image: url('${radio.is_paused == 0 ? radio.song.image600 : (radio.media.status != 'Stopped' ? radio.media.art : radio.song.image600)}'); background-size: cover; background-position: center;"
          (label :class "radio-art-icon" :halign "center" :valign "center"
            :visible {radio.is_paused == 0
              ? radio.song.image600 == ""
              : (radio.media.status != "Stopped"
                  ? radio.media.art == ""
                  : radio.song.image600 == "")}
            :text "󰝚"))
        (box :orientation "v" :space-evenly false :hexpand true :valign "center"
          (label :class "radio-song" :halign "start" :wrap true :limit-width 20
            :text {radio.is_paused == 0
              ? (radio.song.song != "" ? radio.song.song : "Tuning in...")
              : (radio.media.status != "Stopped"
                ? (radio.media.title != "" ? radio.media.title : "Playing")
                : (radio.song.song != "" ? radio.song.song : "Nothing playing"))})
          (label :class "radio-artist" :halign "start" :wrap true :limit-width 22
            :text {radio.is_paused == 0
              ? radio.song.artist
              : (radio.media.status != "Stopped"
                ? (radio.media.artist != "" ? radio.media.artist : radio.media.player)
                : "")})))

      ; Controls - hidden only in placeholder state
      (box :visible {radio.is_paused == 0 || radio.radio > 0 || radio.media.status != "Stopped"}
        :orientation "v" :space-evenly false :class "radio-controls"
        (box :orientation "h" :space-evenly true :halign "center"
          (button :visible {radio.is_paused == 1 && radio.media.status != "Stopped"}
            :class "radio-ctrl-btn" :timeout "2s" :onclick "scripts/media previous"
            (label :text "󰒮"))
          (button :class "radio-ctrl-btn" :timeout "2s"
            :onclick {radio.is_paused == 1 && radio.media.status != "Stopped" ? "scripts/media play-pause" : "scripts/radio toggle"}
            (label :text {radio.is_paused == 0 ? "󰏥" : (radio.media.status == "Playing" ? "󰏥" : "󰐌")}))
          (button :visible {radio.is_paused == 1 && radio.media.status != "Stopped"}
            :class "radio-ctrl-btn" :timeout "2s" :onclick "scripts/media next"
            (label :text "󰒭")))
        (vol-row
          :icon "󰕾"
          :value {radio-vol}
          :onchange "scripts/radio vol {}"
          :onclick "scripts/radio mute"
          :muted {radio-muted})))

    (box :class "section-sep")

    ; --- Stations ---
    (box :orientation "v" :space-evenly false :class "sys-section"
      (section-header :title "Radio Stations" :accent "radio-accent")
      (scroll :vscroll true :hscroll false :height 130
        (box :class "station-list" :space-evenly false :orientation "v"
          (for station in {radio.stations}
            (button
              :class "station-row ${radio.radio == station.id ? 'station-row-active' : ''}"
              :timeout "2s"
              :onclick "scripts/radio start ${station.id}"
              :tooltip {station.title}
              (box :orientation "h" :space-evenly false :valign "center"
                (box :class "station-icon"
                  :style "background-image: url('${station.icon_fill_white}'); background-size: contain; background-position: center;")
                (label :class "station-name" :text {station.title}
                  :hexpand true :halign "start" :limit-width 16)))))))))

(defwidget radio-mod []
  (module
    (eventbox
      :onclick "(sleep 0.1 && scripts/panel-toggle radio)"
      (box :orientation "v"
        (label :show-truncated false :class "icon-text" :text "󰝚")))))