@extends('admin.templates.layout')
@section('head')
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css" />


@endsection
@section('content')
<form id="RateForm" autocomplete="off" class="needs-validation" novalidate enctype="multipart/form-data">
        @csrf
        <input type="hidden" name="id" value="{{ $id }}">
        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header">
                        <h5 class="card-title mb-0">Coordinates Details</h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            
                            <div class="col-xl-6">
                                <div class="mb-3">
                                    <label class="form-label" for="period_name">Title</label>
                                    <input type="text" class="form-control no_special_chars" id="title" value="{{ $title }}" placeholder="Title" name="title" required>
                                </div>

                            </div>
                            
                            <div class="col-xl-6">
                                <div class="mb-3">
                                    <label class="form-label" for="multiplied_value">Type</label>
                                    <select name="type" class="form-control" required>
                                        <option @if($type=="salik") selected @endif value="salik">Salik</option>
                                        <option @if($type=="city_crossing") selected @endif value="city_crossing">City Crossing</option>
                                    </select>
                                </div>

                            </div>
                        </div>


                        <div class="row">
                            <div class="card-body border border-dashed border-end-0 border-start-0">
                                <div id="map_live" style="height: 500px; width: 100%;"></div>
                            </div>
                        </div>
                        <div class="row">
                            <br>
                            <div class="form-group">
                                <label>Sunday</label>
                            </div>
                            <table class="table table-stripped table-condendsed">
                                <thead>
                                    <th>From Time</th>
                                    <th>To Time</th>
                                    <th>Price</th>
                                    <th>
                                        <button type="button" class="btn btn-primary w-xs" data-role="ad-btn" data-key="sun">Add</button>
                                    </th>
                                </thead>
                                <tbody id="pr-holder">
                                    @if(!empty($prices))
                                        @if(isset($prices['sun']))
                                            @foreach($prices['sun'] as $p)
                                            <tr>
                                                <td>
                                                    <input type="text" name="prices[sun][time_from][]" value="{{$p['time_from']}}" class="form-control time1">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[sun][time_to][]" value="{{$p['time_to']}}" class="form-control time2">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[sun][charge][]" value="{{$p['price']}}" class="form-control">
                                                </td>
                                                <td>
                                                    <button type="button" class="btn btn-danger w-xs " data-role="rm-btn">remove</button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                    @endif
                                </tbody>
                            </table>
                            
                            <div class="form-group">
                                <label>Monday</label>
                            </div>
                            <table class="table table-stripped table-condendsed">
                                <thead>
                                    <th>From Time</th>
                                    <th>To Time</th>
                                    <th>Price</th>
                                    <th>
                                        <button type="button" class="btn btn-primary w-xs" data-role="ad-btn" data-key="mon">Add</button>
                                    </th>
                                </thead>
                                <tbody id="pr-holder">
                                    @if(!empty($prices))
                                        @if(isset($prices['mon']))
                                            @foreach($prices['mon'] as $p)
                                            <tr>
                                                <td>
                                                    <input type="text" name="prices[mon][time_from][]" value="{{$p['time_from']}}" class="form-control time1">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[mon][time_to][]" value="{{$p['time_to']}}" class="form-control time2">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[mon][charge][]" value="{{$p['price']}}" class="form-control">
                                                </td>
                                                <td>
                                                    <button type="button" class="btn btn-danger w-xs " data-role="rm-btn">remove</button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                    @endif
                                </tbody>
                            </table>
                            
                            <div class="form-group">
                                <label>Tuesday</label>
                            </div>
                            <table class="table table-stripped table-condendsed">
                                <thead>
                                    <th>From Time</th>
                                    <th>To Time</th>
                                    <th>Price</th>
                                    <th>
                                        <button type="button" class="btn btn-primary w-xs" data-role="ad-btn" data-key="tue">Add</button>
                                    </th>
                                </thead>
                                <tbody id="pr-holder">
                                    @if(!empty($prices))
                                        @if(isset($prices['tue']))
                                            @foreach($prices['tue'] as $p)
                                            <tr>
                                                <td>
                                                    <input type="text" name="prices[tue][time_from][]" value="{{$p['time_from']}}" class="form-control time1">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[tue][time_to][]" value="{{$p['time_to']}}" class="form-control time2">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[tue][charge][]" value="{{$p['price']}}" class="form-control">
                                                </td>
                                                <td>
                                                    <button type="button" class="btn btn-danger w-xs " data-role="rm-btn">remove</button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                    @endif
                                </tbody>
                            </table>
                            <div class="form-group">
                                <label>Wednesday</label>
                            </div>
                            <table class="table table-stripped table-condendsed">
                                <thead>
                                    <th>From Time</th>
                                    <th>To Time</th>
                                    <th>Price</th>
                                    <th>
                                        <button type="button" class="btn btn-primary w-xs" data-role="ad-btn" data-key="wed">Add</button>
                                    </th>
                                </thead>
                                <tbody id="pr-holder">
                                    @if(!empty($prices))
                                        @if(isset($prices['wed']))
                                            @foreach($prices['wed'] as $p)
                                            <tr>
                                                <td>
                                                    <input type="text" name="prices[wed][time_from][]" value="{{$p['time_from']}}" class="form-control time1">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[wed][time_to][]" value="{{$p['time_to']}}" class="form-control time2">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[wed][charge][]" value="{{$p['price']}}" class="form-control">
                                                </td>
                                                <td>
                                                    <button type="button" class="btn btn-danger w-xs " data-role="rm-btn">remove</button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                    @endif
                                </tbody>
                            </table>
                            <div class="form-group">
                                <label>Thursday</label>
                            </div>
                            <table class="table table-stripped table-condendsed">
                                <thead>
                                    <th>From Time</th>
                                    <th>To Time</th>
                                    <th>Price</th>
                                    <th>
                                        <button type="button" class="btn btn-primary w-xs" data-role="ad-btn" data-key="thu">Add</button>
                                    </th>
                                </thead>
                                <tbody id="pr-holder">
                                    @if(!empty($prices))
                                        @if(isset($prices['thu']))
                                            @foreach($prices['thu'] as $p)
                                            <tr>
                                                <td>
                                                    <input type="text" name="prices[thu][time_from][]" value="{{$p['time_from']}}" class="form-control time1">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[thu][time_to][]" value="{{$p['time_to']}}" class="form-control time2">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[thu][charge][]" value="{{$p['price']}}" class="form-control">
                                                </td>
                                                <td>
                                                    <button type="button" class="btn btn-danger w-xs " data-role="rm-btn">remove</button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                    @endif
                                </tbody>
                            </table>
                            <div class="form-group">
                                <label>Friday</label>
                            </div>
                            <table class="table table-stripped table-condendsed">
                                <thead>
                                    <th>From Time</th>
                                    <th>To Time</th>
                                    <th>Price</th>
                                    <th>
                                        <button type="button" class="btn btn-primary w-xs" data-role="ad-btn" data-key="fri">Add</button>
                                    </th>
                                </thead>
                                <tbody id="pr-holder">
                                    @if(!empty($prices))
                                        @if(isset($prices['fri']))
                                            @foreach($prices['fri'] as $p)
                                            <tr>
                                                <td>
                                                    <input type="text" name="prices[fri][time_from][]" value="{{$p['time_from']}}" class="form-control time1">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[fri][time_to][]" value="{{$p['time_to']}}" class="form-control time2">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[fri][charge][]" value="{{$p['price']}}" class="form-control">
                                                </td>
                                                <td>
                                                    <button type="button" class="btn btn-danger w-xs " data-role="rm-btn">remove</button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                    @endif
                                </tbody>
                            </table>
                            <div class="form-group">
                                <label>Saturday</label>
                            </div>
                            <table class="table table-stripped table-condendsed">
                                <thead>
                                    <th>From Time</th>
                                    <th>To Time</th>
                                    <th>Price</th>
                                    <th>
                                        <button type="button" class="btn btn-primary w-xs" data-role="ad-btn" data-key="sat">Add</button>
                                    </th>
                                </thead>
                                <tbody id="pr-holder">
                                    @if(!empty($prices))
                                        @if(isset($prices['sat']))
                                            @foreach($prices['sat'] as $p)
                                            <tr>
                                                <td>
                                                    <input type="text" name="prices[sat][time_from][]" value="{{$p['time_from']}}" class="form-control time1">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[sat][time_to][]" value="{{$p['time_to']}}" class="form-control time2">
                                                </td>
                                                <td>
                                                    <input type="text" name="prices[sat][charge][]" value="{{$p['price']}}" class="form-control">
                                                </td>
                                                <td>
                                                    <button type="button" class="btn btn-danger w-xs " data-role="rm-btn">remove</button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                    @endif
                                </tbody>
                            </table>
                        </div>

                        <div class="row">
                            <div class="col-xl-6">
                                <div class="mb-3">
                                    <label for="choices-publish-status-input" class="form-label">Status</label>
                                    <select class="form-select" id="choices-publish-status-input" name="status" data-choices data-choices-search-false>
                                        <option value="" >Choose Status</option>
                                        <option value="1" @if($status ==1) selected @endif>Active</option>
                                        <option value="0" @if($status ==0) selected @endif>Inactive</option>
                                    </select>
                                </div>
                            </div>
                        </div>


                    </div>
                </div>
                <div class="d-flex justify-content-between mb-3">
                    <button type="button" class="btn btn-dark w-sm" onclick="history.back()">Back</button>
                    <button type="submit" class="btn btn-primary w-sm">Submit</button>
                </div>
            </div>
        </div>
    </form>
    
