<?php
add_action( 'elementor/widget/archive-posts/skins_init', function( $widget ) {
    class Generator_Archive_Skin extends \ElementorPro\Modules\ThemeBuilder\Skins\Posts_Archive_Skin_Cards {
        public function get_id() {
            return 'generators';
        }

        public function get_title() {
            return 'Generators';
        }

        protected function render_loop_header() {
            parent::render_loop_header();
            ?>
            <p class="content-navigation">
                <?php
                // Set Taxonomy
                $taxonomy = 'component';
                // Load Taxonomy Terms (for performance see https://core.trac.wordpress.org/ticket/36846)
                $terms = get_terms( array( 'taxonomy' => $taxonomy ) );
                // Output Terms
                if ( $terms ) {
                    // Show "All" item
                    $class = is_post_type_archive() ? ' class="current"' : '';
                    echo '    <a href="' . home_url( '/generator/' ) . '"' . $class . '>' . __( 'All', 'GenerateWP' ) . '</a>' . "\n";
                    // Show other terms
                    foreach ( $terms as $term ) {
                        $class = is_tax( 'component', $term ) ? ' class="current"' : '';
                        echo '    <a href="' . home_url( '/' . $taxonomy . '/' . $term->slug ) . '/"' . $class . '>' . esc_html( $term->name ) . '</a>' . "\n";
                    }
                } ?>
            </p>
            <div class="row">
            <?php
        }

        protected function render_loop_footer() {
            ?></div><?php
            return parent::render_loop_footer();
        }

        protected function render_post() {
            ?>
            <div class="col-xs-12 col-sm-6 col-md-4">
                <div class="generators">
                    <div class="entry-thumbnail">
                        <a href="<?php the_permalink(); ?>">
                            <?php
                            if ( has_post_thumbnail() ) {
                                echo get_the_post_thumbnail( get_the_ID(), 'large', array( 'class' => 'img-responsive' ) );
                            } else {
                                echo '<img src="https://placeholdit.imgix.net/~text?txtsize=130&amp;txt=&amp;w=600&amp;h=238" class="img-responsive">';
                            }
                            ?>
                            <h3><?php the_title(); ?></h3>
                        </a>
                        <?php
                        if ( ! empty( get_post_meta( get_the_ID(), 'badge_class', true ) ) ) {
                            ?><div class="<?php echo get_post_meta( get_the_ID(), 'badge_class', true ); ?>"><span><?php echo get_post_meta( get_the_ID(), 'badge_title', true ); ?></span></div><?php
                        }
                        ?>
                    </div>
                    <p><?php echo wp_strip_all_tags( get_the_excerpt() ); ?></p>
                </div>
            </div>
            <?php
        }
    }
    // register the skin to the archive posts widget
    $widget->add_skin( new Generator_Archive_Skin( $widget ) );
} );