/**
 * HVAC Welcome Popup System
 * 
 * Handles the welcome popup modal for new users with carousel functionality
 */
(function($) {
    'use strict';
    
    var HVACWelcomePopup = {
        
        init: function() {
            this.currentCard = 0;
            this.totalCards = 4;
            this.bindEvents();
            this.checkAndShowPopup();
        },
        
        bindEvents: function() {
            var self = this;
            
            // Close popup handlers
            $(document).on('click', '.hvac-welcome-close', function(e) {
                e.preventDefault();
                self.closePopup();
            });
            
            $(document).on('click', '.hvac-welcome-overlay', function(e) {
                if (e.target === this) {
                    self.closePopup();
                }
            });
            
            // Navigation handlers
            $(document).on('click', '.hvac-welcome-nav-prev', function(e) {
                e.preventDefault();
                self.previousCard();
            });
            
            $(document).on('click', '.hvac-welcome-nav-next', function(e) {
                e.preventDefault();
                self.nextCard();
            });
            
            // Dot navigation
            $(document).on('click', '.hvac-welcome-dot', function(e) {
                e.preventDefault();
                var cardIndex = $(this).data('card');
                self.goToCard(cardIndex);
            });
            
            // Dismiss permanently
            $(document).on('click', '.hvac-welcome-dismiss', function(e) {
                e.preventDefault();
                self.dismissPermanently();
            });
            
            // Keyboard navigation
            $(document).on('keydown', function(e) {
                if ($('.hvac-welcome-popup').is(':visible')) {
                    switch(e.which) {
                        case 27: // ESC
                            self.closePopup();
                            break;
                        case 37: // Left arrow
                            self.previousCard();
                            break;
                        case 39: // Right arrow
                            self.nextCard();
                            break;
                    }
                }
            });
        },
        
        checkAndShowPopup: function() {
            var self = this;
            
            // Check if user has dismissed the popup
            $.ajax({
                url: hvac_welcome.ajax_url,
                type: 'POST',
                data: {
                    action: 'hvac_check_welcome_dismissed',
                    nonce: hvac_welcome.nonce
                },
                success: function(response) {
                    if (response.success && !response.data.dismissed) {
                        self.showPopup();
                    }
                }
            });
        },
        
        showPopup: function() {
            if ($('.hvac-welcome-popup').length === 0) {
                this.createPopup();
            }
            
            $('body').addClass('hvac-welcome-open');
            $('.hvac-welcome-popup').fadeIn(300);
            this.updateCardDisplay();
        },
        
        closePopup: function() {
            $('.hvac-welcome-popup').fadeOut(300);
            $('body').removeClass('hvac-welcome-open');
        },
        
        dismissPermanently: function() {
            var self = this;
            var shouldDismiss = $('#hvac-welcome-dont-show').is(':checked');
            
            if (shouldDismiss) {
                $.ajax({
                    url: hvac_welcome.ajax_url,
                    type: 'POST',
                    data: {
                        action: 'hvac_dismiss_welcome_popup',
                        nonce: hvac_welcome.nonce
                    },
                    success: function(response) {
                        if (response.success) {
                            self.closePopup();
                        }
                    }
                });
            } else {
                // Just close without permanently dismissing
                self.closePopup();
            }
        },
        
        previousCard: function() {
            this.currentCard = (this.currentCard - 1 + this.totalCards) % this.totalCards;
            this.updateCardDisplay();
        },
        
        nextCard: function() {
            this.currentCard = (this.currentCard + 1) % this.totalCards;
            this.updateCardDisplay();
        },
        
        goToCard: function(cardIndex) {
            this.currentCard = cardIndex;
            this.updateCardDisplay();
        },
        
        updateCardDisplay: function() {
            var self = this;
            var $cards = $('.hvac-welcome-card');
            var $dots = $('.hvac-welcome-dot');
            
            // Hide all cards
            $cards.removeClass('active');
            $dots.removeClass('active');
            
            // Show current card with animation
            setTimeout(function() {
                $cards.eq(self.currentCard).addClass('active');
                $dots.eq(self.currentCard).addClass('active');
            }, 150);
            
            // Update navigation button states
            $('.hvac-welcome-nav-prev').toggleClass('disabled', this.currentCard === 0);
            $('.hvac-welcome-nav-next').toggleClass('disabled', this.currentCard === this.totalCards - 1);
        },
        
        createPopup: function() {
            var popupHTML = this.getPopupHTML();
            $('body').append(popupHTML);
        },
        
        getPopupHTML: function() {
            return `
                <div class="hvac-welcome-popup" style="display: none;">
                    <div class="hvac-welcome-overlay"></div>
                    <div class="hvac-welcome-modal">
                        <button class="hvac-welcome-close" aria-label="Close">&times;</button>
                        
                        <div class="hvac-welcome-content">
                            <div class="hvac-welcome-carousel">
                                
                                <!-- Card 1: Welcome -->
                                <div class="hvac-welcome-card" data-card="0">
                                    <div class="hvac-welcome-icon">
                                        <span class="dashicons dashicons-welcome-learn-more"></span>
                                    </div>
                                    <h2>Welcome to Upskill HVAC!</h2>
                                    <p class="hvac-welcome-subtitle">You're one of the first trainers to be welcomed into our comprehensive training platform.</p>
                                    <div class="hvac-welcome-description">
                                        <p>Our goal is to make it easier for HVAC Trainers to:</p>
                                        <ul>
                                            <li>Get discovered by potential students</li>
                                            <li>Share training events and programs</li>
                                            <li>Build professional reputation</li>
                                            <li>Connect with the HVAC community</li>
                                        </ul>
                                        <p><strong>Note:</strong> We've done our best to customize your personal information, but you may need to make some corrections.</p>
                                    </div>
                                </div>
                                
                                <!-- Card 2: Event Management -->
                                <div class="hvac-welcome-card" data-card="1">
                                    <div class="hvac-welcome-icon">
                                        <span class="dashicons dashicons-calendar-alt"></span>
                                    </div>
                                    <h2>Manage Your Events!</h2>
                                    <p class="hvac-welcome-subtitle">Create and manage your training events with our integrated event system.</p>
                                    <div class="hvac-welcome-description">
                                        <p>Get started by creating your first training event:</p>
                                        <ul>
                                            <li><strong>Events:</strong> Training sessions with pricing and capacity</li>
                                            <li><strong>Venues:</strong> Physical or virtual training locations</li>
                                            <li><strong>Organizers:</strong> Business entities with logos</li>
                                            <li>Track revenue and attendance</li>
                                        </ul>
                                        <p><strong>Good news:</strong> We've tried to auto-create training venues and organizers for you!</p>
                                    </div>
                                </div>
                                
                                <!-- Card 3: Profile & Directory -->
                                <div class="hvac-welcome-card" data-card="2">
                                    <div class="hvac-welcome-icon">
                                        <span class="dashicons dashicons-admin-users"></span>
                                    </div>
                                    <h2>Update & Share Your Profile!</h2>
                                    <p class="hvac-welcome-subtitle">Your trainer profile is your professional showcase in our directory.</p>
                                    <div class="hvac-welcome-description">
                                        <p>Your profile includes powerful features:</p>
                                        <ul>
                                            <li><strong>Directory Listing:</strong> Appears in "Find A Trainer" search</li>
                                            <li><strong>Map Integration:</strong> Shows location and service areas</li>
                                            <li><strong>QR Code Sharing:</strong> Easy sharing at events</li>
                                            <li><strong>Direct Contact:</strong> Students reach out directly</li>
                                        </ul>
                                        <p><strong>Pro tip:</strong> The more you share your profile, the more training leads you can generate!</p>
                                    </div>
                                </div>
                                
                                <!-- Card 4: More Features -->
                                <div class="hvac-welcome-card" data-card="3">
                                    <div class="hvac-welcome-icon">
                                        <span class="dashicons dashicons-star-filled"></span>
                                    </div>
                                    <h2>And Much More!</h2>
                                    <p class="hvac-welcome-subtitle">We're continuously adding features to enhance your training business.</p>
                                    <div class="hvac-welcome-description">
                                        <p>Current features available now:</p>
                                        <ul>
                                            <li><strong>Certificate Generation:</strong> Create completion certificates</li>
                                            <li><strong>Revenue Tracking:</strong> Monitor training income</li>
                                            <li><strong>Analytics:</strong> View performance metrics</li>
                                        </ul>
                                        <p>Coming soon: Direct messaging with attendees, lead history tracking, advanced certificates, and more!</p>
                                        <p><strong>Get started:</strong> Update your profile first, then create your first event!</p>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="hvac-welcome-navigation">
                                <button class="hvac-welcome-nav hvac-welcome-nav-prev" aria-label="Previous">
                                    <span class="dashicons dashicons-arrow-left-alt2"></span>
                                </button>
                                
                                <div class="hvac-welcome-dots">
                                    <button class="hvac-welcome-dot" data-card="0" aria-label="Card 1"></button>
                                    <button class="hvac-welcome-dot" data-card="1" aria-label="Card 2"></button>
                                    <button class="hvac-welcome-dot" data-card="2" aria-label="Card 3"></button>
                                    <button class="hvac-welcome-dot" data-card="3" aria-label="Card 4"></button>
                                </div>
                                
                                <button class="hvac-welcome-nav hvac-welcome-nav-next" aria-label="Next">
                                    <span class="dashicons dashicons-arrow-right-alt2"></span>
                                </button>
                            </div>
                            
                            <div class="hvac-welcome-footer">
                                <label class="hvac-welcome-checkbox">
                                    <input type="checkbox" id="hvac-welcome-dont-show"> 
                                    Don't show this again
                                </label>
                                <button class="hvac-welcome-dismiss button button-primary wp-element-button">Get Started</button>
                            </div>
                        </div>
                    </div>
                </div>
            `;
        }
    };
    
    // Initialize when document is ready
    $(document).ready(function() {
        // Only initialize on dashboard page
        if ($('.hvac-trainer-dashboard-page').length > 0) {
            HVACWelcomePopup.init();
        }
    });
    
})(jQuery);