<div class="cms-carousel-wrap">
    <div class="cms-carousel cms-dot-container cms-carousel-layout1 <?php echo esc_attr($atts['template']);?>" id="<?php echo esc_attr($atts['html_id']);?>" data-dotData="true">
        <?php
        $posts = $atts['posts'];
        while($posts->have_posts()){
            $posts->the_post();
            $size = 'full';
            $carousel_meta = wp_yellow_hats_post_meta_data();
            ?>
            <div class="cms-carousel-item">
                    <?php 
                        if(has_post_thumbnail() && !post_password_required() && !is_attachment() &&  wp_get_attachment_image_src(get_post_thumbnail_id(get_the_ID()), $size, false)):
                            $class = ' has-feature-img';
                            $thumbnail_url = wp_get_attachment_image_src(get_post_thumbnail_id(get_the_ID()), $size, false);
                            $thumbnail = get_the_post_thumbnail(get_the_ID(),'full');
                        else:
                            $class = ' no-feature-img';
                            $thumbnail_url[0] = get_template_directory_uri(). '/assets/images/no-image.jpg';
                            $thumbnail = '<img src="'.get_template_directory_uri(). '/assets/images/no-image.jpg" alt="'.get_the_title().'" />';
                        endif;
                    ?>
                    <div class="cms-carousel-inner">
                        <div class="cms-carousel-image <?php echo esc_attr($class); ?>">
                            <?php echo ''.$thumbnail.''; ?>
                        </div>

                        <?php if(!empty($carousel_meta->_cms_carousel_title)) { ?>
                            <div class="cms-carousel-content">
                                <?php if(!empty($carousel_meta->_cms_carousel_subtitle)) { ?>
                                    <span class="cms-carousel-subtitle"><?php echo esc_attr($carousel_meta->_cms_carousel_subtitle); ?></span>
                                <?php } ?>
                                <h3 class="cms-carousel-title">
                                    <?php echo esc_attr($carousel_meta->_cms_carousel_title); ?>
                                </h3>
                                
                                <div class="cms-carousel-readmore">
                                    <?php if(!empty($carousel_meta->_cms_carousel_buttun_text1)) { ?>
                                        <a class="btn btn-primary size-default" href="<?php echo esc_url($carousel_meta->_cms_carousel_buttun_url1); ?>">
                                            <?php echo esc_attr($carousel_meta->_cms_carousel_buttun_text1); ?>
                                        </a>
                                    <?php } ?>

                                    <?php if(!empty($carousel_meta->_cms_carousel_buttun_text2)) { ?>
                                        <a class="btn btn-secondary-alt size-default" href="<?php echo esc_url($carousel_meta->_cms_carousel_buttun_url2); ?>">
                                            <?php echo esc_attr($carousel_meta->_cms_carousel_buttun_text2); ?>
                                        </a>
                                    <?php } ?>
                                </div>
                                
                            </div>
                        <?php } ?>
                        
                    </div>
                </div>
            <?php
        }
        ?>
    </div>
    <div class="cms-dots">
        <?php
        $posts = $atts['posts'];
        while($posts->have_posts()){
            $posts->the_post();
            ?>
            <?php
            if(has_post_thumbnail()):
                $class = ' has-thumbnail';
                $thumbnail_url_dot = wp_get_attachment_url(get_post_thumbnail_id(get_the_ID(),'full'));
            else:
                $class = ' no-image';
                $thumbnail_url_dot = '' .get_template_directory_uri(). '/assets/images/no-image.jpg';
            endif;
            ?>

            <div class="item-dot" style="background-image:url(<?php echo esc_url($thumbnail_url_dot)?>);"> </div>
            <?php
        }
        ?>
    </div>
</div>