Minor tweaks

This commit is contained in:
nutty
2026-06-29 23:45:48 +10:00
parent 82d5e4fbc2
commit 819d3c2fd3
7 changed files with 43 additions and 50 deletions
+8
View File
@@ -33,6 +33,14 @@ const displayDuration = GetIntParam("displayDuration", 5);
const showAnimation = urlParams.get('showAnimation') || 'slide-in-from-bottom';
const hideAnimation = urlParams.get('hideAnimation') || 'slide-out-bottom';
/////////////////
// GLOBAL VARS //
/////////////////
let CurrentPlaybackStatus;
let CurrentSong;
let hideTimeout = null;
////////////////
// PAGE SETUP //
////////////////
+4 -8
View File
@@ -1,11 +1,3 @@
/////////////////
// GLOBAL VARS //
/////////////////
let CurrentPlaybackStatus;
let CurrentSong;
let hideTimeout = null;
///////////////////
// PAGE ELEMENTS //
///////////////////
@@ -86,11 +78,15 @@ 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}`;
if (newTrackKey !== CurrentSong) {
ChangeTrack(mediaProps, accentColorPalette.LightVibrant); // Now trigger your cross-fade logic here!
CurrentSong = newTrackKey; // Update the tracker with the string key
}
}
// 3. Update the progress info
if (timelineProps)
+1 -1
View File
@@ -82,7 +82,7 @@
position: relative; /* Keeps it in the document flow */
z-index: 2; /* Sits above the background-layer */
padding: 2em 1.75em;
padding: 10% 7.5%;
display: flex;
flex-direction: column;
gap: 0.3em;
+4 -8
View File
@@ -1,11 +1,3 @@
/////////////////
// GLOBAL VARS //
/////////////////
let CurrentPlaybackStatus;
let CurrentSong;
let hideTimeout = null;
///////////////////
// PAGE ELEMENTS //
///////////////////
@@ -81,11 +73,15 @@ 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}`;
if (newTrackKey !== CurrentSong) {
ChangeTrack(mediaProps, accentColorPalette); // Now trigger your cross-fade logic here!
CurrentSong = newTrackKey; // Update the tracker with the string key
}
}
// 3. Update the progress info
if (timelineProps)
+4 -8
View File
@@ -1,11 +1,3 @@
/////////////////
// GLOBAL VARS //
/////////////////
let CurrentPlaybackStatus;
let CurrentSong;
let hideTimeout = null;
///////////////////
// PAGE ELEMENTS //
///////////////////
@@ -83,11 +75,15 @@ 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}`;
if (newTrackKey !== CurrentSong) {
ChangeTrack(mediaProps); // Now trigger your cross-fade logic here!
CurrentSong = newTrackKey; // Update the tracker with the string key
}
}
// // 3. Update the progress info
// if (timelineProps)
+4 -8
View File
@@ -1,11 +1,3 @@
/////////////////
// GLOBAL VARS //
/////////////////
let CurrentPlaybackStatus;
let CurrentSong;
let hideTimeout = null;
///////////////////
// PAGE ELEMENTS //
///////////////////
@@ -86,11 +78,15 @@ 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}`;
if (newTrackKey !== CurrentSong) {
ChangeTrack(mediaProps, accentColorPalette.LightVibrant); // Now trigger your cross-fade logic here!
CurrentSong = newTrackKey; // Update the tracker with the string key
}
}
// 3. Update the progress info
if (timelineProps)
+2 -1
View File
@@ -45,6 +45,7 @@
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
border-radius: 1em;
overflow: hidden;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
@@ -64,7 +65,7 @@
background-repeat: no-repeat;
background-blend-mode: overlay; /* Or 'soft-light' for a subtler effect */
filter: blur(0px) brightness(0.3) saturate(1.2);
filter: blur(5px) brightness(0.3) saturate(1.2);
transform: scale(1.1); /* Slightly zoom in to cover edges when blurred */
}