<?php
/**
 * The template for displaying single Proto Project posts
 *
 * @package Proto_Previewer
 */

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

// If viewed directly, render the full InVision Player experience
if (!isset($_GET['overview'])) {
    $player_template = PROTO_PREVIEW_PLUGIN_DIR . 'templates/player.php';
    if (file_exists($player_template)) {
        require_once $player_template;
        exit;
    }
}

get_header();
?>

<main id="primary" class="site-main">
    <div class="site-container">
        
        <?php while (have_posts()) : the_post(); 
            $project_id = get_the_ID();
            $screens = get_post_meta($project_id, '_proto_screens', true) ?: [];
            $clients = wp_get_post_terms($project_id, 'proto_client', ['fields' => 'names']);
            $client_name = !empty($clients) ? $clients[0] : (get_post_meta($project_id, '_proto_client_name', true) ?: 'Client Stakeholder');
            $player_url = home_url('/?proto_preview=1&project_id=' . $project_id);
        ?>
            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?> style="background: #fff; border-radius: 1rem; border: 1px solid #e2e8f0; padding: 2.5rem; margin-bottom: 2rem;">
                
                <header class="entry-header" style="margin-bottom: 2rem; border-bottom: 1px solid #f1f5f9; padding-bottom: 1.5rem;">
                    <span style="font-size: 0.8rem; font-weight: 800; color: #b02b2b; text-transform: uppercase; letter-spacing: 0.05em; display: block; margin-bottom: 0.5rem;">
                        <?php echo esc_html($client_name); ?>
                    </span>
                    <h1 class="entry-title" style="margin: 0 0 1rem 0;"><?php the_title(); ?></h1>
                    
                    <div style="display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;">
                        <a href="<?php echo esc_url($player_url); ?>" class="btn btn-primary" target="_blank">
                            🚀 Launch InVision Player ↗
                        </a>
                        <?php if (current_user_can('edit_post', $project_id)) : ?>
                            <a href="<?php echo esc_url(get_edit_post_link($project_id)); ?>" class="btn btn-secondary">
                                ✏️ Edit Screens in Admin
                            </a>
                        <?php endif; ?>
                    </div>
                </header>

                <div class="entry-content">
                    <h3>Project Scope & Review Brief</h3>
                    <?php the_content(); ?>

                    <h3 style="margin-top: 2.5rem; margin-bottom: 1rem;">Screen Flows Included</h3>
                    <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem;">
                        <?php foreach ($screens as $s_idx => $s) : ?>
                            <div style="background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.75rem; padding: 1rem;">
                                <span style="font-size: 0.7rem; font-weight: 800; color: #64748b;">SCREEN #<?php echo ($s_idx + 1); ?></span>
                                <h4 style="margin: 0.25rem 0 0.5rem 0; font-size: 1.1rem;"><?php echo esc_html($s['name'] ?? 'Screen'); ?></h4>
                                <span style="font-size: 0.75rem; color: #94a3b8; font-family: monospace;">/<?php echo esc_html($s['slug'] ?? 'slug'); ?></span>
                                <div style="margin-top: 0.75rem; font-size: 0.75rem; color: #475569;">
                                    <?php echo count($s['layouts'] ?? []); ?> Variation Options
                                </div>
                            </div>
                        <?php endforeach; ?>
                    </div>
                </div>

            </article>
        <?php endwhile; ?>

    </div>
</main>

<?php
get_footer();
