<?php
/**
 * Custom Taxonomy Builder List View Template
 * Modern 2-column layout: Left sidebar for taxonomy list, Right main area for edit/create
 *
 * @package Switchboard
 * @since 1.0.0
 */

if (!defined('ABSPATH')) {
    exit;
}

// Get existing taxonomies
$taxonomies = get_option('switchboard_custom_taxonomies', []);

// Determine current action
$action = isset($_GET['action']) ? sanitize_text_field($_GET['action']) : '';
$selected_tax = isset($_GET['tax']) ? sanitize_key($_GET['tax']) : '';

// Get all post types for stats
$all_post_types = get_post_types(['public' => true], 'objects');
$exclude_types = ['attachment', 'wp_block', 'wp_template', 'wp_template_part', 'wp_navigation'];
$all_post_types = array_diff_key($all_post_types, array_flip($exclude_types));
?>

<div class="wrap sb-module-wrap">
    <!-- Header -->
    <div class="sb-module-header">
        <div class="sb-module-header-left">
            <svg class="sb-module-title-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z"></path>
            </svg>
            <div>
                <h1 class="sb-module-title">
                    <?php if ($action === 'add'): ?>
                        <?php esc_html_e('Creating a Custom Taxonomy', 'wpswitchboard'); ?>
                    <?php elseif ($action === 'edit'): ?>
                        <?php esc_html_e('Editing Custom Taxonomy', 'wpswitchboard'); ?>
                    <?php else: ?>
                        <?php esc_html_e('Taxonomy Builder', 'wpswitchboard'); ?>
                    <?php endif; ?>
                    <span class="switchboard-badge">SWITCHBOARD PRO</span>
                </h1>
                <p class="sb-module-subtitle">
                    <?php if ($action === 'add'): ?>
                        <?php esc_html_e('Create a new custom taxonomy with powerful controls', 'wpswitchboard'); ?>
                    <?php elseif ($action === 'edit'): ?>
                        <?php esc_html_e('Edit your custom taxonomy settings and configuration', 'wpswitchboard'); ?>
                    <?php else: ?>
                        <?php esc_html_e('Create and manage custom taxonomies with hierarchical or flat structures', 'wpswitchboard'); ?>
                    <?php endif; ?>
                </p>
            </div>
        </div>
        <div class="sb-module-header-right">
            <a href="https://docs.wpswitchboard.com/modules/content/custom-taxonomy-builder" target="_blank" class="sb-module-help-link">
                <span class="sb-module-help-link-icon dashicons dashicons-editor-help"></span>
                Help
            </a>
            <?php if ($action === 'add' || $action === 'edit'): ?>
                <a href="<?php echo esc_url(admin_url('admin.php?page=custom-taxonomy-builder')); ?>" class="sb-module-button sb-module-button-secondary">
                    <?php esc_html_e('Go Back', 'wpswitchboard'); ?>
                </a>
            <?php else: ?>
                <a href="<?php echo esc_url(admin_url('admin.php?page=custom-taxonomy-builder&action=add')); ?>" class="sb-module-button sb-module-button-primary">
                    <?php esc_html_e('Add New Taxonomy', 'wpswitchboard'); ?>
                </a>
            <?php endif; ?>
        </div>
    </div>

    <!-- Main Content -->
    <div class="sb-module-container">
    <!-- Stats Cards -->
    <div class="sb-module-stats">
        <div class="sb-module-stat-card">
            <div class="sb-module-stat-label"><?php esc_html_e('Custom Taxonomies', 'wpswitchboard'); ?></div>
            <div class="sb-module-stat-content">
                <div class="sb-module-stat-value" id="stat-total-taxonomies"><?php echo count($taxonomies); ?></div>
            </div>
        </div>

        <div class="sb-module-stat-card">
            <div class="sb-module-stat-label"><?php esc_html_e('Registered & Active', 'wpswitchboard'); ?></div>
            <div class="sb-module-stat-content">
                <div class="sb-module-stat-value" id="stat-registered-taxonomies">-</div>
            </div>
        </div>

        <div class="sb-module-stat-card">
            <div class="sb-module-stat-label"><?php esc_html_e('Hierarchical', 'wpswitchboard'); ?></div>
            <div class="sb-module-stat-content">
                <div class="sb-module-stat-value" id="stat-hierarchical-count">-</div>
            </div>
        </div>

        <div class="sb-module-stat-card">
            <div class="sb-module-stat-label"><?php esc_html_e('Avg Post Types', 'wpswitchboard'); ?></div>
            <div class="sb-module-stat-content">
                <div class="sb-module-stat-value" id="stat-avg-post-types">-</div>
            </div>
        </div>
    </div>

    <?php if ($action === ''): ?>
        <!-- Default Dashboard View: Grid of Taxonomies -->
        <?php if (empty($taxonomies)): ?>
            <!-- Empty State -->
            <div class="tax-empty-state">
                <div class="tax-empty-state-icon">
                    <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z"></path>
                    </svg>
                </div>
                <h3 class="tax-empty-state-title"><?php esc_html_e('No taxonomies yet', 'wpswitchboard'); ?></h3>
                <p class="tax-empty-state-desc"><?php esc_html_e('Here are some ideas to get you started', 'wpswitchboard'); ?></p>

                <!-- Use Cases Grid -->
                <div class="tax-use-cases-grid">
                    <div class="tax-use-case-card">
                        <h4 class="tax-use-case-title">Recipe Categories</h4>
                        <p class="tax-use-case-desc">Create 'Cuisine' and 'Meal Type' taxonomies for food blog to filter recipes by multiple criteria beyond standard categories.</p>
                    </div>
                    <div class="tax-use-case-card">
                        <h4 class="tax-use-case-title">Product Attributes</h4>
                        <p class="tax-use-case-desc">Build 'Brand', 'Color', and 'Size' taxonomies for fashion e-commerce site to enable advanced product filtering.</p>
                    </div>
                    <div class="tax-use-case-card">
                        <h4 class="tax-use-case-title">Location Organization</h4>
                        <p class="tax-use-case-desc">Add 'Region' and 'City' taxonomies to organize business listings or real estate by geographic area.</p>
                    </div>
                </div>

                <a href="<?php echo esc_url(admin_url('admin.php?page=custom-taxonomy-builder&action=add')); ?>" class="tax-empty-state-btn">
                    <span class="dashicons dashicons-plus-alt"></span>
                    <?php esc_html_e('Create Taxonomy', 'wpswitchboard'); ?>
                </a>
            </div>
        <?php else: ?>
            <div class="tax-grid">
                <?php foreach ($taxonomies as $tax):
                    $taxonomy_object = get_taxonomy($tax['slug']);
                    $is_registered = $taxonomy_object !== null;
                    $term_count = 0;
                    if ($is_registered) {
                        $term_count = wp_count_terms([
                            'taxonomy' => $tax['slug'],
                            'hide_empty' => false,
                        ]);
                        if (is_wp_error($term_count)) {
                            $term_count = 0;
                        }
                    }
                    $post_type_count = !empty($tax['post_types']) ? count($tax['post_types']) : 0;
                ?>
                    <a href="<?php echo esc_url(admin_url('admin.php?page=custom-taxonomy-builder&action=edit&tax=' . urlencode($tax['slug']))); ?>" class="tax-card">
                        <h3 class="tax-card-title"><?php echo esc_html($tax['name']); ?></h3>
                        <code class="tax-card-slug"><?php echo esc_html($tax['slug']); ?></code>
                        <div class="tax-card-badges">
                            <span class="tax-card-badge"><?php echo number_format($term_count); ?> <?php echo $term_count !== 1 ? esc_html__('terms', 'wpswitchboard') : esc_html__('term', 'wpswitchboard'); ?></span>
                            <span class="tax-card-badge"><?php echo $post_type_count; ?> <?php echo $post_type_count !== 1 ? esc_html__('types', 'wpswitchboard') : esc_html__('type', 'wpswitchboard'); ?></span>
                            <span class="tax-card-badge"><?php echo $tax['hierarchical'] ? esc_html__('Hierarchical', 'wpswitchboard') : esc_html__('Flat', 'wpswitchboard'); ?></span>
                        </div>
                        <?php if ($is_registered): ?>
                            <span class="tax-card-status tax-card-status-active"><?php esc_html_e('Active', 'wpswitchboard'); ?></span>
                        <?php else: ?>
                            <span class="tax-card-status tax-card-status-inactive"><?php esc_html_e('Inactive', 'wpswitchboard'); ?></span>
                        <?php endif; ?>
                        <div class="tax-card-overlay">
                            <span class="dashicons dashicons-edit"></span>
                        </div>
                    </a>
                <?php endforeach; ?>

                <!-- Add New Card -->
                <a href="<?php echo esc_url(admin_url('admin.php?page=custom-taxonomy-builder&action=add')); ?>" class="tax-card tax-card-add">
                    <h3 class="tax-card-add-title"><?php esc_html_e('New Taxonomy', 'wpswitchboard'); ?></h3>
                    <p class="tax-card-add-desc"><?php esc_html_e('Click to create', 'wpswitchboard'); ?></p>
                    <div class="tax-card-add-icon">
                        <span class="dashicons dashicons-plus-alt"></span>
                    </div>
                </a>
            </div>
        <?php endif; ?>
    <?php else: ?>
        <!-- Add/Edit View -->
        <div class="sb-module-layout" style="grid-template-columns: 1fr;">
            <div class="sb-module-main">
                <?php
                $edit_file = plugin_dir_path(__FILE__) . 'edit.php';
                if (file_exists($edit_file)) {
                    include $edit_file;
                }
                ?>
            </div>
        </div>
    <?php endif; ?>
    </div>
