<?php
/**
 * Content Generator View Template
 * 
 * Step-by-step wizard interface for content generation
 * 
 * @package AIProductContentImageGenerator
 * @since 1.0.0
 */

// Prevent direct access
if (!defined('ABSPATH')) {
    exit;
}

// File is loading successfully

// Simple fallback values for testing
$apcig_providers = ['openai' => ['name' => 'OpenAI']];
$apcig_tones = ['professional' => 'Professional', 'casual' => 'Casual', 'friendly' => 'Friendly'];
$apcig_content_types = [
    'short_description' => ['name' => 'Short Description', 'max_words' => 150],
    'long_description' => ['name' => 'Long Description', 'max_words' => 300],
    'title' => ['name' => 'Product Title', 'max_words' => 10],
    'tags' => ['name' => 'Product Tags', 'max_words' => 50]
];
$apcig_products = [];

// Get all products for content generation
if (function_exists('wc_get_products')) {
    try {
        $apcig_products = wc_get_products(['limit' => -1, 'status' => 'publish', 'orderby' => 'date', 'order' => 'DESC']);
    } catch (Exception $e) {
        // Silently handle error
    }
}

// If no products, create dummy data for testing
if (empty($apcig_products)) {
    $apcig_products = [
        (object) [
            'id' => 1,
            'name' => 'Test Product',
            'price_html' => '$10.00',
            'sku' => 'TEST-001',
            'image_id' => 0,
            'short_description' => '',
            'description' => '',
        ]
    ];
}
?>

