<?php

if(get_theme_mod('counter_area_disable') != 'on' ){
	?>
	<?php 
		if( get_theme_mod('counter_areaTpadding',true) ) {
			$counter_areaTpadding = 'padding-top:'.esc_attr(get_theme_mod('counter_areaTpadding')).';';
		}
		if( get_theme_mod('counter_areaBpadding',true) ) {
			$counter_areaBpadding = 'padding-bottom:'.esc_attr(get_theme_mod('counter_areaBpadding')).';';
		}
			if( get_theme_mod('counter_areaOpacity',true) ) {
			$counter_areaOpacity = 'opacity:'.esc_attr(get_theme_mod('counter_areaOpacity')).';';
		}
	?>		
	<div class="counter-area" id="counter" >
		<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 126.557 687.571">
			  <g id="pipe_" data-name="pipe " transform="translate(-1400 -2570.083)">
				    <path id="Path_8" data-name="Path 8" d="M1458.091,2513.083H1395.75l-1.011,564.483h-28.648v88.088h108.467" transform="translate(52 72)" fill="none" stroke="#d9d9d9" stroke-linejoin="round" stroke-width="30"/>
				    <rect id="Rectangle_29" data-name="Rectangle 29" width="13" height="37" rx="6.5" transform="translate(1437 3175) rotate(90)" fill="#bcbcbc"/>
				    <rect id="Rectangle_30" data-name="Rectangle 30" width="13" height="40" rx="6.5" transform="translate(1443.591 3217.654)" fill="#bcbcbc"/>
				    <rect id="Rectangle_27" data-name="Rectangle 27" width="13" height="40" rx="6.5" transform="translate(1466 3101) rotate(90)" fill="#bcbcbc"/>
				    <rect id="Rectangle_26" data-name="Rectangle 26" width="13" height="40" rx="6.5" transform="translate(1468 2629) rotate(90)" fill="#bcbcbc"/>
			  </g>
		</svg>
		 <?php
	          $showStatic = true;
	          for( $i = 1; $i < 9; $i++ ){
	            $counter_page_id = get_theme_mod('counter_page_icon'.$i); 
	            if(!empty($counter_page_id)){
	              $showStatic = false;
	              break;
	            }
	          }
         ?>
      <div class="container">
					<div class="row">  
							<div class="col-lg-6 col-md-12">  
									<div class="counter-img">
										
										<?php 
											$counter_image = get_theme_mod('counter_image');
											if(!empty($counter_image)){
												echo '<img alt="'. esc_html(get_the_title()) .'" src="'.esc_url($counter_image).'" class="img-responsive secondry-bg-img" />';
											}else{
												echo '<img src="'.get_template_directory_uri().'/images/counterimg.png" class="img-responsive" />';
											}

										?>
											
									</div>
							</div>
							<div class="col-lg-6 col-md-12">  
									<div class="counter-single-area">  
										<?php
												$counter_maintitle = get_theme_mod('counter_maintitle', 'Count Visitors, Boost ');
												$counter_subtitle = get_theme_mod('counter_subtitle', 'Success Now');
											
										?>
										<div class="countertures-title ">
												<h2><?php echo ($counter_maintitle);  ?></h2>
												<h3><?php echo ($counter_subtitle);  ?></h3>
										</div>
										<?php
										$cols = get_theme_mod('counter_npp_count', 3);
										$cols++;
													// echo '$cold: '.$cols;
										switch($cols){
											case 1:
											$colCls = 'col-lg-6 col-md-6 col-sm-6 col-xs-12';
											break;
											case 2:	
											$colCls = 'col-lg-6 col-md-6 col-sm-6 col-xs-12';
											break;
											case 3:
											case 5:
											case 6:
											case 9:
											case 11:
											case 13:
											case 15:
											$colCls = 'col-lg-6 col-md-6 col-sm-6 col-xs-12';
											break;
											default: 
											$colCls = 'col-lg-6 col-md-6 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');
										?>
						 					<div class="row counter-post-boxes">
		                      <?php
			                      for( $i = 1; $i <= $cols; $i++ ){
			                        if($showStatic === false){
			                         	$counter_page_id = get_theme_mod('counter_page'.$i);
			                          $counter_page_title = get_theme_mod('counter_page_title'.$i, 'PROJECT DONE');
			                          $counter_page_num = get_theme_mod('counter_page_num'.$i, '1316+');
			                      		$counter_page_icon = get_theme_mod('counter_page_icon'.$i);
			                      if($counter_page_icon){
		                      ?>

		                      <div class="<?php echo $colCls;?> single-top">
		                          <div class="cd-single">
		                            	<div class="count-box">
		                            			<div class="row">
		                            					<div class="col-lg-4 col-md-5 col-sm-4 col-4">
					                            			<div class="cd-icon">
						                                  	<span class="<?php echo $counter_page_icon; ?>"></span>
						                                </div>
					                              	</div>
					                              	<div class="col-lg-8 col-md-7 col-sm-8 col-8">
					                              			<div class="cd-txt">
		                            									<div class="cd-num">
		                            											<?php echo $counter_page_num; ?>
		                            									</div>
		                            									<div class="cd-title inner-area-title">
		                            											<?php echo $counter_page_title; ?>	
		                            									</div>
		                            							</div>
		                           						</div>
		                            			</div>
		                            	</div>
		                          		<div class="clearfix"></div>
		                        	</div>
		                          <div class="clearfix"></div>
		                      </div>
						                <?php
						               }
						                          
						              }else{?>
		                      <div class="<?php echo $colCls;?> single-top ">
		                            <div class="cd-single">
		                              	<div class="count-box">
			                              		<div class="row">
			                              				<div class="col-lg-4 col-md-5 col-sm-4 col-4">
								                              	<div class="cd-icon">
									                                  <span class="fa fa-file-text-o"></span>
									                               </div>
								                            </div>
								                            <div class="col-lg-8 col-md-7 col-sm-8 col-8">
									                              <div class="cd-txt">
								                              			<div class="cd-num count">1316+</div>
								                              			<div class="cd-title inner-area-title">PROJECT DONE</div>
								                              	</div>
								                            </div>
				                              	</div>
		                              	</div>
		                            		<div class="clearfix"></div>
		                          </div>
		                          <div class="clearfix"></div>
		                      </div>
						                <?php }
						              }?>
						              <div class="clearfix"></div>
						          </div>
									</div>
							</div>
					</div>
			</div>
	</div> 
	<!-- counter Area Start -->
<script type="text/javascript">
		var title = 0;
	jQuery("#counter .cd-single").each(function(){
	  if ($(this).height() > title) { title = $(this).height(); }
	});
	jQuery("#counter .cd-single").height(title);


	// on Resize change height

	jQuery(window).resize(function(){
	  jQuery("#counter .cd-single").height("");
	  var title = 0;
	  jQuery("#counter .cd-single").each(function(){
	    if ($(this).height() > title) { title = $(this).height(); }
	  });
	  jQuery("#counter .cd-single").height(title);
	});
</script>
<script>
  $(document).ready(function() {

  var counters = $(".count");
  var countersQuantity = counters.length;
  var counter = [];

  for (i = 0; i < countersQuantity; i++) {
    counter[i] = parseInt(counters[i].innerHTML);
  }

  var count = function(start, value, id) {
    var localStart = start;
    setInterval(function() {
      if (localStart < value) {
        localStart++;
        counters[id].innerHTML = localStart;
      }
    }, 40);
  }

  for (j = 0; j < countersQuantity; j++) {
    count(0, counter[j], j);
  }
});
</script>
	
<?php } 