@extends('layouts.app')

@section('content')
	<div class="container">
		<div class="row" style="margin-bottom:10px;">
			<div class="col-md-12">
				<ul class="nav nav-tabs">
					<li{!! Request::is('profile') ? ' class="active"' : '' !!}>
						<a href="{{route('profile')}}">Informations</a>
					</li>
					<li{!! Request::is('profile/requests') ? ' class="active"' : '' !!}>
						<a href="{{route('profile.requests')}}">Demandes</a>
					</li>
					<li{!! Request::is('profile/drives') ? ' class="active"' : '' !!}>
						<a href="{{route('profile.drives')}}">Trajets</a>
					</li>
					<li{!! Request::is('profile/listeners') ? ' class="active"' : '' !!}>
						<a href="{{route('profile.listeners')}}" class="disabled" disabled="disabled">Attentes</a>
					</li>
				</ul>
			</div>
		</div>
		@include('tooltips.success', ['message' => $message])
		@include('tooltips.error', ['errors' => $errors])
		@yield('sub-content')
	</div>
@endsection

@section("page-script")
	<script type="text/javascript">
		$(document).ready(function () {

			// Requests
			var requestsList = $('#requestsList');
			requestsList.tablesorter({
				theme: 'bootstrap',
				headerTemplate: '{content} {icon}',
				widgets: ['uitheme', 'filter']
			});
			requestsList.show();

			requestsList.delegate('.refuseRequestButton', 'click', function () {
				var commentary = prompt("Quelle est la raison de votre refus ?", "");
				var input = $("<input>")
						.attr("type", "hidden")
						.attr("name", "commentary").val(commentary);
				$(this).parents('form').append($(input));
			});
			requestsList.delegate('.acceptRequestButton', 'click', function () {
				var commentary = prompt("Commentaire (laissez vide si aucun)", "");
				var input = $("<input>")
						.attr("type", "hidden")
						.attr("name", "commentary").val(commentary);
				$(this).parents('form').append($(input));
			});
			requestsList.delegate('.cancelRequestButton', 'click', function (e) {
				if (!confirm("Etes-vous sûr de vouloir annuler votre demande ?")) {
					e.preventDefault();
				}
			});
			// ------------------------------


			// Address
			function getAddressForm() {
				var ajaxurl = '{{route("view.addressForm")}}';
				$.get(
						ajaxurl,
						function (data) {
							$('#address').html(data);
						}
				);
			}

			$('#registerAddress').on('click', function (e) {
				getAddressForm();
			});
//			var placeSearch, autocomplete;
//			var componentForm = {
//				street_number: 'short_name',
//				route: 'long_name',
//				locality: 'long_name',
//				administrative_area_level_1: 'short_name',
//				country: 'long_name',
//				postal_code: 'short_name'
//			};
//
//			function initAutocomplete() {
//				// Create the autocomplete object, restricting the search to geographical
//				// location types.
//				autocomplete = new google.maps.places.Autocomplete(
//						/** @type {!HTMLInputElement} */(document.getElementById('autocomplete')),
//						{types: ['geocode']});
//
//				// When the user selects an address from the dropdown, populate the address
//				// fields in the form.
//				autocomplete.addListener('place_changed', fillInAddress);
//			}
//
//			function fillInAddress() {
//				// Get the place details from the autocomplete object.
//				var place = autocomplete.getPlace();
//
//				for (var component in componentForm) {
//					document.getElementById(component).value = '';
//					document.getElementById(component).disabled = false;
//				}
//
//				// Get each component of the address from the place details
//				// and fill the corresponding field on the form.
//				for (var i = 0; i < place.address_components.length; i++) {
//					var addressType = place.address_components[i].types[0];
//					if (componentForm[addressType]) {
//						var val = place.address_components[i][componentForm[addressType]];
//						document.getElementById(addressType).value = val;
//					}
//				}
//			}
//
//			function geolocate() {
//				if (navigator.geolocation) {
//					navigator.geolocation.getCurrentPosition(function (position) {
//						var geolocation = {
//							lat: position.coords.latitude,
//							lng: position.coords.longitude
//						};
//						var circle = new google.maps.Circle({
//							center: geolocation,
//							radius: position.coords.accuracy
//						});
//						autocomplete.setBounds(circle.getBounds());
//					});
//				}
//			}
			// ------------


			// Drives list
			var drivesList = $('.drivesList');
			drivesList.tablesorter({
				theme: 'bootstrap',
				headerTemplate: '{content} {icon}',
				widgets: ['uitheme', 'filter']
			});
			$('.tablesorter-childRow td').hide();

			drivesList.show();

			$('.tablesorter').delegate('.toggle', 'click', function () {
				$(this).closest('tr').nextUntil('tr.tablesorter-hasChildRow').find('td').toggle();
				return false;
			});
			// -------------
		})
	</script>
@endsection