Server : Apache/2 System : Linux server-15-235-50-60 5.15.0-164-generic #174-Ubuntu SMP Fri Nov 14 20:25:16 UTC 2025 x86_64 User : gositeme ( 1004) PHP Version : 8.2.29 Disable Function : exec,system,passthru,shell_exec,proc_close,proc_open,dl,popen,show_source,posix_kill,posix_mkfifo,posix_getpwuid,posix_setpgid,posix_setsid,posix_setuid,posix_setgid,posix_seteuid,posix_setegid,posix_uname Directory :  /home/gositeme/.cursor-server/data/User/History/1cb2d31c/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

<?php
session_start();

// Set page variables for header
$page_title = 'AJAX Navigation Test - SoundStudioPro';
$page_description = 'Testing AJAX navigation fixes';
$current_page = 'test';

include 'includes/header.php';
?>

<div class="container" id="pageContainer">
    <div class="main-content">
        <style>
            .test-container {
                max-width: 800px;
                margin: 0 auto;
                padding: 2rem;
                background: rgba(255, 255, 255, 0.05);
                border-radius: 12px;
                margin-top: 2rem;
            }
            
            .test-section {
                margin-bottom: 2rem;
                padding: 1.5rem;
                background: rgba(102, 126, 234, 0.1);
                border-radius: 8px;
                border-left: 4px solid #667eea;
            }
            
            .test-button {
                background: linear-gradient(135deg, #667eea, #764ba2);
                color: white;
                border: none;
                padding: 1rem 2rem;
                border-radius: 8px;
                cursor: pointer;
                margin: 0.5rem;
                font-size: 1.4rem;
                transition: all 0.3s ease;
            }
            
            .test-button:hover {
                transform: translateY(-2px);
                box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3);
            }
            
            .status {
                padding: 1rem;
                border-radius: 8px;
                margin: 1rem 0;
                font-family: monospace;
                font-size: 1.2rem;
            }
            
            .status.success {
                background: rgba(81, 207, 102, 0.2);
                border: 1px solid #51cf66;
                color: #51cf66;
            }
            
            .status.error {
                background: rgba(255, 107, 107, 0.2);
                border: 1px solid #ff6b6b;
                color: #ff6b6b;
            }
            
            .status.info {
                background: rgba(102, 126, 234, 0.2);
                border: 1px solid #667eea;
                color: #667eea;
            }
            
            .log {
                background: #1a1a1a;
                border: 1px solid #333;
                border-radius: 8px;
                padding: 1rem;
                font-family: monospace;
                font-size: 1.2rem;
                color: #00ff00;
                max-height: 300px;
                overflow-y: auto;
                white-space: pre-wrap;
            }
            
            .nav-test {
                display: flex;
                flex-wrap: wrap;
                gap: 1rem;
                margin: 1rem 0;
            }
            
            .nav-test a {
                background: linear-gradient(135deg, #667eea, #764ba2);
                color: white;
                text-decoration: none;
                padding: 1rem 2rem;
                border-radius: 8px;
                transition: all 0.3s ease;
                display: inline-block;
            }
            
            .nav-test a:hover {
                transform: translateY(-2px);
                box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3);
            }
        </style>

        <div class="test-container">
            <div class="test-section">
                <h1>🎯 AJAX Navigation Fix Test</h1>
                <p>This page tests the AJAX navigation fixes to ensure they're working properly.</p>
            </div>

            <div class="test-section">
                <h2>🔧 System Status</h2>
                <div id="systemStatus" class="status info">Checking system status...</div>
                <button class="test-button" onclick="checkSystemStatus()">Check Status</button>
            </div>

            <div class="test-section">
                <h2>🧭 Navigation Tests</h2>
                <p>Test navigation to different pages (should work with AJAX):</p>
                
                <div class="nav-test">
                    <a href="/" class="ajax-nav" data-page="home">🏠 Home</a>
                    <a href="/feed.php" class="ajax-nav" data-page="feed">📰 Feed</a>
                    <a href="/artists.php" class="ajax-nav" data-page="artists">👥 Artists</a>
                    <a href="/community.php" class="ajax-nav" data-page="community">🌍 Community</a>
                    <a href="/dashboard.php" class="ajax-nav" data-page="dashboard">📊 Dashboard</a>
                    <a href="/library_new.php" class="ajax-nav" data-page="library">📚 Library</a>
                </div>
                
                <p>Test regular navigation (should work normally):</p>
                <div class="nav-test">
                    <a href="/" target="_blank">🏠 Home (New Tab)</a>
                    <a href="/feed.php" target="_blank">📰 Feed (New Tab)</a>
                    <a href="/artists.php" target="_blank">👥 Artists (New Tab)</a>
                </div>
            </div>

            <div class="test-section">
                <h2>🎵 Global Player Test</h2>
                <p>Test global player functionality:</p>
                
                <button class="test-button" onclick="testGlobalPlayer()">Test Global Player</button>
                <button class="test-button" onclick="testPlayButton()">Test Play Button</button>
                <button class="test-button" onclick="testVolumeSlider()">Test Volume Slider</button>
                <button class="test-button" onclick="testPlaylistButton()">Test Playlist Button</button>
            </div>

            <div class="test-section">
                <h2>📝 Console Logs</h2>
                <button class="test-button" onclick="clearLogs()">Clear Logs</button>
                <div id="consoleLogs" class="log"></div>
            </div>
        </div>
    </div>
