<?php
    /**
     * Template Name: Blog (Custom)
     * Description: Własny blog
     */

    get_header();

    $box_1 = get_field('box_1');
    $box_2 = get_field('box_2');
?>
<main id="primary" class="site-main blog-page">
    <section class="box-1">
        <div class="box-bg">
            <img src="<?php echo $box_1['img']; ?>" alt="">
        </div>
        <div class="container">
            <div class="box-wrapper">
                <div class="row row-1">
                    <div id="box-page-name">
                        <?php echo get_the_title(); ?>
                    </div>
                    <div class="box-title">
                        <h2><?php echo $box_1['title']; ?></h2>
                    </div>
                    <div class="box-text">
                        <?php echo $box_1['text']; ?>
                    </div>
                </div>
                <div class="row row-2">
                    <div class="box-nav-title">
                        <p><?php echo $box_1['tag_title']; ?></p>
                    </div>
                    <div class="box-nav-list">
                        <ul>
                            <?php
                            $categories = get_categories([
                                'taxonomy'   => 'category',
                                'hide_empty' => true,
                                'orderby'    => 'name',
                                'order'      => 'ASC',
                            ]);

                            $current_cat = isset($_GET['cat']) ? intval($_GET['cat']) : 0;

                            echo '<li' . ($current_cat === 0 ? ' class="active"' : '') . '>';
                            echo '<a href="' . esc_url(remove_query_arg('cat')) . '"><span>Wszystkie</span></a></li>';

                            foreach ($categories as $cat) :
                                $is_active = ($current_cat === $cat->term_id) ? ' class="active"' : '';
                                $link = add_query_arg('cat', $cat->term_id);
                                ?>
                                <li<?php echo $is_active; ?>>
                                    <a href="<?php echo esc_url($link); ?>">
                                        <span><?php echo esc_html($cat->name); ?></span>
                                    </a>
                                </li>
                            <?php endforeach; ?>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="box-2">
        <div class="container">
            <div class="box-wrapper">
                <div class="row row-1">
                    <div id="blog-posts" class="blog-posts">
                        <?php
                        $current_cat = isset($_GET['cat']) ? intval($_GET['cat']) : 0;

                        $args = [
                            'post_type'      => 'post',
                            'posts_per_page' => 9,
                            'orderby'        => 'date',
                            'order'          => 'DESC',
                        ];

                        if ($current_cat) {
                            $args['cat'] = $current_cat;
                        }

                        $query = new WP_Query($args);

                        if ($query->have_posts()) :
                            while ($query->have_posts()) : $query->the_post();

                                get_template_part('inc/template-article-card', null, [
                                    'image' => get_the_post_thumbnail_url(get_the_ID(), 'medium_large'),
                                    'title' => get_the_title(),
                                    'link'  => get_the_permalink(),
                                    'category' => get_the_category()
                                ]);

                            endwhile;
                        endif;

                        wp_reset_postdata();
                        ?>
                    </div>
                </div>
                <?php if ($query->found_posts > 9) : ?>
                    <div class="row row-2">
                        <button class="btn-3" id="load-more">
                            Wczytaj więcej
                        </button>
                    </div>
                <?php endif; ?>
            </div>
        </div>
    </section>

    <section class="box-3">
        <div class="box-bg">
            <img src="/wp-content/uploads/2025/10/img-6.svg" alt="">
        </div>
        <div class="container">
            <div class="row">
                <div class="col-1">
                    <div class="box-img">
                        <img src="<?php echo $box_2['img']; ?>" alt="">
                    </div>
                </div>
                <div class="col-2">
                    <div class="box-title">
                        <h2><?php echo $box_2['title']; ?></h2>
                    </div>
                    <div class="box-text">
                        <?php echo $box_2['text']; ?>
                    </div>
                    <div class="box-nav">
                        <?php if ($box_2['btn']['title']): ?>
                        <a class="btn-2" href="<?php echo $box_2['btn']['url']; ?>"><?php echo $box_2['btn']['title']; ?></a>
                        <?php endif; ?>
                    </div>
                </div>
            </div>
        </div>
    </section>
</main>
<?php get_footer(); ?>