Skip to content

Commit deb5b52

Browse files
ManuelBehrendtManuelBehrendt
committed
update ee
1 parent 30e33e2 commit deb5b52

File tree

1 file changed

+62
-195
lines changed

1 file changed

+62
-195
lines changed

‎docs/src/assets/music_player.js‎

Lines changed: 62 additions & 195 deletions
Original file line numberDiff line numberDiff line change
@@ -5,31 +5,6 @@
55
(function() {
66
'use strict';
77

8-
console.log('🎵 MUSIC PLAYER SCRIPT STARTING - Loading enhanced music player...');
9-
10-
// Immediate visibility test - create a simple test element
11-
const testElement = document.createElement('div');
12-
testElement.id = 'mera-music-test';
13-
testElement.style.cssText = `
14-
position: fixed;
15-
top: 10px;
16-
right: 10px;
17-
background: red;
18-
color: white;
19-
padding: 5px;
20-
z-index: 999999;
21-
font-size: 12px;
22-
`;
23-
testElement.textContent = '🎵 MUSIC SCRIPT LOADED';
24-
document.body.appendChild(testElement);
25-
26-
// Remove test element after 3 seconds
27-
setTimeout(() => {
28-
if (testElement.parentNode) {
29-
testElement.parentNode.removeChild(testElement);
30-
}
31-
}, 3000);
32-
338
// Track script execution count to detect reloads
349
if (typeof window.meraScriptCounter === 'undefined') {
3510
window.meraScriptCounter = 0;
@@ -685,46 +660,11 @@
685660
});
686661
}
687662
688-
// GoatCounter tracking helper for popup events
689-
trackPopupEvent(action, trackName = '') {
690-
try {
691-
// Check GoatCounter in popup window or parent window
692-
const gc = window.goatcounter || (window.opener && window.opener.goatcounter);
693-
const hostname = window.location.hostname || (window.opener && window.opener.location.hostname);
694-
695-
// Only track if GoatCounter is available and on production
696-
if (gc && gc.count && hostname === 'manuelbehrendt.github.io') {
697-
const path = `music-popup-${action}`;
698-
const title = trackName ? `Music Popup: ${action} - ${trackName}` : `Music Popup: ${action}`;
699-
700-
gc.count({
701-
path: path,
702-
title: title,
703-
event: true
704-
});
705-
706-
console.log(`📊 Tracked popup event: ${action}${trackName ? ` - ${trackName}` : ''}`);
707-
}
708-
} catch (error) {
709-
// Silently handle any tracking errors - don't break the music player
710-
console.debug('🎵 Analytics tracking error (non-critical):', error);
711-
}
712-
}
713-
714663
initialize(state, musicLibrary) {
715664
console.log('🎵 Initializing popup with state:', state);
716665
this.musicLibrary = musicLibrary;
717666
this.volume = state.volume || 0.15;
718667
719-
// Track popup opening (non-blocking, only if window is stable)
720-
setTimeout(() => {
721-
try {
722-
this.trackPopupEvent('opened');
723-
} catch (e) {
724-
// Silently handle tracking errors
725-
}
726-
}, 1000);
727-
728668
// Update volume UI
729669
document.getElementById('popup-volume').value = Math.round(this.volume * 100);
730670
document.getElementById('popup-volume-display').textContent = Math.round(this.volume * 100) + '%';
@@ -847,9 +787,6 @@
847787
console.log(\`🎵 Successfully started playing: \${track.name}\`);
848788
this.updateStatus(\`🎵 Playing: \${track.name}\`);
849789
this.updateTrackHighlight(track.name);
850-
851-
// Track specific track play
852-
this.trackPopupEvent('track-played', track.name);
853790
}).catch(error => {
854791
console.error(\`🎵 Failed to play track: \${track.name}\`, error);
855792
this.updateStatus(\`❌ Failed to play: \${track.name}\`);
@@ -879,10 +816,6 @@
879816
const randomIndex = Math.floor(Math.random() * this.musicLibrary.length);
880817
console.log(\`🎵 Selected random index: \${randomIndex}\`);
881818
this.updateStatus('🔀 Selecting random track...');
882-
883-
// Track random play action
884-
this.trackPopupEvent('random-played');
885-
886819
this.playTrack(randomIndex);
887820
} else {
888821
console.error('🎵 Music library is empty!');
@@ -898,10 +831,8 @@
898831
899832
if (this.isPlaying) {
900833
this.audio.pause();
901-
this.trackPopupEvent('paused');
902834
} else {
903835
this.audio.play();
904-
this.trackPopupEvent('resumed');
905836
}
906837
}
907838
@@ -941,9 +872,6 @@
941872
}
942873
943874
returnToMain() {
944-
// Track popup closing
945-
this.trackPopupEvent('closed');
946-
947875
const transferState = {
948876
track: this.currentTrack,
949877
isPlaying: this.isPlaying,
@@ -1007,13 +935,9 @@
1007935

1008936
// Create the enhanced persistent top bar
1009937
function createTopBar() {
1010-
try {
1011-
console.log('🎵 createTopBar() called');
1012-
if (document.getElementById('mera-top-bar')) {
1013-
console.log('🎵 Top bar already exists, skipping creation');
1014-
return;
1015-
}
1016-
console.log('🎵 Creating new top bar...');
938+
if (document.getElementById('mera-top-bar')) {
939+
return;
940+
}
1017941

1018942
const topBar = document.createElement('div');
1019943
topBar.id = 'mera-top-bar';
@@ -1093,23 +1017,7 @@
10931017
setupEventListeners();
10941018
updateUI();
10951019

1096-
console.log('🎵 Enhanced persistent music player top bar created successfully');
1097-
} catch (error) {
1098-
console.error('🎵 Failed to create top bar:', error);
1099-
// Try creating a minimal fallback bar
1100-
try {
1101-
console.log('🎵 Attempting minimal fallback top bar...');
1102-
const fallbackBar = document.createElement('div');
1103-
fallbackBar.id = 'mera-top-bar';
1104-
fallbackBar.style.cssText = 'position: fixed; top: 0; left: 0; right: 0; height: 40px; background: #666; color: white; display: flex; align-items: center; padding: 0 20px; z-index: 999999;';
1105-
fallbackBar.innerHTML = '<span>🎵 MERA Music (Minimal)</span>';
1106-
document.body.insertBefore(fallbackBar, document.body.firstChild);
1107-
document.body.style.paddingTop = '45px';
1108-
console.log('🎵 Minimal fallback top bar created');
1109-
} catch (fallbackError) {
1110-
console.error('🎵 Even minimal fallback failed:', fallbackError);
1111-
}
1112-
}
1020+
console.log('🎵 Enhanced persistent music player top bar created');
11131021
}
11141022

11151023
// Enhanced event listeners with popup support
@@ -1184,124 +1092,83 @@
11841092

11851093
// Enhanced initialization with popup support
11861094
async function initialize() {
1187-
try {
1188-
console.log('🎵 Starting main music player initialization...');
1189-
createTopBar();
1190-
console.log('🎵 Top bar created successfully');
1191-
1192-
// Try to restore previous audio state
1193-
const sys = window.meraEnhancedAudioSystem;
1194-
const savedState = localStorage.getItem('mera-was-playing');
1195-
const savedTrack = localStorage.getItem('mera-current-track');
1196-
const savedTime = parseFloat(localStorage.getItem('mera-audio-time') || '0');
1095+
createTopBar();
1096+
1097+
// Try to restore previous audio state
1098+
const sys = window.meraEnhancedAudioSystem;
1099+
const savedState = localStorage.getItem('mera-was-playing');
1100+
const savedTrack = localStorage.getItem('mera-current-track');
1101+
const savedTime = parseFloat(localStorage.getItem('mera-audio-time') || '0');
1102+
1103+
if (savedState === 'true' && savedTrack) {
1104+
console.log(`🎵 Enhanced player - attempting to restore: ${savedTrack} at ${savedTime}s`);
1105+
const path = getMusicPath(savedTrack);
1106+
sys.audio.src = path;
1107+
sys.currentTrack = savedTrack;
1108+
sys.audio.currentTime = Math.max(0, savedTime - 1);
11971109

1198-
if (savedState === 'true' && savedTrack) {
1199-
console.log(`🎵 Enhanced player - attempting to restore: ${savedTrack} at ${savedTime}s`);
1200-
const path = getMusicPath(savedTrack);
1201-
sys.audio.src = path;
1202-
sys.currentTrack = savedTrack;
1203-
sys.audio.currentTime = Math.max(0, savedTime - 1);
1110+
// Don't auto-play, just prepare for resume
1111+
sys.isPlaying = false;
1112+
}
1113+
1114+
updateUI();
1115+
1116+
// Monitor for navigation and recreate if needed
1117+
let currentUrl = window.location.href;
1118+
1119+
const checkForNavigation = async () => {
1120+
const newUrl = window.location.href;
1121+
if (newUrl !== currentUrl) {
1122+
currentUrl = newUrl;
1123+
console.log(`🎵 Enhanced player navigation: ${newUrl}`);
12041124

1205-
// Don't auto-play, just prepare for resume
1206-
sys.isPlaying = false;
1125+
setTimeout(() => {
1126+
if (!document.getElementById('mera-top-bar')) {
1127+
console.log('🎵 Recreating enhanced player UI...');
1128+
createTopBar();
1129+
}
1130+
updateUI();
1131+
}, 50);
12071132
}
1208-
1209-
updateUI();
1210-
1211-
// Monitor for navigation and recreate if needed
1212-
let currentUrl = window.location.href;
1213-
1214-
const checkForNavigation = async () => {
1215-
const newUrl = window.location.href;
1216-
if (newUrl !== currentUrl) {
1217-
currentUrl = newUrl;
1218-
console.log(`🎵 Enhanced player navigation: ${newUrl}`);
1219-
1133+
};
1134+
1135+
setInterval(checkForNavigation, 500);
1136+
window.addEventListener('popstate', checkForNavigation);
1137+
window.addEventListener('hashchange', checkForNavigation);
1138+
1139+
// DOM observer for recreation
1140+
if ('MutationObserver' in window) {
1141+
const observer = new MutationObserver(() => {
1142+
if (!document.getElementById('mera-top-bar')) {
12201143
setTimeout(() => {
12211144
if (!document.getElementById('mera-top-bar')) {
1222-
console.log('🎵 Recreating enhanced player UI...');
12231145
createTopBar();
12241146
}
1225-
updateUI();
12261147
}, 50);
12271148
}
1228-
};
1229-
1230-
setInterval(checkForNavigation, 500);
1231-
window.addEventListener('popstate', checkForNavigation);
1232-
window.addEventListener('hashchange', checkForNavigation);
1233-
1234-
// DOM observer for recreation
1235-
if ('MutationObserver' in window) {
1236-
const observer = new MutationObserver(() => {
1237-
if (!document.getElementById('mera-top-bar')) {
1238-
setTimeout(() => {
1239-
if (!document.getElementById('mera-top-bar')) {
1240-
createTopBar();
1241-
}
1242-
}, 50);
1243-
}
1244-
});
1245-
1246-
observer.observe(document.body, { childList: true, subtree: true });
1247-
}
1149+
});
12481150

1249-
// Periodic state saving
1250-
setInterval(() => {
1251-
if (sys.isPlaying && sys.activePlayer === 'topbar' && !sys.audio.paused) {
1252-
localStorage.setItem('mera-was-playing', 'true');
1253-
localStorage.setItem('mera-current-track', sys.currentTrack);
1254-
localStorage.setItem('mera-audio-time', sys.audio.currentTime.toString());
1255-
}
1256-
}, 2000);
1151+
observer.observe(document.body, { childList: true, subtree: true });
1152+
}
12571153

1258-
console.log('🎵 Main music player initialization completed successfully');
1259-
} catch (error) {
1260-
console.error('🎵 Music player initialization failed:', error);
1261-
// Try to create just the basic top bar without advanced features
1262-
try {
1263-
if (!document.getElementById('mera-top-bar')) {
1264-
createTopBar();
1265-
}
1266-
} catch (fallbackError) {
1267-
console.error('🎵 Even fallback music player creation failed:', fallbackError);
1154+
// Periodic state saving
1155+
setInterval(() => {
1156+
if (sys.isPlaying && sys.activePlayer === 'topbar' && !sys.audio.paused) {
1157+
localStorage.setItem('mera-was-playing', 'true');
1158+
localStorage.setItem('mera-current-track', sys.currentTrack);
1159+
localStorage.setItem('mera-audio-time', sys.audio.currentTime.toString());
12681160
}
1269-
}
1161+
}, 2000);
12701162
}
12711163

12721164
// Make path calculation globally available
12731165
window.meraGetMusicPath = getMusicPath;
12741166

1275-
// Initialize - try multiple approaches
1276-
console.log('🎵 Setting up initialization...');
1277-
console.log('🎵 Document ready state:', document.readyState);
1278-
1279-
function initializeNow() {
1280-
console.log('🎵 initializeNow() called');
1281-
initialize();
1282-
}
1283-
1167+
// Initialize
12841168
if (document.readyState === 'loading') {
1285-
console.log('🎵 Document still loading, waiting for DOMContentLoaded');
1286-
document.addEventListener('DOMContentLoaded', initializeNow);
1169+
document.addEventListener('DOMContentLoaded', initialize);
12871170
} else {
1288-
console.log('🎵 Document ready, initializing immediately');
1289-
initializeNow();
1171+
initialize();
12901172
}
12911173

1292-
// Fallback initialization after a delay
1293-
setTimeout(() => {
1294-
console.log('🎵 Fallback check - looking for top bar');
1295-
if (!document.getElementById('mera-top-bar')) {
1296-
console.log('🎵 No top bar found, running fallback initialization');
1297-
try {
1298-
initializeNow();
1299-
} catch (e) {
1300-
console.error('🎵 Fallback initialization failed:', e);
1301-
}
1302-
} else {
1303-
console.log('🎵 Top bar already exists');
1304-
}
1305-
}, 2000);
1306-
13071174
})();

0 commit comments

Comments
 (0)