Smartcraft-Media-Tech/nutty-tools
1
0
Fork 0
mirror of https://github.com/nuttylmao/nutty.gg.git synced 2026-09-18 19:50:58 -04:00
Code Issues Packages Projects Releases Wiki Activity

Added more settings

Browse Source
This commit is contained in:
nutty
2026-06-28 04:06:45 +10:00
parent a52b07fccc
commit 9e175e2ac7
10 changed files with 144 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files
now-playing/script.js
+44 -6
View File
@@ -20,14 +20,18 @@ const theme = urlParams.get('theme') || 'standard';
const font = urlParams.get("font") || "";
const fontSize = GetIntParam("fontSize", 20);
const maxWidth = GetIntParam("maxWidth", 500);
const albumArt = urlParams.get('albumArt') || 'show';
const showProgressBar = GetBooleanParam("showProgressBar", true);
const textAlignment = urlParams.get('textAlignment') || 'left';
const targetApplication = urlParams.get('targetApplication') || '';
const showAlbumArt = GetBooleanParam("showAlbumArt", true);
const showProgressBar = GetBooleanParam("showProgressBar", true);
const swapArtistTrack = GetBooleanParam("swapArtistTrack", false);
const showPrimary = GetBooleanParam("showPrimary", true);
const showSecondary = GetBooleanParam("showSecondary", true);
const autoHide = GetBooleanParam("autoHide", false);
const displayDuration = GetIntParam("displayDuration", 5);
const showAnimation = urlParams.get('showAnimation') || 'fade';
const hideAnimation = urlParams.get('hideAnimation') || 'fade';
const showAnimation = urlParams.get('showAnimation') || 'slide-in-from-bottom';
const hideAnimation = urlParams.get('hideAnimation') || 'slide-out-bottom';
////////////////
// PAGE SETUP //
@@ -37,6 +41,30 @@ const hideAnimation = urlParams.get('hideAnimation') || 'fade';
document.body.style.fontFamily = font;
document.body.style.fontSize = `${fontSize}px`;
// Set album art visibility
if (showAlbumArt)
document.documentElement.style.setProperty('--show-album-art', ``);
else
document.documentElement.style.setProperty('--show-album-art', `none`);
// Set text alignment
document.documentElement.style.setProperty('--text-alignment', `${textAlignment}`);
switch (textAlignment)
{
case 'left':
document.documentElement.style.setProperty('--justify-content', `flex-start`);
document.documentElement.style.setProperty('--trailing-fade', `linear-gradient(to right, black calc(100% - 1em), transparent 100%)`);
break;
case 'center':
document.documentElement.style.setProperty('--justify-content', `center`);
document.documentElement.style.setProperty('--trailing-fade', `linear-gradient(to right, black calc(100% - 1em), transparent 100%)`);
break;
case 'right':
document.documentElement.style.setProperty('--justify-content', `flex-end`);
document.documentElement.style.setProperty('--trailing-fade', ``);
break;
}
////////////////
@@ -104,8 +132,18 @@ function ConvertMillisecondsToMinutesSoThatItLooksBetterOnTheOverlay(time) {
if (isNaN(time) || time <= 0) return "0:00";
const totalSeconds = Math.floor(time / 1000);
const minutes = Math.floor(totalSeconds / 60);
const hours = Math.floor(totalSeconds / 3600);
const minutes = Math.floor((totalSeconds % 3600) / 60);
const seconds = totalSeconds % 60;
return `${minutes}:${('0' + seconds).slice(-2)}`;
// Format seconds with a leading zero
const paddedSeconds = ('0' + seconds).slice(-2);
if (hours > 0) {
// Format minutes with a leading zero if hours are present
const paddedMinutes = ('0' + minutes).slice(-2);
return `${hours}:${paddedMinutes}:${paddedSeconds}`;
}
return `${minutes}:${paddedSeconds}`;
}
now-playing/settings/settings.json
+49 -13
View File
@@ -51,23 +51,44 @@
"group": "Appearance"
},
{
"id": "albumArt",
"label": "Album Art",
"id": "textAlignment",
"label": "Text Alignment",
"description": "",
"type": "select",
"options": [
{
"value": "none",
"label": "Don't display"
"value": "left",
"label": "Left"
},
{
"value": "show",
"label": "Show"
"value": "center",
"label": "Center"
},
{
"value": "right",
"label": "Right"
}
],
"defaultValue": "show",
"defaultValue": "left",
"group": "Appearance"
},
{
"id": "targetApplication",
"label": "Target Application",
"description": "Specific app to track. Leave empty to automatically follow the active player.<br><a href='http://127.0.0.1:5000/sessions' target='_blank' style='color: #4da6ff; text-decoration: underline;'>View active sources</a>",
"type": "text",
"placeholder": "e.g., Spotify.exe",
"defaultValue": "",
"group": "General"
},
{
"id": "showAlbumArt",
"label": "Show AlbumArt",
"description": "",
"type": "checkbox",
"defaultValue": true,
"group": "General"
},
{
"id": "showProgressBar",
"label": "Show Progress Bar",
@@ -77,12 +98,27 @@
"group": "General"
},
{
"id": "targetApplication",
"label": "Target Application",
"description": "Specific app to track. Leave empty to automatically follow the active player.<br><a href='http://127.0.0.1:5000/sessions' target='_blank' style='color: #4da6ff; text-decoration: underline;'>View active sources</a>",
"type": "text",
"placeholder": "e.g., Spotify.exe",
"defaultValue": "",
"id": "swapArtistTrack",
"label": "Swap Artist and Track",
"description": "Displays Artist above Track instead of Track above Artist.",
"type": "checkbox",
"defaultValue": false,
"group": "General"
},
{
"id": "showPrimary",
"label": "Show Primary Text",
"description": "",
"type": "checkbox",
"defaultValue": true,
"group": "General"
},
{
"id": "showSecondary",
"label": "Show Secondary Text",
"description": "",
"type": "checkbox",
"defaultValue": true,
"group": "General"
},
{
now-playing/themes/card/script.js
+7 -15
View File
@@ -30,24 +30,16 @@ const durationLabel = document.getElementById('duration');
// PAGE SETUP //
////////////////
// Set property visibility
trackLabel.style.display = showPrimary ? '' : 'none';
artistLabel.style.display = showSecondary ? '' : 'none';
// Set container width
if (maxWidth > 0)
mainWrapper.style.width = `${maxWidth}px`;
else
mainWrapper.style.width = `100%`;
// Set album art style
switch (albumArt)
{
case 'none':
albumArtContainer.style.display = 'none';
break;
case 'show':
albumArtContainer.style.display = '';
break;
case 'spinny':
break;
}
// Set progress bar visibility
if (!showProgressBar)
progressContainer.style.display = 'none';
@@ -169,8 +161,8 @@ async function ChangeTrack(mediaProps) {
// Wait for fade (0.5s), then swap the real text and hide overlay
setTimeout(() => {
trackLabel.innerText = mediaProps.Title;
artistLabel.innerText = mediaProps.Artist;
trackLabel.innerText = swapArtistTrack ? mediaProps.Artist : mediaProps.Title;
artistLabel.innerText = swapArtistTrack ? mediaProps.Title : mediaProps.Artist;
// Extract the image source string (use fallback if Windows has no art)
const newArtUrl = mediaProps.Base64Image;
now-playing/themes/card/style.css
+6 -3
View File
@@ -17,6 +17,7 @@
background-size: cover;
background-position: center;
margin: 0em 0em 1em 0em;
display: var(--show-album-art);
}
#album-art-layer,
@@ -90,19 +91,21 @@
#track-label {
font-size: 1em;
font-weight: 600;
text-align: var(--text-alignment);
}
#artist-label {
font-size: 0.8em;
font-weight: 300;
opacity: 0.6;
text-align: var(--text-alignment);
}
.text-label {
white-space: nowrap;
/* overflow: hidden; */
mask-image: linear-gradient(to right, black calc(100% - 1em), transparent 100%);
-webkit-mask-image: linear-gradient(to right, black calc(100% - 1em), transparent 100%);
mask-image: var(--trailing-fade);
-webkit-mask-image: var(--trailing-fade);
transition: opacity 0.25s ease-in-out;
}
@@ -110,7 +113,7 @@
display: flex;
flex-direction: column;
gap: 0.2em;
margin-top: 0.2em;
margin-top: 1em;
}
#progress-bar-track {
now-playing/themes/compact/script.js
+13 -6
View File
@@ -16,8 +16,8 @@ const songInfoContainer = document.getElementById('song-info-container');
const progressBar = document.getElementById('progress-bar');
const trackLabel = document.getElementById('track-label');
const artistLabel = document.getElementById('artist-label');
const trackLabelBase = document.getElementById('track-label-background');
const artistLabelBase = document.getElementById('artist-label-background');
const trackLabelBackground = document.getElementById('track-label-background');
const artistLabelBackground = document.getElementById('artist-label-background');
const songLabel = document.getElementById('song-label');
const songLabelBackground = document.getElementById('song-label-background');
@@ -27,6 +27,13 @@ const songLabelBackground = document.getElementById('song-label-background');
// PAGE SETUP //
////////////////
// Set property visibility
trackLabel.style.display = showPrimary ? '' : 'none';
artistLabel.style.display = showSecondary ? '' : 'none';
trackLabelBackground.style.display = showPrimary ? '' : 'none';
artistLabelBackground.style.display = showSecondary ? '' : 'none';
// Set container width
if (maxWidth > 0)
mainWrapper.style.width = `${maxWidth}px`;
else
@@ -150,10 +157,10 @@ async function ChangeTrack(mediaProps, accentColor) {
// Wait for fade (0.5s), then swap the real text and hide overlay
setTimeout(() => {
trackLabel.innerText = mediaProps.Title;
artistLabel.innerText = mediaProps.Artist;
trackLabelBase.innerText = mediaProps.Title;
artistLabelBase.innerText = mediaProps.Artist;
trackLabel.innerText = swapArtistTrack ? mediaProps.Artist : mediaProps.Title;
artistLabel.innerText = swapArtistTrack ? mediaProps.Title : mediaProps.Artist;
trackLabelBackground.innerText = swapArtistTrack ? mediaProps.Artist : mediaProps.Title;
artistLabelBackground.innerText = swapArtistTrack ? mediaProps.Title : mediaProps.Artist;
// Extract the image source string (use fallback if Windows has no art)
now-playing/themes/compact/style.css
+1 -1
View File
@@ -52,7 +52,7 @@
align-items: baseline;
gap: 0.5em;
min-width: 100%;
/* justify-content: center; */
justify-content: var(--justify-content);
overflow: visible;
}
now-playing/themes/simple/script.js
+7 -15
View File
@@ -30,24 +30,16 @@ const artistLabel = document.getElementById('artist-label');
// PAGE SETUP //
////////////////
// Set property visibility
trackLabel.style.display = showPrimary ? '' : 'none';
artistLabel.style.display = showSecondary ? '' : 'none';
// Set container width
if (maxWidth > 0)
mainWrapper.style.width = `${maxWidth}px`;
else
mainWrapper.style.width = `100%`;
// Set album art style
switch (albumArt)
{
case 'none':
albumArtContainer.style.display = 'none';
break;
case 'show':
albumArtContainer.style.display = '';
break;
case 'spinny':
break;
}
// // Set progress bar visibility
// if (!showProgressBar)
// progressContainer.style.display = 'none';
@@ -169,8 +161,8 @@ async function ChangeTrack(mediaProps) {
// Wait for fade (0.5s), then swap the real text and hide overlay
setTimeout(() => {
trackLabel.innerText = mediaProps.Title;
artistLabel.innerText = mediaProps.Artist;
trackLabel.innerText = swapArtistTrack ? mediaProps.Artist : mediaProps.Title;
artistLabel.innerText = swapArtistTrack ? mediaProps.Title : mediaProps.Artist;
// Extract the image source string (use fallback if Windows has no art)
const newArtUrl = mediaProps.Base64Image;
now-playing/themes/simple/style.css
+5 -2
View File
@@ -17,6 +17,7 @@
position: relative;
background-size: cover;
background-position: center;
display: var(--show-album-art);
}
#album-art-layer,
@@ -66,18 +67,20 @@
#track-label {
font-size: 1em;
font-weight: 600;
text-align: var(--text-alignment);
}
#artist-label {
font-size: 0.8em;
font-weight: 300;
opacity: 0.6;
text-align: var(--text-alignment);
}
.text-label {
white-space: nowrap;
overflow: hidden;
mask-image: linear-gradient(to right, black calc(100% - 1em), transparent 100%);
-webkit-mask-image: linear-gradient(to right, black calc(100% - 1em), transparent 100%);
mask-image: var(--trailing-fade);
-webkit-mask-image: var(--trailing-fade);
transition: opacity 0.25s ease-in-out;
}
now-playing/themes/standard/script.js
+7 -15
View File
@@ -30,24 +30,16 @@ const durationLabel = document.getElementById('duration');
// PAGE SETUP //
////////////////
// Set property visibility
trackLabel.style.display = showPrimary ? '' : 'none';
artistLabel.style.display = showSecondary ? '' : 'none';
// Set container width
if (maxWidth > 0)
mainWrapper.style.width = `${maxWidth}px`;
else
mainWrapper.style.width = `100%`;
// Set album art style
switch (albumArt)
{
case 'none':
albumArtContainer.style.display = 'none';
break;
case 'show':
albumArtContainer.style.display = '';
break;
case 'spinny':
break;
}
// Set progress bar visibility
if (!showProgressBar)
progressContainer.style.display = 'none';
@@ -172,8 +164,8 @@ async function ChangeTrack(mediaProps, tintColor) {
// Wait for fade (0.5s), then swap the real text and hide overlay
setTimeout(async () => {
trackLabel.innerText = mediaProps.Title;
artistLabel.innerText = mediaProps.Artist;
trackLabel.innerText = swapArtistTrack ? mediaProps.Artist : mediaProps.Title;
artistLabel.innerText = swapArtistTrack ? mediaProps.Title : mediaProps.Artist;
// Extract the image source string (use fallback if Windows has no art)
const newArtUrl = mediaProps.Base64Image;
now-playing/themes/standard/style.css
+5 -2
View File
@@ -16,6 +16,7 @@
position: relative;
background-size: cover;
background-position: center;
display: var(--show-album-art);
}
#album-art-layer,
@@ -89,19 +90,21 @@
#track-label {
font-size: 1em;
font-weight: 600;
text-align: var(--text-alignment);
}
#artist-label {
font-size: 0.8em;
font-weight: 300;
opacity: 0.6;
text-align: var(--text-alignment);
}
.text-label {
white-space: nowrap;
overflow: hidden;
mask-image: linear-gradient(to right, black calc(100% - 1em), transparent 100%);
-webkit-mask-image: linear-gradient(to right, black calc(100% - 1em), transparent 100%);
mask-image: var(--trailing-fade);
-webkit-mask-image: var(--trailing-fade);
transition: opacity 0.25s ease-in-out;
}