<?php
/**
 * Template Name: Home Template
 */

get_header(); ?>

<main id="skip-content">
<?php if ( get_theme_mod( 'electronics_equipment_slider_section_setting', false ) ) { ?>
  <section id="top-slider">
    <div class="p-0 slider-mainn">
      <?php
        $electronics_equipment_slide_defaults = array(
          1 => __( 'Premium Smartphones',   'electronics-equipment' ),
          2 => __( 'Top Laptops',           'electronics-equipment' ),
          3 => __( 'Smart Accessories',     'electronics-equipment' ),
        );
        $electronics_equipment_slides = array();
        for ( $electronics_equipment_count = 1; $electronics_equipment_count <= 3; $electronics_equipment_count++ ) {
          $electronics_equipment_slide_def   = isset( $electronics_equipment_slide_defaults[ $electronics_equipment_count ] ) ? $electronics_equipment_slide_defaults[ $electronics_equipment_count ] : '';
          $electronics_equipment_slide_title = get_theme_mod( 'electronics_equipment_slide_title_' . $electronics_equipment_count, $electronics_equipment_slide_def );
          $electronics_equipment_slide_image = get_theme_mod( 'electronics_equipment_slide_image_' . $electronics_equipment_count, '' );
          if ( ! empty( $electronics_equipment_slide_title ) || ! empty( $electronics_equipment_slide_image ) ) {
            $electronics_equipment_slides[] = $electronics_equipment_count;
          }
        }
        if ( ! empty( $electronics_equipment_slides ) ) :
          $electronics_equipment_slide_counter = 1;
      ?>
      <div class="owl-carousel" role="listbox" data-slide-count="<?php echo esc_attr( count( $electronics_equipment_slides ) ); ?>">
        <?php foreach ( $electronics_equipment_slides as $electronics_equipment_slide_index ) :
          $electronics_equipment_slide_def   = isset( $electronics_equipment_slide_defaults[ $electronics_equipment_slide_index ] ) ? $electronics_equipment_slide_defaults[ $electronics_equipment_slide_index ] : '';
          $electronics_equipment_slide_title       = get_theme_mod( 'electronics_equipment_slide_title_'       . $electronics_equipment_slide_index, $electronics_equipment_slide_def );
          $electronics_equipment_slide_description = get_theme_mod( 'electronics_equipment_slide_description_' . $electronics_equipment_slide_index, '' );
          $electronics_equipment_slide_image       = get_theme_mod( 'electronics_equipment_slide_image_'       . $electronics_equipment_slide_index, '' );
        ?>
          <div class="slide-box" data-count="<?php echo esc_attr( $electronics_equipment_slide_counter ); ?>">

            <div class="row g-0 slider-split-row">

              <!-- Left: Content -->
              <div class="col-lg-6 slider-content-col">
                <div class="slider-inner-box">

                  <?php
                  $electronics_equipment_short_heading = get_theme_mod( 'electronics_equipment_slider_short_heading' );
                  if ( ! empty( $electronics_equipment_short_heading ) ) { ?>
                    <p class="slider-short-tag">
                      <?php echo esc_html( $electronics_equipment_short_heading ); ?>
                    </p>
                  <?php } ?>

                  <h2 class="slider-main-title">
                    <?php echo esc_html( $electronics_equipment_slide_title ); ?>
                  </h2>

                  <div class="slider-title-divider"></div>

                  <p class="post-excerpt">
                    <?php echo esc_html( wp_trim_words( $electronics_equipment_slide_description, 25, '...' ) ); ?>
                  </p>

                  <div class="slide-btn mt-4">
                    <a href="<?php echo esc_url( get_theme_mod( 'electronics_equipment_slider_button_url' ) ); ?>">
                      <?php echo esc_html( get_theme_mod( 'electronics_equipment_slider_button_text', __( 'SHOP Now', 'electronics-equipment' ) ) ); ?>
                    </a>
                  </div>

                </div>
              </div><!-- /slider-content-col -->

              <!-- Right: Image -->
              <div class="col-lg-6 slider-image-col">

                <?php
                $electronics_equipment_slider_bg_word = get_theme_mod( 'electronics_equipment_slider_bg_word', '' );
                if ( ! empty( $electronics_equipment_slider_bg_word ) ) { ?>
                  <div class="slider-bg-word" aria-hidden="true">
                    <?php echo esc_html( $electronics_equipment_slider_bg_word ); ?>
                  </div>
                <?php } ?>

                <div class="slider-product-img">
                  <?php if ( ! empty( $electronics_equipment_slide_image ) ) { ?>
                    <img
                      class="img-fluid"
                      src="<?php echo esc_url( $electronics_equipment_slide_image ); ?>"
                      alt="<?php echo esc_attr( $electronics_equipment_slide_title ); ?>"
                    />
                  <?php } else { ?>
                    <img
                      class="img-fluid"
                      src="<?php echo esc_url( get_template_directory_uri() . '/assets/img/slider1.png' ); ?>"
                      alt="<?php echo esc_attr__( 'Default Slider Image', 'electronics-equipment' ); ?>"
                    />
                  <?php } ?>
                </div>

              </div><!-- /slider-image-col -->

            </div><!-- /slider-split-row -->

          </div>
        <?php $electronics_equipment_slide_counter++; endforeach; ?>
      </div>
      <?php else : ?>
        <div class="no-postfound"></div>
      <?php endif; ?>
      
    </div>
  </section>
<?php }?>