</div>

<style>
/* Empty State */
.tax-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 80px 40px;
    background: white;
    border-radius: 12px;
    margin-top: 24px;
}

.tax-empty-state-icon {
    width: 80px;
    height: 80px;
    background: var(--primary-50);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.tax-empty-state-icon svg {
    width: 40px;
    height: 40px;
    color: var(--primary-500);
}

.tax-empty-state-title {
    font-size: 20px;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 8px 0;
}

.tax-empty-state-desc {
    font-size: 14px;
    color: #64748b;
    margin: 0 0 24px 0;
    line-height: 1.6;
}

.tax-empty-state-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--primary-500);
    color: white;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.2s ease;
    cursor: pointer;
    text-decoration: none;
}

.tax-empty-state-btn:hover {
    background: var(--primary-600);
    color: white;
}

.tax-empty-state-btn .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

/* Use Cases Grid */
.tax-use-cases-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin: 32px 0;
    width: 100%;
    max-width: 900px;
}

.tax-use-case-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 20px;
    text-align: left;
    transition: all 0.2s ease;
}

.tax-use-case-card:hover {
    border-color: var(--primary-500);
    background: var(--primary-50);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(var(--primary-500-rgb), 0.1);
}

.tax-use-case-title {
    font-size: 14px;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 8px 0;
}

