eww: refactor and improved experience with media widgets
This commit is contained in:
@@ -9,3 +9,6 @@
|
|||||||
(include "windows/volume-control.yuck")
|
(include "windows/volume-control.yuck")
|
||||||
(include "windows/volume-popup.yuck")
|
(include "windows/volume-popup.yuck")
|
||||||
(include "windows/floating-media.yuck")
|
(include "windows/floating-media.yuck")
|
||||||
|
|
||||||
|
; Widgets
|
||||||
|
(include "widgets/big-media.yuck")
|
||||||
|
|||||||
@@ -103,7 +103,7 @@ class PlayerManager:
|
|||||||
else:
|
else:
|
||||||
self.clear_output()
|
self.clear_output()
|
||||||
|
|
||||||
de on_metadata_changed(self, player, metadata, _=None):
|
def on_metadata_changed(self, player, metadata, _=None):
|
||||||
logger.debug(f"Metadata changed for player {player.props.player_name}")
|
logger.debug(f"Metadata changed for player {player.props.player_name}")
|
||||||
player_name = player.props.player_name
|
player_name = player.props.player_name
|
||||||
artist = player.get_artist()
|
artist = player.get_artist()
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
#!/usr/bin/env bash
|
#!/usr/bin/env bash
|
||||||
|
|
||||||
# initial notification history
|
# initial notification history
|
||||||
json_initial_history=$(makoctl history | jq -c '.data[]' | sed 's/\\[n]/\\n/g')
|
json_initial_history=$(makoctl history | jq -c '.data[]' | sed -e 's/\\[n]/\\n/g' -e 's/&/&/g')
|
||||||
echo $json_initial_history
|
echo $json_initial_history
|
||||||
|
|
||||||
while true; do
|
while true; do
|
||||||
@@ -9,7 +9,7 @@ while true; do
|
|||||||
sleep .2
|
sleep .2
|
||||||
|
|
||||||
# frequently updated history variable
|
# frequently updated history variable
|
||||||
json_history=$(makoctl history | jq -c '.data[]' | sed 's/\\[n]/\\n/g')
|
json_history=$(makoctl history | jq -c '.data[]' | sed -e 's/\\[n]/\\n/g' -e 's/&/&/g')
|
||||||
|
|
||||||
if ! [[ "$json_initial_history" == "$json_history" ]]; then
|
if ! [[ "$json_initial_history" == "$json_history" ]]; then
|
||||||
json_initial_history="$json_history"
|
json_initial_history="$json_history"
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ box.button-row {
|
|||||||
$bg-color: darken($color: $foreground, $amount: 25);
|
$bg-color: darken($color: $foreground, $amount: 25);
|
||||||
|
|
||||||
& > button {
|
& > button {
|
||||||
background: rgba($bg-color, .7);
|
background: rgba($bg-color, .8);
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
margin: 0 1px;
|
margin: 0 1px;
|
||||||
|
|
||||||
@@ -31,7 +31,7 @@ box.button-row {
|
|||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: rgba($bg-color, 1);
|
background: $bg-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -41,7 +41,7 @@ box.vertical.button-row {
|
|||||||
$bg-color: darken($color: $foreground, $amount: 25);
|
$bg-color: darken($color: $foreground, $amount: 25);
|
||||||
|
|
||||||
& > button {
|
& > button {
|
||||||
background: rgba($bg-color, .7);
|
background: rgba($bg-color, .8);
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
margin: 1px 0;
|
margin: 1px 0;
|
||||||
|
|
||||||
@@ -56,7 +56,7 @@ box.vertical.button-row {
|
|||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: rgba($bg-color, 1);
|
background: $bg-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -201,4 +201,5 @@ tooltip {
|
|||||||
box-shadow: inset 0 0 0 100px rgba($background, .55);
|
box-shadow: inset 0 0 0 100px rgba($background, .55);
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,10 +4,10 @@
|
|||||||
(defwidget media []
|
(defwidget media []
|
||||||
(eventbox :onhover "${EWW_CMD} update media_reveal_controls=true"
|
(eventbox :onhover "${EWW_CMD} update media_reveal_controls=true"
|
||||||
:onhoverlost "${EWW_CMD} update media_reveal_controls=false"
|
:onhoverlost "${EWW_CMD} update media_reveal_controls=false"
|
||||||
:visible { json_media.title == "null" && json_media.artist == "null" ?
|
:visible { json_media == "" ||
|
||||||
false
|
(active_window.class =~ json_media.player &&
|
||||||
:
|
active_window.title =~ json_media.title) ?
|
||||||
"${ active_window.class =~ json_media.player || active_window.title =~ json_media.title ? false : true }"
|
false : true
|
||||||
}
|
}
|
||||||
:onclick "sh scripts/eww-window.sh toggle floating-media"
|
:onclick "sh scripts/eww-window.sh toggle floating-media"
|
||||||
:class "mediaplayer-eventbox"
|
:class "mediaplayer-eventbox"
|
||||||
|
|||||||
@@ -1,7 +1,8 @@
|
|||||||
(defwidget big-media [ album-background ?player-info ]
|
(defwidget big-media [ show-album-bg show-album-image ?album-image-size ?style-background-color ?visible ]
|
||||||
(box :class "big-media ${ album-background == true ? 'album-bg' : '' }"
|
(box :class "big-media ${ show-album-bg ? 'album-bg' : '' } ${ show-album-image ? 'album-image' : '' }"
|
||||||
:style { album-background == true ? "background-image: image(url('${json_media.artUrl}'))" : "" }
|
:style "${ show-album-bg ? 'background-image: image(url(\"${json_media.artUrl}\"))' : '' } ${
|
||||||
:visible { json_media.title != "null" && json_media.artist != "null" ? true : false }
|
style-background-color != '' ? 'background-color: ${style-background-color}' : '' }"
|
||||||
|
:visible { visible ? true : false}
|
||||||
:space-evenly false
|
:space-evenly false
|
||||||
:orientation "vertical"
|
:orientation "vertical"
|
||||||
|
|
||||||
@@ -10,15 +11,17 @@
|
|||||||
:class "media"
|
:class "media"
|
||||||
|
|
||||||
(box :class "album-image"
|
(box :class "album-image"
|
||||||
:width 98
|
:width { album-image-size != "" ? album-image-size : 98 }
|
||||||
:height 87
|
:height { album-image-size != "" ? "${album-image-size - 11}" : 87 }
|
||||||
:style "background-image: image(url('${json_media.artUrl}'));"
|
:style "background-image: image(url('${json_media.artUrl}'));"
|
||||||
:valign "center")
|
:valign "center"
|
||||||
|
:visible { show-album-image ? true : false })
|
||||||
|
|
||||||
(box :orientation "vertical"
|
(box :orientation "vertical"
|
||||||
:space-evenly false
|
:space-evenly false
|
||||||
:class "right"
|
:class "right"
|
||||||
:hexpand true
|
:hexpand true
|
||||||
|
:valign "center"
|
||||||
|
|
||||||
(box :class "media-info"
|
(box :class "media-info"
|
||||||
:space-evenly false
|
:space-evenly false
|
||||||
@@ -45,8 +45,8 @@
|
|||||||
(label :class "summary"
|
(label :class "summary"
|
||||||
:text "${summary}"
|
:text "${summary}"
|
||||||
:xalign 0
|
:xalign 0
|
||||||
:show-truncated true
|
:halign "start"
|
||||||
:halign "start")
|
:show-truncated true)
|
||||||
|
|
||||||
(label :class "body"
|
(label :class "body"
|
||||||
:markup "${body}"
|
:markup "${body}"
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
(include "widgets/control-center/top-bar.yuck")
|
(include "widgets/control-center/top-bar.yuck")
|
||||||
(include "widgets/control-center/notifications.yuck")
|
(include "widgets/control-center/notifications.yuck")
|
||||||
(include "widgets/control-center/big-media.yuck")
|
|
||||||
(include "widgets/control-center/notification.yuck")
|
(include "widgets/control-center/notification.yuck")
|
||||||
(include "widgets/control-center/toggles.yuck")
|
(include "widgets/control-center/toggles.yuck")
|
||||||
|
|
||||||
@@ -17,7 +16,9 @@
|
|||||||
:space-evenly false
|
:space-evenly false
|
||||||
(top-bar)
|
(top-bar)
|
||||||
(toggles)
|
(toggles)
|
||||||
(big-media :album-background true)
|
(big-media :show-album-bg true
|
||||||
|
:show-album-image true
|
||||||
|
:visible { json_media != "" ? true : false })
|
||||||
(notifications)
|
(notifications)
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -1,15 +1,16 @@
|
|||||||
(defwindow floating-media []
|
(defwindow floating-media []
|
||||||
:monitor 0
|
:monitor 0
|
||||||
:geometry (geometry :anchor "top center"
|
:geometry (geometry :anchor "top center"
|
||||||
:width "350px")
|
:width "420px")
|
||||||
:exclusive false
|
:exclusive false
|
||||||
:stacking "overlay"
|
:stacking "fg"
|
||||||
:focusable false
|
:focusable false
|
||||||
|
:namespace "eww-media"
|
||||||
(box :class "floating-media"
|
(box :class "floating-media"
|
||||||
:orientation "vertical"
|
:orientation "vertical"
|
||||||
:space-evenly false
|
:space-evenly false
|
||||||
:style "box-shadow: 0 5px 6px 1px rgb(0, 0, 0);"
|
(big-media :show-album-bg true
|
||||||
(big-media :album-background true
|
:album-image-size 124
|
||||||
:player-info true)
|
:show-album-image true)
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user