const config = window.SeasonalsPluginConfig?.Space || {};

const space = config.EnableSpace !== undefined ? config.EnableSpace : true;
const symbolCount = config.SymbolCount || 25;
const useRandomSymbols = config.EnableRandomSymbols !== undefined ? config.EnableRandomSymbols : true;
const enableRandomMobile = config.EnableRandomSymbolsMobile !== undefined ? config.EnableRandomSymbolsMobile : false;
const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? config.EnableDifferentDuration : true;

const spaceImages = [
    "../Seasonals/Resources/space_assets/astronaut_1.gif",
    "../Seasonals/Resources/space_assets/planet_1.png",
    "../Seasonals/Resources/space_assets/planet_2.png",
    "../Seasonals/Resources/space_assets/planet_3.png",
    "../Seasonals/Resources/space_assets/planet_4.png",
    "../Seasonals/Resources/space_assets/planet_5.png",
    "../Seasonals/Resources/space_assets/planet_6.png",
    "../Seasonals/Resources/space_assets/planet_7.png",
    "../Seasonals/Resources/space_assets/planet_8.png",
    "../Seasonals/Resources/space_assets/planet_9.png",
    "../Seasonals/Resources/space_assets/rocket.gif",
    "../Seasonals/Resources/space_assets/Satellite_1.gif",
    "../Seasonals/Resources/space_assets/Satellite_2.gif",
    "../Seasonals/Resources/space_assets/space-shuttle.png",
    "../Seasonals/Resources/space_assets/iss.png"
];

let msgPrinted = false;

function toggleSpace() {
  const container = document.querySelector('.space-container');
  if (!container) return;

  const videoPlayer = document.querySelector('.videoPlayerContainer');
  const trailerPlayer = document.querySelector('.youtubePlayerContainer');
  const isDashboard = document.body.classList.contains('dashboardDocument');
  const hasUserMenu = document.querySelector('#app-user-menu');

  if (videoPlayer || trailerPlayer || isDashboard || hasUserMenu) {
    container.style.display = 'none';
    if (!msgPrinted) {
      console.log('Space hidden');
      msgPrinted = true;
    }
  } else {
    container.style.display = 'block';
    if (msgPrinted) {
      console.log('Space visible');
      msgPrinted = false;
    }
  }
}

const observer = new MutationObserver(toggleSpace);
observer.observe(document.body, {
  childList: true,
  subtree: true,
  attributes: true
});

