blog/public/js/random.js

/**
 * Static Random Pic API
 * Generated by build script
 */
(function() {
    var counts = {"h":979,"v":3596};
    var domain = 'https://pic.acofork.com';
    
    // State management for session consistency
    var sessionRandomH = null;
    var sessionRandomV = null;

    // Helper: Get random URL for a type (h or v), persistent per session
    function getRandomUrl(type) {
        if (!counts[type] || counts[type] === 0) return '';
        
        // Return existing session URL if available
        if (type === 'h' && sessionRandomH) return sessionRandomH;
        if (type === 'v' && sessionRandomV) return sessionRandomV;

        // Generate new if not exists
        var num = Math.floor(Math.random() * counts[type]) + 1;
        var url = domain + '/ri/' + type + '/' + num + '.webp';

        // Save to session state
        if (type === 'h') sessionRandomH = url;
        if (type === 'v') sessionRandomV = url;

        return url;
    }

    // Expose global functions
    window.getRandomPicH = function() { return getRandomUrl('h'); };
    window.getRandomPicV = function() { return getRandomUrl('v'); };

    // 1. Logic for Background (Customized based on user request)
    function setRandomBackground() { 
         // Get random URL using the helper (Dynamic count & domain)
         const bgUrl = getRandomUrl('h');
          
         // Find the background box element 
         const bgBox = document.getElementById('bg-box'); 
          
         if (bgBox) { 
             // Preload image 
             const img = new Image(); 
             img.onload = function() { 
                 bgBox.style.backgroundImage = `url('${bgUrl}')`; 
                 bgBox.classList.add('loaded'); 
                 console.log('Random background loaded:', bgUrl); 
                  
                 // Set CSS variables for transparency effects 
                 document.documentElement.style.setProperty('--card-bg', 'var(--card-bg-transparent)'); 
                 document.documentElement.style.setProperty('--float-panel-bg', 'var(--float-panel-bg-transparent)'); 
             }; 
             img.onerror = function() { 
                 console.error('Failed to load background image:', bgUrl); 
             }; 
             img.src = bgUrl; 
         } else { 
             // Fallback: If no #bg-box, check for data-random-bg for backward compatibility/other elements
             // This keeps the generic functionality available if needed, but prioritizes the user's specific logic above.
             initGenericBackgrounds();
         } 
    }

    // 2. Logic for Image Tags (Generic)
    function initImgTags() {
        var imgTags = document.getElementsByTagName('img');
        for (var i = 0; i < imgTags.length; i++) {
            var img = imgTags[i];
            var alt = img.getAttribute('alt');
            var src = img.getAttribute('src');

            if (alt === 'random:h' || (src && src.indexOf('/random/h') !== -1)) {
                img.src = getRandomUrl('h');
            } else if (alt === 'random:v' || (src && src.indexOf('/random/v') !== -1)) {
                img.src = getRandomUrl('v');
            }
        }
    }

    // Helper for generic data-random-bg (as a backup or secondary feature)
    function initGenericBackgrounds() {
        var bgElements = document.querySelectorAll('[data-random-bg]');
        bgElements.forEach(function(el) {
            // Skip if it is the bg-box we already handled (though setRandomBackground handles #bg-box specifically)
            if (el.id === 'bg-box') return;

            var type = el.getAttribute('data-random-bg');
            if (type === 'h' || type === 'v') {
                var url = getRandomUrl(type);
                if (url) {
                    var img = new Image();
                    img.onload = function() {
                        el.style.backgroundImage = 'url("' + url + '")';
                        el.classList.add('loaded');
                    };
                    img.src = url;
                }
            }
        });
    }

    function init() {
        setRandomBackground();
        initImgTags();
    }
  
    // Run on initial load 
    if (document.readyState === 'loading') { 
        document.addEventListener('DOMContentLoaded', init); 
    } else { 
        init(); 
    } 
  
    // Swup integration
    function setupSwup() {
        if (window.swup && window.swup.hooks) {
            // Register hook for content replacement
            window.swup.hooks.on('content:replace', init);
            console.log('Random Pic API: Registered with Swup hooks.');
        }
    }

    if (window.swup) {
        setupSwup();
    } else {
        document.addEventListener('swup:enable', setupSwup);
    }

    // Legacy Swup support
    document.addEventListener('swup:contentReplaced', init); 
})();