<?php $__env->startSection('title'); ?> <?php if( ! empty($title)): ?> <?php echo e($title); ?> | <?php endif; ?> ##parent-placeholder-3c6de1b7dd91465d437ef415f94f36afc1fbc8a8## <?php $__env->stopSection(); ?>

<?php $__env->startSection('main'); ?>

<div class="container-fluid">
    <div class="row">

        <div class="col-md-8">
            <div class="row">
                <div class="col-sm-12">

                    <?php
                        $allAdTab = route('listing').str_replace('/', '', str_replace(route('listing'), '', request()->fullUrlWithQuery(['adType'=>'all'])));
                        $personalAdTab = route('listing').str_replace('/', '', str_replace(route('listing'), '', request()->fullUrlWithQuery(['adType'=>'personal'])));
                        $businessAdTab = route('listing').str_replace('/', '', str_replace(route('listing'), '', request()->fullUrlWithQuery(['adType'=>'business'])));

                        ?>

                    <div class="listingTopFilterBar">
                        <span class="totalFoundListingTop"><?php echo app('translator')->getFromJson('app.total'); ?> <strong><?php echo e(count($agents)); ?></strong>
                            Agents Found </span>
                    </div>
                </div>
            </div>


            <div class="ad-box-wrap" id="listing-desktop-view">


               
                
                <?php if(count($agents) > 0): ?>

                <h3 style="margin-bottom:20px"><?php echo app('translator')->getFromJson('app.listing_results'); ?></h3>
                <div class="col-sm-12">
                    <?php $__currentLoopData = $agents; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $agent): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <div class="sidebar-feature-agents row-sm-2">
                        <div class="row">
                            <div class="col-xs-3">
                                <a href="<?php echo e(route('profileview', ['type'=>'agent', 'id' => $agent->id])); ?>">
                                    <img src="<?php echo e($agent->get_gravatar()); ?>" class="img-circle img-responsive" /> </a>
                            </div>
                            <div class="col-xs-9">
                                <a href="<?php echo e(route('profileview', ['type'=>'agent', 'id' => $agent->id])); ?>">
                                    <h5><?php echo e($agent->name); ?></h5>
                                    <p class="text-muted"><i class="fa fa-map-marker"></i> <?php echo e($agent->get_address()); ?></p>
                                    <p class="text-muted"><i class="fa fa-building"></i> <?php echo e($agent->ads->count()); ?>

                                        <?php echo app('translator')->getFromJson('app.estates'); ?>
                                        <?php if($agent->phone): ?>, <br><p><i class="fa fa-phone"></i> <?php echo e($agent->phone); ?> <?php endif; ?>
                                    </p>
                                </a>
                                <a href="<?php echo e(route('listing', ['user_id'=>$agent->id])); ?>"><p class="text-muted"><i class="fa fa-map-marker"></i> Ads By This Agent</p></a>
                            </div>
                        </div>
                    </div>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                   
                </div>





                <?php else: ?>
                <div class="alert alert-warning">
                    <h2><i class="fa fa-info-circle"></i> <?php echo app('translator')->getFromJson('app.search_not_found'); ?> </h2>
                </div>
                <?php endif; ?>

               
</div>

</div>

<div class="col-md-4">

    <div class="sidebar-widget">
        <h3><?php echo app('translator')->getFromJson('app.feature_agents'); ?></h3>
        <?php $__currentLoopData = $feature_agents; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $agent): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
        <div class="sidebar-feature-agents">
            <div class="row">
                <div class="col-xs-3">
                    <a href="<?php echo e(route('listing', ['user_id'=>$agent->id])); ?>">
                        <img src="<?php echo e($agent->get_gravatar()); ?>" class="img-circle img-responsive" /> </a>
                </div>
                <div class="col-xs-9">
                    <a href="<?php echo e(route('listing', ['user_id'=>$agent->id])); ?>">
                        <h5><?php echo e($agent->name); ?></h5>
                        <p class="text-muted"><i class="fa fa-map-marker"></i> <?php echo e($agent->get_address()); ?></p>
                        <p class="text-muted"><i class="fa fa-building"></i> <?php echo e($agent->ads->count()); ?>

                            <?php echo app('translator')->getFromJson('app.estates'); ?>
                            <?php if($agent->phone): ?>, <br><p><i class="fa fa-phone"></i> <?php echo e($agent->phone); ?> <?php endif; ?>
                        </p>
                    </a>
                </div>
            </div>
        </div>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
    </div>


