// Initialiseer flatpickr voor de datetime invoer met gewenste opties
flatpickr(".chanvalli-datetime", {
    enableTime: true,
    dateFormat: "Y-m-d H:i", // Datum/tijd formaat
    minDate: "today",       // Geen datums in het verleden
    time_24hr: true         // 24-uurs tijdweergave
});



// Haal adres-suggesties op en vul een datalist (of ander element) met de resultaten
function fetchAddressSuggestions(input, fieldId) {
    fetch(`${geocodeUrl}?text=${input}&api_key=${OpenRouteServiceAPIKey}&boundary.country=NL,DE,FR,BE,LU`)
        .then(response => response.json())
        .then(data => {
            const suggestions = data.features;
            const list = document.getElementById(`${fieldId}-suggestions`);
            list.innerHTML = ''; // Reset de suggestielijst

            suggestions.forEach(suggestion => {
                let fullLabel = suggestion.properties.label;
                // Verdeel de label op komma's
                let parts = fullLabel.split(',');
                // Neem de eerste twee onderdelen (straat en stad)
                let street = parts[0] ? parts[0].trim() : '';
                let city   = parts[1] ? parts[1].trim() : '';
                
                let optionText = street;
                if (city) {
                    optionText += ', ' + city;
                }
                
                const option = document.createElement('option');
                option.value = optionText;
                list.appendChild(option);
            });
        })
        .catch(error => console.error('Error fetching address suggestions:', error));
}

// Luister naar input op het "from" veld voor adres-suggesties
$('#from').on('input', function () {
    if ($(this).val().length > 4) {
        //fetchAddressSuggestions($(this).val(), 'from');
    }
});

// Luister naar input op het "to" veld voor adres-suggesties
$('#to').on('input', function () {
    if ($(this).val().length > 4) {
        //fetchAddressSuggestions($(this).val(), 'to');
    }
});

// Functie om een loader te tonen (bijv. een spinner)
function showLoader(){
    console.log('Toon loader');
    $('.loader-container').show();           
}

// Functie om de loader te verbergen
function hideLoader(){
    console.log('Verberg loader');
    $('.loader-container').hide();           
}

// Haal synchron blokkerend de coördinaten op voor een gegeven adres via de OpenRouteService API
function getCoordinates(address) {
    var url = "https://api.openrouteservice.org/geocode/search";
    var coordinates = null;

    $.ajax({
        url: url,
        data: { api_key: OpenRouteServiceAPIKey, text: address },
        dataType: "json",
        async: false, // Blokkerende aanroep
        success: function (data) {
            if (data.features.length > 0) {
                // Eerste resultaat: [longitude, latitude]
                coordinates = data.features[0].geometry.coordinates;
            }
        },
        error: function (error) {
            console.error("Fout bij ophalen van coördinaten:", error);
        }
    });

    return coordinates;
}

function bookRide() {
    // Create a form dynamically
    let form = document.createElement("form");
    form.method = "POST";
    form.action = "/ride/book"; // Target endpoint on your server
    console.log(rideData);
    // Convert JSON data to hidden form inputs
    for (let key in rideData) {
        let input = document.createElement("input");
        input.type = "hidden";
        input.name = key;
        input.value = rideData[key];
        form.appendChild(input);
    }

    // Append the form to the body and submit
    document.body.appendChild(form);
    form.submit();
}

// Verwerk het taxi formulier bij submit
//$('#taxiForm').on('submit', function (event) {
//    event.preventDefault(); // Voorkom standaard form submit (pagina herladen)
//    
//    const clientname = $('#clientname').val();
//    const phonenumber = $('#phonenumber').val();
//    const from = $('#from').val();
//    const to = $('#to').val();
//    const aantalBagage = $('#aantal-bagage').val() || 0;
//    const datetime = $('#datetime').val();
//    const passengers = $('#passengers').val();
//    const fromCoords = getCoordinates(from);
//    const toCoords = getCoordinates(to);
//
//    console.log(fromCoords);
//
//    // URL voor de route berekening
//    const orsUrl = 'https://api.openrouteservice.org/v2/directions/driving-car';
//
//    // Maak het body-object voor de POST-aanvraag
//    const body = {
//        "coordinates": [fromCoords, toCoords]
//    };
//
//    $.ajax({
//        url: orsUrl,
//        type: 'POST',
//        headers: {
//            'Authorization': OpenRouteServiceAPIKey,
//            'Content-Type': 'application/json'
//        },
//        data: JSON.stringify(body),
//        success: function (data) {
//            const distance = data.routes[0].summary.distance / 1000; // km
//            const duration = data.routes[0].summary.duration / 60;     // minuten
//            
//            // Toon de resultaten in het #result element
//            resultMessage = `<p>👤<b>Name</b>: ${clientname}</p>
//<p>📞  <b>PhoneNr</b>: ${phonenumber}</p>
//<p>📍  <b>From address</b>: ${from}</p>
//<p> 🎯 <b>To address</b>: ${to}</p>
//<p>📏  <b>Distance</b>: ${distance.toFixed(2)} km </p>
//<p>⏳   <b>Est. duration</b>: ${Math.round(duration)} minuten </p>
//<p>🧍‍♂  <b>Nr of Passengers</b>: ${passengers} </p>
//<p>👜  <b>Nr of Bags</b>: ${aantalBagage} </p>
//<p>📅  <b>Ophaalmoment</b>: ${datetime} </p>
//`;          
//            var estTotalPrice = getValutaFormat(calcPrice(distance.toFixed(2), Math.round(duration)));
//            //save in variable to use later if client actually goes to book
//            rideData = {
//                name: clientname,
//                phone_number: phonenumber,
//                from_address: from,
//                to_address: to,
//                distance_km: distance.toFixed(2),
//                estimated_duration: Math.round(duration),
//                passengers: passengers,
//                bags: aantalBagage,
//                pickup_time: datetime,
//                EstTotalPrice: estTotalPrice,
//                csrf_token: csrf_token
//            };
//
//            $('#result .ride-info').html(resultMessage);
//            document.getElementById("price").textContent = estTotalPrice;
//            $('#result-wrapper').show();
//            $('#taxiForm').hide();
//            
//            hideLoader();
//        },
//        error: function () {
//            $('#result').html('Er is een fout opgetreden bij het berekenen van de rit.');
//        }
//    });
//});

function calcPrice(distance, duration){
    let baseFare = 4.15;
    let pricePerKm = 3.05;
    let pricePerMinute = 0.50;

    let totalPrice = baseFare + (pricePerKm * distance) + (pricePerMinute * duration);
    totalPrice = totalPrice.toFixed(2);

    return totalPrice
    
}

// Functie die het formulier valideert en submit met een korte vertraging
function submitForm(){
    showLoader();
    setTimeout(() => {
        const form = document.getElementById('taxiForm');
        if (form.checkValidity()) {
            // Als het formulier geldig is, trigger submit
            $('#taxiForm').trigger('submit');
        } else {
            // Toon validatie fouten
            form.reportValidity();
        }
        hideLoader();
    }, 100); // 100ms vertraging voor de UI
}