@stop

@section('script')
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script src="https://cdn.jsdelivr.net/npm/leaflet-draw@1.0.4/dist/leaflet.draw.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet-draw@1.0.4/dist/leaflet.draw.css" />
<script type='text/javascript' src="{{asset('/')}}admin_assets/assets/libs/flatpickr/flatpickr.min.js"></script>
<script src="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.js"></script>



<script>
    $('body').off('click','[data-role="rm-btn"]');
    $('body').on('click','[data-role="rm-btn"]',function(e){
        $(this).closest('tr').remove();
    });
    $('body').off('click','[data-role="ad-btn"]');
    $('body').on('click','[data-role="ad-btn"]',function(e){
        let key = $(this).attr("data-key");
        let html =`<tr>
                        <td>
                            <input type="text" name="prices[${key}][time_from][]" class="form-control time1">
                        </td>
                        <td>
                            <input type="text" name="prices[${key}][time_to][]" class="form-control time2">
                        </td>
                        <td>
                            <input type="text" name="prices[${key}][charge][]" class="form-control">
                        </td>
                        <td>
                            <button type="button" class="btn btn-danger w-xs" data-role="rm-btn">remove</button>
                        </td>
                    </tr>`;
        $(this).closest('table').find('tbody').append(html);
        //$('#pr-holder').append(html);
        flatpickr(".time2", {
                enableTime: true,
                noCalendar: true,
                dateFormat: "H:i",
                time_24hr: true
            });
    });
    jQuery(document).ready(function () {
        const endTimePicker = flatpickr(".time2", {
                enableTime: true,
                noCalendar: true,
                dateFormat: "H:i",
                time_24hr: true
            });

    // Initialize flatpickr for all rows dynamically
    $('tbody').on('focus', '.time1', function () {
        if (!this.flatpickrInstance) {
            flatpickr(this, {
                enableTime: true,
                noCalendar: true,
                dateFormat: "H:i",
                time_24hr: true,
                onChange: function (selectedDates, dateStr, instance) {
                    // Get the parent row of the current time1 input
                    const parentRow = $(instance.input).closest('tr');
                    // Find the time2 input in the same row
                    const time2 = parentRow.find('.time2');

                    if (time2.length) {
                        // Initialize Flatpickr for time2 if not already initialized
                        let time2Instance = time2[0].flatpickrInstance;
                        if (!time2Instance) {
                            time2Instance = flatpickr(time2[0], {
                                enableTime: true,
                                noCalendar: true,
                                dateFormat: "H:i",
                                time_24hr: true
                            });
                        }

                        // Set the minimum time for time2
                        if (time2Instance) {
                            console.log("Setting minTime for time2:", dateStr);
                            time2Instance.set('minTime', dateStr);
                            time2Instance.clear();
                        } else {
                            console.error("Failed to initialize Flatpickr for time2.");
                        }
                    } else {
                        console.error("No time2 input found in the same row.");
                    }
                }
            });
        }
    });

    
});





    let coordinates = '';
    
    let map_live, drawingManager, polygon;

        function initMap() {
            // Initialize the map
            map_live = new google.maps.Map(document.getElementById('map_live'), {
                center: { lat: 25.2048, lng: 55.2708 }, // Dubai coordinates
                zoom: 20,
            });

            // Initialize the DrawingManager
            drawingManager = new google.maps.drawing.DrawingManager({
                drawingMode: google.maps.drawing.OverlayType.POLYGON,
                drawingControl: true,
                drawingControlOptions: {
                    position: google.maps.ControlPosition.TOP_CENTER,
                    drawingModes: ['polygon'], // Only allow polygon drawing
                },
                polygonOptions: {
                    editable: true,
                    draggable: true,
                },
            });

            drawingManager.setMap(map_live);

            // Event listener for polygon completion
            google.maps.event.addListener(drawingManager, 'overlaycomplete', function (event) {
                if (event.type === google.maps.drawing.OverlayType.POLYGON) {
                    // Remove the previous polygon if it exists
                    if (polygon) {
                        polygon.setMap(null);
                    }

                    // Save the newly drawn polygon
                    polygon = event.overlay;

                    // Get and log the polygon coordinates
                    const coordinates = polygon.getPath().getArray().map(latlng => ({
                        lat: latlng.lat(),
                        lng: latlng.lng(),
                    }));
                    console.log('Polygon Coordinates:', coordinates);

                    // Add event listeners for editing
                    google.maps.event.addListener(polygon.getPath(), 'set_at', function () {
                        updatePolygonCoordinates(polygon);
                    });
                    google.maps.event.addListener(polygon.getPath(), 'insert_at', function () {
                        updatePolygonCoordinates(polygon);
                    });
                }
            });
        }

        // Function to update coordinates when polygon is edited
        function updatePolygonCoordinates(polygon) {
            const coordinates = polygon.getPath().getArray().map(latlng => ({
                lat: latlng.lat(),
                lng: latlng.lng(),
            }));
            console.log('Updated Coordinates:', coordinates);
        }

        // Initialize the map
        window.initMap = initMap;
