@extends('layouts.app')

@if(empty($org_type))
  @section('form-title') {{ __('Add new organisation') }} @endsection
@else
  @section('form-title') {{ 'Add new '.strtolower($org_name) }} @endsection
@endif

@section('breadcrumb')
  @if(empty($org_type))
    <li class="breadcrumb-item"><a href="{{ route('organisations.index') }}">{{ __('Organisations') }}</a></li> 
    <li class="breadcrumb-item">{{ __('Add new organisation') }} </li> 
  @else
    <li class="breadcrumb-item"><a href="{{ route('organisations.index', ['type' => $org_type]) }}">{{ \Illuminate\Support\Str::plural($org_name) }}</a></li> 
    <li class="breadcrumb-item">{{ __('Add new '.strtolower($org_name)) }} </li> 
  @endif
@endsection

@section('content')
@include('partials.modals.maps')
@php
  $google_maps_field = $settings__->google_maps_field ? json_decode($settings__->google_maps_field) : null;
@endphp
<div class="pcoded-inner-content">
    <div class="main-body">
      <div class="page-wrapper">
        <!-- Page body start -->
        <div class="page-body">
          <div class="row">
            <div class="col-sm-12">
              <!-- Basic Inputs Validation start -->
              <div class="card">
                <div class="card-block">
                  <form id="main" method="post" action="{{ route('organisations.store') }}" novalidate>
                    @csrf
                    <input type="hidden" name="org_type" id="org_type" value="{{ $org_type }}">
                    <input type="hidden" name="org_type_name" id="org_type_name" value="{{ $org_name }}">
                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('Name') }} *</label>
                      <div class="col-sm-10">
                        @php
                          $name_placeholder = empty($org_type) ? __('Organisation name') : $org_name . ' name';
                        @endphp
                        <input type="text" class="form-control" name="name" id="name" placeholder="{{ $name_placeholder }}" value="{{ old('name') }}">
                        <span class="messages">
                            @if($errors->has('name'))
                            <p class="text-danger error">{{ $errors->first('name') }}</p>
                            @endif
                        </span>
                      </div>
                    </div>

                    @if(canViewUpdate('app-owner'))
                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('Application owner') }} </label>
                      <div class="col-sm-10">
                        {!! yesNoRadio('application_owner', old('application_owner', 'no')) !!}
                        <span class="messages">
                            @if($errors->has('application_owner'))
                            <p class="text-danger error">{{ $errors->first('application_owner') }}</p>
                            @endif
                        </span>
                      </div>
                    </div>
                    @endif

                    @if(empty($org_type))
                    <div class="mb-3 row">
                        <label class="form-label col-sm-2 col-form-label">{{ __('Type(s)') }} *</label>
                        <div class="col-sm-10 col-xl-10">
                            {!! organisationTypes([old('organisation_types[]')]) !!}
                            <span class="messages">
                              @if($errors->has('organisation_types'))
                              <p class="text-danger error">{{ $errors->first('organisation_types') }}</p>
                              @endif
                            </span>
                        </div>
                    </div>
                    @else
                    {!! organisationType('organisation_types[]', $org_type) !!}
                    @endif

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('Zip code') }} </label>
                      <div class="col-sm-10">
                          <input type="text" class="form-control" name="zip" id="zip" placeholder="{{ __('E.g. 123...') }}" value="{{ old('zip') }}">
                          <span class="messages">
                              @if($errors->has('zip'))
                              <p class="text-danger error">{{ $errors->first('zip') }}</p>
                              @endif
                              <p class="text-danger error" id="zip_error" style="display: none;"></p>
                          </span>
                      </div>
                    </div>

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('House number') }} </label>
                      <div class="col-sm-10">
                          <input type="text" class="form-control" name="house_number" id="house_number" placeholder="{{ __('E.g. 1') }}" value="{{ old('house_number') }}">
                          <span class="messages">
                              @if($errors->has('house_number'))
                              <p class="text-danger error">{{ $errors->first('house_number') }}</p>
                              @endif
                              <p class="text-danger error" id="house_number_error" style="display: none;"></p>
                          </span>
                      </div>
                    </div>

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('Addition (optional)') }} </label>
                      <div class="col-sm-10">
                          <input type="text" class="form-control" name="house_number_optional" id="house_number_optional" placeholder="{{ __('E.g. A') }}" value="{{ old('house_number_optional') }}">
                      </div>
                    </div>

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('Street') }} </label>
                      <div class="col-sm-10">
                        <input type="text" class="form-control" name="street" id="street" placeholder="{{ __('Street') }}" value="{{ old('street') }}">
                        <span class="messages">
                            @if($errors->has('street'))
                            <p class="text-danger error">{{ $errors->first('street') }}</p>
                            @endif
                        </span>
                      </div>
                    </div>

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('City') }} </label>
                      <div class="col-sm-10">
                        <input type="text" class="form-control" name="city" id="city" placeholder="{{ __('City') }}" value="{{ old('city') }}">
                        <span class="messages">
                            @if($errors->has('city'))
                            <p class="text-danger error">{{ $errors->first('city') }}</p>
                            @endif
                        </span>
                      </div>
                    </div>
                    @if($google_maps_field->option_to_fill_in === 'yes')
                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('Google Maps address') }} </label>
                      <div class="col-sm-10">
                          @if($google_maps_field->forward_to_gm_api === 'yes')
                          <input type="text" class="form-control" name="gml" id="gml" placeholder="{{ __('Google Maps address') }}" value="{{ old('gml') }}">
                          @else
                          <input type="text" class="form-control" name="gml" id="gml" placeholder="{{ __('Google Maps address') }}" value="{{ old('gml') }}" onclick="openLocationMap();" readonly="">
                          @endif
                        <input type="hidden" name="latitude" id="latitude" value="{{ old('latitude') }}">                    
                        <input type="hidden" name="longitude" id="longitude" value="{{ old('longitude') }}">
                        <span class="messages">
                            @if($errors->has('gml'))
                            <p class="text-danger error">{{ $errors->first('gml') }}</p>
                            @endif
                        </span>
                      </div>
                    </div>
                    @endif

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('Country') }} </label>
                      <div class="col-sm-10">
                        {!! countries(156) !!}
                        <span class="messages">
                            @if($errors->has('country'))
                            <p class="text-danger error">{{ $errors->first('country') }}</p>
                            @endif
                        </span>
                      </div>
                    </div>

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('Phone number') }} </label>
                      <div class="col-sm-10">
                        <div class="row">
                          <div class="col-sm-3">
                            <input type="number" class="form-control country-code" name="country_code" id="country_code" maxlength="4">
                          </div>
                          <div class="col-sm-9">
                            <input type="text" class="form-control fill" name="phone" id="phone" placeholder="{{ __('Your Phone Number') }}" value="{{ old('phone') }}">
                            <span class="messages">
                              @if($errors->has('phone'))
                              <p class="text-danger error">{{ $errors->first('phone') }}</p>
                              @endif
                              <p class="text-danger error" id="phone-error" style="display: none;"></p>
                            </span>
                          </div>
                        </div>
                      </div>
                    </div>

                    <div class="mb-3 row">
                        <label class="form-label col-sm-2 col-form-label">{{ __('Website') }} </label>
                        <div class="col-sm-10">
                            <input type="url" class="form-control" name="website" id="website" placeholder="{{ __('Https://') }}" value="{{ old('website') }}">
                            <span class="messages">
                                @if($errors->has('website'))
                                <p class="text-danger error">{{ $errors->first('website') }}</p>
                                @endif
                            </span>
                        </div>
                    </div>

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2 col-form-label">{{ __('E-mail address') }} *</label>
                      <div class="col-sm-10">
                        <input type="email" class="form-control" name="email" id="email" placeholder="{{ __('E-mail address') }}" value="{{ old('email') }}">
                        <span class="messages">
                            @if($errors->has('email'))
                            <p class="text-danger error">{{ $errors->first('email') }}</p>
                            @endif
                        </span>
                      </div>
                    </div>

                    <div class="mb-3 row">
                      <label class="form-label col-sm-2"></label>
                      <div class="col-sm-10">
                        @if(request()->has('return'))
                        <input type="hidden" name="return" value="{{ old('return', url()->previous()) }}">
                        @endif
                        <button type="submit" class="btn btn-primary m-b-0">{{ __('Save') }}</button>
                      </div>
                    </div>
                  </form>
                </div>
              </div>
              <!-- Basic Inputs Validation end -->
              
            </div>
            <!-- Form components Validation card end -->
          </div>
        </div>
      </div>
      <!-- Page body end -->
    </div>
  </div>
</div>
        
@endsection

@push('child-scripts')
<script src="https://maps.googleapis.com/maps/api/js?key={{ config('furnit.google_map_key') }}&libraries=places&callback=initialize" async defer></script>
<script>
function openLocationMap(){
  //getLocation();
  $('#maps_modal').modal('show');
}

var x = '';
var select_address_id = '';

function getLocation(id='') {
  if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(showPosition);
  } else { 
      x.innerHTML = "Geolocation is not supported by this browser.";
  } 
  select_address_id = id;
}

function showPosition(position) {
  var Latitude = position.coords.latitude; 
  var Longitude = position.coords.longitude;
}
 
function initialize() {
  var latlng = new google.maps.LatLng(52.377956,4.897070);
  var map = new google.maps.Map(document.getElementById('map'), {
      center: latlng,
      zoom: 10
  });

  var marker = new google.maps.Marker({
      map: map,
      position: latlng,
      draggable: true,
      anchorPoint: new google.maps.Point(0, -29)
  });

  var input = document.getElementById('input_maps_location');
  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){
  document.getElementById('gml').value = address;
  document.getElementById('latitude').value = lat;
  document.getElementById('longitude').value = lng;
}
</script>
@include('partials.postcode-js')
@endpush