<?php 
/**
 * Template part for displaying Featured Slider Section
 *
 *@package Rock Singer
 */

    $data_slick_speed                = rock_singer_get_option( 'data_slick_speed' );
    $data_slick_fade                 = rock_singer_get_option( 'data_slick_fade' );
    $data_slick_infinite             = rock_singer_get_option( 'data_slick_infinite' );
    $data_slick_autoplay             = rock_singer_get_option( 'data_slick_autoplay' );
    $data_slick_draggable            = rock_singer_get_option( 'data_slick_draggable' );
    $number_of_featured_slider_items = rock_singer_get_option( 'number_of_featured_slider_items' ); ?>

    <?php
        if( $data_slick_fade == 0 ) {
            $data_slick_fade = 'false';
        }
        else {
            $data_slick_fade = 'true';
        }
    ?>

    <?php
        if( $data_slick_infinite == 0 ) {
            $data_slick_infinite = 'false';
        }
        else {
            $data_slick_infinite = 'true';
        }
    ?>

    <?php
        if( $data_slick_autoplay == 0 ) {
            $data_slick_autoplay = 'false';
        }
        else {
            $data_slick_autoplay = 'true';
        }
    ?>

    <?php
        if( $data_slick_draggable == 0 ) {
            $data_slick_draggable = 'false';
        }
        else {
            $data_slick_draggable = 'true';
        }
    ?>

    <div class="section-content" data-slick='{"slidesToShow": 1, "slidesToScroll": 1, "infinite": <?php echo esc_attr( $data_slick_infinite ); ?>, "speed": <?php echo esc_attr( $data_slick_speed ); ?>, "dots": true, "arrows": true, "autoplay": <?php echo esc_attr( $data_slick_autoplay ); ?>, "draggable": <?php echo esc_attr( $data_slick_draggable ); ?>, "fade": <?php echo esc_attr( $data_slick_fade ); ?> }'>

        <?php for( $i=1; $i<=$number_of_featured_slider_items; $i++ ) : 
            $featured_slider_slide_image[$i]  = rock_singer_get_option( 'featured_slider_slide_image_'.$i );
            $featured_slider_title[$i]        = rock_singer_get_option( 'featured_slider_title_'.$i );
            $featured_slider_content[$i]      = rock_singer_get_option( 'featured_slider_content_'.$i );
            $featured_slider_btn_text[$i]     = rock_singer_get_option( 'featured_slider_btn_text_'.$i );
            $featured_slider_btn_url[$i]  = rock_singer_get_option( 'featured_slider_btn_url_'.$i );   
        ?>

        <article style="background-image: url('<?php echo esc_url( $featured_slider_slide_image[$i] ); ?>');">
            <div class="overlay"></div>
            <div class="wrapper">
                <div class="featured-content-wrapper">
                    <?php if( !empty($featured_slider_content[$i]) ): ?>
                        <h3 class="entry-subtitle"><?php echo esc_html( $featured_slider_content[$i] ); ?></h3>
                    <?php endif; ?>
                    
                    <?php if( !empty($featured_slider_title[$i]) ): ?>
                        <h2 class="entry-title"><?php echo esc_html( $featured_slider_title[$i] ); ?></h2>
                    <?php endif; ?>

                    <?php if( !empty($featured_slider_btn_text[$i]) ): ?>
                        <a href="<?php echo esc_attr($featured_slider_btn_url[$i]);?>" class="btn"><?php echo esc_html($featured_slider_btn_text[$i]);?><i class="fa-solid fa-arrow-up-right-from-square"></i></a>
                    <?php endif; ?>
                </div><!-- .featured-content-wrapper -->
            </div><!-- .wrapper -->
        </article>
        <?php endfor; ?>
    </div><!-- .section-content -->