From 82785e1da19bbad8864b455669e32150e71f6c87 Mon Sep 17 00:00:00 2001 From: Glenn Thompson Date: Wed, 8 Oct 2025 09:32:05 +0300 Subject: [PATCH] Fix frontend JavaScript to work with define-api endpoints - Update API paths from /asteroid/api/ to /api/asteroid/ in users.js and profile.js - Add RADIANCE API wrapper handling for icecast-status responses - Improve error handling in player.js loadTracks function - All frontend code now properly handles define-api response format --- static/js/front-page.js | 6 ++++-- static/js/player.js | 15 +++++++++++---- static/js/profile.js | 12 ++++++------ static/js/users.js | 12 ++++++------ 4 files changed, 27 insertions(+), 18 deletions(-) diff --git a/static/js/front-page.js b/static/js/front-page.js index 636c012..b3eb531 100644 --- a/static/js/front-page.js +++ b/static/js/front-page.js @@ -57,9 +57,11 @@ async function updateNowPlaying() { try { const response = await fetch('/api/asteroid/icecast-status') const data = await response.json() - if (data.icestats && data.icestats.source) { + // Handle RADIANCE API wrapper format + const icecastData = data.data || data; + if (icecastData.icestats && icecastData.icestats.source) { // Find the high quality stream (asteroid.mp3) - const sources = Array.isArray(data.icestats.source) ? data.icestats.source : [data.icestats.source]; + const sources = Array.isArray(icecastData.icestats.source) ? icecastData.icestats.source : [icecastData.icestats.source]; const mainStream = sources.find(s => s.listenurl && s.listenurl.includes('asteroid.mp3')); if (mainStream && mainStream.title) { diff --git a/static/js/player.js b/static/js/player.js index dbd7f6b..e8f76f8 100644 --- a/static/js/player.js +++ b/static/js/player.js @@ -56,11 +56,16 @@ async function loadTracks() { if (!response.ok) { throw new Error(`HTTP ${response.status}`); } - const data = await response.json(); + const result = await response.json(); + // Handle RADIANCE API wrapper format + const data = result.data || result; if (data.status === 'success') { tracks = data.tracks || []; displayTracks(tracks); + } else { + console.error('Error loading tracks:', data.error); + document.getElementById('track-list').innerHTML = '
Error loading tracks
'; } } catch (error) { console.error('Error loading tracks:', error); @@ -566,9 +571,11 @@ async function updateLiveStream() { if (!response.ok) { throw new Error(`HTTP ${response.status}`); } - const data = await response.json(); - console.log('Live stream data:', data); // Debug log - + const result = await response.json(); + console.log('Live stream data:', result); // Debug log + + // Handle RADIANCE API wrapper format + const data = result.data || result; if (data.icestats && data.icestats.source) { const sources = Array.isArray(data.icestats.source) ? data.icestats.source : [data.icestats.source]; const mainStream = sources.find(s => s.listenurl && s.listenurl.includes('asteroid.mp3')); diff --git a/static/js/profile.js b/static/js/profile.js index d141819..28bd7c2 100644 --- a/static/js/profile.js +++ b/static/js/profile.js @@ -9,7 +9,7 @@ function loadProfileData() { console.log('Loading profile data...'); // Load user info - fetch('/asteroid/api/user/profile') + fetch('/api/asteroid/user/profile') .then(response => response.json()) .then(data => { if (data.status === 'success') { @@ -50,7 +50,7 @@ function updateProfileDisplay(user) { } function loadListeningStats() { - fetch('/asteroid/api/user/listening-stats') + fetch('/api/asteroid/user/listening-stats') .then(response => response.json()) .then(data => { if (data.status === 'success') { @@ -72,7 +72,7 @@ function loadListeningStats() { } function loadRecentTracks() { - fetch('/asteroid/api/user/recent-tracks?limit=3') + fetch('/api/asteroid/user/recent-tracks?limit=3') .then(response => response.json()) .then(data => { if (data.status === 'success' && data.tracks.length > 0) { @@ -99,7 +99,7 @@ function loadRecentTracks() { } function loadTopArtists() { - fetch('/asteroid/api/user/top-artists?limit=5') + fetch('/api/asteroid/user/top-artists?limit=5') .then(response => response.json()) .then(data => { if (data.status === 'success' && data.artists.length > 0) { @@ -139,7 +139,7 @@ function exportListeningData() { console.log('Exporting listening data...'); showMessage('Preparing data export...', 'info'); - fetch('/asteroid/api/user/export-data', { + fetch('/api/asteroid/user/export-data', { method: 'POST' }) .then(response => response.blob()) @@ -168,7 +168,7 @@ function clearListeningHistory() { console.log('Clearing listening history...'); showMessage('Clearing listening history...', 'info'); - fetch('/asteroid/api/user/clear-history', { + fetch('/api/asteroid/user/clear-history', { method: 'POST' }) .then(response => response.json()) diff --git a/static/js/users.js b/static/js/users.js index 22b184c..3a31537 100644 --- a/static/js/users.js +++ b/static/js/users.js @@ -5,7 +5,7 @@ document.addEventListener('DOMContentLoaded', function() { async function loadUserStats() { try { - const response = await fetch('/asteroid/api/users/stats'); + const response = await fetch('/api/asteroid/users/stats'); const result = await response.json(); if (result.status === 'success') { @@ -37,7 +37,7 @@ async function loadUserStats() { async function loadUsers() { try { - const response = await fetch('/asteroid/api/users'); + const response = await fetch('/api/asteroid/users'); const result = await response.json(); if (result.status === 'success') { @@ -101,7 +101,7 @@ async function updateUserRole(userId, newRole) { const formData = new FormData(); formData.append('role', newRole); - const response = await fetch(`/asteroid/api/users/${userId}/role`, { + const response = await fetch(`/api/asteroid/users/${userId}/role`, { method: 'POST', body: formData }); @@ -126,7 +126,7 @@ async function deactivateUser(userId) { } try { - const response = await fetch(`/asteroid/api/users/${userId}/deactivate`, { + const response = await fetch(`/api/asteroid/users/${userId}/deactivate`, { method: 'POST' }); @@ -147,7 +147,7 @@ async function deactivateUser(userId) { async function activateUser(userId) { try { - const response = await fetch(`/asteroid/api/users/${userId}/activate`, { + const response = await fetch(`/api/asteroid/users/${userId}/activate`, { method: 'POST' }); @@ -195,7 +195,7 @@ async function createNewUser(event) { formData.append('password', password); formData.append('role', role); - const response = await fetch('/asteroid/api/users/create', { + const response = await fetch('/api/asteroid/users/create', { method: 'POST', body: formData });