<?php
function seo_project_shortcode($atts, $content =null){

    extract( shortcode_atts( array(
        'title' => ''


    ), $atts) );

   $project_id = rand(20000, 30000);
   $project_catagory = get_terms('project_cat');

    $seo_project_markup ='
    <script>
         jQuery(document).ready(function($){



        $(".seo-project-list li").click(function(){

            $(".seo-project-list li").removeClass("active");
            $(this).addClass("active");

            var selector = $(this).attr("data-filter");
            $(".project-wrapper-'.$project_id.'").isotope({
                filter: selector
            });

        });


    });


    jQuery(window).load(function(){

            jQuery(".project-wrapper-'.$project_id.'").isotope();


    });


    </script>
        <div class="row">
            <div class="col-md-3">
                <ul class="seo-project-list">
                    <li class="active" data-filter="*">all works</li>';

                if(!empty($project_catagory) && ! is_wp_error($project_catagory)){
                    foreach($project_catagory as $catagory){
                         $seo_project_markup .='<li  data-filter=".'.$catagory->slug.'">'.$catagory->name.'</li>';
                    }
                }


    $seo_project_markup .='
                </ul>
            </div>
            <div class="col-md-9">
                <div class="row project-wrapper-'.$project_id.'">';





    $project_array = new WP_Query(array('posts_per_page' => -1, 'post_type' => 'project', ));
    while($project_array->have_posts()) : $project_array->the_post();


    $seo_project_cat = get_the_terms( get_the_ID(), 'project_cat' );
    if(!empty($seo_project_cat) && ! is_wp_error($seo_project_cat)){
         $project_cat_list = array();

        foreach($seo_project_cat as $single_project_cat){
            $project_cat_list[] = $single_project_cat->slug;
        }
        $project_assigned_list = join( " ", $project_cat_list );
    }else{
        $project_assigned_list = '';
    }

    $seo_project_markup .='
                    <div class="col-md-4 '.$project_assigned_list.' " >
                        <a href="'.get_permalink().'" class="single-project">
                            <div class="project-bg" style="background-image:url('.get_the_post_thumbnail_url(get_the_ID(),'large').')"></div>
                            <div class="project-hover">
                                <div class="hover-content">
                                    <i class="fa fa-link"></i>
                                    <h4>'.get_the_title().'</h4>
                                </div>
                            </div>
                        </a>
                    </div>';
    endwhile;
    wp_reset_query();





    $seo_project_markup .='
                </div>
            </div>
        </div>
    ';

    return $seo_project_markup;
}
add_shortcode('seo_project', 'seo_project_shortcode');

?>