//     document.addEventListener('DOMContentLoaded', () => {
//     // Initialize map
//     const map_live = L.map('map_live').setView([25.2048, 55.2708], 15);

//     // Add OpenStreetMap tiles
//     L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
//         maxZoom: 30,
//     }).addTo(map_live);

//     // Add Geocoder Control for location search
//     L.Control.geocoder({
//         defaultMarkGeocode: true, // Adds a marker at the searched location
//         position: 'topright', // Position of the geocoder control
//     }).addTo(map_live);

//     // Add draw control
//     const drawnItems = new L.FeatureGroup();
//     map_live.addLayer(drawnItems);

//     @if($polygon_coordinates)
//         coordinates = {{$polygon_coordinates}}; // Ensure this is valid JSON

//         // Add polygon to the feature group
//         const existingPolygon = L.polygon(coordinates);
//         drawnItems.addLayer(existingPolygon); // Add to drawnItems for edit functionality
//     @endif

//     const drawControl = new L.Control.Draw({
//         edit: {
//             featureGroup: drawnItems, // Allow editing of existing layers in this group
//             remove: true, 
//         },
//         draw: {
//             polygon: true,
//             marker: false,
//             polyline: false,
//             rectangle: false,
//             circle: false,
//             circlemarker: false,
//         },
//     });

