<?php
/**
 *
 * @package Luzuk Premium
 */
?>
<?php  
if (get_theme_mod('dinero_project_enable', true) == true) { ?>
      <div class="project_section" id="project">
    <div class="project-bg"></div>
        <div class="<?php if(get_theme_mod('dinero_project_section_width','Box Width') == 'Box Width'){ ?>container <?php } elseif(get_theme_mod('dinero_project_section_width','Box Width') == 'Full Width'){ ?> container-fluid <?php }?>"> 

         <?php
        $dinero_project_page_id = get_theme_mod('dinero_project_page');   
        $dinero_project_maintitle = get_theme_mod('dinero_project_maintitle', 'LATEST CASE STUDIES');
        $dinero_project_subtitle = get_theme_mod('dinero_project_subtitle', 'Reads Now Our<br> Recent Projects Studies');
        ?>
        <div class="row ">
                <?php if($dinero_project_maintitle || $dinero_project_subtitle){ ?>
                    <div class="col-xl-12 col-lg-12 col-sm-12">
                    <div class="dinero-section-head" style="text-align: <?php if(get_theme_mod('dinero_project_head_align','Left') == 'Left'){ ?> left <?php } elseif(get_theme_mod('dinero_project_head_align','Center') == 'Center'){ ?> center <?php } elseif(get_theme_mod('dinero_project_head_align','Right') == 'Right'){ ?> right <?php } ?> ">
                        <?php if($dinero_project_maintitle){ ?>
                        <h2><?php echo ($dinero_project_maintitle);  ?></h2>
                        <?php }?>
                           <?php if( get_theme_mod('dinero_project_head_icon_enable','No') == 'Yes'){ ?>
                            <div class="dinero-section-head-icon">
                                <i class="<?php echo esc_attr(get_theme_mod('dinero_project_head_icon', 'fa fa-bell')); ?>"></i>
                            </div>
                            <?php }?>
                        <h3><?php echo ($dinero_project_subtitle);  ?></h3>               
                    </div>
                </div>
                <?php }?>
            </div>
            <div class="clearfix"></div>
            <div class="dinero-project-area">
                <div class="row">  
                <?php 
                $showStatic = true;
                $cols = get_theme_mod('dinero_project_npp_count', 2);
                $cols++;
                switch($cols){
                    case 1:
                    $colCls = 'col-md-12 col-sm-12';
                    break;
                    case 2: 
                    $colCls = 'col-md-6 col-sm-6';
                    break;
                    case 3:
                    case 5:
                    case 6:
                    case 9:
                    case 11:
                    case 13:
                    case 15:
                    case 17:
                    case 19:
                    case 21:
                    case 23:
                    $colCls = 'col-md-4 col-sm-6';
                    break;
                    default: 
                    $colCls = 'col-md-3 col-sm-6';
                    break;
                }
                for( $i = 1; $i <= $cols; $i++ ){
                    $dinero_project_page_id = get_theme_mod('dinero_project_page'.$i); 
                    $dinero_project_page_icon = get_theme_mod('dinero_project_page_icon'.$i);
                    if($dinero_project_page_id){
                        $showStatic = false;
                        echo projectShortCode($dinero_project_page_id, $isCustomizer=true, $i);
                    }
                }
                if($showStatic === true){
                    for( $i = 1; $i <= $cols; $i++ ){ ?>
                        <div class="<?php echo $colCls;?> dinero-project-b">
                            <div project-match-height="groupName" class="dinero-project-single <?php echo esc_attr(get_theme_mod('dinero_project_box_onload_effects','wow zoomIn')); ?>" data-wow-duration="2s" style="text-align : <?php if(get_theme_mod('dinero_project_box_align','Center') == 'Center'){ ?> center <?php } elseif(get_theme_mod('dinero_project_box_align','Left') == 'Left'){ ?> left <?php } elseif(get_theme_mod('dinero_project_box_align','Right') == 'Right'){ ?> right <?php } ?> ">
                                <a href="#" class="picon">
                                    <div class="dinero-project-img"> <img class="img-responsive" src="<?php echo esc_url(get_template_directory_uri().'/images/project.jpg');?>" alt="project" style="height: <?php echo esc_attr(get_theme_mod('dinero_project_post_image_height','500')) ?>px;" />
                                    </div>
                                </a>
                                <div class="dinero-project-content">
                                    <h4 class="dinero-project-title inner-area-title" style="text-transform : <?php if(get_theme_mod('dinero_project_title_case','Capitalize') == 'Capitalize'){ ?> capitalize <?php } elseif(get_theme_mod('dinero_project_title_case','Lowercase') == 'Lowercase'){ ?> lowercase <?php } elseif(get_theme_mod('dinero_project_title_case','Uppercase') == 'Uppercase'){ ?> uppercase <?php } ?>">
                                        Project 1
                                    </h4>
                                    <?php if( get_theme_mod('dinero_project_button_enable','Yes') == 'Yes'){ ?>
                                        <a href="#" class="read-btn"><?php echo esc_html('Read More', 'dinero'); ?><i class="fa fa-angle-double-right" aria-hidden="true"></i></a>
                                    <?php }?>
                                   
                                    <div class="clearfix"></div>
                                </div>
                               
                            </div>
                            
                        </div>
                        <?php 
                    }
                } ?>
            </div>
            </div>

	</div>
</div>

<script>
    var matchHeight = function () {
    
    function init() {
        eventListeners();
        matchHeight();
    }
    
    function eventListeners(){
        $(window).on('resize', function() {
            matchHeight();
        });
    }
    
    function matchHeight(){
        var groupName = $('[project-match-height]');
        var groupHeights = [];
        
        groupName.css('min-height', 'auto');
        
        groupName.each(function() {
            groupHeights.push($(this).outerHeight());
        });
        
        var maxHeight = Math.max.apply(null, groupHeights);
        groupName.css('min-height', maxHeight);
    };
    
    return {
        init: init
    };
    
} ();

$(document).ready(function() {
    matchHeight.init();
});
</script>
<?php }