function createSpace() {
    const container = document.querySelector('.space-container') || document.createElement('div');

    if (!document.querySelector('.space-container')) {
        container.className = 'space-container';
        container.setAttribute("aria-hidden", "true");
        document.body.appendChild(container);
    }

    const standardCount = 15;
    const totalSymbols = symbolCount + standardCount;
    
    let isMobile = window.matchMedia("only screen and (max-width: 768px)").matches;
    let finalCount = totalSymbols;

    if (isMobile) {
        finalCount = enableRandomMobile ? totalSymbols : standardCount;
    }

    // Add Nebula Glow
    const bgGlow = document.createElement('div');
    bgGlow.className = 'space-bg-glow';
    container.appendChild(bgGlow);

    // Add CSS Starfield
    const starfield = document.createElement('div');
    starfield.className = 'space-starfield';
    let boxShadows1 = [];
    let boxShadows2 = [];
    let boxShadows3 = [];
    
    // Generate random stars for parallax starfield using CSS % / vw sizes for responsiveness
    for (let i = 0; i < 150; i++) {
        boxShadows1.push(`${(Math.random() * 100).toFixed(2)}vw ${(Math.random() * 100).toFixed(2)}vh #FFF`);
        if (i < 50) boxShadows2.push(`${(Math.random() * 100).toFixed(2)}vw ${(Math.random() * 100).toFixed(2)}vh #FFF`);
        if (i < 20) boxShadows3.push(`${(Math.random() * 100).toFixed(2)}vw ${(Math.random() * 100).toFixed(2)}vh #FFF`);
    }

    const starLayer1 = document.createElement('div');
    starLayer1.style.width = '1px'; starLayer1.style.height = '1px';
    starLayer1.style.background = 'transparent';
    starLayer1.style.boxShadow = boxShadows1.join(", ");
    starLayer1.style.animation = 'space-slow-spin 200s linear infinite';
    starfield.appendChild(starLayer1);

    const starLayer2 = document.createElement('div');
    starLayer2.style.width = '2px'; starLayer2.style.height = '2px';
    starLayer2.style.background = 'transparent';
    starLayer2.style.boxShadow = boxShadows2.join(", ");
    starLayer2.style.animation = 'space-slow-spin 150s linear infinite reverse';
    starfield.appendChild(starLayer2);

    const starLayer3 = document.createElement('div');
    starLayer3.style.width = '3px'; starLayer3.style.height = '3px';
    starLayer3.style.background = 'transparent';
    starLayer3.style.boxShadow = boxShadows3.join(", ");
    starLayer3.style.animation = 'space-slow-spin 100s linear infinite';
    starfield.appendChild(starLayer3);
    
    container.appendChild(starfield);

    // Shooting stars
    const shootingStarCount = isMobile ? 1 : 2; // Less frequent
    for (let i = 0; i < shootingStarCount; i++) {
        const streak = document.createElement('div');
        streak.className = 'space-shooting-star';
        // Pick a random tail direction and fall direction to match
        const isFromLeft = Math.random() > 0.5;
        const rotateAngle = isFromLeft ? 45 : -45;
        
        streak.style.transform = `rotate(${rotateAngle}deg)`;
        streak.style.transformOrigin = isFromLeft ? 'left center' : 'right center';
        
        const topStart = Math.random() * 50; 
        streak.style.setProperty('--shoot-start-x', isFromLeft ? '-20vw' : '120vw');
        streak.style.setProperty('--shoot-end-x', isFromLeft ? '120vw' : '-20vw');
        streak.style.setProperty('--shoot-start-y', `${topStart}vh`);
        streak.style.setProperty('--shoot-end-y', `${topStart + 140}vh`); // 140vh drop to cross screen diagonally
        
        streak.style.animationDelay = `${Math.random() * 20}s`; // Less frequent
        streak.style.animationDuration = `${Math.random() * 2 + 3}s`; // 3-5s
        container.appendChild(streak);
    }

    const useRandomDuration = enableDifferentDuration !== false;

    for (let i = 0; i < finalCount; i++) {
        let symbol = document.createElement('div');
        
        const randomImage = spaceImages[Math.floor(Math.random() * spaceImages.length)];
        symbol.className = `space-symbol`;

        let img = document.createElement('img');
        img.src = randomImage;
        img.onerror = function() {
            this.style.display = 'none';
        }; // removed emoji fallback
        symbol.appendChild(img);

        const topPos = Math.random() * 90; // 0 to 90vh
        const delaySeconds = Math.random() * 10;
        
        // Zero gravity sizes / speeds
        const depth = Math.random(); 
        const distanceScale = 0.3 + (depth * 0.7); // 0.3 to 1.0 (decently small)
        const blurAmount = depth < 0.3 ? (1 - depth) * 2 : 0; 
        
        symbol.style.filter = `blur(${blurAmount}px)`;
        symbol.style.zIndex = Math.floor(depth * 30) + 20;

        let durationSeconds = 30; // Very slow
        if (useRandomDuration) {
            durationSeconds = (1 - depth) * 40 + 30 + Math.random() * 10 - 5; 
        }

        // Randomly pick direction: left-to-right OR right-to-left
        const goRight = Math.random() > 0.5;
        const baseTransformScale = goRight ? 'scaleX(-1)' : 'scaleX(1)';
        
        if (goRight) {
            symbol.style.animationName = 'space-drift-right';
            symbol.style.left = '-15vw';
        } else {
            symbol.style.animationName = 'space-drift-left';
            symbol.style.right = '-15vw';
        }

        symbol.style.top = `${topPos}vh`;
        symbol.style.animationDuration = `${durationSeconds}s`;
        symbol.style.animationDelay = `${delaySeconds}s`;
        
        // Slow rotation inside inner div
        const rotationDiv = document.createElement('div');
        const rotDur = Math.random() * 20 + 20; // 20-40s spin
        const spinReverse = Math.random() > 0.5 ? 'reverse' : 'normal';
        rotationDiv.style.animation = `space-slow-spin ${rotDur}s linear infinite ${spinReverse}`;
        
        rotationDiv.appendChild(symbol.cloneNode(true));
        
        // Apply final static scaling and facing to inner image
        rotationDiv.firstChild.style.transform = `scale(${distanceScale}) ${baseTransformScale}`;
        
        symbol.innerHTML = '';
        symbol.appendChild(rotationDiv);

        container.appendChild(symbol);
    }
}

function initializeSpace() {
  if (!space) return;
  createSpace();
  toggleSpace();
}

initializeSpace();