//     map_live.addControl(drawControl);

//     // Handle the "draw:created" event
//     map_live.on('draw:created', function (e) {
//         const layer = e.layer;
//         drawnItems.addLayer(layer); // Add the layer to the feature group

//         const latlngs = layer.getLatLngs()[0]; // Get polygon coordinates
//         coordinates = latlngs.map(latlng => [latlng.lat, latlng.lng]); // Convert to lat,lng array
//         console.log('Polygon Coordinates:', coordinates);
//     });

//     // Event: When editing is stopped
//     map_live.on('draw:edited', function (e) {
//         e.layers.eachLayer(layer => {
//             const latlngs = layer.getLatLngs()[0]; // Updated polygon coordinates
//             coordinates = latlngs.map(latlng => [latlng.lat, latlng.lng]);
//             console.log('Updated Coordinates:', coordinates);
//         });
//     });

//     // Event: When a layer is deleted
//     map_live.on('draw:deleted', function (e) {
//         e.layers.eachLayer(layer => {
//             console.log('Deleted Layer:', layer);
//         });
//     });
// });

// document.addEventListener('DOMContentLoaded', () => {
//     // Initialize map
//     const map_live = L.map('map_live').setView([25.2048, 55.2708], 15);

//     // Add OpenStreetMap tiles
//     L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
//         maxZoom: 30,
//     }).addTo(map_live);

