<?php
/**
 * Lean Analytics Dashboard Template
 */

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

<div class="wrap lean-analytics-wrap">
    <div class="lean-analytics-header">
        <div class="lean-header-left">
            <h1>Analytics <span class="switchboard-badge">SWITCHBOARD</span></h1>
            <div class="lean-privacy-badge" title="Privacy-First Analytics">
                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
                </svg>
                <span class="lean-tooltip">
                    <strong>Privacy-First Analytics</strong><br>
                    • No personal data stored<br>
                    • Daily-rotated visitor hashes<br>
                    • DNT respected<br>
                    • First-party tracking only
                </span>
            </div>
        </div>
        <div class="lean-header-right">
            <select id="lean-range-select">
                <option value="today">Today</option>
                <option value="yesterday">Yesterday</option>
                <option value="this_week">This Week</option>
                <option value="last_week">Last Week</option>
                <option value="this_month">This Month</option>
                <option value="last_month">Last Month</option>
                <option value="last_30_days" selected>Last 30 Days</option>
                <option value="last_90_days">Last 90 Days</option>
                <option value="last_365_days">Last 365 Days</option>
                <option value="this_year">This Year</option>
                <option value="last_year">Last Year</option>
                <option value="all_time">All Time</option>
            </select>
            <?php if (current_user_can('manage_options')) : ?>
            <button type="button" id="lean-settings-btn" class="lean-icon-btn" title="Data Cleanup">
                <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"/>
                    <path d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/>
                </svg>
            </button>
            <?php endif; ?>
        </div>
    </div>
    
    <?php if (current_user_can('manage_options')) : ?>
    <!-- Settings Panel (Hidden by default) - Admin only -->
    <div id="lean-settings-panel" class="lean-settings-panel" style="display: none;">
        <div class="lean-settings-panel-inner">
            <div class="lean-settings-row">
                <div class="lean-settings-left">
                    <div class="lean-settings-icon">
                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
                            <path d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0"/>
                        </svg>
                    </div>
                    <div class="lean-settings-title">
                        <h3>Data Cleanup</h3>
                        <p class="lean-muted">Remove old analytics data to free up database space</p>
                    </div>
                </div>
                <div class="lean-settings-right">
                    <div class="lean-cleanup-field">
                        <label for="lean-cleanup-date">Delete data before:</label>
                        <input type="date" id="lean-cleanup-date" value="<?php echo date('Y-m-d', strtotime('-180 days')); ?>" max="<?php echo date('Y-m-d'); ?>">
                    </div>
                    <div class="lean-cleanup-actions">
                        <button type="button" id="lean-cleanup-preview" class="lean-btn-secondary">Preview</button>
                        <button type="button" id="lean-cleanup-execute" class="lean-btn-danger">Delete Data</button>
                    </div>
                </div>
            </div>
            <div id="lean-cleanup-result"></div>
        </div>
    </div>
    <?php endif; ?>
    
    <div class="lean-tabs">
        <button type="button" class="lean-tab active" data-tab="overview">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <rect x="3" y="3" width="7" height="7"/>
                <rect x="14" y="3" width="7" height="7"/>
                <rect x="14" y="14" width="7" height="7"/>
                <rect x="3" y="14" width="7" height="7"/>
            </svg>
            Overview
        </button>
        <button type="button" class="lean-tab" data-tab="pages">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/>
                <polyline points="14 2 14 8 20 8"/>
            </svg>
            Pages
        </button>
        <button type="button" class="lean-tab" data-tab="referrers">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/>
                <path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/>
            </svg>
            Referrers
        </button>
        <button type="button" class="lean-tab" data-tab="countries">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <circle cx="12" cy="12" r="10"/>
                <line x1="2" y1="12" x2="22" y2="12"/>
                <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/>
            </svg>
            Countries
        </button>
        <button type="button" class="lean-tab" data-tab="posts">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <path d="M12 20h9M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"/>
            </svg>
            Posts
        </button>
        <button type="button" class="lean-tab" data-tab="other_content">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/>
                <polyline points="3.27 6.96 12 12.01 20.73 6.96"/>
                <line x1="12" y1="22.08" x2="12" y2="12"/>
            </svg>
            Other
        </button>
        <button type="button" class="lean-tab" data-tab="hourly">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <circle cx="12" cy="12" r="10"/>
                <polyline points="12 6 12 12 16 14"/>
            </svg>
            Hourly
        </button>
        <button type="button" class="lean-tab" data-tab="campaigns">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <path d="M18 8h1a4 4 0 0 1 0 8h-1M2 8h16v9a4 4 0 0 1-4 4H6a4 4 0 0 1-4-4V8z"/>
                <line x1="6" y1="1" x2="6" y2="4"/>
                <line x1="10" y1="1" x2="10" y2="4"/>
                <line x1="14" y1="1" x2="14" y2="4"/>
            </svg>
            Campaigns
        </button>
    </div>
    
    <div id="lean-content" class="lean-main-content">
        <div class="lean-loading">
            <svg class="lean-spinner" width="40" height="40" viewBox="0 0 50 50">
                <circle cx="25" cy="25" r="20" fill="none" stroke-width="4" stroke="currentColor" stroke-dasharray="31.4 31.4" stroke-linecap="round">
                    <animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1s" repeatCount="indefinite"/>
                </circle>
            </svg>
            <p>Loading analytics...</p>
        </div>
    </div>
</div>

<script type="text/javascript">
// Fallback: Define leanAnalyticsAdmin if not already defined by wp_localize_script
if (typeof leanAnalyticsAdmin === 'undefined') {
    <?php
    $host = parse_url(home_url(), PHP_URL_HOST);
    if (in_array($host, array('localhost', '127.0.0.1')) || strpos($host, '.local') !== false || strpos($host, '.test') !== false) {
        $host = 'wpswitchboard.com';
    }
    ?>
    var leanAnalyticsAdmin = {
        ajaxUrl: '<?php echo admin_url('admin-ajax.php'); ?>',
        nonce: '<?php echo wp_create_nonce('lean_analytics_admin'); ?>',
        siteUrl: '<?php echo esc_js($host); ?>',
        canManage: <?php echo current_user_can('manage_options') ? 'true' : 'false'; ?>
    };
}
</script>