</div>

<script>
    // Override console.log to capture logs
    const originalLog = console.log;
    const originalError = console.error;
    const logContainer = document.getElementById('consoleLogs');
    
    function addLog(message, type = 'log') {
        const timestamp = new Date().toLocaleTimeString();
        const logEntry = `[${timestamp}] ${type.toUpperCase()}: ${message}\n`;
        logContainer.textContent += logEntry;
        logContainer.scrollTop = logContainer.scrollHeight;
    }
    
    console.log = function(...args) {
        originalLog.apply(console, args);
        addLog(args.join(' '), 'log');
    };
    
    console.error = function(...args) {
        originalError.apply(console, args);
        addLog(args.join(' '), 'error');
    };
    
    function checkSystemStatus() {
        const statusDiv = document.getElementById('systemStatus');
        let status = '';
        
        // Check if AJAX navigation exists
        if (typeof window.ajaxNavigation === 'undefined') {
            status += '<div style="color: #ff6b6b;">❌ AJAX navigation not found</div>';
        } else {
            status += '<div style="color: #51cf66;">✅ AJAX navigation found</div>';
            status += `<div>🎯 Current page: ${window.ajaxNavigation.currentPage}</div>`;
            status += `<div>🎯 Loading: ${window.ajaxNavigation.loading}</div>`;
            status += `<div>🎯 Initialized: ${window.ajaxNavigation.initialized}</div>`;
        }
        
        // Check for navigation elements
        const ajaxLinks = document.querySelectorAll('.ajax-nav');
        status += `<div>🎯 Found ${ajaxLinks.length} AJAX navigation links</div>`;
        
        ajaxLinks.forEach((link, index) => {
            const href = link.getAttribute('href');
            const dataPage = link.getAttribute('data-page');
            status += `<div>🎯 Link ${index + 1}: ${href} (${dataPage})</div>`;
        });
        
        // Check global player
        if (typeof window.globalPlayer === 'undefined') {
            status += '<div style="color: #ff6b6b;">❌ Global player not found</div>';
        } else {
            status += '<div style="color: #51cf66;">✅ Global player found</div>';
            status += `<div>🎵 Initialized: ${window.globalPlayer.initialized}</div>`;
            status += `<div>🎵 Is playing: ${window.globalPlayer.isPlaying}</div>`;
        }
        
        statusDiv.innerHTML = status;
    }
    
    function testGlobalPlayer() {
        console.log('🎵 Testing global player...');
        
        if (typeof window.globalPlayer !== 'undefined') {
            console.log('✅ Global player is available');
            window.globalPlayer.showPlayer();
        } else {
            console.error('❌ Global player not available');
        }
    }
    
    function testPlayButton() {
        console.log('▶️ Testing play button...');
        
        const playBtn = document.getElementById('globalPlayBtn');
        if (playBtn) {
            console.log('✅ Play button found, clicking...');
            playBtn.click();
        } else {
            console.error('❌ Play button not found');
        }
    }
    
    function testVolumeSlider() {
        console.log('🔊 Testing volume slider...');
        
        const volumeSlider = document.getElementById('globalVolumeSlider');
        if (volumeSlider) {
            console.log('✅ Volume slider found');
            volumeSlider.value = 75;
            volumeSlider.dispatchEvent(new Event('input'));
        } else {
            console.error('❌ Volume slider not found');
        }
    }
    
    function testPlaylistButton() {
        console.log('📋 Testing playlist button...');
        
        const playlistBtn = document.getElementById('globalPlaylistToggle');
        if (playlistBtn) {
            console.log('✅ Playlist button found, clicking...');
            playlistBtn.click();
        } else {
            console.error('❌ Playlist button not found');
        }
    }
    
    function clearLogs() {
        document.getElementById('consoleLogs').textContent = '';
    }
    
    // Monitor AJAX navigation events
    document.addEventListener('click', (e) => {
        if (e.target.closest('.ajax-nav')) {
            console.log('🎯 AJAX nav link clicked:', e.target.closest('.ajax-nav').href);
        }
    });
    
    // Auto-check status when page loads
    document.addEventListener('DOMContentLoaded', () => {
        console.log('🧪 Test page loaded');
        setTimeout(checkSystemStatus, 1000);
    });
</script>

<?php include 'includes/footer.php'; ?>