<div class="apcig-content-generator">
    <!-- Step Progress Indicator -->
    <div class="apcig-step-progress">
        <div class="apcig-step active" data-step="1">
            <div class="apcig-step-number">1</div>
            <div class="apcig-step-label"><?php esc_html_e('Select Products', 'contengen-ai-product-content-image-generator'); ?></div>
        </div>
        <div class="apcig-step" data-step="2">
            <div class="apcig-step-number">2</div>
            <div class="apcig-step-label"><?php esc_html_e('Configure Content', 'contengen-ai-product-content-image-generator'); ?></div>
        </div>
        <div class="apcig-step" data-step="3">
            <div class="apcig-step-number">3</div>
            <div class="apcig-step-label"><?php esc_html_e('Preview & Edit', 'contengen-ai-product-content-image-generator'); ?></div>
        </div>
        <div class="apcig-step" data-step="4">
            <div class="apcig-step-number">4</div>
            <div class="apcig-step-label"><?php esc_html_e('Apply Content', 'contengen-ai-product-content-image-generator'); ?></div>
        </div>
    </div>

    <!-- Step 1: Product Selection -->
    <div class="apcig-step-content active" id="step-1">
        <div class="apcig-card">
            <div class="apcig-card-header">
                <h3><?php esc_html_e('Step 1: Select Products', 'contengen-ai-product-content-image-generator'); ?></h3>
            </div>
            <div class="apcig-card-body">
                <!-- Search and Filters -->
                <div class="apcig-product-filters">
                    <div class="apcig-filter-row">
                        <div class="apcig-form-group">
                            <label class="apcig-label"><?php esc_html_e('Search Products', 'contengen-ai-product-content-image-generator'); ?></label>
                            <input type="text" id="product-search" class="apcig-input" placeholder="<?php esc_attr_e('Search by name, SKU, or description...', 'contengen-ai-product-content-image-generator'); ?>">
                        </div>
                        <div class="apcig-form-group">
                            <label class="apcig-label"><?php esc_html_e('Category', 'contengen-ai-product-content-image-generator'); ?></label>
                            <select id="category-filter" class="apcig-select">
                                <option value=""><?php esc_html_e('All Categories', 'contengen-ai-product-content-image-generator'); ?></option>
                                <?php
                                $apcig_categories = get_terms(['taxonomy' => 'product_cat', 'hide_empty' => false]);
                                foreach ($apcig_categories as $apcig_category):
                                ?>
                                <option value="<?php echo esc_attr($apcig_category->term_id); ?>">
                                    <?php echo esc_html($apcig_category->name); ?>
                                </option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        <div class="apcig-form-group">
                            <label class="apcig-label"><?php esc_html_e('Status', 'contengen-ai-product-content-image-generator'); ?></label>
                            <select id="status-filter" class="apcig-select">
                                <option value=""><?php esc_html_e('All Status', 'contengen-ai-product-content-image-generator'); ?></option>
                                <option value="missing-content"><?php esc_html_e('Missing Content', 'contengen-ai-product-content-image-generator'); ?></option>
                                <option value="has-content"><?php esc_html_e('Has Content', 'contengen-ai-product-content-image-generator'); ?></option>
                            </select>
                        </div>
                        <div class="apcig-filter-actions">
                            <label class="apcig-label">&nbsp;</label>
                            <div class="apcig-filter-buttons">
                                <button type="button" id="apply-filters" class="apcig-btn apcig-btn-primary apcig-btn-sm">
                                    <span class="dashicons dashicons-search"></span>
                                    <?php esc_html_e('Search', 'contengen-ai-product-content-image-generator'); ?>
                                </button>
                                <button type="button" id="reset-filters" class="apcig-btn apcig-btn-secondary apcig-btn-sm">
                                    <span class="dashicons dashicons-update"></span>
                                    <?php esc_html_e('Reset', 'contengen-ai-product-content-image-generator'); ?>
                                </button>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Product Selection -->
                <div class="apcig-product-selection">
                    <div class="apcig-selection-info">
                        <p class="apcig-info-message">
                            <span class="dashicons dashicons-info"></span>
                            <?php esc_html_e('Select a single product to generate content. For bulk content generation, please use the Bulk Processing page.', 'contengen-ai-product-content-image-generator'); ?>
                        </p>
                    </div>

                    <div class="apcig-products-grid" id="products-grid">
                        <?php foreach (array_slice($apcig_products, 0, 20) as $apcig_product): ?>
                        <?php
                        // Handle both WooCommerce products and dummy objects
                        $apcig_product_id = is_object($apcig_product) && method_exists($apcig_product, 'get_id') ? $apcig_product->get_id() : (isset($apcig_product->id) ? $apcig_product->id : 0);
                        $apcig_product_name = is_object($apcig_product) && method_exists($apcig_product, 'get_name') ? $apcig_product->get_name() : (isset($apcig_product->name) ? $apcig_product->name : 'Unknown Product');
                        $apcig_product_price = is_object($apcig_product) && method_exists($apcig_product, 'get_price_html') ? $apcig_product->get_price_html() : (isset($apcig_product->price_html) ? $apcig_product->price_html : '$0.00');
                        $apcig_product_sku = is_object($apcig_product) && method_exists($apcig_product, 'get_sku') ? $apcig_product->get_sku() : (isset($apcig_product->sku) ? $apcig_product->sku : '');
                        $apcig_product_image_id = is_object($apcig_product) && method_exists($apcig_product, 'get_image_id') ? $apcig_product->get_image_id() : (isset($apcig_product->image_id) ? $apcig_product->image_id : 0);
                        $apcig_short_desc = is_object($apcig_product) && method_exists($apcig_product, 'get_short_description') ? $apcig_product->get_short_description() : (isset($apcig_product->short_description) ? $apcig_product->short_description : '');
                        $apcig_long_desc = is_object($apcig_product) && method_exists($apcig_product, 'get_description') ? $apcig_product->get_description() : (isset($apcig_product->description) ? $apcig_product->description : '');
                        ?>
                        <div class="apcig-product-card" data-product-id="<?php echo esc_attr($apcig_product_id); ?>">
                            <div class="apcig-product-radio-wrapper">
                                <input type="radio" name="selected_product" class="apcig-product-radio" value="<?php echo esc_attr($apcig_product_id); ?>" id="product-<?php echo esc_attr($apcig_product_id); ?>">
                                <label for="product-<?php echo esc_attr($apcig_product_id); ?>"></label>
                            </div>
                            
                            <div class="apcig-product-image">
                                <?php if ($apcig_product_image_id): ?>
                                    <?php echo wp_get_attachment_image($apcig_product_image_id, 'thumbnail'); ?>
                                <?php else: ?>
                                    <div class="apcig-no-image">
                                        <span class="dashicons dashicons-format-image"></span>
                                    </div>
                                <?php endif; ?>
                            </div>
                            
                            <div class="apcig-product-info">
                                <h4 class="apcig-product-title"><?php echo esc_html($apcig_product_name); ?></h4>
                                <div class="apcig-product-price"><?php echo wp_kses_post($apcig_product_price); ?></div>
                                <?php if ($apcig_product_sku): ?>
                                <div class="apcig-product-sku">
                                    <small><?php esc_html_e('SKU:', 'contengen-ai-product-content-image-generator'); ?> <?php echo esc_html($apcig_product_sku); ?></small>
                                </div>
                                <?php endif; ?>
                                
                                <!-- Content Status Indicators -->
                                <div class="apcig-content-status">
                                    <span class="apcig-status-badge <?php echo esc_attr($apcig_short_desc ? 'success' : 'missing'); ?>">
                                        <?php esc_html_e('Short Desc', 'contengen-ai-product-content-image-generator'); ?>
                                    </span>
                                    <span class="apcig-status-badge <?php echo esc_attr($apcig_long_desc ? 'success' : 'missing'); ?>">
                                        <?php esc_html_e('Long Desc', 'contengen-ai-product-content-image-generator'); ?>
                                    </span>
                                    <?php
                                    $apcig_tags = [];
                                    if ($apcig_product_id && function_exists('wp_get_post_terms')) {
                                        $apcig_tags = wp_get_post_terms($apcig_product_id, 'product_tag');
                                    }
                                    ?>
                                    <span class="apcig-status-badge <?php echo !empty($apcig_tags) ? 'success' : 'missing'; ?>">
                                        <?php esc_html_e('Tags', 'contengen-ai-product-content-image-generator'); ?>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <?php endforeach; ?>
                    </div>
                    
                    <?php if (count($apcig_products) > 20): ?>
                    <div class="apcig-load-more-container">
                        <button type="button" class="apcig-btn apcig-btn-secondary" id="load-more-content-products">
                            <?php esc_html_e('Load More Products', 'contengen-ai-product-content-image-generator'); ?>
                        </button>
                        <p class="apcig-products-count">
                            <?php 
                            /* translators: %1$d: number of displayed products, %2$d: total number of products */
                            echo esc_html(sprintf(__('Showing %1$d of %2$d products', 'contengen-ai-product-content-image-generator'), 20, count($products))); 
                            ?>
                        </p>
                    </div>
                    <?php endif; ?>
                </div>

                <div class="apcig-step-actions">
                    <button type="button" class="apcig-btn apcig-btn-primary" id="continue-to-step-2" disabled>
                        <?php esc_html_e('Continue', 'contengen-ai-product-content-image-generator'); ?>
                        <span class="dashicons dashicons-arrow-right-alt"></span>
                    </button>
                </div>
            </div>
        </div>
    </div>

    <!-- Step 2: Content Configuration -->
    <div class="apcig-step-content" id="step-2" style="display: none;">
        <div class="apcig-card">
            <div class="apcig-card-header">
                <h3><?php esc_html_e('Step 2: Configure Content', 'contengen-ai-product-content-image-generator'); ?></h3>
            </div>
            <div class="apcig-card-body">
                <div class="apcig-config-grid">
                    <!-- Content Types -->
                    <div class="apcig-config-section">
                        <h4><?php esc_html_e('Content Types', 'contengen-ai-product-content-image-generator'); ?></h4>
                        <div class="apcig-content-types">
                            <?php foreach ($apcig_content_types as $apcig_type_key => $apcig_type_config): ?>
                            <label class="apcig-checkbox-card">
                                <input type="checkbox" name="content_types[]" value="<?php echo esc_attr($apcig_type_key); ?>" checked>
                                <div class="apcig-checkbox-content">
                                    <strong><?php echo esc_html($apcig_type_config['name']); ?></strong>
                                    <?php /* translators: %d: maximum number of words allowed for this content type */ ?>
                                    <small><?php echo esc_html(sprintf(__('Max %d words', 'contengen-ai-product-content-image-generator'), $apcig_type_config['max_words'])); ?></small>
                                </div>
                            </label>
                            <?php endforeach; ?>
                        </div>
                    </div>

                    <!-- AI Settings -->
                    <div class="apcig-config-section">
                        <h4><?php esc_html_e('AI Settings', 'contengen-ai-product-content-image-generator'); ?></h4>
                        
                        <div class="apcig-form-group">
                            <label class="apcig-label"><?php esc_html_e('AI Provider', 'contengen-ai-product-content-image-generator'); ?></label>
                            <select name="provider" class="apcig-select">
                                <?php foreach ($apcig_providers as $apcig_provider_id => $apcig_provider_config): ?>
                                <option value="<?php echo esc_attr($apcig_provider_id); ?>">
                                    <?php echo esc_html($apcig_provider_config['name']); ?>
                                </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="apcig-form-group">
                            <label class="apcig-label"><?php esc_html_e('Tone', 'contengen-ai-product-content-image-generator'); ?></label>
                            <select name="tone" class="apcig-select">
                                <?php foreach ($apcig_tones as $apcig_tone_key => $apcig_tone_name): ?>
                                <option value="<?php echo esc_attr($apcig_tone_key); ?>">
                                    <?php echo esc_html($apcig_tone_name); ?>
                                </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="apcig-form-group">
                            <label class="apcig-label"><?php esc_html_e('Language', 'contengen-ai-product-content-image-generator'); ?></label>
                            <select name="language" class="apcig-select">
                                <option value="en"><?php esc_html_e('English', 'contengen-ai-product-content-image-generator'); ?></option>
                                <option value="es"><?php esc_html_e('Spanish', 'contengen-ai-product-content-image-generator'); ?></option>
                                <option value="fr"><?php esc_html_e('French', 'contengen-ai-product-content-image-generator'); ?></option>
                                <option value="de"><?php esc_html_e('German', 'contengen-ai-product-content-image-generator'); ?></option>
                                <option value="it"><?php esc_html_e('Italian', 'contengen-ai-product-content-image-generator'); ?></option>
                                <option value="pt"><?php esc_html_e('Portuguese', 'contengen-ai-product-content-image-generator'); ?></option>
                            </select>
                        </div>
                    </div>
                </div>

                <!-- Custom Prompt -->
                <div class="apcig-config-section">
                    <h4><?php esc_html_e('Custom Prompt (Optional)', 'contengen-ai-product-content-image-generator'); ?></h4>
                    <div class="apcig-form-group">
                        <textarea name="custom_prompt" class="apcig-textarea" rows="4" placeholder="<?php esc_attr_e('Create a compelling description for {product_name} highlighting its {key_features} and benefits...', 'contengen-ai-product-content-image-generator'); ?>"></textarea>
                        <small class="apcig-help-text">
                            <?php esc_html_e('Available variables:', 'contengen-ai-product-content-image-generator'); ?>
                            <code>{product_name}</code>, <code>{category}</code>, <code>{price}</code>, <code>{attributes}</code>, <code>{sku}</code>
                        </small>
                    </div>
                </div>

                <div class="apcig-step-actions">
                    <button type="button" class="apcig-btn apcig-btn-secondary" id="back-to-step-1">
                        <span class="dashicons dashicons-arrow-left-alt"></span>
                        <?php esc_html_e('Back', 'contengen-ai-product-content-image-generator'); ?>
                    </button>
                    <button type="button" class="apcig-btn apcig-btn-primary" id="continue-to-step-3">
                        <?php esc_html_e('Generate Preview', 'contengen-ai-product-content-image-generator'); ?>
                        <span class="dashicons dashicons-arrow-right-alt"></span>
                    </button>
                </div>
            </div>
        </div>
    </div>

    <!-- Step 3: Preview & Edit -->
    <div class="apcig-step-content" id="step-3" style="display: none;">
        <div class="apcig-card">
            <div class="apcig-card-header">
                <h3><?php esc_html_e('Step 3: Preview & Edit', 'contengen-ai-product-content-image-generator'); ?></h3>
            </div>
            <div class="apcig-card-body">
                <div id="content-preview-container">
                    <!-- Content will be loaded here via AJAX -->
                </div>

                <div class="apcig-step-actions">
                    <button type="button" class="apcig-btn apcig-btn-secondary" id="back-to-step-2">
                        <span class="dashicons dashicons-arrow-left-alt"></span>
                        <?php esc_html_e('Back', 'contengen-ai-product-content-image-generator'); ?>
                    </button>
                    <button type="button" class="apcig-btn apcig-btn-primary" id="continue-to-step-4">
                        <?php esc_html_e('Apply Content', 'contengen-ai-product-content-image-generator'); ?>
                        <span class="dashicons dashicons-arrow-right-alt"></span>
                    </button>
                </div>
            </div>
        </div>
    </div>

    <!-- Step 4: Apply Content -->
    <div class="apcig-step-content" id="step-4" style="display: none;">
        <div class="apcig-card">
            <div class="apcig-card-header">
                <h3><?php esc_html_e('Step 4: Apply Content', 'contengen-ai-product-content-image-generator'); ?></h3>
            </div>
            <div class="apcig-card-body">
                <div class="apcig-apply-notice" style="margin-bottom: 20px;">
                    <p><?php esc_html_e('Click the button below to apply the generated content to your selected products.', 'contengen-ai-product-content-image-generator'); ?></p>
                </div>

                <div id="apply-progress" style="display: none;">
                    <div class="apcig-progress">
                        <div class="apcig-progress-bar" id="apply-progress-bar"></div>
                    </div>
                    <p id="apply-progress-text"><?php esc_html_e('Applying content...', 'contengen-ai-product-content-image-generator'); ?></p>
                </div>

                <div id="apply-results" style="display: none;">
                    <!-- Results will be shown here -->
                </div>

                <div class="apcig-step-actions">
                    <button type="button" class="apcig-btn apcig-btn-secondary" id="back-to-step-3">
                        <span class="dashicons dashicons-arrow-left-alt"></span>
                        <?php esc_html_e('Back', 'contengen-ai-product-content-image-generator'); ?>
                    </button>
                    <button type="button" class="apcig-btn apcig-btn-success" id="apply-content">
                        <span class="dashicons dashicons-yes-alt"></span>
                        <?php esc_html_e('Apply All Content', 'contengen-ai-product-content-image-generator'); ?>
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

