@extends('admin.layouts.master')
@section('headerFiles')
    <link rel="stylesheet" type="text/css" href="{{ admin_asset('admin-assets/plugins/table/datatable/datatables.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ admin_asset('admin-assets/plugins/table/datatable/custom_dt_zero_config.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ admin_asset('admin-assets/plugins/jqvalidation/custom-jqBootstrapValidation.css') }}">
    <link href="{{ admin_asset('admin-assets/plugins/notification/toastr/toastr.min.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ admin_asset('admin-assets/plugins/editors/tinymce/stylesheet.css') }}" rel="stylesheet" type="text/css" />
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    <!-- END GLOBAL MANDATORY STYLES -->    
    <style type="text/css">
        .error{
            color: red;
            display: block;
        }
        .select2-container .select2-selection--multiple{
           width: 100%;
        }
        .info_err{
            color: red;
            display: block;
        }
    </style>
@endsection

@section('content')

<div class="container">
    <div class="page-header">
        <div class="page-title">
            <h3>{{ $page_title }}</h3>
        </div>
    </div>

    <div class="row layout-spacing ">

        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12  layout-spacing">
            <div class="statbox widget box box-shadow">                
                <div class="widget-content widget-content-area" style="height: inherit">
                    <form method="post" class="form-validate" method="post">
                        @csrf
                        <input type="hidden" name="id" id="id" value="{{ $property->property_id }}" >
                        <div class="form-group row">
                            <div class="col-md-6 col-sm-12">
                                <label for="t-text">Title En *</label>                                            
                                <input type="text" name="property_name" id="property_name" value="{{ $property->property_name }}" class="form-control" placeholder="Enter property title" required>
                            </div>
                            <div class="col-md-6 col-sm-12">
                                <label for="t-text">Title Ar</label>                                            
                                <input type="text" dir="rtl" name="property_name_ar" id="property_name_ar" value="{{ $property->property_name_ar }}" class="form-control" placeholder="Enter property title Ar">
                            </div>
                            <div class="col-md-12 col-sm-12">
                                <label for="t-text">Special Notes</label>                                            
                                <input type="text" name="special_notes" id="special_notes" value="{{ $property->special_notes }}" class="form-control" placeholder="Enter property Special Notes">
                            </div>
                        </div>

                        <div class="form-group row">
                            <div class="col-md-4 col-sm-12">
                                <label for="t-text">Property Code *</label>                                            
                                <input type="text" name="property_code" id="property_code" value="{{ $property->property_code }}" class="form-control" placeholder="Enter property code" required>
                            </div>
                            <div class="col-md-4 col-sm-12">
                                <label for="t-text">Category *</label>                                            
                                <select class="custom-select mb-4" name="category_type" id="category_type" required>
                                    <option value="">Select Category Type</option>
                                    @foreach ($categories as $category)
                                    <option value="{{ $category->id }}" {{ $property->category_type == $category->id ? "selected" : ""}} >{{ $category->name_en }}</option>    
                                    @endforeach                                
                                </select>
                            </div>
                            <div class="col-md-4 col-sm-12">
                                <label for="t-text">Property Type *</label>                                            
                                <select class="custom-select mb-4" name="property_type" id="property_type" required>
                                    <option value="">Select Property Type</option>
                                    @foreach ($property_types as $type)
                                    <option value="{{ $type->id }}" {{ $property->property_type == $type->id ? "selected" : ""}} >{{ $type->name_en }}</option>    
                                    @endforeach                                
                                </select>
                            </div>
                            <div class="col-md-4 col-sm-12">
                                <label for="t-text">Area</label>                                            
                                <select class="custom-select mb-4" name="area_id" id="area_id">
                                    <option value="">Select Area</option>
                                    @foreach ($areas as $area)
                                    <option value="{{ $area->id }}" {{ $property->area_id == $area->id ? "selected" : ""}} >{{ $area->name_en }}</option>    
                                    @endforeach                                
                                </select>
                            </div>
                            @if(\Request::has('deals_of_month') == true)
                            <input type="hidden" name="deals_of_month" value="1">
                            @else
                            @endif
                                <div class="col-md-4 col-sm-12 mt-3">
                                    <label for="t-text">Actual Price *</label>                                            
                                    <input type="number" name="property_price" id="property_price" value="{{ $property->property_price == null ? 0  :  $property->property_price}}" class="form-control" placeholder="Enter property price" required>
                                </div>
                                <div class="col-md-4 col-sm-12 mt-3">
                                    <label for="t-text">Offer Price </label>                                            
                                    <input type="number" name="offer_price" id="offer_price" value="{{ $property->offer_price == null ? 0 : $property->offer_price }}" class="form-control" placeholder="Enter Offer Price" onchange="check()">
                                    <span class="error" id="error"></span>
                                </div>
                                <div class="col-md-4 col-sm-12 mt-3">
                                    <label for="t-text">Percentage % </label>                                            
                                    <input type="text" disabled name="discount_percentage"  value="{{ $property->discount_percentage == null ? 0 : $property->discount_percentage }}" class="form-control discount_percentage">
                                    <input type="hidden" name="discount_percentage"  value="{{ $property->discount_percentage == null ? 0 : $property->discount_percentage }}" class="form-control discount_percentage">
                                </div>
                                <div class="col-md-4 col-sm-12 mt-3">
                                    <label for="t-text">Cleaning Fee *</label>                                            
                                    <input type="number" name="rms_cleaning_fee" id="rms_cleaning_fee" value="{{ $property->rms_cleaning_fee == null ? 0 : $property->rms_cleaning_fee }}" class="form-control" placeholder="Enter Cleaning Fee" required>
                                </div>
                                <div class="col-md-4 col-sm-12 mt-3">
                                    <label for="t-text">Tourism Fee *</label>                                            
                                    <input type="number" name="tourism_fee" id="tourism_fee" value="{{ $property->tourism_fee == null ? 0 : $property->tourism_fee }}" class="form-control" placeholder="Enter Tourism Fee" required>
                                </div>

                                <div class="col-md-4 col-sm-12 mt-3">
                                    <label for="t-text">Service Fee % * </label>                                            
                                    <input type="number" name="booking_fee" id="booking_fee" value="{{ $property->booking_fee == null ? 0 : $property->booking_fee }}" class="form-control" placeholder="Enter Service Fee %" max="100" min="0" required>
                                </div>
                            
                            <div class="col-md-4 col-sm-12 mt-3">
                                <label for="t-text">Sort Order *</label>                                            
                                <input type="number" name="sort_order" id="sort_order" value="{{ $property->sort_order }}" class="form-control" placeholder="Enter Sort Order" required>
                            </div>

                            <div class="col-md-4 col-sm-12 mt-3">
                                <label for="t-text">Promo Code </label>                                            
                                <input type="text" name="rms_promocode" id="rms_promocode" value="{{ $property->rms_promocode }}" class="form-control" placeholder="Enter The Coupon Code">
                            </div>
                            
                            <div class="col-md-12 col-sm-12 mt-3 mb-5">
                                <label for="t-text">Amenities</label>                                            
                                <select class="form-control" name="amenities[]" id="amenities" multiple>
                                    @php
                                        $property_amenities = explode(',', $property->property_amenities)
                                    @endphp
                                    <!-- <option value="">Select Amenties Type</option> -->
                                    @foreach ($amenities as $value)
                                    <option value="{{ $value->amenities_id }}" {{ (in_array($value->amenities_id, $property_amenities)) ? "selected" : ""}} >{{ $value->amenities_name }}</option>    
                                    @endforeach                                
                                </select>
                            </div>                          
                        </div>

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

                        <div class="form-group row" id="rent_type_div" style="display: none;">
                            <div class="col-md-12 col-sm-12">
                                <label for="t-text">Rent Type</label>                                            
                                <select class="custom-select mb-4" name="rent_type" id="rent_type">
                                    <option value="Yearly">Yearly</option>
                                    <option value="Monthly">Monthly</option>
                                    <option value="Weekly">Weekly</option>
                                    <option value="Daily">Daily</option>                                
                                </select>
                            </div>
                        </div>
                        @php
                        $beedrooms = [0,1,2,3,4,5,6,7,8,9,10];
                        @endphp
                        <div class="form-group row">
                            <div class="col-md-4 col-sm-12">
                                <label for="t-text">Bedroom *</label>   
                                <select class="custom-select mb-4" name="property_bedroom" id="property_bedroom" required>
                                    <option value="">Select Bedroom</option>
                                    @foreach($beedrooms as $key => $beedroom)
                                    @if($beedroom == 0)
                                    <option value="{{$beedroom}}" {{($property->property_bedroom ==$beedroom) ? 'selected' : ''}}>STUDIO</option>
                                    @else
                                    <option value="{{$beedroom}}" {{($property->property_bedroom ==$beedroom) ? 'selected' : ''}}>{{$beedroom}}</option>
                                    @endif
                                    @endforeach                                         
                                </select>
                                <!-- <input type="number" name="property_bedroom" id="property_bedroom" value="{{  $property->property_bedroom }}" class="form-control" placeholder="Enter number of bedroom" required> -->
                            </div>
                            <div class="col-md-4 col-sm-12">
                                <label for="t-text">Bathroom *</label>                                            
                                <input type="number" name="property_bathroom" id="property_bathroom" value="{{ $property->property_id != null ? $property->property_bathroom : ""}}" class="form-control" placeholder="Enter number of bathroom" required>
                            </div>
                            <div class="col-md-4 col-sm-12">
                                <label for="t-text">Guest *</label>                                            
                                <input type="number" name="guest" id="guest" value="{{ $property->property_id != null ? $property->guest : ""}}" class="form-control" placeholder="Enter number of guest" required>
                            </div>
                        {{-- </div>
                        <div class="form-group row"> --}}
                            <div class="col-md-4 col-sm-12">
                                <label for="t-text">Size (Squre Feet)</label>                                            
                                <input type="number" type="any" name="property_sqft" id="property_sqft" value="{{ $property->property_sqft }}" class="form-control" placeholder="Enter property square foot">
                            </div>   
                            {{-- <div class="col-md-3 form-group">
                                <label> Start Data *</label>
                                <input type="date" name="start_date" class="form-control jqv-input" data-jqv-required="true"
                                    value="{{ $property->start_date ? date('Y-m-d',strtotime($property->start_date)) : ''  }}" required>
                            </div> --}}
                            {{-- <div class="col-md-3 form-group">
                                <label> End Data *</label>
                                <input type="date" name="end_date" class="form-control jqv-input" data-jqv-required="true"
                                    value="{{ $property->end_date ? date('Y-m-d',strtotime($property->end_date)) : '' }}" required>
                            </div> --}}
                            <!--<div class="col-md-6 col-sm-12">-->
                            <!--    <label for="t-text">Completion Level</label>                                            -->
                            <!--    <input type="text" name="completion_level" id="completion_level" value="{{ $property->completion_level}}" class="form-control" placeholder="Enter completion level">-->
                            <!--</div>-->
                        </div>
                        
                        <div class="form-group row">
                            <!--<div class="col-md-6 col-sm-12">-->
                            <!--    <label for="t-text">Size (Squre Feet)</label>                                            -->
                            <!--    <input type="text" name="service_charges" id="service_charges" value="{{ $property->service_charges}}" class="form-control" placeholder="Enter service charges">-->
                            <!--</div>                       -->
                            
                        </div>
                        <div class="form-group row">
                            <div class="col-md-6 col-sm-12">
                                <label class="control-label">Enter the location or Drag the marker</label>
                                <input type="text" name="txt_location" id="txt_location" value="{{  $property->property_location }}" class="form-control autocomplete" placeholder="Property location">
                                {{-- <input type="hidden" id="latitude" name="latitude[]" value="{{ $property->property_id != null ? $property->latitude : "25.204819"}}">
                                <input type="hidden" id="longitude" name="longitude[]" value="{{ $property->property_id != null ? $property->longitude : "55.270931"}}"> --}}
                                <input type="hidden" id="location" name="location">
                            </div>
                            <div class="col-md-6 col-sm-12">  
                            </div>
                        </div>
                        <div class="form-group row">
                            <div class="col-md-6 col-sm-12">                                
                                <div id="map_canvas_branch" style="height: 200px;width:100%;"></div>
                            </div>
                            <div class="col-md-6 col-sm-12 row"> 
                                <div class="col-md-6 col-sm-12">  
                                    <div class="custom-control custom-checkbox checkbox-primary">
                                        <input type="checkbox" class="custom-control-input"   name="status" id="status" {{ $property->property_status == 1 ? "checked" : ""}}>
                                        <label class="custom-control-label" for="status">Status</label>
                                    </div>
                                </div> 
                                <div class="col-md-6 col-sm-12">  
                                    <div class="custom-control custom-checkbox checkbox-primary">                              
                                        <input type="checkbox" class="custom-control-input"  name="short_term_rent" id="short_term_rent" {{ $property->short_term_rent == 1 ? "checked" : ""}}>
                                        <label  class="custom-control-label" for="short_term_rent">Short Term Rent</label>
                                    </div>
                                </div>
                                <div class="col-md-6 col-sm-12">                                
                                    <div class="custom-control custom-checkbox checkbox-primary">                              
                                    <input type="checkbox" class="custom-control-input"  name="featured" id="featured" {{ $property->featured == 1 ? "checked" : ""}}>
                                    <label class="custom-control-label" for="featured">Featured</label>
                                </div>
                                </div>
                                <div class="col-md-6 col-sm-12">                                
                                    <div class="custom-control custom-checkbox checkbox-primary">                              
                                    <input type="checkbox" class="custom-control-input"  name="recomended" id="recomended" {{ $property->recomended == 1 ? "checked" : ""}}>
                                    <label class="custom-control-label" for="recomended">Recomended</label>
                                </div>
                                </div>
                                
                                {{-- <div class="col-md-6 col-sm-12">                                                                            
                                    <div class="custom-control custom-checkbox checkbox-primary">                              
                                    <input type="checkbox" class="custom-control-input"  name="bedroom_maids" id="bedroom_maids" {{ $property->bedroom_maids == 1 ? "checked" : ""}}>                                
                                    <label class="custom-control-label" for="bedroom_maids">Maid Room</label>
                                </div>                            
                                </div> --}}
                                <div class="col-md-6 col-sm-12">  
                                    <div class="custom-control custom-checkbox checkbox-primary">
                                        <input type="checkbox" class="custom-control-input"   name="vacational_rent" id="vacational_rent" {{ $property->vacational_rent == 1 ? "checked" : ""}}>
                                        <label class="custom-control-label" for="vacational_rent">Vacational Rent</label>
                                    </div>
                                </div>
                                <div class="col-md-6 col-sm-12">  
                                    <div class="custom-control custom-checkbox checkbox-primary">                              
                                        <input type="checkbox" class="custom-control-input"  name="is_premium" id="is_premium" {{ $property->is_premium == 1 ? "checked" : ""}}>
                                        <label  class="custom-control-label" for="is_premium">Premium</label>
                                    </div>
                                </div>
                                
                                <div class="col-md-6 col-sm-12">                                                                            
                                    <div class="custom-control custom-checkbox checkbox-primary">                              
                                    <input type="checkbox" class="custom-control-input"  name="luxary_house" id="luxary_house" {{ $property->luxary_house == 1 ? "checked" : ""}}>                                
                                    <label class="custom-control-label" for="luxary_house">Luxary House</label>
                                </div>                            
                                </div> 
                                {{-- <div class="col-md-6 col-sm-12">                                                                            
                                    <div class="custom-control custom-checkbox checkbox-primary">                              
                                    <input type="checkbox" class="custom-control-input"  name="allow_guest" id="allow_guest" {{ $property->allow_guest == 1 ? "checked" : ""}}>                                
                                    <label class="custom-control-label" for="allow_guest">Allow Guest</label>
                                </div>                            
                                </div>                               --}}

                            </div>

                        </div>
                        <div class="form-group row">
                            <div class="col-md-6 col-sm-12">
                                <label for="t-text">Description En</label>
                                <textarea id="property_desc" name="property_desc" class="form-control property_desc">{{ $property->property_desc  }}</textarea>
                            </div>                            
                            <div class="col-md-6 col-sm-12">
                                <label for="t-text">Description Ar</label>
                                <textarea id="property_desc_ar" name="property_desc_ar" dir="rtl" class="form-control float-end property_desc_ar">{{ $property->property_desc_ar  }}</textarea>
                            </div>                            
                        </div>


                        <div class="col-md-12 mt-4">
                            <h4>SEO Details</h4>
                        </div>
                        <div class="col-md-12  form-group">
                          <label for="t-text">Meta Title </label>
                          <input type="text" name="meta_title" id="meta_title" value="{{ $property->meta_title }}" class="form-control" placeholder="Enter meta title" onkeyup="countChar(this,1,60)">
                          <span>(<span id="display_count1">{{60 - strlen($property->meta_title)}} </span>Characters)</span>
                        </div>
                        <div class="col-md-12  form-group">
                          <label for="t-text">Meta Keyword  ( Coma(,) Separated keywords)</label>
                          <input type="text" name="meta_keywords" id="meta_keyword" value="{{ $property->meta_keywords }}" class="form-control" placeholder="Enter meta keywords ">
                        </div>
                        <div class="col-md-12  form-group">
                          <label for="t-text">Meta Description </label>
                          <textarea class="form-control" id ="meta_description" placeholder="Enter meta description" name="meta_description" onkeyup="countChar(this,2,120)">{{ $property->meta_description }} </textarea>
                          <span>(<span id="display_count2">{{120 - strlen($property->meta_description)}} </span>Characters)</span>
                        </div>

                    </form>
                    <div class="form-group row">
                        <div class="col-md-12 col-sm-12">
                            <button class="mt-4 btn btn-button-7" onclick="submit()">Submit</button>
                        </div>                            
                    </div>

                </div>
            </div>
        </div>
        
    </div>

