Compare commits
No commits in common. "3835c993b9b4366c1cee373034f474a2a41130dc" and "65946cb7949c0ad2f3a1a92f7d69a976ab3dc1d0" have entirely different histories.
3835c993b9
...
65946cb794
3 changed files with 55 additions and 85 deletions
|
@ -36,19 +36,15 @@ export default ({
|
||||||
const playerBox = overlay.list().at(-1);
|
const playerBox = overlay.list().at(-1);
|
||||||
|
|
||||||
if (offset >= 0) {
|
if (offset >= 0) {
|
||||||
playerBox.setStyle(`
|
playerBox.setStyle(`margin-left: ${offset}px;
|
||||||
margin-left: ${offset}px;
|
margin-right: -${offset}px;
|
||||||
margin-right: -${offset}px;
|
${playerBox._bgStyle}`);
|
||||||
${playerBox._bgStyle}
|
|
||||||
`);
|
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
const newOffset = Math.abs(offset);
|
const newOffset = Math.abs(offset);
|
||||||
playerBox.setStyle(`
|
playerBox.setStyle(`margin-left: -${newOffset}px;
|
||||||
margin-left: -${newOffset}px;
|
margin-right: ${newOffset}px;
|
||||||
margin-right: ${newOffset}px;
|
${playerBox._bgStyle}`);
|
||||||
${playerBox._bgStyle}
|
|
||||||
`);
|
|
||||||
}
|
}
|
||||||
overlay._selected = playerBox;
|
overlay._selected = playerBox;
|
||||||
}, 'drag-update'],
|
}, 'drag-update'],
|
||||||
|
@ -63,27 +59,24 @@ export default ({
|
||||||
const playerBox = overlay.list().at(-1);
|
const playerBox = overlay.list().at(-1);
|
||||||
|
|
||||||
if (Math.abs(offset) > MAX_OFFSET) {
|
if (Math.abs(offset) > MAX_OFFSET) {
|
||||||
widget.sensitive = false;
|
|
||||||
if (offset >= 0) {
|
if (offset >= 0) {
|
||||||
playerBox.setStyle(`
|
playerBox.setStyle(`${TRANSITION}
|
||||||
${TRANSITION}
|
margin-left: ${OFFSCREEN}px;
|
||||||
margin-left: ${OFFSCREEN}px;
|
margin-right: -${OFFSCREEN}px;
|
||||||
margin-right: -${OFFSCREEN}px;
|
opacity: 0;
|
||||||
opacity: 0; ${playerBox._bgStyle}
|
${playerBox._bgStyle}`);
|
||||||
`);
|
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
playerBox.setStyle(`
|
playerBox.setStyle(`${TRANSITION}
|
||||||
${TRANSITION}
|
margin-left: -${OFFSCREEN}px;
|
||||||
margin-left: -${OFFSCREEN}px;
|
margin-right: ${OFFSCREEN}px;
|
||||||
margin-right: ${OFFSCREEN}px;
|
opacity: 0;
|
||||||
opacity: 0; ${playerBox._bgStyle}`);
|
${playerBox._bgStyle}`);
|
||||||
}
|
}
|
||||||
timeout(500, () => {
|
timeout(500, () => {
|
||||||
overlay.reorder_overlay(playerBox, 0);
|
overlay.reorder_overlay(playerBox, 0);
|
||||||
playerBox.setStyle(playerBox._bgStyle);
|
playerBox.setStyle(playerBox._bgStyle);
|
||||||
overlay._selected = overlay.list().at(-1);
|
overlay._selected = overlay.list().at(-1);
|
||||||
widget.sensitive = true;
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
|
|
|
@ -1,9 +1,8 @@
|
||||||
import Mpris from 'resource:///com/github/Aylur/ags/service/mpris.js';
|
import Mpris from 'resource:///com/github/Aylur/ags/service/mpris.js';
|
||||||
import { Button, Icon, Label, Stack, Slider, CenterBox, Box } from 'resource:///com/github/Aylur/ags/widget.js';
|
import { Button, Icon, Label, Stack, Slider, CenterBox, Box } from 'resource:///com/github/Aylur/ags/widget.js';
|
||||||
import { execAsync, lookUpIcon, interval, readFileAsync } from 'resource:///com/github/Aylur/ags/utils.js';
|
import { execAsync, lookUpIcon, readFileAsync } from 'resource:///com/github/Aylur/ags/utils.js';
|
||||||
|
|
||||||
import Gdk from 'gi://Gdk';
|
import Gdk from 'gi://Gdk';
|
||||||
import GLib from 'gi://GLib';
|
|
||||||
const display = Gdk.Display.get_default();
|
const display = Gdk.Display.get_default();
|
||||||
|
|
||||||
import Separator from '../misc/separator.js';
|
import Separator from '../misc/separator.js';
|
||||||
|
@ -34,30 +33,13 @@ export const CoverArt = (player, props) => CenterBox({
|
||||||
...props,
|
...props,
|
||||||
vertical: true,
|
vertical: true,
|
||||||
properties: [['bgStyle', '']],
|
properties: [['bgStyle', '']],
|
||||||
setup: self => {
|
|
||||||
// Give temp cover art
|
|
||||||
readFileAsync(player.coverPath).catch(() => {
|
|
||||||
if (!player.colors.value && !player.trackCoverUrl) {
|
|
||||||
player.colors.value = {
|
|
||||||
'imageAccent': '#9d4141',
|
|
||||||
'buttonAccent': '#ffdad6',
|
|
||||||
'buttonText': '#400005',
|
|
||||||
'hoverAccent': '#ffb3b0',
|
|
||||||
};
|
|
||||||
|
|
||||||
self._bgStyle = `
|
|
||||||
background: radial-gradient(circle,
|
|
||||||
rgba(0, 0, 0, 0.4) 30%,
|
|
||||||
${player.colors.value.imageAccent}),
|
|
||||||
rgb(0, 0, 0);
|
|
||||||
background-size: cover;
|
|
||||||
background-position: center;
|
|
||||||
`;
|
|
||||||
self.setStyle(self._bgStyle);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
connections: [[player, self => {
|
connections: [[player, self => {
|
||||||
|
// Don't show players that don't have covers
|
||||||
|
readFileAsync(player.coverPath).catch(() => {
|
||||||
|
if (!player.colors.value && !player.trackCoverUrl)
|
||||||
|
player.colors.value = 'delete';
|
||||||
|
});
|
||||||
|
|
||||||
execAsync(['bash', '-c', `[[ -f "${player.coverPath}" ]] &&
|
execAsync(['bash', '-c', `[[ -f "${player.coverPath}" ]] &&
|
||||||
coloryou "${player.coverPath}" | grep -v Warning`])
|
coloryou "${player.coverPath}" | grep -v Warning`])
|
||||||
.then(out => {
|
.then(out => {
|
||||||
|
@ -117,15 +99,17 @@ export const PlayerIcon = (player, { symbolic = true, ...props } = {}) => {
|
||||||
|
|
||||||
const widget = Box({});
|
const widget = Box({});
|
||||||
var overlay;
|
var overlay;
|
||||||
const source = interval(100, () => {
|
const interval = setInterval(() => {
|
||||||
if (player.colors.value) {
|
if (player.colors.value === 'delete') {
|
||||||
|
interval.destroy();
|
||||||
|
}
|
||||||
|
else if (player.colors.value && player.trackCoverUrl) {
|
||||||
overlay = widget.get_parent().get_parent().get_parent();
|
overlay = widget.get_parent().get_parent().get_parent();
|
||||||
updateIcons();
|
updateIcons();
|
||||||
overlay._mprisConnections.set(player.busName, Mpris.connect('changed', updateIcons));
|
Mpris.connect('changed', updateIcons);
|
||||||
|
interval.destroy();
|
||||||
GLib.source_remove(source);
|
|
||||||
}
|
}
|
||||||
});
|
}, 100);
|
||||||
const updateIcons = () => {
|
const updateIcons = () => {
|
||||||
const overlays = overlay.list();
|
const overlays = overlay.list();
|
||||||
|
|
||||||
|
@ -182,7 +166,7 @@ export const PositionSlider = (player, props) => EventBox({
|
||||||
[1000, s => s._update(s)],
|
[1000, s => s._update(s)],
|
||||||
[player.colors, s => {
|
[player.colors, s => {
|
||||||
const c = player.colors.value;
|
const c = player.colors.value;
|
||||||
if (player.colors.value) {
|
if (c && c != 'delete') {
|
||||||
s.setCss(`highlight { background-color: ${c.buttonAccent}; }
|
s.setCss(`highlight { background-color: ${c.buttonAccent}; }
|
||||||
slider { background-color: ${c.buttonAccent}; }
|
slider { background-color: ${c.buttonAccent}; }
|
||||||
slider:hover { background-color: ${c.hoverAccent}; }
|
slider:hover { background-color: ${c.hoverAccent}; }
|
||||||
|
@ -268,7 +252,7 @@ const PlayerButton = ({ player, items, onClick, prop }) => Button({
|
||||||
if (!Mpris.players.find(p => player === p))
|
if (!Mpris.players.find(p => player === p))
|
||||||
return;
|
return;
|
||||||
|
|
||||||
if (player.colors.value) {
|
if (player.colors.value && player.colors.value != 'delete') {
|
||||||
if (prop == 'playBackStatus') {
|
if (prop == 'playBackStatus') {
|
||||||
if (button._hovered) {
|
if (button._hovered) {
|
||||||
items.forEach(item => {
|
items.forEach(item => {
|
||||||
|
|
|
@ -93,15 +93,14 @@ export default () => Box({
|
||||||
child: PlayerGesture({
|
child: PlayerGesture({
|
||||||
properties: [
|
properties: [
|
||||||
['players', new Map()],
|
['players', new Map()],
|
||||||
['mprisConnections', new Map()],
|
|
||||||
['setup', false],
|
['setup', false],
|
||||||
|
['selected'],
|
||||||
],
|
],
|
||||||
connections: [
|
connections: [
|
||||||
[Mpris, (overlay, busName) => {
|
[Mpris, (overlay, busName) => {
|
||||||
if (overlay._players.has(busName))
|
if (overlay._players.has(busName))
|
||||||
return;
|
return;
|
||||||
|
|
||||||
// Sometimes the signal doesn't give the busName
|
|
||||||
if (!busName) {
|
if (!busName) {
|
||||||
const player = Mpris.players.find(p => !overlay._players.has(p.busName));
|
const player = Mpris.players.find(p => !overlay._players.has(p.busName));
|
||||||
if (player)
|
if (player)
|
||||||
|
@ -110,17 +109,23 @@ export default () => Box({
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Get the one on top so it stays there
|
|
||||||
var previousFirst = overlay.get_children().at(-1);
|
|
||||||
for (const [key, value] of overlay._players.entries()) {
|
|
||||||
if (value === previousFirst) {
|
|
||||||
previousFirst = key;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const player = Mpris.getPlayer(busName);
|
const player = Mpris.getPlayer(busName);
|
||||||
player.colors = Variable();
|
player.colors = Variable();
|
||||||
|
const id = player.colors.connect('changed', () => {
|
||||||
|
if (!overlay._players.has(busName))
|
||||||
|
return;
|
||||||
|
if (player.colors.value === 'delete') {
|
||||||
|
overlay._players.delete(busName);
|
||||||
|
|
||||||
|
const result = [];
|
||||||
|
overlay._players.forEach(widget => {
|
||||||
|
result.push(widget);
|
||||||
|
});
|
||||||
|
|
||||||
|
overlay.overlays = result;
|
||||||
|
}
|
||||||
|
player.colors.disconnect(id);
|
||||||
|
});
|
||||||
|
|
||||||
overlay._players.set(busName, PlayerBox(player));
|
overlay._players.set(busName, PlayerBox(player));
|
||||||
|
|
||||||
|
@ -134,13 +139,13 @@ export default () => Box({
|
||||||
// Select favorite player at startup
|
// Select favorite player at startup
|
||||||
if (!overlay._setup) {
|
if (!overlay._setup) {
|
||||||
if (overlay._players.has(FAVE_PLAYER))
|
if (overlay._players.has(FAVE_PLAYER))
|
||||||
overlay.reorder_overlay(overlay._players.get(FAVE_PLAYER), -1);
|
overlay._selected = overlay._players.get(FAVE_PLAYER);
|
||||||
|
|
||||||
overlay._setup = true;
|
overlay._setup = true;
|
||||||
}
|
}
|
||||||
else {
|
|
||||||
overlay.reorder_overlay(overlay._players.get(previousFirst), -1);
|
if (overlay._selected)
|
||||||
}
|
overlay.reorder_overlay(overlay._selected, -1);
|
||||||
}, 'player-added'],
|
}, 'player-added'],
|
||||||
|
|
||||||
|
|
||||||
|
@ -148,18 +153,7 @@ export default () => Box({
|
||||||
if (!busName || !overlay._players.has(busName))
|
if (!busName || !overlay._players.has(busName))
|
||||||
return;
|
return;
|
||||||
|
|
||||||
// Get the one on top so it stays there
|
|
||||||
var previousFirst = overlay.get_children().at(-1);
|
|
||||||
for (const [key, value] of overlay._players.entries()) {
|
|
||||||
if (value === previousFirst) {
|
|
||||||
previousFirst = key;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
overlay._players.delete(busName);
|
overlay._players.delete(busName);
|
||||||
Mpris.disconnect(overlay._mprisConnections.get(busName));
|
|
||||||
overlay._mprisConnections.delete(busName);
|
|
||||||
|
|
||||||
const result = [];
|
const result = [];
|
||||||
overlay._players.forEach(widget => {
|
overlay._players.forEach(widget => {
|
||||||
|
@ -167,9 +161,8 @@ export default () => Box({
|
||||||
});
|
});
|
||||||
|
|
||||||
overlay.overlays = result;
|
overlay.overlays = result;
|
||||||
|
if (overlay._selected)
|
||||||
if (overlay._players.has(previousFirst))
|
overlay.reorder_overlay(overlay._selected, -1);
|
||||||
overlay.reorder_overlay(overlay._players.get(previousFirst), -1);
|
|
||||||
}, 'player-closed'],
|
}, 'player-closed'],
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
|
|
Loading…
Reference in a new issue