![]() 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/-14af89fa/ |
<?php session_start(); ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Global Player Connection Test - SoundStudioPro</title>
<style>
body {
font-family: Arial, sans-serif;
max-width: 1200px;
margin: 50px auto;
padding: 20px;
background: #0a0a0a;
color: white;
}
.container {
background: rgba(255, 255, 255, 0.1);
padding: 30px;
border-radius: 15px;
border: 1px solid rgba(255, 255, 255, 0.2);
}
.test-section {
background: rgba(255, 255, 255, 0.05);
padding: 20px;
border-radius: 8px;
margin: 20px 0;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.play-btn {
width: 60px;
height: 60px;
border-radius: 50%;
background: linear-gradient(135deg, #667eea, #764ba2);
border: none;
color: white;
font-size: 2rem;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
margin: 10px;
}
.play-btn:hover {
transform: scale(1.1);
}
.status {
padding: 10px;
border-radius: 5px;
margin: 10px 0;
font-weight: bold;
}
.status.success {
background: rgba(72, 187, 120, 0.2);
border: 1px solid #48bb78;
color: #48bb78;
}
.status.error {
background: rgba(229, 62, 62, 0.2);
border: 1px solid #e53e3e;
color: #e53e3e;
}
.status.warning {
background: rgba(245, 158, 11, 0.2);
border: 1px solid #f59e0b;
color: #f59e0b;
}
.test-track {
background: rgba(0, 0, 0, 0.3);
padding: 15px;
border-radius: 8px;
margin: 10px 0;
display: flex;
align-items: center;
gap: 15px;
}
.track-info {
flex: 1;
}
.track-title {
font-size: 1.4rem;
font-weight: bold;
margin-bottom: 5px;
}
.track-artist {
font-size: 1.2rem;
color: #a0aec0;
}
.button-group {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.test-btn {
background: #667eea;
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
font-size: 1.2rem;
}
.test-btn:hover {
background: #5a67d8;
}
.test-btn.danger {
background: #e53e3e;
}
.test-btn.danger:hover {
background: #c53030;
}
.test-btn.success {
background: #48bb78;
}
.test-btn.success:hover {
background: #38a169;
}
</style>
</head>
<body>
<div class="container">
<h1>đĩ Global Player Connection Test</h1>
<div class="test-section">
<h2>đ System Status Check</h2>
<div id="systemStatus">Checking system status...</div>
<button class="test-btn" onclick="checkSystemStatus()">đ Refresh Status</button>
</div>
<div class="test-section">
<h2>đĩ Test Tracks (Artist ID 5)</h2>
<div id="testTracks">Loading tracks...</div>
<button class="test-btn" onclick="loadTestTracks()">đ Load Tracks</button>
</div>
<div class="test-section">
<h2>đŽ Global Player Controls</h2>
<div class="button-group">
<button class="play-btn" onclick="testGlobalPlayerPlay()">âļī¸</button>
<button class="play-btn" onclick="testGlobalPlayerPause()">â¸ī¸</button>
<button class="play-btn" onclick="testGlobalPlayerStop()">âšī¸</button>
<button class="play-btn" onclick="testGlobalPlayerNext()">âī¸</button>
</div>
<div class="button-group">
<button class="test-btn" onclick="testGlobalPlayerFunction()">đĩ Test Global Function</button>
<button class="test-btn" onclick="testDirectAudio()">đ Test Direct Audio</button>
<button class="test-btn" onclick="testArtistProfileButton()">đ¤ Test Artist Profile Button</button>
</div>
</div>
<div class="test-section">
<h2>đ Debug Information</h2>
<div id="debugInfo">Click buttons above to see debug info...</div>
<button class="test-btn" onclick="clearDebugInfo()">đī¸ Clear Debug</button>
</div>
<div style="text-align: center; margin-top: 30px;">
<button class="test-btn success" onclick="window.location.href='/artist_profile.php?id=5'">
đ¤ Go to Artist Profile (ID=5)
</button>
</div>
</div>
<script>
let testTracks = [];
function log(message, type = 'info') {
const debugInfo = document.getElementById('debugInfo');
const timestamp = new Date().toLocaleTimeString();
const logEntry = document.createElement('div');
logEntry.style.marginBottom = '10px';
logEntry.style.padding = '10px';
logEntry.style.borderRadius = '5px';
logEntry.style.fontFamily = 'monospace';
logEntry.style.fontSize = '1.2rem';
if (type === 'error') {
logEntry.style.background = 'rgba(229, 62, 62, 0.2)';
logEntry.style.border = '1px solid #e53e3e';
logEntry.style.color = '#e53e3e';
} else if (type === 'success') {
logEntry.style.background = 'rgba(72, 187, 120, 0.2)';
logEntry.style.border = '1px solid #48bb78';
logEntry.style.color = '#48bb78';
} else if (type === 'warning') {
logEntry.style.background = 'rgba(245, 158, 11, 0.2)';
logEntry.style.border = '1px solid #f59e0b';
logEntry.style.color = '#f59e0b';
} else {
logEntry.style.background = 'rgba(255, 255, 255, 0.1)';
logEntry.style.border = '1px solid rgba(255, 255, 255, 0.2)';
logEntry.style.color = 'white';
}
logEntry.textContent = `[${timestamp}] ${message}`;
debugInfo.appendChild(logEntry);
debugInfo.scrollTop = debugInfo.scrollHeight;
console.log(`đĩ ${message}`);
}
function clearDebugInfo() {
document.getElementById('debugInfo').innerHTML = '';
}
async function checkSystemStatus() {
log('đ Checking system status...');
// Check if global player exists
if (typeof window.globalPlayer !== 'undefined') {
log('â
Global player object exists', 'success');
log(`đ Global player initialized: ${window.globalPlayer.initialized}`, 'info');
log(`đĩ Global player playlist length: ${window.globalPlayer.playlist ? window.globalPlayer.playlist.length : 'N/A'}`, 'info');
log(`âļī¸ Global player is playing: ${window.globalPlayer.isPlaying}`, 'info');
} else {
log('â Global player object not found', 'error');
}
// Check if global functions exist
if (typeof window.playTrackWithGlobalPlayer === 'function') {
log('â
playTrackWithGlobalPlayer function exists', 'success');
} else {
log('â playTrackWithGlobalPlayer function not found', 'error');
}
if (typeof window.ensureGlobalPlayer === 'function') {
log('â
ensureGlobalPlayer function exists', 'success');
} else {
log('â ensureGlobalPlayer function not found', 'error');
}
// Check if global player elements exist
const playerElement = document.getElementById('globalMusicPlayer');
const playBtn = document.getElementById('globalPlayBtn');
if (playerElement) {
log('â
Global player HTML element exists', 'success');
} else {
log('â Global player HTML element not found', 'error');
}
if (playBtn) {
log('â
Global play button exists', 'success');
} else {
log('â Global play button not found', 'error');
}
// Check browser audio support
if (typeof Audio !== 'undefined') {
log('â
Browser Audio API supported', 'success');
} else {
log('â Browser Audio API not supported', 'error');
}
// Update status display
const statusDiv = document.getElementById('systemStatus');
if (window.globalPlayer && window.globalPlayer.initialized) {
statusDiv.innerHTML = '<div class="status success">â
System Ready - Global Player Initialized</div>';
} else {
statusDiv.innerHTML = '<div class="status error">â System Not Ready - Global Player Not Initialized</div>';
}
}
async function loadTestTracks() {
log('đĩ Loading test tracks for artist ID 5...');
try {
const response = await fetch('/api/get_community_tracks.php?personal=true');
const data = await response.json();
if (data.success && data.tracks) {
testTracks = data.tracks;
log(`â
Loaded ${testTracks.length} tracks`, 'success');
// Display tracks
const tracksDiv = document.getElementById('testTracks');
tracksDiv.innerHTML = '';
testTracks.forEach((track, index) => {
const trackDiv = document.createElement('div');
trackDiv.className = 'test-track';
trackDiv.innerHTML = `
<div class="track-info">
<div class="track-title">${track.title}</div>
<div class="track-artist">${track.artist_name || 'Unknown Artist'}</div>
</div>
<button class="play-btn" onclick="testTrack(${index})">âļī¸</button>
<button class="test-btn" onclick="testTrackWithGlobalPlayer(${index})">đĩ Global</button>
<button class="test-btn" onclick="testDirectAudio(${index})">đ Direct</button>
`;
tracksDiv.appendChild(trackDiv);
});
} else {
log('â Failed to load tracks: ' + (data.error || 'Unknown error'), 'error');
}
} catch (error) {
log('â Error loading tracks: ' + error.message, 'error');
}
}
function testTrack(index) {
if (!testTracks[index]) {
log('â Track not found at index ' + index, 'error');
return;
}
const track = testTracks[index];
log(`đĩ Testing track ${index}: ${track.title}`);
// Use the same function as artist profile
if (typeof playTrackDirectly === 'function') {
playTrackDirectly(track.audio_url, track.title, track.artist_name || 'Unknown Artist', track.id);
} else {
log('â playTrackDirectly function not found', 'error');
}
}
async function testTrackWithGlobalPlayer(index) {
if (!testTracks[index]) {
log('â Track not found at index ' + index, 'error');
return;
}
const track = testTracks[index];
log(`đĩ Testing global player with track ${index}: ${track.title}`);
if (typeof window.playTrackWithGlobalPlayer === 'function') {
try {
const result = await window.playTrackWithGlobalPlayer(
track.audio_url,
track.title,
track.artist_name || 'Unknown Artist',
track.id
);
log(`â
Global player result: ${result}`, 'success');
} catch (error) {
log('â Global player error: ' + error.message, 'error');
}
} else {
log('â playTrackWithGlobalPlayer function not found', 'error');
}
}
function testDirectAudio(index) {
if (!testTracks[index]) {
log('â Track not found at index ' + index, 'error');
return;
}
const track = testTracks[index];
log(`đ Testing direct audio with track ${index}: ${track.title}`);
try {
const audio = new Audio(track.audio_url);
audio.volume = 0.5;
audio.addEventListener('loadedmetadata', () => {
log('â
Audio metadata loaded', 'success');
audio.play().then(() => {
log('â
Direct audio playing successfully', 'success');
}).catch(error => {
log('â Direct audio play failed: ' + error.message, 'error');
});
});
audio.addEventListener('error', (error) => {
log('â Audio load error: ' + error.message, 'error');
});
} catch (error) {
log('â Audio creation failed: ' + error.message, 'error');
}
}
function testGlobalPlayerPlay() {
log('đĩ Testing global player play button...');
if (window.globalPlayer && typeof window.globalPlayer.togglePlayPause === 'function') {
window.globalPlayer.togglePlayPause();
log('â
Global player play/pause toggled', 'success');
} else {
log('â Global player togglePlayPause function not found', 'error');
}
}
function testGlobalPlayerPause() {
log('â¸ī¸ Testing global player pause...');
if (window.globalPlayer && window.globalPlayer.audio) {
window.globalPlayer.audio.pause();
window.globalPlayer.isPlaying = false;
window.globalPlayer.updatePlayButton();
log('â
Global player paused', 'success');
} else {
log('â Global player audio not available', 'error');
}
}
function testGlobalPlayerStop() {
log('âšī¸ Testing global player stop...');
if (window.globalPlayer && typeof window.globalPlayer.stopTrack === 'function') {
window.globalPlayer.stopTrack();
log('â
Global player stopped', 'success');
} else {
log('â Global player stopTrack function not found', 'error');
}
}
function testGlobalPlayerNext() {
log('âī¸ Testing global player next...');
if (window.globalPlayer && typeof window.globalPlayer.nextTrack === 'function') {
window.globalPlayer.nextTrack();
log('â
Global player next track', 'success');
} else {
log('â Global player nextTrack function not found', 'error');
}
}
function testGlobalPlayerFunction() {
log('đĩ Testing global player function directly...');
if (typeof window.playTrackWithGlobalPlayer === 'function') {
// Test with a sample track
const testUrl = 'https://apiboxfiles.erweima.ai/MTk4YTg3OGYtM2Y4NS00YWJhLWIxMjMtMjk1OWFjOTUwMDFk.mp3';
window.playTrackWithGlobalPlayer(testUrl, 'Test Track', 'Test Artist', 999)
.then(result => {
log(`â
Global player function result: ${result}`, 'success');
})
.catch(error => {
log('â Global player function error: ' + error.message, 'error');
});
} else {
log('â Global player function not available', 'error');
}
}
function testArtistProfileButton() {
log('đ¤ Testing artist profile button functionality...');
// Simulate the exact button from artist profile
const testAudioUrl = 'https://apiboxfiles.erweima.ai/MTk4YTg3OGYtM2Y4NS00YWJhLWIxMjMtMjk1OWFjOTUwMDFk.mp3';
const testTitle = 'Test Track from Artist Profile';
const testArtist = 'Test Artist';
const testId = 999;
if (typeof playTrackDirectly === 'function') {
log('â
playTrackDirectly function found, testing...');
playTrackDirectly(testAudioUrl, testTitle, testArtist, testId);
} else {
log('â playTrackDirectly function not found', 'error');
// Try alternative approach
if (typeof window.playTrackWithGlobalPlayer === 'function') {
log('đ Trying global player function instead...');
window.playTrackWithGlobalPlayer(testAudioUrl, testTitle, testArtist, testId)
.then(result => {
log(`â
Alternative approach result: ${result}`, 'success');
})
.catch(error => {
log('â Alternative approach error: ' + error.message, 'error');
});
} else {
log('â No play functions available', 'error');
}
}
}
// Initialize on page load
document.addEventListener('DOMContentLoaded', () => {
log('đ Page loaded, initializing tests...');
setTimeout(() => {
checkSystemStatus();
loadTestTracks();
}, 1000);
});
</script>
</body>
</html>