</div>

@endsection

@section('footerJs')
{{-- <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB8QkOt74HuPCD8N6m1OfwSzyb0NWnjorg&v=weekly&libraries=places" async defer></script> --}}
<script src="{{ admin_asset('admin-assets/plugins/jqvalidation/jqBootstrapValidation-1.3.7.min.js') }}"></script>
<script src="{{ admin_asset('admin-assets/plugins/jqvalidation/jqBootstrapValidation-1.3.7.min.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.js"></script>
<script src="{{ admin_asset('admin-assets/plugins/editors/tinymce/tinymce.min.js') }}"></script>
<script src="{{ admin_asset('admin-assets/plugins/editors/tinymce/editor_tinymce.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB8QkOt74HuPCD8N6m1OfwSzyb0NWnjorg&v=weekly&libraries=places"></script>
<script>
    tinymce.init({
        selector: '.property_desc'
      });
      tinymce.init({
        selector: '.property_desc_ar',
        directionality: "rtl",
        
      });

    $(document).ready(function(){
        $('#amenities').select2();
        $("#category_type").trigger('change');
    });

    $("#category_type").change(function(){       
       var category_type = $("#category_type").val();    
       if(category_type == 2){
           $("#rent_type_div").show();
       } else {
           $("#rent_type_div").hide();
       }       
       $("#rent_type").val("{{ $property->property_id != null ? $property->rent_type : 'Yearly' }}");
       
    });
    
    function  check(){
        let property_price = $('#property_price').val();
        let offer_price = $('#offer_price').val();
        property_price = property_price != undefined ? parseFloat(property_price) : 0;
        offer_price = offer_price != undefined ? parseFloat(offer_price) : 0;
            $('#error').hide();
            $('#error').html('');
        if(offer_price > property_price ){
            $('#error').show();
            $('#error').html('Offer price can not be greater then actual price.');
            $('#offer_price').focus();
            return false;
        }
        let percentage = ((property_price - offer_price) / property_price) * 100;
        percentage = percentage != undefined ? (percentage).toFixed(2) : 0;
        $('.discount_percentage').val(percentage);
         return true;
    }
    function submit(){
        if(check() == true){
            $(".form-validate").submit();
        }
        return;
    }
    $(".form-validate").submit(function(e) {
        e.preventDefault();
    }).validate({
        rules: {           
            articles_type_id: "required"            
        },
        messages: {            
            articles_type_id: "Please select article type"
        },
        submitHandler: function(form) {

            $(".info_err").remove();

            $.ajax({
                type:'POST',
                url: "{{ route("admin.property.add_edit_save")}}",
                data: $('.form-validate').serialize()+"&property_desc="+tinymce.get("property_desc").getContent()+"&property_desc_ar="+tinymce.get("property_desc_ar").getContent(),
                success: function(response) {
                    if(response.success == 1){
                        toastr["success"](response.message);
                        setTimeout(function(){ 
                            @if(\Request::has('deals_of_month') == true)
                                window.location.href = "{{ route("admin.property.deals_of_month")}}";
                            @else
                                window.location.href = "{{ route("admin.property.list")}}";
                            @endif
                        }, 1000);                        
                    }
                    else if(response.success == 2){
                        
                        $.each(response.errors, function(key, value) {

                            $('#'+key+'').parents('.col-md-6').append('<span class="info_err">'+value+'</span>');
                            $('#'+key+'').focus();
                        });                       
                    }
                    else
                    {
                        toastr["error"](response.message);
                    }
                }            
            });
        }
    });



    var map;
    var usermarker;
    var geocoder;
    var currentLat = 25.204819;
    var currentLong = 55.270931;
    $("#location").val(currentLat+","+currentLong);

    currentlocation = {
        "lat": currentLat,
        "lng": currentLong,
    };
    console.log(currentlocation)

    function initMap2() {
        console.log("init map 2")
        map2 = new google.maps.Map(document.getElementById('map_canvas_branch'), {
            center: {
                lat: currentlocation.lat,
                lng: currentlocation.lng
            },
            zoom: 14,
            gestureHandling: 'greedy',
            mapTypeControl: false,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
            },
            streetViewControlOptions: {
                position: google.maps.ControlPosition.LEFT_BOTTOM
            },
        });

        geocoder = new google.maps.Geocoder();

        // geocoder2 = new google.maps.Geocoder;
        usermarker = new google.maps.Marker({
            position: {
                lat: currentlocation.lat,
                lng: currentlocation.lng
            },
            map: map2,
            draggable: true,

            animation: google.maps.Animation.BOUNCE
        });


        //map click
        google.maps.event.addListener(map2, 'click', function(event) {
            updatepostition2(event.latLng, "movemarker");
            //drag end event
            usermarker.addListener('dragend', function(event) {
                // alert();
                updatepostition2(event.latLng, "movemarker");

            });
        });

        //drag end event
        usermarker.addListener('dragend', function(event) {
            // alert();
            updatepostition2(event.latLng);

        });
    }

    function geocodePosition(pos) {
        geocoder.geocode({
            latLng: pos
        }, function(responses) {
            if (responses && responses.length > 0) {
                usermarker.formatted_address = responses[0].formatted_address;
            } else {
                usermarker.formatted_address = 'Cannot determine address at this location.';
            }
            console.log(usermarker.formatted_address);
            $('#branch_address').text(usermarker.formatted_address);
        });
    }


    updatepostition2 = function(position, movemarker) {
        console.log(position);
        geocodePosition(position);
        usermarker.setPosition(position);
        map2.panTo(position);
        map2.setZoom(15);
        let createLatLong = position.lat()+","+position.lng();
        console.log("Address Lat/long="+createLatLong);
        $("#location").val(createLatLong);
    }

    function initAutocomplete2() {
        // Create the search box and link it to the UI element.
        var input2 = document.getElementById('txt_location');
        var searchBox2 = new google.maps.places.SearchBox(input2);

        map2.addListener('bounds_changed', function() {
            searchBox2.setBounds(map2.getBounds());
        });

        searchBox2.addListener('places_changed', function() {
            var places2 = searchBox2.getPlaces();

            if (places2.length == 0) {
                return;
            }
            $('#txt_location').val(input2.value)

            var bounds2 = new google.maps.LatLngBounds();
            places2.forEach(function(place) {
                if (!place.geometry) {
                    console.log("Returned place contains no geometry");
                    return;
                }

                updatepostition2(place.geometry.location);

                if (place.geometry.viewport) {
                    // Only geocodes have viewport.
                    bounds2.union(place.geometry.viewport);
                } else {
                    bounds2.extend(place.geometry.location);
                }
            });
            map2.fitBounds(bounds2);
        });
    }

    initMap2();
    initAutocomplete2();


</script>

<script>
$('#property_name').bind('keyup keypress blur', function(){  
    
    var myStr = $(this).val()
    // myStr=myStr.toLowerCase();
    myStr=myStr.replace(/(^\s+|[^a-zA-Z0-9 ]+|\s+$)/g," ");
    myStr=myStr.replace(/\s+/g, " ");

    $('#property_name').val(myStr); 
});


function countChar(val, one = null,length=255) {
    var len = val.value.length;
    if (len > length) {
        val.value = val.value.substring(0, length);
    } else {
        if (one != null) {
            $('#display_count'+one).text(length - len);
        } else if (one == 2) {
            $('#display_count2').text(length - len);
        } else {
            $('#display_count').text(length - len);
        }
    }
}
</script>

@endsection