//     // Add draw control
//     const drawnItems = new L.FeatureGroup();
//     map_live.addLayer(drawnItems);

//     @if($polygon_coordinates)
//         coordinates = {{$polygon_coordinates}}; // Ensure this is valid JSON

//         // Add polygon to the feature group
//         const existingPolygon = L.polygon(coordinates);
//         drawnItems.addLayer(existingPolygon); // Add to drawnItems for edit functionality
//     @endif

//     const drawControl = new L.Control.Draw({
//         edit: {
//             featureGroup: drawnItems, // Allow editing of existing layers in this group
//             remove: true, 
//         },
//         draw: {
//             polygon: true,
//             marker: false,
//             polyline: false,
//             rectangle: false,
//             circle: false,
//             circlemarker: false,
//         },
//     });
    
//     map_live.addControl(drawControl);

//     // Handle the "draw:created" event
//     map_live.on('draw:created', function (e) {
//         const layer = e.layer;
//         drawnItems.addLayer(layer); // Add the layer to the feature group

//         const latlngs = layer.getLatLngs()[0]; // Get polygon coordinates
//         coordinates = latlngs.map(latlng => [latlng.lat, latlng.lng]); // Convert to lat,lng array
//         console.log('Polygon Coordinates:', coordinates);
//     });

//     // Event: When editing is stopped
//     map_live.on('draw:edited', function (e) {
//         e.layers.eachLayer(layer => {
//             const latlngs = layer.getLatLngs()[0]; // Updated polygon coordinates
//             coordinates = latlngs.map(latlng => [latlng.lat, latlng.lng]);
//             console.log('Updated Coordinates:', coordinates);
//         });
//     });

//     // Event: When a layer is deleted
//     map_live.on('draw:deleted', function (e) {
//         e.layers.eachLayer(layer => {
//             console.log('Deleted Layer:', layer);
//         });
//     });
// });