.tax-use-case-desc {
    font-size: 12px;
    color: #64748b;
    margin: 0;
    line-height: 1.5;
}

@media (max-width: 1024px) {
    .tax-use-cases-grid {
        grid-template-columns: 1fr;
    }
}

/* Taxonomy Grid */
.tax-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 24px;
}

.tax-card {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 32px 20px;
    transition: all 0.2s ease;
    position: relative;
    cursor: pointer;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
}

.tax-card:hover {
    border-color: var(--primary-500);
    background: var(--primary-50);
}

.tax-card-title {
    font-size: 15px;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
    line-height: 1.3;
}

.tax-card-slug {
    font-size: 11px;
    color: #94a3b8;
    background: #f1f5f9;
    padding: 4px 8px;
    border-radius: 4px;
    font-family: monospace;
}

.tax-card-badges {
    display: flex;
    gap: 6px;
    justify-content: center;
    flex-wrap: wrap;
}

.tax-card-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 4px 10px;
    background: var(--primary-100);
    color: var(--primary-700);
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
    transition: all 0.2s ease;
}

.tax-card:hover .tax-card-badge {
    background: var(--primary-200);
    color: var(--primary-800);
}

.tax-card-status {
    position: absolute;
    top: 12px;
    left: 12px;
    font-size: 9px;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tax-card-status-active {
    background: var(--primary-100);
    color: var(--primary-800);
}

.tax-card-status-inactive {
    background: #fee2e2;
    color: #991b1b;
}

.tax-card-overlay {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 28px;
    height: 28px;
    background: var(--primary-500);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.tax-card:hover .tax-card-overlay {
    opacity: 1;
}

.tax-card-overlay .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: white;
}

/* Add New Card */
.tax-card-add {
    border: 2px dashed #cbd5e1;
    background: #f8fafc;
}

.tax-card-add:hover {
    border-color: var(--primary-500);
    background: var(--primary-50);
}

.tax-card-add-title {
    font-size: 15px;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
}

.tax-card-add-desc {
    font-size: 12px;
    color: #94a3b8;
    margin: 0;
}

.tax-card-add-icon {
    margin-top: 4px;
    width: 40px;
    height: 40px;
    background: #f1f5f9;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.tax-card-add-icon .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
    color: #cbd5e1;
    transition: color 0.2s ease;
}

.tax-card-add:hover .tax-card-add-icon {
    background: var(--primary-100);
}

.tax-card-add:hover .tax-card-add-icon .dashicons {
    color: var(--primary-500);
}

/* Responsive */
@media (max-width: 1400px) {
    .tax-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 1024px) {
    .tax-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .tax-grid {
        grid-template-columns: 1fr;
    }
}
</style>

<script>
jQuery(document).ready(function($) {
    // Update stats
    var taxonomies = <?php echo json_encode($taxonomies); ?>;
    var registered = 0;
    var hierarchical = 0;
    var total_post_types = 0;
    
    <?php
    // Check which taxonomies are registered
    $registered_taxonomies = [];
    foreach ($taxonomies as $tax) {
        if (taxonomy_exists($tax['slug'])) {
            $registered_taxonomies[] = $tax['slug'];
        }
    }
    ?>
    var registeredSlugs = <?php echo json_encode($registered_taxonomies); ?>;
    
    taxonomies.forEach(function(tax) {
        if (registeredSlugs.indexOf(tax.slug) !== -1) {
            registered++;
        }
        if (tax.hierarchical) {
            hierarchical++;
        }
        if (tax.post_types) {
            total_post_types += tax.post_types.length;
        }
    });
    
    $('#stat-registered-taxonomies').text(registered);
    $('#stat-hierarchical-count').text(hierarchical);
    $('#stat-avg-post-types').text(taxonomies.length > 0 ? (total_post_types / taxonomies.length).toFixed(1) : '0');
});
</script>

