<?php
    /**
     * Template Name: Web Stories
     */
    use BlogPostx\CustomizerDefault as BPX;
    get_header();

        $image_hover = BPX\blog_postx_get_customizer_option( 'site_image_hover_effects' );
        $image_size = BPX\blog_postx_get_customizer_option( 'web_stories_image_sizes' );
        $show_preview_count = true;
        $show_preview_title = true;

        $sectionClass[] = 'blog-postx-web-stories';
        $sectionClass[] = 'hover--' . $image_hover;
        $categories = get_categories([
            'hide_empty'    =>  true
        ]);

        ?>
            <section class="<?php echo esc_attr( implode( ' ', $sectionClass ) ); ?>">
                <div class="blog-postx-container">
                    <div class="row">
                        <h2 class="section-title"><span class="divider"></span><span class="title"><?php esc_html_e( 'Today\'s Stories', 'blog-postx' ); ?></span></h2>
                        <div class="stories-wrap">
                            <?php
                                if( ! is_null( $categories ) && is_array( $categories ) ) :
                                    foreach( $categories as $cat_key => $cat_value ) :
                                        $category_query_args = [
                                            'cat'   =>  absint( $cat_value->term_id ),
                                            'meta_query'    =>  [
                                                [
                                                    'key'   =>  '_thumbnail_id',
                                                    'compare'   =>  'EXISTS'
                                                ]
                                            ],
                                            'ignore_stick_posts'    =>  true,
                                            'fields'    =>  'ids',
                                            'no_found_rows' =>  true
                                        ];
                                        $category_query = new WP_Query( apply_filters( 'blog_postx_query_args_filter', $category_query_args ) );
                                        $preview_title = '';
                                        if( $category_query->have_posts() ) :
                                            $first_post = $category_query->posts[0];
                                            $thumbnail_id = ( $first_post != null ) ? $first_post : '';
                                            $preview_title = get_the_title( $first_post );
                                        else:
                                            $thumbnail_id = '';
                                        endif;
                                        $template_part_args = [
                                            'cat_value' =>  $cat_value,
                                            'thumbnail_id'  =>  $thumbnail_id,
                                            'image_size'  =>  $image_size,
                                            'show_preview_count'    =>  $show_preview_count,
                                            'preview_title'    =>  $preview_title,
                                            'show_preview_title'    =>  $show_preview_title,
                                        ];
                                        get_template_part( 'template-parts/content', 'web-stories', $template_part_args );
                                    endforeach;
                                endif;
                            ?>
                        </div>
                        <div class="inner-stories-wrap">
                            <div class="inner-stories"></div>
                            <div class="action-buttons">
                                <button class="action-btn close"><i class="fa-solid fa-xmark"></i></button>
                                <button class="action-btn pause"><i class="fa-solid fa-pause"></i></button>
                            </div>
                            <div class="story-arrows"></div>
                        </div>
                    </div>
                </div>
            </section>
        <?php

    get_footer();