@extends('admin.layouts.app')
@section('content')
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            Admin
            <small>it all here</small>
        </h1>
        <ol class="breadcrumb">
            <li><a ><i class="fa fa-dashboard"></i>Home</a></li>
            <li class="active">Admin</li>
            <li class="active">Edit</li>
        </ol>
    </section>
    <!-- Main content -->
    <section class="content">
        <!-- Default box -->
        <div class="box">
            <div class="box-header with-border">
                <h4>Admin- Edit</h4>
                @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
            </div>
            <div style="margin-top: 10px" class="flash-message">
                @if(Session::has('message'))
                <p class="alert {{ Session::get('alert-class', 'alert-info') }}">{{ Session::get('message') }}</p>
                @endif
            </div>
            <div class="box-body">
                <form action="{{route('admin.hospital.update',encryptValuebase($id))}}" method="post" enctype="multipart/form-data" id="form">
                    {{csrf_field()}}
                    <div class="row">
                        <div class="col-sm-8 col-sm-offset-2">
                            <input type="hidden" name="hiddenId" value="{{$id}}">
                            <div class="form-group">
                                <label for="website">Admin Name :</label>
                                <input  type="text" name="hospital_name" id="hospital_name" class="form-control" value="{{$data->name}}">
                            </div>
                            <div class="form-group">
                                <label for="website">Email:</label>
                                <input  type="text" name="hospital_email" id="hospital_email" class="form-control" value="{{$data->email}}">
                            </div>
                            <div class="form-group">
                                <label for="website">Phone Number:</label>
                                <input  type="text" name="hospital_number" id="hospital_number" class="form-control" value="{{$data->phone_number}}">
                            </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" value="{{$data->verify_id}}">
                            </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" value="{{$data->post_code}}">
                            </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" value="{{$data->address}}">
                            </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"> Update</i></button>
                                <a href="{{route('admin.list.hospital')}}" class="btn btn-danger" href=""><i class="fa fa-times"> Cancel</i></a>
                            </div>
                            <input type="hidden" value="" name="hidden_lat" id="hidden_lat">
                            <input type="hidden" value="" name="hidden_long" id="hidden_long">
                        </div>
                    </div>
            </div>
            <!-- /.box-body -->

            <!-- /.box-footer-->
        </div>
        <!-- /.box -->

    </section>
    <!-- /.content -->
</div>
@endsection
@section('js')
<script 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>
<script type="text/javascript" src="{{asset('asset')}}/js/hospital/add.js"></script>
@endsection