</script>
<script type='text/javascript' src="{{asset('/')}}admin_assets/assets/libs/flatpickr/flatpickr.min.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function(){

            const startTimePicker = flatpickr("#start_time", {
                enableTime: true,
                noCalendar: true,
                dateFormat: "H:i",
                time_24hr: true,
                onChange: function(selectedDates, dateStr, instance) {
                    // Clear the End Time value when Start Time is changed
                    endTimePicker.clear();
                    endTimePicker.set("minTime", dateStr);
                }
            });

            // Initialize the End Time Picker
            const endTimePicker = flatpickr("#end_time", {
                enableTime: true,
                noCalendar: true,
                dateFormat: "H:i",
                time_24hr: true
            });


            $("#RateForm").validate({
                rules: {
                    title: {
                        required: true,
                    },
                    multiplied_value: {
                        required: true,
                        doublePrecision: true
                    },
                    status:{
                        required:true
                    }

                },
                messages: {
                    title:{
                        required: "Title is required.",
                    },
                    multiplied_value: {
                        required: "Fare is required.",
                        doublePrecision: "Please enter a valid number with double precision."
                    },
                    status:{
                        required: "Status is required."
                    }

                },
                errorPlacement: function (error, element) {
                    error.appendTo(element.parent());
                },
                submitHandler: function (form) {

                    // Use FormData to handle file uploads
                    let formData = new FormData(form);
                    if(coordinates ==''){
                        Swal.fire({
                                    text: "Please draw cordintates on map",
                                    iconHtml: '<img src="{{asset('/')}}admin_assets/assets/images/close.svg" class="img-fluid">',
                                });
                        return false;
                    }
                    formData.append('polygon_coordinates', JSON.stringify(coordinates));
                    $.ajax({
                        url: "{{ route('admin.rta_polygon_map.store') }}", // Change to your route
                        type: "POST",
                        data: formData,
                        processData: false, // Required for file upload
                        contentType: false,
                        beforeSend: function (xhr) {
                            // Set the CSRF token in the AJAX request header
                            xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'));
                        },
                        success: function (response) {
                            if(response.status == "success") {
                                Swal.fire({
                                    text: response.message,
                                    iconHtml: '<img src="{{asset('/')}}admin_assets/assets/images/tick.svg" class="img-fluid">',
                                    confirmButtonText: "OK", // Optional: Change the text of the button
                                    customClass: {
                                        confirmButton: 'custom-ok-button-class w-sm' // Add your custom class here
                                    }
                                }).then((result) => {
                                    if (result.isConfirmed) {
                                        // Redirect to the next page
                                        window.location.href = "{{ route('admin.rta_polygon_map') }}";
                                    }
                                });
                            } else {
                                Swal.fire({
                                    text: response.message,
                                    iconHtml: '<img src="{{asset('/')}}admin_assets/assets/images/close.svg" class="img-fluid">',
                                });
                            }

                        },
                        error: function (xhr) {
                            if (xhr.status === 422) {
                                let errors = xhr.responseJSON.errors;
                                $.each(errors, function (key, errorMessages) {
                                    $("input[name=" + key + "], select[name=" + key + "]").after('<label class="error">' + errorMessages[0] + '</label>');
                                });
                            } else if(xhr.status == 500){
                                Swal.fire({
                                    text:  xhr.responseJSON.message,
                                    iconHtml: '<img src="{{asset('/')}}admin_assets/assets/images/close.svg" class="img-fluid">',

                                });
                            } else {
                                Swal.fire({
                                    text: "Something went wrong. Please try later",
                                    iconHtml: '<img src="{{asset('/')}}admin_assets/assets/images/close.svg" class="img-fluid">',
                                });
                            }
                        }
                    });
                    return false; // Prevent the default form submission
                }
            });

            $.validator.addMethod("timeFormat", function(value, element) {
                // Regex for HH:mm (24-hour format)
                return this.optional(element) || /^([01][0-9]|2[0-3]):([0-5][0-9])$/.test(value);
            }, "Invalid time format. Please use HH:mm.");

            // Custom double precision validation rule
            $.validator.addMethod("doublePrecision", function(value, element) {
                // Regex for a number with optional decimal places (double precision)
                return this.optional(element) || /^-?\d+(\.\d+)?$/.test(value);
            }, "Invalid number. Please use a valid double precision number.");
        });
    </script>
@stop