From 4ccf5edd2e45466f90e32a0d49d82372c797711b Mon Sep 17 00:00:00 2001 From: Sophia Atkinson Date: Sat, 21 Jun 2025 22:53:47 -0700 Subject: [PATCH] Changed how the artwork gets sent to the API, this is done by sending it separately, so now we have 2 endpoints, its not the best but, it works for now :) --- content.js | 82 +++++++++++++++++++++++++++++---------------------- manifest.json | 2 +- options.html | 4 ++- options.js | 6 ++-- 4 files changed, 54 insertions(+), 40 deletions(-) diff --git a/content.js b/content.js index 8d62c43..a0711d4 100644 --- a/content.js +++ b/content.js @@ -1,7 +1,9 @@ let pauseStartTime = null; let endpoint = null; +let artworkEndpoint = null; let token = null; let intervalId = null; +let lastSentArtworkKey = null; async function imageUrlToBase64(url) { try { @@ -72,6 +74,7 @@ async function getNowPlayingData() { const currentTime = timestampInput ? Number(timestampInput.getAttribute('aria-valuenow')) : media.currentTime; const duration = timestampInput ? Number(timestampInput.getAttribute('aria-valuemax')) : media.duration; + const commonData={details:title,state:artist,album,smallImageKey:'play',smallImageText:'Playing',startTimestamp:Math.floor(Date.now()/1000)-Math.floor(currentTime),endTimestamp:Math.floor(Date.now()/1000)+Math.floor(duration-currentTime),paused,currentTime,duration}; if (paused) { if (!pauseStartTime) pauseStartTime = Date.now(); @@ -81,37 +84,12 @@ async function getNowPlayingData() { state: "", paused: true }; - } else { - return { - details: title, - state: artist, - album, - smallImageKey: 'play', - smallImageText: 'Playing', - artworkBase64, - startTimestamp: Math.floor(Date.now() / 1000) - Math.floor(currentTime), - endTimestamp: Math.floor(Date.now() / 1000) + Math.floor(duration - currentTime), - paused: true, - currentTime, - duration - }; } - } else { - pauseStartTime = null; } return { - details: title, - state: artist, - album, - smallImageKey: 'play', - smallImageText: 'Playing', - artworkBase64, - startTimestamp: Math.floor(Date.now() / 1000) - Math.floor(currentTime), - endTimestamp: Math.floor(Date.now() / 1000) + Math.floor(duration - currentTime), - paused: false, - currentTime, - duration + ...commonData, + artworkBase64 }; } @@ -122,23 +100,54 @@ async function sendNowPlaying() { } const data = await getNowPlayingData(); + if (!data) return; + + const { artworkBase64, details, state, ...noArtData } = data; + try { - const response = await fetch(endpoint, { + await fetch(endpoint, { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${token}` }, - body: JSON.stringify(data), + body: JSON.stringify({ + ...noArtData, + details, + state + }) }); - if (response.ok) { - console.log('Now playing data sent:', data.details, '-', data.state); - } else { - console.error('Failed to send now playing data:', response.status); - } + console.log('Now playing data sent:', details, '-', state); } catch (e) { - console.error('Error sending now playing data:', e); + console.error('Failed to send now playing:', e); + } + + // Only send artwork when song changes + const currentTrackKey = `${details} - ${state}`; + if ( + artworkEndpoint && + artworkBase64 && + currentTrackKey !== lastSentArtworkKey + ) { + try { + await fetch(artworkEndpoint, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'Authorization': `Bearer ${token}` + }, + body: JSON.stringify({ + image: artworkBase64, + details, + state + }) + }); + lastSentArtworkKey = currentTrackKey; + console.log('Artwork sent for:', currentTrackKey); + } catch (e) { + console.error('Failed to send artwork:', e); + } } } @@ -169,13 +178,14 @@ if (!window._nowPlayingExtensionLogged) { } if (typeof chrome !== "undefined" && chrome.storage && chrome.storage.sync) { - chrome.storage.sync.get(['endpoint', 'token'], (result) => { + chrome.storage.sync.get(['endpoint', 'artworkEndpoint', 'token'], (result) => { if (chrome.runtime.lastError) { console.error("Failed to load settings:", chrome.runtime.lastError.message); return; } endpoint = result.endpoint; + artworkEndpoint = result.artworkEndpoint; token = result.token; if (!endpoint || !token) { diff --git a/manifest.json b/manifest.json index 7f9da4b..2a68801 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 3, "name": "Apple Music Now Playing", - "version": "1.3.1", + "version": "1.4.0", "description": "Easily display your currently playing Apple Music track on your website with this extension.", "permissions": [ "storage", diff --git a/options.html b/options.html index ce24c18..4217449 100644 --- a/options.html +++ b/options.html @@ -88,8 +88,10 @@

AmNP Settings (Beta)

- + + + diff --git a/options.js b/options.js index b897bcb..b8cc77e 100644 --- a/options.js +++ b/options.js @@ -1,14 +1,16 @@ /* global chrome */ document.addEventListener('DOMContentLoaded', () => { - chrome.storage.sync.get(['endpoint', 'token'], (data) => { + chrome.storage.sync.get(['endpoint', 'token', 'artworkEndpoint'], (data) => { document.getElementById('endpoint').value = data.endpoint || ''; document.getElementById('token').value = data.token || ''; + document.getElementById('artworkEndpoint').value = data.artworkEndpoint || ''; }); document.getElementById('save').addEventListener('click', () => { const endpoint = document.getElementById('endpoint').value; const token = document.getElementById('token').value; - chrome.storage.sync.set({ endpoint, token }, () => { + const artworkEndpoint = document.getElementById('artworkEndpoint').value; + chrome.storage.sync.set({ endpoint, token, artworkEndpoint }, () => { alert('Settings saved.'); }); });