<?php 
/**
 *
 * @package Luzuk
 */
if(get_theme_mod('testimonials_area_disable') != 'on' ){ ?> 

    <?php 
      if( get_theme_mod('testimonials_areaTpadding',true) ) {
        $testimonials_areaTpadding = 'padding-top:'.esc_attr(get_theme_mod('testimonials_areaTpadding')).';';
      }
      if( get_theme_mod('testimonials_areaBpadding',true) ) {
        $testimonials_areaBpadding = 'padding-bottom:'.esc_attr(get_theme_mod('testimonials_areaBpadding')).';';
      }
     
    ?>  
<div class="testimonials-area" id="testimonials" style="<?php echo esc_attr($testimonials_areaTpadding); ?>" "<?php echo esc_attr($testimonials_areaBpadding); ?>">

    <!-- <div class="testimonials-overlay"></div> -->
    <?php
      $testimonials_page_id = get_theme_mod('testimonials_page'); 
      $testimonials_subtitle = get_theme_mod('testimonials_subtitle', 'Heading Here');
      $testimonials_maintitle = get_theme_mod('testimonials_title', 'TESTIMONIALS');
    ?>
      <div class="container">
        
          <?php if($testimonials_maintitle || $testimonials_subtitle){ ?>
            <div class="section-heading">
              <div class="heading-inn">
                <p><?php echo ($testimonials_subtitle);  ?></p>
                  <h2><?php echo ($testimonials_maintitle);  ?></h2>
              </div> 
            </div>
          <?php }?>
        
      </div>

  <div class="container">
    <div class="row row-eq-height">
      <div class="col-md-6 pd-0">
        <div class="testimonials-single-area ">
            <div class="owl-carousel owl-theme">   
               
            <?php 
            $showStatic = true;
            $cols = get_theme_mod('test_npp_count', 3);
            $cols++;
            switch($cols){
              case 1:
                $colCls = 'col-md-12 col-sm-12 col-xs-12';
                break;
              case 2:
                $colCls = 'col-md-6 col-sm-6 col-xs-12';
                break;
              case 3:
              case 5:
              case 6:
              case 7:
              case 8:
              case 9:
              case 10:
              case 11:
              case 12:
                $colCls = 'col-md-4 col-sm-6 col-xs-12';
                break;
              default:
                $colCls = 'col-md-3 col-sm-6 col-xs-12';
                break;
            }
            $icons = array(1=>'heart', 2=>'star', 3=>'flash', 4=>'bell',5=>'heart', 6=>'star', 7=>'flash', 8=>'bell'); 

            for( $i = 1; $i <= $cols; $i++ ){
              $testimonials_page_id = get_theme_mod('testimonials_page'.$i); 
              $testimonials_page_icon = get_theme_mod('testimonials_page_icon'.$i);
              if($testimonials_page_id){
                $showStatic = false;
                echo testimonialShortCode($testimonials_page_id, $isCustomizer=true, $i);
              }
            }
            // adding the static content
            if($showStatic === true){
              for( $i = 1; $i <= $cols; $i++ ){ ?>
              <div class="item">        
                <div class="ts-area-single pd-0">
                  <div class="ts-inn">
                      <div class="ts-area-thumb">
                        <i class="fa fa-quote-left" aria-hidden="true"></i>
                        <img class="img-responsive" src="<?php echo get_template_directory_uri(); ?>/images/testimonial.jpg" alt="">
                      </div>

                       <div class="ts-area-content">
                          <p>Dolor sit amet, consectetur adipiscing elit. Vivamus eu pharetra ex. Etiam eget diam ligula. Sed at blandit ante. Vivam tortor mi aliquam.</p> 
                            <h6 class="ts-area-title">Mr. Jems Bond</h6> 
                      </div>
                      <div class="clearfix"></div>
                  </div>
                </div>
              </div>
              
              <?php 
              }
            } ?>
          </div>
          <div class="clearfix"></div>
        </div>
         <div class="clearfix"></div>
      </div>

      <!-- ============skill======================= -->
      <div class="col-md-6 pd-0">

        <div class="skill-area">  

          <?php
            $showStatic = true;
            for( $i = 1; $i < 11; $i++ ){
               $url = get_theme_mod('luzuk_skill_page_url_'.$i, '#');
              $skill_page_id = get_theme_mod('skill_page_icon'.$i); 
              if(!empty($skill_page_id)){
                $showStatic = false;
                break;
              }
            }
          ?>
        <?php
        $cols = get_theme_mod('skill_npp_count', 2);
        $cols++;
        // echo '$cold: '.$cols;
        switch($cols){
          case 1:
          $colCls = 'col-md-12 col-sm-12 col-xs-12';
          break;
          case 2:
          $colCls = 'col-md-12 col-sm-12 col-xs-12';
          break;
          case 3:
          case 6:
          case 5:
          $colCls = 'col-md-12 col-sm-12 col-xs-12';
          break;
          default: 
          $colCls = 'col-md-12 col-sm-12 col-xs-12';
          break;
        }
        $icons = array(1=>'heart', 2=>'star', 3=>'flash', 4=>'bell',5=>'heart', 6=>'star', 7=>'flash', 8=>'bell');
        ?>
        <div class="row skills-box">
          <?php
          for( $i = 1; $i <= $cols; $i++ ){
          if($showStatic === false){
            $url = get_theme_mod('luzuk_skill_page_url_'.$i, '#');
            $skill_page_title = get_theme_mod('skill_page_title'.$i, 'Take Responsibilities');

            $skill_page_id = get_theme_mod('skill_page'.$i); 
            $skill_page_icon = get_theme_mod('skill_page_icon'.$i);
            if($skill_page_icon){
              
            ?>
            <div class="<?php echo $colCls;?> pd-0">
              <div class="skill-single " data-wow-duration="1s">
                <div class="col-md-3 col-sm-2 col-xs-12 pd-0">
                  <a href="<?php echo esc_url(!empty($url)?$url:'#');?>">
                    <div class="hi-icon">
                      <span class="<?php echo $skill_page_icon; ?>"></span>
                    </div>
                  </a>
                </div>
                <div class="col-md-9 col-sm-10 col-xs-10 pd-0">
                  <div class="skill-area-data">
                    <h4 class="inner-area-title"><?php echo $skill_page_title; ?></h4> 
                  </div>
                </div>
                <div class="clearfix"></div>            
              </div>
              <div class="clearfix"></div>
            </div>
            <?php
                
            }
          }else{?>
            <div class="<?php echo $colCls;?> pd-0 ">
                <div class="skill-single " data-wow-duration="1s">
                  <div class="col-md-3 col-sm-2 col-xs-12 pd-0">
                    <a href="#">
                      <div class="hi-icon">
                          <span class="fa fa-qrcode"></span> 
                      </div>
                    </a>
                  </div>

                  <div class="col-md-9 col-sm-10 col-xs-12 pd-0">
                    <div class="skill-area-data">
                      <h4 class="inner-area-title">Take Responsibilities</h4>
                    </div>
                  </div>
                  <div class="clearfix"></div>            
                </div>
                <div class="clearfix"></div>
            </div>
          <?php }

          }?>
          <div class="clearfix"></div>
        </div>
      </div>
      </div>
    </div><!--row-->
  </div><!--container-->

      
    </div>
  </div>
 <script>
        $(document).ready(function() {
          $('.testimonials-area .owl-carousel').owlCarousel({
           slideSpeed : 1500,
            autoplay: true,
              loop: true,
              margin: 30,
              responsiveClass: true,
              responsive: {
                0: {
                  items: 1,
                  nav: true
                },
                600: {
                  items:1,
                  nav: true
                },
                
            }
          })
        })
      </script>
<script type="text/javascript">
  var title = 0;
jQuery(".skill-area .skill-single").each(function(){
  if ($(this).height() > title) { title = $(this).height(); }
});
jQuery(".skill-area .skill-single").height(title);


// on Resize change height

jQuery(window).resize(function(){
  jQuery(".skill-area .skill-single").height("");
  var title = 0;
  jQuery(".skill-area .skill-single").each(function(){
    if ($(this).height() > title) { title = $(this).height(); }
  });
  jQuery(".skill-area .skill-single").height(title);
});
</script>
<script type="text/javascript">
  var title = 0;
jQuery(".skill-area .skill-single").each(function(){
  if ($(this).height() > title) { title = $(this).height(); }
});
jQuery(".skill-area .skill-single").height(title);


// on Resize change height

jQuery(window).resize(function(){
  jQuery(".skill-area .skill-single").height("");
  var title = 0;
  jQuery(".skill-area .skill-single").each(function(){
    if ($(this).height() > title) { title = $(this).height(); }
  });
  jQuery(".skill-area .skill-single").height(title);
});
</script>
<!--         <script>
    jQuery.noConflict();
    $(function(){
      function skillsingleHeight(){
        var ht = 0;
        $('.skill-area .skill-single').each(function(i){
          var tHt = $(this).height();
          if(ht<tHt){
            ht=tHt;
          }
        });
        $('.skill-area .skill-single').height(ht+'px');
      }
      skillsingleHeight();
    });
    $( window ).resize(function(){
      skillsingleHeight();
    });
  </script> -->


<!--   <script>
    jQuery.noConflict();
    $(function(){
      function tsareasingleHeight(){
        var ht = 0;
        $('#testimonials .ts-area-single').each(function(i){
          var tHt = $(this).height();
          if(ht<tHt){
            ht=tHt;
          }
        });
        $('#testimonials .ts-area-single').height(ht+'px');
      }
      tsareasingleHeight();
    });
    $( window ).resize(function(){
      tsareasingleHeight();
    });
  </script>  -->
    <?php }

