@extends('Admin.components.layout')
@section('title')
Admin
@endsection
@section('subtitle')
        Add Admin
@endsection
@section('content')
    <div class="container-fluid">
        <div class="row mt-2">
            <div class="col-12">
                <div class="card  p-3">
                    <div class="card-body ">
                        @if ($errors->any())
                        <div class="row">
                            <div class="col-sm-6 col-sm-offset-3">
                                {!! implode('', $errors->all('<div class="alert alert-danger">:message</div>')) !!}
                            </div>
                        </div>
                        @endif
                        <form action="{{ route('admin.hospital.store') }}" method="POST" name="form" id="form">
                            {{ csrf_field() }}
                            @if (isset($data))
                                <input type="hidden" name='id' id='id' value="{{$data->id}}">
                           @endif
                           <div class="col-sm-8 col-sm-offset-2">
                            <div class="form-group">
                                <label for="website">Admin Name :</label>
                                <input  type="text" name="hospital_name" id="hospital_name" class="form-control"
                                    @if (isset($data))
                                        value="{{ $data->name }}"
                                    @else
                                        value="{{ old('hospital_name') }}"
                                    @endif>
                            </div>
                            <div class="form-group">
                                <label for="website">Email:</label>
                                <input  type="text" name="hospital_email" id="hospital_email" class="form-control"
                                @if (isset($data))
                                    value="{{ $data->email }}"
                                @else
                                    value="{{ old('hospital_email') }}"
                                @endif>
                            </div>
                            <div class="form-group">
                                <label for="website">Phone Number:</label>
                                <input  type="text" name="hospital_number" id="hospital_number" class="form-control"
                                @if (isset($data))
                                    value="{{ $data->phone_number }}"
                                @else
                                    value="{{ old('hospital_number') }}"
                                @endif>
                            </div>
                            <div class="form-group">
                                <label for="website">Post Code:</label>
                                <input  type="text" name="hospital_post_code" id="hospital_post_code" class="form-control"
                                @if (isset($data))
                                    value="{{ $data->post_code }}"
                                @else
                                    value="{{ old('hospital_post_code') }}"
                                @endif>
                            </div>
                             <div class="form-group">
                                <label for="website">Verify Id</label>
                                <input  type="text" name="hospital_verified_id" id="hospital_verified_id" class="form-control"
                                @if (isset($data))
                                    value="{{ $data->verify_id }}"
                                @else
                                    value="{{ old('hospital_verified_id') }}"
                                @endif>
                            </div>
                            <div class="form-group">
                                <label for="website">Admin Address </label>
                                <input id="autocomplete" style="z-index: 0;left:113px;top:10px!important;background: rgb(255, 255, 255);width: 85%;" class="form-control chamankaka" type="text" placeholder="Enter a location"  name="location"
                                @if (isset($data))
                                    value="{{ $data->address }}"
                                @else
                                    value="{{ old('location') }}"
                                @endif>
                            </div>
                            <div class="form-group">
	                            <div class="map" id="map" style="width: 100%; height: 300px;"></div>
	                    </div>
                            <div class="form-group text-right">
                                <button type="submit" class="btn btn-success"><i class="fa fa-plus"> Add</i></button>
                                {{-- <a  class="btn btn-danger" href="{{route('admin.list.hospital')}}"><i class="fa fa-times"> Cancel</i></a> --}}
                            </div>
                            <input type="hidden"
                                @if (isset($data))
                                    value="{{ $data->latitude }}"
                                @else
                                    value="{{ old('hidden_lat') }}"
                                @endif name="hidden_lat" id="hidden_lat">
                            <input type="hidden"
                            @if (isset($data))
                                value="{{ $data->longitude }}"
                            @else
                                value="{{ old('hidden_long') }}"
                            @endif  name="hidden_long" id="hidden_long">
                        </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('js')
<script nonce="{{$cspNonce}}" src="{{ asset(JS) }}/hospital/add.js"></script>

<script nonce="{{$cspNonce}}" src="https://maps.googleapis.com/maps/api/js?v=3&sensor=false&amp;libraries=places&key=AIzaSyBo3KpktOeAR6lKN3oWHl5IAw9a7FHGG24"></script>
<script nonce="{{$cspNonce}}">
function initialize() {
	var lati=23.0225;
	var longi=72.5714;
	var latlng = new google.maps.LatLng(lati,longi);
	var map = new google.maps.Map(document.getElementById('map'), {
                center: latlng,
                zoom: 13
            });
    var marker = new google.maps.Marker({
      map: map,
      position: latlng,
      draggable: true,
      anchorPoint: new google.maps.Point(0, -29)
   });
    var input = document.getElementById('autocomplete');
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);
    var geocoder = new google.maps.Geocoder();
    var autocomplete = new google.maps.places.Autocomplete(input);
    autocomplete.bindTo('bounds', map);
    var infowindow = new google.maps.InfoWindow();
    autocomplete.addListener('place_changed', function() {
        infowindow.close();
        marker.setVisible(false);
        var place = autocomplete.getPlace();
        if (!place.geometry) {
            window.alert("Autocomplete's returned place contains no geometry");
            return;
        }

        // If the place has a geometry, then present it on a map.
        if (place.geometry.viewport) {
            map.fitBounds(place.geometry.viewport);
        } else {
            map.setCenter(place.geometry.location);
            map.setZoom(17);
        }

        marker.setPosition(place.geometry.location);
        marker.setVisible(true);

        bindDataToForm(place.formatted_address,place.geometry.location.lat(),place.geometry.location.lng());
        infowindow.setContent(place.formatted_address);
        infowindow.open(map, marker);

    });
    // this function will work on marker move event into map
    google.maps.event.addListener(marker, 'dragend', function() {
        geocoder.geocode({'latLng': marker.getPosition()}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          if (results[0]) {
              bindDataToForm(results[0].formatted_address,marker.getPosition().lat(),marker.getPosition().lng());
              infowindow.setContent(results[0].formatted_address);
              infowindow.open(map, marker);
          }
        }
        });
    });
}
function bindDataToForm(address,lat,lng){
    $("#hidden_lat").val(lat);
    $("#hidden_long").val(lng);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>

@endsection