CrowdWork - on an event page, if there's only one ticket tier, then auto select one ticket

crowdwork-auto-select-one-ticket.js

/**
 * Auto-select 1 ticket when only one tier is available
 * Version: 1.0.0
 */

(function() {
    'use strict';
    
    function autoSelectSingleTier() {
        // Find all ticket selection containers
        const ticketContainers = document.querySelectorAll('.btn-incrementor');
        
        // Only proceed if there's exactly one tier available
        if (ticketContainers.length !== 1) {
            return;
        }
        
        const container = ticketContainers[0];
        const selectElement = container.querySelector('.ticket-select');
        const countDisplay = container.querySelector('.ticket-count-display');
        
        if (!selectElement || !countDisplay) {
            return;
        }
        
        // Check if already selected (avoid re-triggering)
        if (selectElement.value !== '0') {
            return;
        }
        
        // Set select value to 1
        selectElement.value = '1';
        
        // Update display counter
        countDisplay.textContent = '1';
        
        // Trigger change event for any listeners
        const changeEvent = new Event('change', { bubbles: true });
        selectElement.dispatchEvent(changeEvent);
        
        // Add visual feedback to increment button (optional)
        const incrementBtn = container.querySelector('.btn-increment');
        if (incrementBtn) {
            incrementBtn.classList.add('active');
            setTimeout(() => {
                incrementBtn.classList.remove('active');
            }, 200);
        }
        
        console.log('Auto-selected 1 ticket for single tier');
    }
    
    // Run when DOM is ready
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', autoSelectSingleTier);
    } else {
        autoSelectSingleTier();
    }
    
    // Also run after dynamic content loads (if applicable)
    const observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
                // Check if ticket containers were added
                const hasTicketContainer = Array.from(mutation.addedNodes).some(node => 
                    node.nodeType === 1 && 
                    (node.classList?.contains('btn-incrementor') || 
                     node.querySelector?.('.btn-incrementor'))
                );
                
                if (hasTicketContainer) {
                    setTimeout(autoSelectSingleTier, 100);
                }
            }
        });
    });
    
    // Observe changes to the document body
    observer.observe(document.body, {
        childList: true,
        subtree: true
    });
    
})();