add more debug info for aplayer

add more debug info for aplayer
This commit is contained in:
Sora 2026-01-19 15:20:33 +08:00
parent 20e7500fb8
commit e251421fb8
2 changed files with 65 additions and 24 deletions

View File

@ -9,8 +9,17 @@
function initAPlayer() { function initAPlayer() {
console.log('APlayer initialization started'); console.log('APlayer initialization started');
// Check if APlayer is loaded
if (typeof APlayer === 'undefined') { if (typeof APlayer === 'undefined') {
console.error('APlayer library not loaded'); console.error('APlayer library not loaded - checking if script loaded');
// Try to load APlayer if not available
const aplayerScript = document.querySelector('script[src*="APlayer.min.js"]');
if (!aplayerScript) {
console.error('APlayer script tag not found in DOM');
} else {
console.log('APlayer script tag found:', aplayerScript.src);
}
return; return;
} }
console.log('APlayer library loaded'); console.log('APlayer library loaded');
@ -63,9 +72,12 @@
return; return;
} }
console.log('APlayer container found:', container); console.log('APlayer container found:', container);
console.log('Container dimensions:', container.offsetWidth, 'x', container.offsetHeight);
console.log('Container styles:', window.getComputedStyle(container));
console.log('Creating APlayer with playlist:', playlist); console.log('Creating APlayer with playlist:', playlist);
try {
const ap = new APlayer({ const ap = new APlayer({
container: container, container: container,
lrcType: 0, lrcType: 0,
@ -85,6 +97,24 @@
// Log initialization // Log initialization
console.log('APlayer initialized with', playlist.length, 'tracks'); console.log('APlayer initialized with', playlist.length, 'tracks');
console.log('APlayer instance:', ap);
// Check if APlayer created DOM elements
setTimeout(() => {
const aplayerElements = container.querySelectorAll('*');
console.log('APlayer created', aplayerElements.length, 'child elements');
if (aplayerElements.length === 0) {
console.error('APlayer did not create any child elements - initialization failed');
} else {
console.log('APlayer child elements:', aplayerElements);
}
}, 100);
} catch (error) {
console.error('APlayer initialization failed:', error);
return;
}
// Optional: Add event listeners // Optional: Add event listeners
ap.on('play', function() { ap.on('play', function() {

View File

@ -37,8 +37,8 @@
} }
.header { .header {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
color: white; color: #333;
padding: 30px; padding: 30px;
text-align: center; text-align: center;
} }
@ -56,16 +56,27 @@
.player-wrapper { .player-wrapper {
padding: 20px; padding: 20px;
min-height: 300px; min-height: 400px;
display: flex;
align-items: center;
justify-content: center;
background: #f9f9f9;
border-radius: 8px;
margin: 20px 0;
} }
#aplayer { #aplayer {
margin: 0; margin: 0;
width: 100% !important; width: 100% !important;
height: auto !important; height: 300px !important;
min-height: 200px !important; min-height: 300px !important;
visibility: visible !important; visibility: visible !important;
display: block !important; display: block !important;
opacity: 1 !important;
z-index: 10 !important;
background: white;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
} }
.footer { .footer {