@extends('backend.layouts.app')

@section('title','Chaturmas'.' | '.env('APP_NAME'))

@push('after-styles')
@endpush

@section('breadcrumb')
<div class="subheader py-2 py-lg-4 subheader-solid" id="kt_subheader">
    <div class="container-fluid d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
        <!--begin::Info-->
        <div class="d-flex align-items-center flex-wrap mr-1">
            <!--begin::Page Heading-->
            <div class="d-flex align-items-baseline mr-5">
                <!--begin::Page Title-->
                <!--end::Page Title-->
                <!--begin::Breadcrumb-->
                <ul class="breadcrumb breadcrumb-transparent breadcrumb-dot font-weight-bold p-0 my-2 font-size-sm">
                    <li class="breadcrumb-item active">
                        <a href="{{ route('admin.dashboard') }}" class="text-muted">{{ __('breadcrumb.dashboard') }}</a>
                    </li>
                    <li class="breadcrumb-item active">
                        <a href="{{ route('admin.sant.chaturmas.index', $sant->id) }}" class="text-muted">{{ __('breadcrumb.chaturmases') }}</a>
                    </li>
                    <li class="breadcrumb-item">
                        {{ __('breadcrumb.add_chaturmas') }}
                    </li>
                </ul>
                <!--end::Breadcrumb-->
            </div>
            <!--end::Page Heading-->
        </div>
        <!--end::Info-->
    </div>
</div>
@endsection

@section('content')
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="card card-custom">
                    <div class="card-header">
                        <h3 class="card-title">
                            Add Chaturmas
                        </h3>
                        <div class="card-toolbar">
                            <div class="example-tools justify-content-center">
                                <span class="example-toggle" data-toggle="tooltip" title="View code"></span>
                                <span class="example-copy" data-toggle="tooltip" title="Copy code"></span>
                            </div>
                        </div>
                    </div>
                    <!--begin::Form-->
                    {{ Form::open(['route' => ['admin.sant.chaturmas.store',$sant->id],'id' => 'createSantChaturmasForm', 'files' => true]) }}
                        @include('backend.sant.sant-chaturmas.partials._form')
                    {{ Form::close() }}
                    <!--end::Form-->
                </div>
            </div>
        </div>
    </div>
@endsection

@section('after-scripts')
@component('backend.layouts.components.validation')@endcomponent
<script>
        function demo1() {

        }

        $(document).ready(function () {
            demo1();
            $("#createSantChaturmasForm").validate({
                errorClass: 'is-invalid',
                normalizer: function(value) {
                    return $.trim(value);
                },
                rules: {
                    name: {
                        required: true,
                    }
                },
                onfocusout: function(element) {
                    // "eager" validation
                    // this.element(element);
                }
            });
        });
    </script>
    
    {{-- Google Map script --}}
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAoZv-67UKDVz5Rp3fa3e2xcHunahFGKOc&libraries=places&callback=dummy"></script>
    <script>
        google.maps.event.addDomListener(window, 'load', initialize);
        function initialize() {
            var input = document.getElementById('place');
            var autocomplete = new google.maps.places.Autocomplete(input);
            autocomplete.addListener('place_changed', function () {
                var place = autocomplete.getPlace();
                var state = place.address_components.find(item => item.types.includes('administrative_area_level_1'));
            
                $('#latitude_show').val(place.geometry['location'].lat());
                $('#longitude_show').val(place.geometry['location'].lng());
                $('#latitude').val(place.geometry['location'].lat());
                $('#longitude').val(place.geometry['location'].lng());
                $("#latitudeArea").removeAttr('hidden');
                $("#longtitudeArea").removeAttr('hidden');
            });
        }
    </script>
@endsection