mirror of
https://github.com/nuttylmao/nutty.gg.git
synced 2026-09-18 19:50:58 -04:00
Minor polish
This commit is contained in:
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 178 KiB |
@@ -332,10 +332,10 @@ async function UpdatePlayerState(data) {
|
||||
// 2. Check if the track name/artist have changed - this is our indicator that the next track has loaded
|
||||
// Only proceed if the player state is actively playing audio
|
||||
if (CurrentPlaybackStatus == PlaybackStatus.PLAYING) {
|
||||
const newTrackKey = `${mediaProps.Title}|${mediaProps.Artist}`;
|
||||
const newTrackKey = `${mediaProps.Title}-${mediaProps.Artist}-${mediaProps.Thumbnail}`;
|
||||
if (newTrackKey !== CurrentSongKey) {
|
||||
ChangeTrack(mediaProps, accentColorPalette); // Now trigger your cross-fade logic here!
|
||||
CurrentSongKey = newTrackKey; // Update the tracker with the string key
|
||||
ChangeTrack(mediaProps, accentColorPalette); // Now trigger your cross-fade logic here!
|
||||
CurrentSongKey = newTrackKey; // Update the tracker with the string key
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -44,8 +44,10 @@ if (!showProgressBar)
|
||||
|
||||
async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
// Fade in the overlay (shows the new text)
|
||||
trackLabel.style.opacity = "0";
|
||||
artistLabel.style.opacity = "0";
|
||||
if (trackLabel.innerText != (swapArtistTrack ? mediaProps.Artist : mediaProps.Title))
|
||||
trackLabel.style.opacity = "0";
|
||||
if (artistLabel.innerText != (swapArtistTrack ? mediaProps.Title : mediaProps.Artist))
|
||||
artistLabel.style.opacity = "0";
|
||||
backgroundLayer.style.opacity = "0";
|
||||
albumArtLayer.style.opacity = "0";
|
||||
|
||||
@@ -55,15 +57,14 @@ async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
artistLabel.innerText = swapArtistTrack ? mediaProps.Title : mediaProps.Artist;
|
||||
|
||||
// Extract the image source string (use fallback if Windows has no art)
|
||||
const newArtUrl = mediaProps.Thumbnail;
|
||||
const newArtUrl = mediaProps.Thumbnail ?? './images/placeholder.png';
|
||||
|
||||
// Set the image
|
||||
backgroundLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
albumArtLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
|
||||
// Apply a tint: Use 30% opacity of the accent color + a dark overlay for contrast
|
||||
// 'rgba(0,0,0,0.6)' ensures the text stays readable
|
||||
// backgroundLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
|
||||
// Apply a tint
|
||||
backgroundLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
|
||||
|
||||
trackLabel.style.opacity = "";
|
||||
artistLabel.style.opacity = "";
|
||||
@@ -75,9 +76,8 @@ async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
backgroundTransitionLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
albumArtTransition.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
|
||||
// Apply a tint: Use 30% opacity of the accent color + a dark overlay for contrast
|
||||
// 'rgba(0,0,0,0.6)' ensures the text stays readable
|
||||
// backgroundTransitionLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
|
||||
// Apply a tint:
|
||||
backgroundTransitionLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
|
||||
|
||||
SetVisibility(true); // Show the overlay for a few seconds if autoHide is enabled
|
||||
}, 250);
|
||||
|
||||
@@ -44,8 +44,10 @@ if (!showProgressBar)
|
||||
|
||||
async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
// Fade in the overlay (shows the new text)
|
||||
trackLabel.style.opacity = "0";
|
||||
artistLabel.style.opacity = "0";
|
||||
if (trackLabel.innerText != (swapArtistTrack ? mediaProps.Artist : mediaProps.Title))
|
||||
trackLabel.style.opacity = "0";
|
||||
if (artistLabel.innerText != (swapArtistTrack ? mediaProps.Title : mediaProps.Artist))
|
||||
artistLabel.style.opacity = "0";
|
||||
backgroundLayer.style.opacity = "0";
|
||||
albumArtLayer.style.opacity = "0";
|
||||
|
||||
@@ -55,14 +57,13 @@ async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
artistLabel.innerText = swapArtistTrack ? mediaProps.Title : mediaProps.Artist;
|
||||
|
||||
// Extract the image source string (use fallback if Windows has no art)
|
||||
const newArtUrl = mediaProps.Thumbnail;
|
||||
const newArtUrl = mediaProps.Thumbnail ?? './images/placeholder.png';
|
||||
|
||||
// Set the image
|
||||
backgroundLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
albumArtLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
|
||||
// Apply a tint: Use 30% opacity of the accent color + a dark overlay for contrast
|
||||
// 'rgba(0,0,0,0.6)' ensures the text stays readable
|
||||
// Apply a tint
|
||||
backgroundLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
|
||||
|
||||
trackLabel.style.opacity = "";
|
||||
@@ -75,8 +76,7 @@ async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
backgroundTransitionLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
albumArtTransition.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
|
||||
// Apply a tint: Use 30% opacity of the accent color + a dark overlay for contrast
|
||||
// 'rgba(0,0,0,0.6)' ensures the text stays readable
|
||||
// Apply a tint
|
||||
backgroundTransitionLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
|
||||
|
||||
SetVisibility(true); // Show the overlay for a few seconds if autoHide is enabled
|
||||
|
||||
@@ -44,8 +44,10 @@ if (textAlignment == 'right')
|
||||
////////////////////
|
||||
|
||||
async function ChangeTrack(mediaProps) {
|
||||
trackLabel.style.opacity = "0";
|
||||
artistLabel.style.opacity = "0";
|
||||
if (trackLabel.innerText != (swapArtistTrack ? mediaProps.Artist : mediaProps.Title))
|
||||
trackLabel.style.opacity = "0";
|
||||
if (artistLabel.innerText != (swapArtistTrack ? mediaProps.Title : mediaProps.Artist))
|
||||
artistLabel.style.opacity = "0";
|
||||
albumArtLayer.style.opacity = "0";
|
||||
|
||||
// Wait for fade (0.5s), then swap the real text and hide overlay
|
||||
@@ -54,7 +56,7 @@ async function ChangeTrack(mediaProps) {
|
||||
artistLabel.innerText = swapArtistTrack ? mediaProps.Title : mediaProps.Artist;
|
||||
|
||||
// Extract the image source string (use fallback if Windows has no art)
|
||||
const newArtUrl = mediaProps.Thumbnail;
|
||||
const newArtUrl = mediaProps.Thumbnail ?? './images/placeholder.png';
|
||||
|
||||
// Set the image
|
||||
albumArtLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
|
||||
@@ -56,8 +56,10 @@ switch (themeVariant) {
|
||||
|
||||
async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
// Fade in the overlay (shows the new text)
|
||||
trackLabel.style.opacity = "0";
|
||||
artistLabel.style.opacity = "0";
|
||||
if (trackLabel.innerText != (swapArtistTrack ? mediaProps.Artist : mediaProps.Title))
|
||||
trackLabel.style.opacity = "0";
|
||||
if (artistLabel.innerText != (swapArtistTrack ? mediaProps.Title : mediaProps.Artist))
|
||||
artistLabel.style.opacity = "0";
|
||||
backgroundLayer.style.opacity = "0";
|
||||
albumArtLayer.style.opacity = "0";
|
||||
|
||||
@@ -90,9 +92,8 @@ async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
backgroundLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
albumArtLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
|
||||
// Apply a tint: Use 30% opacity of the accent color + a dark overlay for contrast
|
||||
// 'rgba(0,0,0,0.6)' ensures the text stays readable
|
||||
// backgroundLayer.style.backgroundColor = accentColorPalette.LightVibrant + "80"; // 80 is 50% opacity in hex
|
||||
// Apply a tint
|
||||
backgroundLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
|
||||
|
||||
trackLabel.style.opacity = "";
|
||||
artistLabel.style.opacity = "";
|
||||
@@ -104,9 +105,8 @@ async function ChangeTrack(mediaProps, accentColorPalette) {
|
||||
backgroundTransitionLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
albumArtTransition.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
|
||||
// Apply a tint: Use 30% opacity of the accent color + a dark overlay for contrast
|
||||
// 'rgba(0,0,0,0.6)' ensures the text stays readable
|
||||
// backgroundTransitionLayer.style.backgroundColor = accentColorPalette.LightVibrant + "80"; // 80 is 50% opacity in hex
|
||||
// Apply a tint
|
||||
backgroundTransitionLayer.style.backgroundColor = accentColorPalette.DarkMuted + "80"; // 80 is 50% opacity in hex
|
||||
|
||||
SetVisibility(true); // Show the overlay for a few seconds if autoHide is enabled
|
||||
}, 250);
|
||||
|
||||
@@ -46,7 +46,7 @@ async function ChangeTrack(mediaProps) {
|
||||
setTimeout(() => {
|
||||
|
||||
// Extract the image source string (use fallback if Windows has no art)
|
||||
const newArtUrl = mediaProps.Thumbnail;
|
||||
const newArtUrl = mediaProps.Thumbnail ?? './images/placeholder.png';
|
||||
|
||||
// Set the image
|
||||
albumArtLayer.style.backgroundImage = `url('${newArtUrl}')`;
|
||||
|
||||
Reference in New Issue
Block a user