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

@@ -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) {

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 = '<div class="error">Error loading tracks</div>';
         }
     } 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();
+        const result = await response.json();
-        console.log('Live stream data:', data); // Debug log
+        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'));

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())

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
         });