<?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" style="<?php echo esc_attr($counter_areaTpadding); ?>" "<?php echo esc_attr($counter_areaBpadding); ?>">
		<div class="counter-overlay"></div>
		 <?php
	          $showStatic = true;
	          for( $i = 1; $i < 9; $i++ ){
	            $counter_page_id = get_theme_mod('counter_page_num'.$i); 
	            if(!empty($counter_page_id)){
	              $showStatic = false;
	              break;
	            }
	          }
         ?>
			<div class="container">  
					<div class="counter-single-area">  
						<?php
						$cols = get_theme_mod('counter_npp_count', 3);
						$cols++;
									// echo '$cold: '.$cols;
						switch($cols){
							case 1:
							$colCls = 'col-md-12 col-sm-6 col-xs-12 ';
							break;
							case 2:	
							$colCls = 'col-md-6 col-sm-6 col-xs-6 col-6';
							break;
							case 3:
							case 5:
							case 6:
							case 9:
							case 11:
							case 13:
							case 15:
							$colCls = 'col-md-4 col-sm-6 col-xs-6 col-6';
							break;
							default: 
							$colCls = 'col-md-3 col-sm-6 col-xs-6 col-6';
							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, 'Screens Place');
		                          	$counter_page_num = get_theme_mod('counter_page_num'.$i, '341+');
		                          	//$counter_page_text = get_theme_mod('counter_page_text'.$i, 'Professional Service');
		                      		$counter_page_num = get_theme_mod('counter_page_num'.$i);
		                      if($counter_page_num){
		                          ?>

                  <div class="<?php echo $colCls;?> single-top wow zoomIn">
                      <div class="cd-single">
                        	<div class="count-box">
                        		<div class="count-border"></div>
                        			<div class="cd-num count"><?php echo $counter_page_num; ?> </div>
                        			<div class="cd-title inner-area-title"><?php echo $counter_page_title; ?></div>
                        	</div>
                      		<div class="clearfix"></div>
                    	</div>
                      <div class="clearfix"></div>
                  </div>
		                <?php
		               }
		                          
		              }else{?>
                  <div class="<?php echo $colCls;?> single-top wow zoomIn ">
                        <div class="cd-single">
                          	<div class="count-box">	
                          			<div class="count-border"></div>
                          			<div class="cd-num count">341+</div>
                          			<div class="cd-title inner-area-title">Screens Place </div>
                          	</div>
                        	<div class="clearfix"></div>
                      </div>
                      <div class="clearfix"></div>
                  </div>
		                <?php }
		              }?>
		              <div class="clearfix"></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 } 