LESA/custum-hyprpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP - Refactor media menu

Browse Source
This commit is contained in:
Jas Singh
2024-07-10 00:46:24 -07:00
parent 81ecf205be
commit 6cda814d9b
14 changed files with 358 additions and 564 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
modules/menus/media/components/albumcover.js
View File

@@ -1,16 +0,0 @@
const AlbumCover = (curPlayer) => {
if (
typeof curPlayer.track_cover_url === "string" &&
curPlayer.track_cover_url.length > 0
) {
return Widget.Box({
vexpand: false,
vpack: "center",
class_name: "media-indicator-current-album-cover",
css: `background-image: url("${curPlayer.track_cover_url}")`,
});
}
return Widget.Box();
};
export { AlbumCover };

56
modules/menus/media/components/bar.js
View File

@@ -1,4 +1,26 @@
const Bar = (curPlayer) => {
const media = await Service.import("mpris");
const Bar = (getPlayerInfo) => {
media.connect("changed", () => {
const statusOrder = {
Playing: 1,
Paused: 2,
Stopped: 3,
};
const isPlaying = media.players.find(
(p) => p["play-back-status"] === "Playing",
);
if (isPlaying) {
curPlayer.value = media.players.sort(
(a, b) =>
statusOrder[a["play-back-status"]] -
statusOrder[b["play-back-status"]],
)[0];
}
});
return Widget.Box({
class_name: "media-indicator-current-progress-bar",
hexpand: true,
@@ -11,34 +33,34 @@ const Bar = (curPlayer) => {
class_name: "menu-slider media progress",
draw_value: false,
on_change: ({ value }) => {
return (curPlayer.position = value * curPlayer.length);
const foundPlayer = getPlayerInfo(media);
return (foundPlayer.position = value * foundPlayer.length);
},
setup: (self) => {
const update = () => {
if (
typeof curPlayer.position === "number" &&
curPlayer.position > 0 &&
typeof curPlayer.length === "number" &&
curPlayer.length > 0
) {
const value = curPlayer.position / curPlayer.length;
const foundPlayer = getPlayerInfo(media);
if (foundPlayer !== undefined) {
const value = foundPlayer.position / foundPlayer.length;
self.value = value > 0 ? value : 0;
} else {
self.value = 0;
}
};
self.hook(curPlayer, update);
self.hook(curPlayer, update, "position");
self.hook(media, update);
self.poll(1000, update);
function updateTooltip() {
const curHour = Math.floor(curPlayer.position / 3600);
const curMin = Math.floor((curPlayer.position % 3600) / 60);
const curSec = Math.floor(curPlayer.position % 60);
const foundPlayer = getPlayerInfo(media);
if (foundPlayer === undefined) {
return self.tooltip_text = '0:0'
}
const curHour = Math.floor(foundPlayer.position / 3600);
const curMin = Math.floor((foundPlayer.position % 3600) / 60);
const curSec = Math.floor(foundPlayer.position % 60);
if (
typeof curPlayer.position === "number" &&
curPlayer.position >= 0
typeof foundPlayer.position === "number" &&
foundPlayer.position >= 0
) {
// WARN: These nested ternaries are absolutely disgusting lol
self.tooltip_text = `${
@@ -51,7 +73,7 @@ const Bar = (curPlayer) => {
}
}
self.poll(1000, updateTooltip);
self.hook(curPlayer, updateTooltip);
self.hook(media, updateTooltip);
},
}),
}),

63
modules/menus/media/components/controls.js vendored
View File

@@ -1,6 +1,31 @@
import icons from "../../../icons/index.js";
const media = await Service.import("mpris");
const Controls = (curPlayer) => {
const Controls = () => {
const curPlayer = Variable(media.players[0]);
media.connect("changed", () => {
const statusOrder = {
Playing: 1,
Paused: 2,
Stopped: 3,
};
const isPlaying = media.players.find(
(p) => p["play-back-status"] === "Playing",
);
if (isPlaying) {
curPlayer.value = media.players.sort(
(a, b) =>
statusOrder[a["play-back-status"]] -
statusOrder[b["play-back-status"]],
)[0];
}
});
if (curPlayer.value === undefined) {
return Widget.Box();
}
const isLoopActive = (player) => {
return player["loop-status"] !== null &&
["track", "playlist"].includes(player["loop-status"].toLowerCase())
@@ -28,25 +53,25 @@ const Controls = (curPlayer) => {
Widget.Button({
hpack: "center",
tooltip_text:
curPlayer.shuffle_status !== null
? curPlayer.shuffle_status
curPlayer.value.shuffle_status !== null
? curPlayer.value.shuffle_status
? "Shuffling"
: "Not Shuffling"
: null,
hasTooltip: true,
on_primary_click: () => curPlayer.shuffle(),
class_name: `media-indicator-control-button shuffle ${isShuffleActive(curPlayer)} ${curPlayer.shuffle_status !== null ? "enabled" : "disabled"}`,
on_primary_click: () => curPlayer.value.shuffle(),
class_name: `media-indicator-control-button shuffle ${isShuffleActive(curPlayer.value)} ${curPlayer.value.shuffle_status !== null ? "enabled" : "disabled"}`,
child: Widget.Icon(icons.mpris.shuffle["enabled"]),
}),
],
}),
Widget.Box({
class_name: `media-indicator-control prev ${curPlayer.can_go_prev}`,
class_name: `media-indicator-control prev ${curPlayer.value.can_go_prev}`,
children: [
Widget.Button({
hpack: "center",
on_primary_click: () => curPlayer.previous(),
class_name: `media-indicator-control-button prev ${curPlayer.can_go_prev ? "enabled" : "disabled"}`,
on_primary_click: () => curPlayer.value.previous(),
class_name: `media-indicator-control-button prev ${curPlayer.value.can_go_prev ? "enabled" : "disabled"}`,
child: Widget.Icon(icons.mpris.prev),
}),
],
@@ -56,10 +81,10 @@ const Controls = (curPlayer) => {
children: [
Widget.Button({
hpack: "center",
on_primary_click: () => curPlayer.playPause(),
class_name: `media-indicator-control-button play ${curPlayer.can_play ? "enabled" : "disabled"}`,
on_primary_click: () => curPlayer.value.playPause(),
class_name: `media-indicator-control-button play ${curPlayer.value.can_play ? "enabled" : "disabled"}`,
child: Widget.Icon(
icons.mpris[curPlayer.play_back_status.toLowerCase()],
icons.mpris[curPlayer.value.play_back_status.toLowerCase()],
),
}),
],
@@ -69,8 +94,8 @@ const Controls = (curPlayer) => {
children: [
Widget.Button({
hpack: "center",
on_primary_click: () => curPlayer.next(),
class_name: `media-indicator-control-button next ${curPlayer.can_go_next ? "enabled" : "disabled"}`,
on_primary_click: () => curPlayer.value.next(),
class_name: `media-indicator-control-button next ${curPlayer.value.can_go_next ? "enabled" : "disabled"}`,
child: Widget.Icon(icons.mpris.next),
}),
],
@@ -81,16 +106,16 @@ const Controls = (curPlayer) => {
Widget.Button({
hpack: "center",
tooltip_text:
curPlayer.loop_status !== null
? `Looping: ${curPlayer.loop_status}`
curPlayer.value.loop_status !== null
? `Looping: ${curPlayer.value.loop_status}`
: null,
hasTooltip: true,
on_primary_click: () => curPlayer.loop(),
class_name: `media-indicator-control-button loop ${isLoopActive(curPlayer)} ${curPlayer.loop_status !== null ? "enabled" : "disabled"}`,
on_primary_click: () => curPlayer.value.loop(),
class_name: `media-indicator-control-button loop ${isLoopActive(curPlayer.value)} ${curPlayer.value.loop_status !== null ? "enabled" : "disabled"}`,
child: Widget.Icon(
curPlayer.loop_status === null
curPlayer.value.loop_status === null
? icons.mpris.loop["none"]
: icons.mpris.loop[curPlayer.loop_status?.toLowerCase()],
: icons.mpris.loop[curPlayer.value.loop_status?.toLowerCase()],
),
}),
],

52
modules/menus/media/components/mediainfo.js
View File

@@ -1,4 +1,28 @@
const MediaInfo = (curPlayer) => {
const media = await Service.import("mpris");
const MediaInfo = () => {
const curPlayer = Variable(media.players[0]);
media.connect("changed", () => {
const statusOrder = {
Playing: 1,
Paused: 2,
Stopped: 3,
};
const isPlaying = media.players.find(
(p) => p["play-back-status"] === "Playing",
);
if (isPlaying) {
curPlayer.value = media.players.sort(
(a, b) =>
statusOrder[a["play-back-status"]] -
statusOrder[b["play-back-status"]],
)[0];
}
console.log('changed');
});
return Widget.Box({
class_name: "media-indicator-current-media-info",
hpack: "center",
@@ -11,10 +35,15 @@ const MediaInfo = (curPlayer) => {
children: [
Widget.Label({
truncate: "end",
max_width_chars: 21,
max_width_chars: 35,
wrap: true,
class_name: "media-indicator-current-song-name-label",
label: curPlayer["track-title"],
setup: (self) => {
self.hook(curPlayer, () => {
console.log('did change')
return (self.label = curPlayer.value["track-title"]);
});
},
}),
],
}),
@@ -25,9 +54,14 @@ const MediaInfo = (curPlayer) => {
Widget.Label({
truncate: "end",
wrap: true,
max_width_chars: 25,
max_width_chars: 35,
class_name: "media-indicator-current-song-author-label",
label: curPlayer["track-artists"].join(", "),
setup: (self) => {
self.hook(curPlayer, () => {
console.log(JSON.stringify(curPlayer, null, 2));
return (self.label = curPlayer.value["track-title"]);
});
},
}),
],
}),
@@ -38,9 +72,13 @@ const MediaInfo = (curPlayer) => {
Widget.Label({
truncate: "end",
wrap: true,
max_width_chars: 25,
max_width_chars: 40,
class_name: "media-indicator-current-song-album-label",
label: curPlayer["track-album"],
setup: (self) => {
self.hook(curPlayer, () => {
return (self.label = curPlayer.value["track-album"]);
});
},
}),
],
}),