From 559893ed6468000ef2891d48061a8b2cef79f89b Mon Sep 17 00:00:00 2001
From: Luis Pereira <luispereira.tkd@gmail.com>
Date: Sun, 2 Nov 2025 22:18:34 +0000
Subject: [PATCH] fix: redirection when navigating between frameset

---
 static/js/front-page.js          | 37 ++++++++++++++++++++++----------
 static/js/player.js              | 14 ++++++++++++
 template/admin.ctml              |  4 ++--
 template/front-page-content.ctml |  1 +
 template/front-page.ctml         |  2 +-
 template/profile.ctml            |  4 ++--
 template/users.ctml              |  2 +-
 7 files changed, 47 insertions(+), 17 deletions(-)

diff --git a/static/js/front-page.js b/static/js/front-page.js
index f21fb68..ff41d5f 100644
--- a/static/js/front-page.js
+++ b/static/js/front-page.js
@@ -79,13 +79,14 @@ window.addEventListener('DOMContentLoaded', function() {
     // Set initial quality display to match the selected stream
     const selector = document.getElementById('stream-quality');
     const streamBaseUrl = document.getElementById('stream-base-url');
-    const config = getStreamConfig(streamBaseUrl.value, selector.value);
-    document.getElementById('stream-url').textContent = config.url;
-    document.getElementById('stream-format').textContent = config.format;
-
-    const statusQuality = document.querySelector('[data-text="stream-quality"]');
-    if (statusQuality) {
-        statusQuality.textContent = config.format;
+    if (streamBaseUrl && selector) {
+        const config = getStreamConfig(streamBaseUrl.value, selector.value);
+        document.getElementById('stream-url').textContent = config.url;
+        document.getElementById('stream-format').textContent = config.format;
+        const statusQuality = document.querySelector('[data-text="stream-quality"]');
+        if (statusQuality) {
+            statusQuality.textContent = config.format;
+        }
     }
     // Update playing information right after load
     updateNowPlaying();
@@ -185,14 +186,28 @@ function disableFramesetMode() {
     window.location.href = '/asteroid/';
 }
 
+function redirectWhenFrame() {
+    const path = window.location.pathname;
+    const isFramesetPage = window.parent !== window.self;
+    const isContentFrame = path.includes('asteroid/content');
+
+    if (isFramesetPage && !isContentFrame) {
+        window.location.href = '/asteroid/content';
+    }
+    if (!isFramesetPage && isContentFrame) {
+        window.location.href = '/asteroid';
+    }
+}
+
 // Check if user prefers frameset mode on page load
 window.addEventListener('DOMContentLoaded', function() {
     const path = window.location.pathname;
-    const isFramesetPage = path.includes('/frameset') || path.includes('/content') || 
-                           path.includes('/audio-player-frame') || path.includes('/player-content');
-    
-    if (localStorage.getItem('useFrameset') === 'true' && !isFramesetPage && path === '/asteroid/') {
+    const isFramesetPage = window.parent !== window.self;
+
+    if (localStorage.getItem('useFrameset') === 'true' && !isFramesetPage && path.includes('/asteroid')) {
         // User wants frameset but is on regular front page, redirect
         window.location.href = '/asteroid/frameset';
     }
+
+    redirectWhenFrame();
 });
diff --git a/static/js/player.js b/static/js/player.js
index dcfcb12..e172720 100644
--- a/static/js/player.js
+++ b/static/js/player.js
@@ -14,6 +14,7 @@ let filteredLibraryTracks = [];
 
 document.addEventListener('DOMContentLoaded', function() {
     audioPlayer = document.getElementById('audio-player');
+    redirectWhenFrame();
     loadTracks();
     loadPlaylists();
     setupEventListeners();
@@ -28,6 +29,19 @@ document.addEventListener('DOMContentLoaded', function() {
     }
 });
 
+function redirectWhenFrame () {
+    const path = window.location.pathname;
+    const isFramesetPage = window.parent !== window.self;
+    const isContentFrame = path.includes('player-content');
+
+    if (isFramesetPage && !isContentFrame) {
+        window.location.href = '/asteroid/player-content';
+    }
+    if (!isFramesetPage && isContentFrame) {
+        window.location.href = '/asteroid/player';
+    }
+}
+
 function setupEventListeners() {
     // Search
     document.getElementById('search-tracks').addEventListener('input', filterTracks);
diff --git a/template/admin.ctml b/template/admin.ctml
index 5310f18..06012f2 100644
--- a/template/admin.ctml
+++ b/template/admin.ctml
@@ -12,8 +12,8 @@
   <div class="container">
     <h1>🎛️ ADMIN DASHBOARD</h1>
     <div class="nav">
-      <a href="/asteroid/content" target="content-frame">Home</a>
-      <a href="/asteroid/player-content" target="content-frame">Player</a>
+      <a href="/asteroid" target="content-frame">Home</a>
+      <a href="/asteroid/player" target="content-frame">Player</a>
       <a href="/asteroid/profile" target="content-frame">Profile</a>
       <a href="/asteroid/admin/users">👥 Users</a>
       <a href="/asteroid/logout" class="btn-logout">Logout</a>
diff --git a/template/front-page-content.ctml b/template/front-page-content.ctml
index f4e8c97..4c5d574 100644
--- a/template/front-page-content.ctml
+++ b/template/front-page-content.ctml
@@ -35,6 +35,7 @@
       <div class="live-stream">
         <h2 style="color: #00ff00;">🟢 LIVE STREAM</h2>
         <p><em>The live stream player is now in the persistent bar at the bottom of the page.</em></p>
+        <input type="hidden" id="stream-base-url" lquery="(val stream-base-url)">
         <p><strong>Stream URL:</strong> <code id="stream-url" lquery="(text default-stream-url)"></code></p>
         <p><strong>Format:</strong> <span id="stream-format" lquery="(text default-stream-encoding-desc)"></span></p>
         <p><strong>Status:</strong> <span id="stream-status" style="color: #00ff00;">● BROADCASTING</span></p>
diff --git a/template/front-page.ctml b/template/front-page.ctml
index dff4977..7dfd2cf 100644
--- a/template/front-page.ctml
+++ b/template/front-page.ctml
@@ -47,7 +47,6 @@
         
         <!-- Stream Quality Selector -->
         <div class="live-stream-quality">
-          <input type="hidden" id="stream-base-url" lquery="(val stream-base-url)">
           <label for="stream-quality" ><strong>Quality:</strong></label>
           <select id="stream-quality" onchange="changeStreamQuality()">
             <option value="aac">AAC 96kbps (Recommended)</option>
@@ -56,6 +55,7 @@
           </select>
         </div>
         
+        <input type="hidden" id="stream-base-url" lquery="(val stream-base-url)">
         <p><strong>Stream URL:</strong> <code id="stream-url" lquery="(text default-stream-url)"></code></p>
         <p><strong>Format:</strong> <span id="stream-format" lquery="(text default-stream-encoding-desc)"></span></p>
         <p><strong>Status:</strong> <span id="stream-status" style="color: #00ff00;">● BROADCASTING</span></p>
diff --git a/template/profile.ctml b/template/profile.ctml
index 2956190..7f8b327 100644
--- a/template/profile.ctml
+++ b/template/profile.ctml
@@ -12,8 +12,8 @@
   <div class="container">
     <h1>👤 USER PROFILE</h1>
     <div class="nav">
-      <a href="/asteroid/content" target="content-frame">Home</a>
-      <a href="/asteroid/player-content" target="content-frame">Player</a>
+      <a href="/asteroid" target="content-frame">Home</a>
+      <a href="/asteroid/player" target="content-frame">Player</a>
       <a href="/asteroid/admin" target="content-frame" data-show-if-admin>Admin</a>
       <a href="/asteroid/logout" class="btn-logout">Logout</a>
     </div>
diff --git a/template/users.ctml b/template/users.ctml
index 58fb45d..a05f81c 100644
--- a/template/users.ctml
+++ b/template/users.ctml
@@ -11,7 +11,7 @@
   <div class="container">
     <h1>👥 USER MANAGEMENT</h1>
     <div class="nav">
-      <a href="/asteroid/content" target="content-frame">Home</a>
+      <a href="/asteroid" target="content-frame">Home</a>
       <a href="/asteroid/admin" target="content-frame">Admin</a>
       <a href="/asteroid/logout" class="btn-logout">Logout</a>
     </div>