<?php if ( get_theme_mod( 'electronics_equipment_trending_section_setting', false ) != '' ) { ?>
  <section id="trending-products" class="py-5">
    <div class="container">

      <div class="trending-header d-flex align-items-center justify-content-between flex-wrap mb-4 gap-3">

        <?php $electronics_equipment_trending_heading = get_theme_mod( 'electronics_equipment_trending_section_heading', '' );
        if ( ! empty( $electronics_equipment_trending_heading ) ) { ?>
          <h2 class="trending-main-heading mb-0"><?php echo esc_html( $electronics_equipment_trending_heading ); ?></h2>
        <?php } ?>

        <div class="d-flex align-items-center flex-wrap gap-2">
          <ul class="nav trending-tabs" id="trendingTabs" role="tablist">
            <?php
              $electronics_equipment_tab_count = absint( get_theme_mod( 'electronics_equipment_trending_tab_number', 5 ) );
              $electronics_equipment_first_btn = true;
              for ( $electronics_equipment_t = 1; $electronics_equipment_t <= $electronics_equipment_tab_count; $electronics_equipment_t++ ) :
                $electronics_equipment_tab_title = get_theme_mod( 'electronics_equipment_trending_tab_title_' . $electronics_equipment_t, '' );
                if ( empty( $electronics_equipment_tab_title ) ) continue;
            ?>
              <li class="nav-item" role="presentation">
                <button class="nav-link<?php echo $electronics_equipment_first_btn ? ' active' : ''; ?>"
                        id="trending-tab-<?php echo esc_attr( $electronics_equipment_t ); ?>"
                        data-bs-toggle="tab"
                        data-bs-target="#trending-pane-<?php echo esc_attr( $electronics_equipment_t ); ?>"
                        type="button" role="tab"
                        aria-controls="trending-pane-<?php echo esc_attr( $electronics_equipment_t ); ?>"
                        aria-selected="<?php echo $electronics_equipment_first_btn ? 'true' : 'false'; ?>">
                  <?php echo esc_html( $electronics_equipment_tab_title ); ?>
                </button>
              </li>
            <?php $electronics_equipment_first_btn = false; endfor; ?>
          </ul>

          <?php $electronics_equipment_view_all = get_theme_mod( 'electronics_equipment_trending_view_all_url', '' );
          if ( ! empty( $electronics_equipment_view_all ) ) { ?>
            <a href="<?php echo esc_url( $electronics_equipment_view_all ); ?>" class="trending-view-all-btn">
              <?php esc_html_e( 'View All', 'electronics-equipment' ); ?>
            </a>
          <?php } ?>
        </div>
      </div>

      <div class="tab-content" id="trendingTabContent">
        <?php
          $electronics_equipment_tab_count     = absint( get_theme_mod( 'electronics_equipment_trending_tab_number', 5 ) );
          $electronics_equipment_products_num  = absint( get_theme_mod( 'electronics_equipment_trending_products_per_tab', 8 ) );
          $electronics_equipment_first_tab     = true;
          for ( $electronics_equipment_t = 1; $electronics_equipment_t <= $electronics_equipment_tab_count; $electronics_equipment_t++ ) :
            $electronics_equipment_tab_title    = get_theme_mod( 'electronics_equipment_trending_tab_title_' . $electronics_equipment_t, '' );
            if ( empty( $electronics_equipment_tab_title ) ) continue;
            $electronics_equipment_tab_category = get_theme_mod( 'electronics_equipment_trending_tab_category_' . $electronics_equipment_t, '' );

            $electronics_equipment_args = array(
              'post_type'      => 'product',
              'posts_per_page' => $electronics_equipment_products_num,
              'orderby'        => 'date',
              'order'          => 'DESC',
              'status'         => 'publish',
            );
            if ( ! empty( $electronics_equipment_tab_category ) ) {
              $electronics_equipment_args['tax_query'] = array(
                array(
                  'taxonomy' => 'product_cat',
                  'field'    => 'slug',
                  'terms'    => sanitize_title( $electronics_equipment_tab_category ),
                ),
              );
            }
            $electronics_equipment_loop = new WP_Query( $electronics_equipment_args );
        ?>
          <div class="tab-pane fade <?php echo $electronics_equipment_first_tab ? 'show active' : ''; ?>"
               id="trending-pane-<?php echo esc_attr( $electronics_equipment_t ); ?>"
               role="tabpanel"
               aria-labelledby="trending-tab-<?php echo esc_attr( $electronics_equipment_t ); ?>">

            <?php if ( class_exists( 'WooCommerce' ) && $electronics_equipment_loop->have_posts() ) : ?>
              <div class="row row-cols-1 row-cols-md-3 row-cols-lg-4 g-4">
                <?php while ( $electronics_equipment_loop->have_posts() ) : $electronics_equipment_loop->the_post();
                  global $product; ?>
                  <div class="col">
                    <div class="trending-product-card">
                      <div class="trending-product-img-wrap">
                        <?php
                          $electronics_equipment_regular = (float) $product->get_regular_price();
                          $electronics_equipment_sale    = (float) $product->get_sale_price();
                          if ( $product->is_on_sale() && $electronics_equipment_sale > 0 && $electronics_equipment_regular > 0 ) {
                            $electronics_equipment_discount = round( ( ( $electronics_equipment_regular - $electronics_equipment_sale ) / $electronics_equipment_regular ) * 100 );
                            echo '<span class="trending-discount-badge">' . esc_html( $electronics_equipment_discount ) . '%</span>';
                          }
                        ?>

                        <a href="<?php the_permalink(); ?>">
                          <?php if ( has_post_thumbnail() ) {
                            the_post_thumbnail( 'woocommerce_thumbnail', array( 'class' => 'img-fluid' ) );
                          } else {
                            echo '<img src="' . esc_url( wc_placeholder_img_src() ) . '" alt="' . esc_attr__( 'Placeholder', 'electronics-equipment' ) . '" class="img-fluid" />';
                          } ?>
                        </a>

                        <?php if ( defined( 'YITH_WCWL' ) ) { ?>
                          <div class="trending-wishlist-wrap">
                            <?php echo do_shortcode( '[yith_wcwl_add_to_wishlist]' ); ?>
                          </div>
                        <?php } ?>
                      </div>

                      <div class="trending-product-info">
                        <h4 class="trending-product-title">
                          <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
                        </h4>
                        <div class="trending-product-meta d-flex align-items-center justify-content-between">
                          <div class="trending-product-price">
                            <?php echo wp_kses_post( $product->get_price_html() ); ?>
                          </div>
                          <?php $electronics_equipment_avg = $product->get_average_rating();
                          if ( $electronics_equipment_avg > 0 ) { ?>
                            <div class="trending-product-rating">
                              <i class="fas fa-star" aria-hidden="true"></i>
                              <span><?php echo esc_html( number_format( (float) $electronics_equipment_avg, 1 ) ); ?></span>
                            </div>
                          <?php } ?>
                        </div>
                        <div class="trending-product-atc">
                          <?php if ( $product->is_type( 'simple' ) ) {
                            woocommerce_template_loop_add_to_cart();
                          } else { ?>
                            <a href="<?php the_permalink(); ?>" class="button">
                              <?php esc_html_e( 'Select Options', 'electronics-equipment' ); ?>
                            </a>
                          <?php } ?>
                        </div>
                      </div>

                    </div>
                  </div>
                <?php endwhile; wp_reset_postdata(); ?>
              </div>
            <?php else : ?>
              <p class="text-center py-4"><?php esc_html_e( 'No products found.', 'electronics-equipment' ); ?></p>
            <?php endif; ?>

          </div>
        <?php $electronics_equipment_first_tab = false; endfor; ?>
      </div>

    </div>
  </section>
<?php } ?>
  <section id="page-content">
    <div class="container">
      <div class="py-3">
        <?php
          if ( have_posts() ) :
            while ( have_posts() ) : the_post();
              the_content();
            endwhile;
          endif;
        ?>
      </div>
    </div>
  </section>
</main>

<?php get_footer(); ?>