</div>

</div>
</div>

</div>

<!-- Property Modal-->
<div class="modal fade" id="property-page" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
    aria-hidden="true">
    <div class="modal-dialog modal-xl" style="width:90%;">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title"></h3>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>

                </button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-8">

                        <div class="modal-images-col" style="padding: 0 15px;">

                        </div>
                    </div>
                    <div class="col-md-4 content-area">
                        <div style="margin-right: 10px;">
                            <!--<h3 class="modal-title"></h3>-->
                            <h4 class="modal-price" style="margin-top: 0px;"></h4>
                            <h4 style="margin-top: 15px;" class="display-text"><i class="fas fa-map-marker"></i> <span
                                    class="modal-address"></span></h4>
                            <h4 style="margin-top: 15px;" class="display-text"><i class="fas fa-map-marker"></i> <span
                                    class="modal-city"></span></h4>
                            <h4 style="margin-top: 15px;" class="display-text"><i class="fa fa-user"></i> <span
                                    class="modal-agent"></span></h4>
                            <h4 style="margin-top: 15px;" class="display-text"><i class="fas fa-envelope"></i> <span
                                    class="modal-agent-email"></span></h4>
                            <h4 style="margin-top: 15px;" class="display-text"><i class="fa fa-phone"></i> <span
                                    class="modal-agent-number"></span></h4>
                            <h4 style="margin-top: 15px;" class="display-text"><i class="fa fa-clock-o"></i> <span
                                    class="modal-posted"></span></h4>
                            <h4 style="margin-top: 15px;margin-bottom:15px;">Share this Property</h4>
                            <a href="" target="_blank" class="modal-fb-link">
                                <i class="fab fa-facebook-square fb-modal"></i>
                            </a>
                            <a href="" class="modal-twitter-link">
                                <i class="fab fa-twitter-square twitter-modal"></i>
                            </a>
                            <a href="javascript:;" class="modal-icon" id="save-as-favourite" data-slug="">

                            </a>

                            <a href="" class="modal-icon modal-report-ad">
                                <h4>
                                    <i class="fas fa-ban "></i>
                                    Report Ad
                                </h4>
                            </a>
                        </div>
                        <div class="row" style="margin-right: 10px;">
                            <div class="col-sm-4">
                                <p class="modal-urgent"></p>
                            </div>
                            <div class="col-sm-4">
                                <p class="modal-price-plan"></p>
                            </div>
                            <div class="col-sm-4">
                                <p class="modal-purpose"></p>
                            </div>

                        </div>

                        <div class="row attributes-row">
                            <div class="col-sm-6">
                                <h4 class="display-text"><i class="fa fa-building"></i> <span class="modal-type"></span>
                                </h4>
                                <h4 style="margin-top: 15px;" class="display-text"><i class="fa fa-bars"></i> <span
                                        class="modal-floors"></span></h4>
                                <h4 style="margin-top: 15px;" class="display-text"><i class="fa fa-bath "></i> <span
                                        class="modal-baths"></span></h4>
                                <h4 style="margin-top: 15px;" class="display-text"><i class="fas fa-utensils"></i> <span
                                        class="modal-dining-space"></span></h4>
                            </div>
                            <div class="col-sm-6">
                                <h4 class="display-text"><i class="fa fa-bed"></i> <span class="modal-beds"></span></h4>
                                <h4 style="margin-top: 15px;" class="display-text"><i class="fa fa-arrows-alt "></i>
                                    <span class="modal-unitspace"></span></h4>
                                <h4 style="margin-top: 15px;" class="display-text"><i class="fa fa-television "></i>
                                    <span class="modal-living-room"></span></h4>
                            </div>
                        </div>
                        <div class="row desc-row" style="margin-bottom: 50px;">
                            <div class="col-sm-12">
                                <p class="modal-desc display-text">

                                </p>
                            </div>
                        </div>
                        <div class="row"
                            style="padding:20px 5px;padding-top: 10px;margin-right:10px;border-top: 5px solid #811fd3;border-radius: 5px;">
                            <div id="modal-map" style="width: 100%; height: 400px; margin: 0px 0;"></div>
                        </div>
                        <div class="row"
                            style="padding:20px 5px;padding-top: 10px;margin-right:10px;border-top: 5px solid #811fd3;border-radius: 5px;">
                            <h3 class="modal-subtitle">Monthly Expenses</h3>
                            <div class="expenses">
                                <table style="width:100%;">
                                    <tr>
                                        <td>
                                            <i class="fas fa-home"></i>
                                        </td>
                                        <td>
                                            <h4 class="display-text">Mortgage</h4>
                                        </td>
                                        <td>
                                            <h3 class="mortgageamount expense-amount"></h3>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <i class="fas fa-house-damage"></i>
                                        </td>
                                        <td>
                                            <h4 class="display-text">Insurance</h4>
                                        </td>
                                        <td>
                                            <h3 class="expense-amount">750</h3>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <i class="fas fa-tint"></i>
                                        </td>
                                        <td>
                                            <h4 class="display-text">Water</h4>
                                        </td>
                                        <td>
                                            <h3 class="expense-amount">500</h3>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <i class="fas fa-wifi"></i>
                                        </td>
                                        <td>
                                            <h4 class="display-text">Internet</h4>
                                        </td>
                                        <td>
                                            <h3 class="expense-amount">650</h3>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <i class="fa fa-television"></i>
                                        </td>
                                        <td>
                                            <h4 class="display-text">Television</h4>
                                        </td>
                                        <td>
                                            <h3 class="expense-amount">900</h3>
                                        </td>
                                    </tr>
                                </table>
                                
                            </div>
                            <h4 style="text-align:center" class="display-text">Total Monthly Expenses </h4>
                            <h3 style="text-align:center" class="expense-amount">ZMK <span
                                    class="total-expenses"></span></h3>
                        </div>
                        <div class="row"
                            style="padding:20px 5px;padding-top: 10px;margin-right:10px;border-top: 5px solid #811fd3;border-radius: 5px;">
                            <h3 class="modal-subtitle">Mortgage Calculator</h3>
                            <div class="">
                                <div class="form-group">
                                    <h4 class="display-text">Price</h4>
                                    <input type="number" onchange="recalculateMortgage()"
                                        onkeyup="recalculateMortgage()" class="form-control" id="principal">
                                </div>
                                <div class="form-group" style="margin-top:35px">
                                    <h4 class="display-text">Interest Rate</h4>
                                    <input type="number" onchange="recalculateMortgage()"
                                        onkeyup="recalculateMortgage()" class="form-control" id="rate" min="0"
                                        max="100">
                                </div>
                            </div>
                            <div class="">
                                <div class="form-group">
                                    <h4 class="display-text">Years</h4>
                                    <input type="number" onchange="recalculateMortgage()"
                                        onkeyup="recalculateMortgage()" class="form-control" id="years" min="1"
                                        max="20">
                                </div>
                                <div class="form-group" style="margin-top:35px">
                                    <h4 class="display-text">Mortgage Amount</h4>
                                    <h3 style="text-align: center;" class="expense-amount">ZMK <span
                                            class="mortgageamount"></span> Per Month
                                    </h3>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>



            </div>

        </div>
    </div>
