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

get_header();
?>

<main id="primary">

    <?php if (get_theme_mod('pixel_transport_banner_section_on_off_setting', false)) { ?>
        <section id="main-banner-wrap">
            <?php
            $pixel_transport_banner_image = get_theme_mod('pixel_transport_banner_image', '');
            if (!empty($pixel_transport_banner_image)) { ?>
                <div class="main-banner-inner-box">
                    <img src="<?php echo esc_url($pixel_transport_banner_image); ?>" alt="Banner Image">
                </div>
                <div class="main-banner-content-box">
                    <?php
                    $pixel_transport_banner_heading = get_theme_mod('pixel_transport_banner_heading', '');
                    if (!empty($pixel_transport_banner_heading)) { ?>
                        <h3><?php echo esc_html($pixel_transport_banner_heading); ?></h3>
                    <?php } ?>
                    
                    <?php
                    $pixel_transport_banner_text = get_theme_mod('pixel_transport_banner_text', '');
                    if (!empty($pixel_transport_banner_text)) { ?>
                        <p><?php echo esc_html($pixel_transport_banner_text); ?></p>
                    <?php } ?>
                    
                    <div class="banner-button">
                        <?php
                        $pixel_transport_banner_button_link = get_theme_mod('pixel_transport_banner_button_link', '');
                        if (!empty($pixel_transport_banner_button_link)) { ?>
                            <a href="<?php echo esc_url($pixel_transport_banner_button_link); ?>">
                                <?php echo esc_html('Read More', 'pixel-transport'); ?>
                            </a>
                        <?php } ?>
                    </div>
                </div>
            <?php } ?>
        </section>
    <?php } ?>

    <?php if (get_theme_mod('pixel_transport_project_section_on_off_setting', false)) { ?>
        <section class="project py-5 text-center">
            <div class="container">
                <?php
                    $pixel_transport_project_heading = get_theme_mod( 'pixel_transport_project_heading', '' );
                    if ( ! empty( $pixel_transport_project_heading ) ) { ?>
                    <h3><?php echo esc_html( $pixel_transport_project_heading ); ?></h3>
                <?php } ?>
                <?php
                    $pixel_transport_project_text = get_theme_mod( 'pixel_transport_project_text', '' );
                    if ( ! empty( $pixel_transport_project_text ) ) { ?>
                    <p><?php echo esc_html( $pixel_transport_project_text ); ?></p>
                <?php } ?>

                <div class="tab">
                    <ul>
                        <li><button class="tablinks" onclick="pixel_transport_projects_tab(event, 'tab1')"><?php
                        $pixel_transport_project_tab1 = get_theme_mod( 'pixel_transport_project_tab1', '' );
                        if ( ! empty( $pixel_transport_project_tab1 ) ) { ?>
                        <?php echo esc_html( $pixel_transport_project_tab1 ); ?>
                        <?php } ?></button></li>
                        <li><button class="tablinks" onclick="pixel_transport_projects_tab(event, 'tab2')"><?php
                        $pixel_transport_project_tab2 = get_theme_mod( 'pixel_transport_project_tab2', '' );
                        if ( ! empty( $pixel_transport_project_tab2 ) ) { ?>
                        <?php echo esc_html( $pixel_transport_project_tab2 ); ?>
                        <?php } ?></button></li>
                        <li><button class="tablinks" onclick="pixel_transport_projects_tab(event, 'tab3')"><?php
                        $pixel_transport_project_tab3 = get_theme_mod( 'pixel_transport_project_tab3', '' );
                        if ( ! empty( $pixel_transport_project_tab3 ) ) { ?>
                        <?php echo esc_html( $pixel_transport_project_tab3 ); ?>
                        <?php } ?></button></li>
                        <li><button class="tablinks" onclick="pixel_transport_projects_tab(event, 'tab4')"><?php
                        $pixel_transport_project_tab4 = get_theme_mod( 'pixel_transport_project_tab4', '' );
                        if ( ! empty( $pixel_transport_project_tab4 ) ) { ?>
                        <?php echo esc_html( $pixel_transport_project_tab4 ); ?>
                        <?php } ?></button></li>
                    </ul>
                </div>

                <?php 
                    $pixel_transport_project1 = get_theme_mod( 'pixel_transport_project1');
                ?>

                <div id="tab1" class="tabcontent">
                    <div class="row">
                        <?php for ( $pixel_transport_i = 1; $pixel_transport_i <= $pixel_transport_project1; $pixel_transport_i++ ){ ?>
                            <div class="col-lg-4 col-md-6 col-sm-6">
                                <div class="projects_inner_box mb-4">
                                    <?php
                                    $pixel_transport_project_image1 = get_theme_mod( 'pixel_transport_project_image1'.$pixel_transport_i, '' );
                                    if ( ! empty( $pixel_transport_project_image1 ) ) { ?>
                                        <img class="project-image" src="<?php echo esc_url( $pixel_transport_project_image1 ); ?>">
                                    <?php } ?>
                                    <?php
                                        $pixel_transport_project_title1 = get_theme_mod( 'pixel_transport_project_title1'.$pixel_transport_i, '' );
                                        if ( ! empty( $pixel_transport_project_title1 ) ) { ?>
                                        <h4 class="my-2"><?php echo esc_html( $pixel_transport_project_title1 ); ?></h4>
                                    <?php } ?>
                                </div>
                            </div>
                        <?php }?>
                    </div>
                </div>

                <?php 
                    $pixel_transport_project2 = get_theme_mod( 'pixel_transport_project2');
                ?>

                <div id="tab2" class="tabcontent">
                    <div class="row">
                        <?php for ( $pixel_transport_i = 1; $pixel_transport_i <= $pixel_transport_project2; $pixel_transport_i++ ){ ?>
                            <div class="col-lg-4 col-md-6 col-sm-6">
                                <div class="projects_inner_box mb-4">
                                    <?php
                                    $pixel_transport_project_image2 = get_theme_mod( 'pixel_transport_project_image2'.$pixel_transport_i, '' );
                                    if ( ! empty( $pixel_transport_project_image2 ) ) { ?>
                                        <img class="project-image2" src="<?php echo esc_url( $pixel_transport_project_image2 ); ?>">
                                    <?php } ?>
                                    <?php
                                        $pixel_transport_project_title2 = get_theme_mod( 'pixel_transport_project_title2'.$pixel_transport_i, '' );
                                        if ( ! empty( $pixel_transport_project_title2 ) ) { ?>
                                        <h4><?php echo esc_html( $pixel_transport_project_title2 ); ?></h4>
                                    <?php } ?>
                                </div>
                            </div>
                        <?php }?>
                    </div>
                </div>

                <?php 
                    $pixel_transport_project3 = get_theme_mod( 'pixel_transport_project3');
                ?>

                <div id="tab3" class="tabcontent">
                    <div class="row">
                        <?php for ( $pixel_transport_m = 1; $pixel_transport_m <= $pixel_transport_project3; $pixel_transport_m++ ){ ?>
                            <div class="col-lg-4 col-md-6 col-sm-6">
                                <div class="projects_inner_box mb-4">
                                    <?php
                                    $pixel_transport_project_image3 = get_theme_mod( 'pixel_transport_project_image3'.$pixel_transport_m, '' );
                                    if ( ! empty( $pixel_transport_project_image3 ) ) { ?>
                                        <img class="project-image2" src="<?php echo esc_url( $pixel_transport_project_image3 ); ?>">
                                    <?php } ?>
                                    <?php
                                        $pixel_transport_project_title3 = get_theme_mod( 'pixel_transport_project_title3'.$pixel_transport_m, '' );
                                        if ( ! empty( $pixel_transport_project_title3 ) ) { ?>
                                        <h4><?php echo esc_html( $pixel_transport_project_title3 ); ?></h4>
                                    <?php } ?>
                                </div>
                            </div>                    
                        <?php }?>
                    </div>
                </div>

                <?php 
                    $pixel_transport_project4 = get_theme_mod( 'pixel_transport_project4');
                ?>

                <div id="tab4" class="tabcontent">
                    <div class="row">
                        <?php for ( $pixel_transport_n = 1; $pixel_transport_n <= $pixel_transport_project4; $pixel_transport_n++ ){ ?>
                            <div class="col-lg-4 col-md-6 col-sm-6">
                                <div class="projects_inner_box mb-4">
                                    <?php
                                    $pixel_transport_project_image4 = get_theme_mod( 'pixel_transport_project_image4'.$pixel_transport_n, '' );
                                    if ( ! empty( $pixel_transport_project_image4 ) ) { ?>
                                        <img class="project-image2" src="<?php echo esc_url( $pixel_transport_project_image4 ); ?>">
                                    <?php } ?>
                                    <?php
                                        $pixel_transport_project_title4 = get_theme_mod( 'pixel_transport_project_title4'.$pixel_transport_n, '' );
                                        if ( ! empty( $pixel_transport_project_title4 ) ) { ?>
                                        <h4><?php echo esc_html( $pixel_transport_project_title4 ); ?></h4>
                                    <?php } ?>
                                </div>
                            </div>
                        <?php }?>
                    </div>
                </div>
            </div>
        </section>
    <?php } ?>

</main>

<?php
get_footer();