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

get_header(); ?>

<main id="skip-content" role="main">

	<?php do_action( 'mobile_repair_above_slider' ); ?>

	<?php if( get_theme_mod('mobile_repair_slider_hide_show') != ''){ ?>
		<section id="slider">
			<svg viewBox="0 0 147.19 145.45" class="slider-svg"><defs><style>.cls-2{fill:#ffab1a;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><circle class="cls-2" cx="1.54" cy="1.54" r="1.54"/><circle class="cls-2" cx="15.37" cy="1.54" r="1.54"/><circle class="cls-2" cx="28.17" cy="1.54" r="1.54"/><circle class="cls-2" cx="41.13" cy="1.54" r="1.54"/><circle class="cls-2" cx="54.04" cy="1.54" r="1.54"/><circle class="cls-2" cx="66.78" cy="1.54" r="1.54"/><circle class="cls-2" cx="1.54" cy="16.58" r="1.54"/><circle class="cls-2" cx="15.37" cy="16.58" r="1.54"/><circle class="cls-2" cx="28.17" cy="16.58" r="1.54"/><circle class="cls-2" cx="41.13" cy="16.58" r="1.54"/><circle class="cls-2" cx="54.04" cy="16.58" r="1.54"/><circle class="cls-2" cx="66.78" cy="16.58" r="1.54"/><circle class="cls-2" cx="1.54" cy="30.62" r="1.54"/><circle class="cls-2" cx="15.37" cy="30.62" r="1.54"/><circle class="cls-2" cx="28.17" cy="30.62" r="1.54"/><circle class="cls-2" cx="41.13" cy="30.62" r="1.54"/><circle class="cls-2" cx="54.04" cy="30.62" r="1.54"/><circle class="cls-2" cx="66.78" cy="30.62" r="1.54"/><circle class="cls-2" cx="1.54" cy="44.65" r="1.54"/><circle class="cls-2" cx="15.37" cy="44.65" r="1.54"/><circle class="cls-2" cx="28.17" cy="44.65" r="1.54"/><circle class="cls-2" cx="41.13" cy="44.65" r="1.54"/><circle class="cls-2" cx="54.04" cy="44.65" r="1.54"/><circle class="cls-2" cx="66.78" cy="44.65" r="1.54"/><circle class="cls-2" cx="1.54" cy="58.69" r="1.54"/><circle class="cls-2" cx="15.37" cy="58.69" r="1.54"/><circle class="cls-2" cx="28.17" cy="58.69" r="1.54"/><circle class="cls-2" cx="41.13" cy="58.69" r="1.54"/><circle class="cls-2" cx="54.04" cy="58.69" r="1.54"/><circle class="cls-2" cx="66.78" cy="58.69" r="1.54"/><circle class="cls-2" cx="1.54" cy="72.72" r="1.54"/><circle class="cls-2" cx="15.37" cy="72.72" r="1.54"/><circle class="cls-2" cx="28.17" cy="72.72" r="1.54"/><circle class="cls-2" cx="41.13" cy="72.72" r="1.54"/><circle class="cls-2" cx="54.04" cy="72.72" r="1.54"/><circle class="cls-2" cx="66.78" cy="72.72" r="1.54"/><circle class="cls-2" cx="1.54" cy="86.76" r="1.54"/><circle class="cls-2" cx="15.37" cy="86.76" r="1.54"/><circle class="cls-2" cx="28.17" cy="86.76" r="1.54"/><circle class="cls-2" cx="41.13" cy="86.76" r="1.54"/><circle class="cls-2" cx="54.04" cy="86.76" r="1.54"/><circle class="cls-2" cx="66.78" cy="86.76" r="1.54"/><circle class="cls-2" cx="1.54" cy="100.79" r="1.54"/><circle class="cls-2" cx="15.37" cy="100.79" r="1.54"/><circle class="cls-2" cx="28.17" cy="100.79" r="1.54"/><circle class="cls-2" cx="41.13" cy="100.79" r="1.54"/><circle class="cls-2" cx="54.04" cy="100.79" r="1.54"/><circle class="cls-2" cx="66.78" cy="100.79" r="1.54"/><circle class="cls-2" cx="1.54" cy="114.83" r="1.54"/><circle class="cls-2" cx="15.37" cy="114.83" r="1.54"/><circle class="cls-2" cx="28.17" cy="114.83" r="1.54"/><circle class="cls-2" cx="41.13" cy="114.83" r="1.54"/><circle class="cls-2" cx="54.04" cy="114.83" r="1.54"/><circle class="cls-2" cx="66.78" cy="114.83" r="1.54"/><circle class="cls-2" cx="1.54" cy="128.87" r="1.54"/><circle class="cls-2" cx="15.37" cy="128.87" r="1.54"/><circle class="cls-2" cx="28.17" cy="128.87" r="1.54"/><circle class="cls-2" cx="41.13" cy="128.87" r="1.54"/><circle class="cls-2" cx="54.04" cy="128.87" r="1.54"/><circle class="cls-2" cx="66.78" cy="128.87" r="1.54"/><circle class="cls-2" cx="1.54" cy="142.9" r="1.54"/><circle class="cls-2" cx="15.37" cy="142.9" r="1.54"/><circle class="cls-2" cx="28.17" cy="142.9" r="1.54"/><circle class="cls-2" cx="41.13" cy="142.9" r="1.54"/><circle class="cls-2" cx="54.04" cy="142.9" r="1.54"/><circle class="cls-2" cx="66.78" cy="142.9" r="1.54"/></g></g></svg>
			<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel"> 
			    <?php $mobile_repair_slider_pages = array();
			    for ( $count = 1; $count <= 4; $count++ ) {
			        $mod = intval( get_theme_mod( 'mobile_repair_slider'. $count ));
			        if ( 'page-none-selected' != $mod ) {
			          $mobile_repair_slider_pages[] = $mod;
			        }
			    }
		      	if( !empty($mobile_repair_slider_pages) ) :
			        $args = array(
			          	'post_type' => 'page',
			          	'post__in' => $mobile_repair_slider_pages,
			          	'orderby' => 'post__in'
			        );
		        	$query = new WP_Query( $args );
		        if ( $query->have_posts() ) :
		          	$i = 1;
		    	?>     
			    <div class="carousel-inner" role="listbox">
			      	<?php  while ( $query->have_posts() ) : $query->the_post(); ?>
			        <div <?php if($i == 1){echo 'class="carousel-item active"';} else{ echo 'class="carousel-item"';}?>>
			        	<div class="slider-bg"></div>
						<?php
							$mobile_repair_slider_effect = get_theme_mod('mobile_repair_slider_effect', '') 
						?>
			          	<div class="carousel-caption <?php echo ($mobile_repair_slider_effect); ?>">
				            <div class="inner-carousel row">
				            	<div class="col-lg-6 col-md-7 my-auto">
					              	<h2><?php the_title(); ?></h2>
									<p><?php $mobile_repair_excerpt = get_the_excerpt(); echo esc_html( mobile_repair_string_limit_words( $mobile_repair_excerpt, esc_attr(get_theme_mod('mobile_repair_slider_excerpt_length','20') ) )); ?></p>
			            			<a href="<?php the_permalink(); ?>" class="read-btn"><?php esc_html_e('Read More','mobile-repair'); ?><span class="screen-reader-text"><?php esc_html_e('Read More','mobile-repair'); ?></span></a>
			            		</div>
			            		<div class="offset-lg-2 col-lg-4 col-md-5">
			            			<img src="<?php echo esc_url(get_the_post_thumbnail_url(null, 'full')); ?>" alt="<?php the_title_attribute(); ?>" />
			            		</div>
		            		</div>
			          	</div>
			        </div>
			      	<?php $i++; endwhile; 
			      	wp_reset_postdata();?>
			    </div>
			    <?php else : ?>
			    <div class="no-postfound"></div>
		      		<?php endif;
			    endif;?>
			    <hr class="slider-arrow">
			    <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
			      	<span class="carousel-control-prev-icon" aria-hidden="true"><i class="fas fa-caret-left"></i></span>
			      	<span class="screen-reader-text"><?php esc_html_e( 'Prev','mobile-repair' );?></span>
			    </a>
			    <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
			      	<span class="carousel-control-next-icon" aria-hidden="true"><i class="fas fa-caret-right"></i></span>
			      	<span class="screen-reader-text"><?php esc_html_e( 'Next','mobile-repair' );?></span>
			    </a>
			</div>
		  	<div class="clearfix"></div>
		</section>
	<?php }?>

	<?php do_action('mobile_repair_below_slider'); ?>

	<?php $choose_backg = 'background-image:url(\''.esc_url(get_theme_mod('mobile_repair_chooseus_background_img')).'\')'; ?>

	<?php if( get_theme_mod('mobile_repair_choose_category') != ''){ ?>
		<section id="services-section" class="py-5" style="<?php echo esc_attr($choose_backg); ?>;background-repeat: no-repeat;">
			<div class="container">
				<div class="service-head text-center">
					<?php if(get_theme_mod('mobile_repair_choose_section_title')) {?>
						<i class="fas fa-rocket"></i>
						<h3 class="text-center"><?php echo esc_html(get_theme_mod('mobile_repair_choose_section_title')); ?></h3>
					<?php }?>
					<?php if(get_theme_mod('mobile_repair_chooseus_text')) {?>
						<p class="section-text text-center"><?php echo esc_html(get_theme_mod('mobile_repair_chooseus_text')); ?></p>
					<?php }?>
				</div>
	            <div class="row">
		      		<?php $mobile_repair_catData1 =  get_theme_mod('mobile_repair_choose_category');
	  				if($mobile_repair_catData1){ 
	      				$page_query = new WP_Query(array( 'category_name' => esc_html($mobile_repair_catData1 ,'mobile-repair'))); ?>
		        		<?php while( $page_query->have_posts() ) : $page_query->the_post(); ?>	
		          			<div class="col-lg-4 col-md-4">
		          				<div class="service-box">
		      						<div class="service-img">
							      		<img src="<?php esc_url(the_post_thumbnail_url('full')); ?>" />
							  		</div>
	          						<div class="service-content">
					            		<h4><?php the_title(); ?></h3>
					            		<p><?php $mobile_repair_excerpt = get_the_excerpt(); echo esc_html( mobile_repair_string_limit_words( $mobile_repair_excerpt,12 ) ); ?></p>
		            				</div>
		          				</div>
						    </div>
		          		<?php $i++; endwhile; 
		          		wp_reset_postdata();
		      		}?>
	      		</div>
				<div class="clearfix"></div>
			</div>
		</section>
	<?php }?>

	<?php do_action('mobile_repair_below_service_section'); ?>

	<div class="container">
	  	<?php while ( have_posts() ) : the_post(); ?>
	  		<div class="lz-content">
	        	<?php the_content(); ?>
	        </div>
	    <?php endwhile; // end of the loop. ?>
	</div>
</main>

<?php get_footer(); ?>