</div>
<!-- Property Modal End-->
<!-- Img Modal-->
<div class="kupeza-modal hidden-modal" onclick="toggleKupezaModal()">
    <div class="image-modal-close">
        <i class="fas fa-times"></i>
    </div>
    <div class="kupeza-modal-img-container">
        <img src="" alt="" class="kupeza-modal-img">
    </div>

</div>




<?php $__env->stopSection(); ?>


<?php $__env->startSection('page-js'); ?>
<script
    src="https://maps.googleapis.com/maps/api/js?key=<?php echo e(get_option('google_map_api_key')); ?>&libraries=places&callback=initMap"
    async defer></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"
    integrity="sha256-pTxD+DSzIwmwhOqTFN+DB+nHjO4iAsbgfyFq5K5bcE0=" crossorigin="anonymous"></script>

<script>
    var map;
        var modalMap
        
        function initMap() {
            
            // set map 
            modalMap = new google.maps.Map(document.getElementById('modal-map'), {
                center: {lat: -15.3875, lng: 28.3228 },
                zoom: 15 
            });
                
            

        }

        $(document).ready(function() {
            $('#shortBySelect').change(function () {
                var form_input = $('#listingFilterForm').serialize();
                location.href = '<?php echo e(route('listing')); ?>?' + form_input + '&shortBy=' + $(this).val();
            });
        });
        
        

        $('#property-page').on('show.bs.modal', function (event) {
            var button = $(event.relatedTarget) // Button that triggered the modal
            var title = button.data('title');
            var featureImg = button.data('featureimg');
            var price = button.data('price');
            var beds = button.data('beds');
            var type = button.data('type');
            var unitspace = button.data('unitspace');
            var city = button.data('city')
            var floors = button.data('floor');
            var agent = button.data('agent');
            var agentnumber = button.data('agentnumber');
            var agentemail = button.data('agentemail');
            var priceplan = button.data('priceplan');
            var urgent = button.data('urgent');
            var posted = button.data('posted');
            var desc = button.data('desc');
            var livingroom = button.data('livingroom');
            var diningspace = button.data('diningspace');
            var purpose = button.data('purpose');
            var baths = button.data('baths');
            var longitude = button.data('longitude');
            var latitude = button.data('latitude');
            var priceToSet = button.data('pricetoset');
            var address = button.data('address');
            var ad_id = button.data('adid');
            var sharelink = button.data('sharelink');
            var slug = button.data('slug');
            var favourite = button.data('favourite');
            var marker;
            
            console.log(favourite);
            // callChart();
            
            var modal = $(this);
            modal.find('.modal-title').text(title);
            modal.find('.modal-feature-img').attr('src', featureImg);
            modal.find('.modal-beds').text(beds);
            modal.find('.modal-price').text(price);
            modal.find('.modal-type').text(type);
            modal.find('.modal-unitspace').text(unitspace);
            modal.find('.modal-city').text(city);
            modal.find('.modal-floors').text(floors);
            modal.find('.modal-agent').text(agent);
            modal.find('.modal-agent-number').text(agentnumber);
            modal.find('.modal-agent-email').text(agentemail);
            modal.find('.modal-price-plan').text(priceplan);
            modal.find('.modal-posted').text(posted);
            modal.find('.modal-desc').text(desc);
            modal.find('.modal-purpose').text(purpose);
            modal.find('.modal-address').text(address);
            modal.find('.modal-fb-link').attr('href', "https://www.facebook.com/sharer/sharer.php?u=" + sharelink);
            modal.find('.modal-twitter-link').attr('href', "https://twitter.com/intent/tweet?url=" + sharelink);
            modal.find("#save-as-favourite").attr('data-slug',slug);
            modal.find(".modal-report-ad").attr('href', 'report-ad/' + slug)

            if(favourite == "FALSE"){
                modal.find('#save-as-favourite').empty();
                modal.find('#save-as-favourite').append("<h4><i class='far fa-star'></i>Mark As Favourite</h4>");
            
            } else{
                modal.find('#save-as-favourite').empty();
                modal.find('#save-as-favourite').append("<h4><i class='fas fa-star'></i>Remove From Favourite</h4>");            
            }
            if(urgent == 1){
                modal.find('.modal-urgent').text("URGENT");    
            } else{
                modal.find('.modal-urgent').hide();
            }
            if(livingroom != 0 || livingroom != null){
                modal.find('.modal-living-room').text(livingroom);    
            } else{
                modal.find('.modal-living-room').hide();
            }
            if(diningspace != 0 || diningspace != null){
                modal.find('.modal-dining-space').text(diningspace);    
            } else{
                modal.find('.modal-dining-space').hide();
            }
            if(baths != 0 || baths != null){
                modal.find('.modal-baths').text(baths);    
            } else{
                modal.find('.modal-baths').hide();
            }
            if(latitude && longitude){
                if (marker && marker.setMap) {
                    marker.setMap(null);
                    console.log('done');
                }
                //console.log({lat:latitude, lng:longitude});
                // google.maps.Marker().setMap(null);
                marker = new google.maps.Marker({
                position: {lat:latitude, lng:longitude},
                map: modalMap,
                title: title
                });
                
                marker.setMap(modalMap);
                modalMap.setCenter(marker.getPosition());
            } else{
                if (marker && marker.setMap) {
                    marker.setMap(null);
                    console.log('done');
                }
            }

            // Input Mortgage Data
            modal.find('#principal').val(priceToSet);
            modal.find('#rate').val(0.5);
            modal.find('#years').val(20);
            // To calculate mortgage
            var stepOne = 1 + 0.005 ;//this is the rate + 1
            var stepTwo = Math.pow(stepOne, 240);
            var stepThree = stepTwo * 0.005;
            var stepFour = stepTwo -1;
            var stepFive = stepThree/stepFour;
            var mortgageAmount = Math.round(Number(priceToSet) * stepFive);
            //Calculate images
            modal.find('.mortgageamount').text(mortgageAmount);
            modal.find('.total-expenses').text(mortgageAmount + 750 + 500 + 650 + 900);
            
            
            // Remove Images from modal            
            $(".modal-images-col").empty();

            //Pull Images from media db
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $.ajax({
                url:"getimages/" + ad_id,
                type:"GET",
                dataType:"JSON",
                success:function(data){
                    if(data.hasImages){                        
                        //url hardcoded in till i can find a better solution
                        //Online url https://www.kupeza.co.zm/uploads/images/
                        //local url http://localhost/kupeza/uploads/images/
                        data.ad_images.forEach((item, i) =>{
                            if(i == 0){
                                $(".modal-images-col").append("<div class='modal-load-images' style='margin:0;width:100%;cursor: pointer;'><img src='https://www.kupeza.co.zm/uploads/images/" + item.media_name +"' class='img-responsive modal-img' onclick='displayModal(\"" + item.media_name + "\")' style='padding:5px;width:100%;'></div>");
                            } else{
                                $(".modal-images-col").append("<div class='modal-load-images' style='margin:0;cursor: pointer;'><img src='https://www.kupeza.co.zm/uploads/images/" + item.media_name +"' class='img-responsive modal-img' onclick='displayModal(\"" + item.media_name + "\")' style='padding:5px'></div>");
                            }
                        });
                        
                        
                        console.log(data.ad_images);
                    } else{
                        console.log("No Images");
                    }
                },
                error:function(status){                
                    console.log(status);
                }
            });
            
            
            
            // var midpoint = {lat: latitude, lng: longitude };
            // marker.setPosition(midpoint);

        });

        function recalculateMortgage(){
            var mortgageRate= $("#rate").val();
            var Principal = $("#principal").val();
            var years = $("#years").val();
            mortgageRate = mortgageRate/100
            years *= 12;

            var stepOne = 1 + mortgageRate ;//this is the rate + 1
            var stepTwo = Math.pow(stepOne, years);
            var stepThree = stepTwo * mortgageRate;            ;
            var stepFour = stepTwo -1;
            var stepFive = stepThree/stepFour;
            var mortgageAmount = Math.round(Principal * stepFive);
            if(mortgageRate === 0){
                $('.mortgageamount').text("Calculating...");
                $('.total-expenses').text("Calculating...");
            } else{
                $('.mortgageamount').text(mortgageAmount);
                $('.total-expenses').text(mortgageAmount + 750 + 500 + 650 + 900);
            }
        }

        // $(".modal-img").click(function(){
    
        // });
        $(function(){
            $("#save-as-favourite").click(function(){
                var selector = $(this);
                var slug = selector.data('slug');
                //console.log("clicked");
                $.ajax({
                    type : 'POST',
                    url : '<?php echo e(route('save_ad_as_favorite')); ?>',
                    data : { slug : slug, action: 'add', _token : '<?php echo e(csrf_token()); ?>' },
                    success : function (data) {
                        // console.log(data);
                        // console.log(data.action)
                        if (data.status == 1){
                            // selector.html(data.msg);
                            if(data.action === 'added'){
                                $('#save-as-favourite').empty();
                                $('#save-as-favourite').append("<h4><i class='far fa-star'></i>Mark As Favourite</h4>");
                            } 
                            if(data.action === 'removed'){
                                $('#save-as-favourite').empty();
                                $('#save-as-favourite').append("<h4><i class='fas fa-star'></i>Remove From Favourite</h4>");
                            }
                        }else {
                            if (data.redirect_url){
                                location.href= data.redirect_url;
                            }
                        }
                    }
                });
            })
        })
        function displayModal(imgSrc){
            // $(this).attr('src')
            // var imgSrc = this.getAttribute("src");  
            $(".kupeza-modal").toggleClass("hidden-modal");
            $(".kupeza-modal-img").attr("src", "https://www.kupeza.co.zm/uploads/images/" + imgSrc);

            console.log(imgSrc);
        }

        function toggleKupezaModal(){
            $(".kupeza-modal").toggleClass("hidden-modal");
        }

        




        function generate_option_from_json(jsonData, fromLoad){
            //Load Category Json Data To Brand Select
            if (fromLoad === 'category_to_sub_category'){
                var option = '';
                if (jsonData.length > 0) {
                    option += '<option value="" selected> <?php echo trans('app.select_a_sub_category') ?> </option>';
                    for ( i in jsonData){
                        option += '<option value="'+jsonData[i].id+'"> '+jsonData[i].category_name +' </option>';
                    }
                    $('#sub_category_select').html(option);
                    $('#sub_category_select').select2();
                }else {
                    $('#sub_category_select').html('<option value=""><?php echo app('translator')->getFromJson('app.select_a_sub_category'); ?></option>');
                    $('#sub_category_select').select2();
                }
                $('#loaderListingIcon').hide('slow');
            }else if (fromLoad === 'category_to_brand'){
                var option = '';
                if (jsonData.length > 0) {
                    option += '<option value="" selected> <?php echo trans('app.select_a_brand') ?> </option>';
                    for ( i in jsonData){
                        option += '<option value="'+jsonData[i].id+'"> '+jsonData[i].brand_name +' </option>';
                    }
                    $('#brand_select').html(option);
                    $('#brand_select').select2();
                }else {
                    $('#brand_select').html('<option value=""><?php echo app('translator')->getFromJson('app.select_a_brand'); ?></option>');
                    $('#brand_select').select2();
                }
                $('#loaderListingIcon').hide('slow');
            }else if(fromLoad === 'country_to_state'){
                var option = '';
                if (jsonData.length > 0) {
                    option += '<option value="" selected> <?php echo app('translator')->getFromJson('app.select_state'); ?> </option>';
                    for ( i in jsonData){
                        option += '<option value="'+jsonData[i].id+'"> '+jsonData[i].state_name +' </option>';
                    }
                    $('#state_select').html(option);
                    $('#state_select').select2();
                }else {
                    $('#state_select').html('<option value="" selected> <?php echo app('translator')->getFromJson('app.select_state'); ?> </option>');
                    $('#state_select').select2();
                }
                $('#loaderListingIcon').hide('slow');

            }else if(fromLoad === 'state_to_city'){
                var option = '';
                if (jsonData.length > 0) {
                    option += '<option value="" selected> <?php echo app('translator')->getFromJson('app.select_city'); ?> </option>';
                    for ( i in jsonData){
                        option += '<option value="'+jsonData[i].id+'"> '+jsonData[i].city_name +' </option>';
                    }
                    $('#city_select').html(option);
                    $('#city_select').select2();
                }else {
                    $('#city_select').html('<option value="" selected> <?php echo app('translator')->getFromJson('app.select_city'); ?> </option>');
                    $('#city_select').select2();
                }
                $('#loaderListingIcon').hide('slow');
            }
        }

        $(function(){

            $('[name="country"]').change(function(){
                var country_id = $(this).val();
                $('#loaderListingIcon').show();
                $.ajax({
                    type : 'POST',
                    url : '<?php echo e(route('get_state_by_country')); ?>',
                    data : { country_id : country_id,  _token : '<?php echo e(csrf_token()); ?>' },
                    success : function (data) {
                        generate_option_from_json(data, 'country_to_state');
                    }
                });
            });
            $('[name="state"]').change(function(){
                var state_id = $(this).val();
                $('#loaderListingIcon').show();
                $.ajax({
                    type : 'POST',
                    url : '<?php echo e(route('get_city_by_state')); ?>',
                    data : { state_id : state_id,  _token : '<?php echo e(csrf_token()); ?>' },
                    success : function (data) {
                        generate_option_from_json(data, 'state_to_city');
                    }
                });
            });
        });
        $(function(){
            $('#showGridView').click(function(){
                $('.ad-box-grid-view').hide();
                $('.ad-box-list-view').show();
                $.ajax({
                    type : 'POST',
                    url : '<?php echo e(route('switch_grid_list_view')); ?>',
                    data : { grid_list_view : 'grid',  _token : '<?php echo e(csrf_token()); ?>' },
                });
            });
            $('#showListView').click(function(){
                $('.ad-box-grid-view').show();
                $('.ad-box-list-view').hide();
                $.ajax({
                    type : 'POST',
                    url : '<?php echo e(route('switch_grid_list_view')); ?>',
                    data : { grid_list_view : 'list',  _token : '<?php echo e(csrf_token()); ?>' },
                });
            });
        });
</script>

<script>
    <?php if(session('success')): ?>
            toastr.success('<?php echo e(session('success')); ?>', '<?php echo trans('app.success') ?>', toastr_options);
        <?php endif; ?>
</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layout.main', \Illuminate\Support\Arr::except(get_defined_vars(), array('__data', '__path')))->render(); ?>