<?php






ini_set('session.gc_maxlifetime', 30*60);

session_start();

include '../../../includes/config.php';



$D_ID = $_SESSION['D_Log'];




if (!$_SESSION['D_Log'])
echo '<script language="JavaScript">
 document.location="../../Drivers-Sign-In.php";
</script>';







$sql3 = mysqli_query($dbConn,"select * from drivers where ID='$D_ID'");
					$row3 = mysqli_fetch_array($sql3);
$Name=$row3['Name'];
$Phone_Number=$row3['Phone_Number'];
$Gender=$row3['Gender'];
$Photo=$row3['Photo'];
$lon=$row3['Longitude'];
$lat=$row3['Latitude'];
$Total_Rates=$row3['Total_Rates'];
$Car_Type=$row3['Car_Type'];
$Car_Color=$row3['Car_Color'];
$Penalty_Balance=$row3['Penalty_Balance'];
$Credit_Balance=$row3['Credit_Balance'];
$Total_Need_Balance=$row3['Total_Need_Balance'];
$Avalability_Status=$row3['Avalability_Status'];



	$Trip_ID = $_GET['Trip_ID'];
	$Max_Limit_Riders = $_GET['Max_Limit_Riders'];	
	$Gender = $_GET['Gender'];
	$Total_KM_Distance = $_GET['Total_KM_Distance'];	

	$Date = $_GET['Date'];
	$D_ID = $_GET['D_ID'];	


	$lng1 = $_GET['lng1'];	
	$lat1 = $_GET['lat1'];	
	$lng2 = $_GET['lng2'];	
	$lat2 = $_GET['lat2'];	
	$From_Location = $_GET['From_Location'];	
	$To_Location = $_GET['To_Location'];	


?>
		
	

<!doctype html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="../../../css/bootstrap.min.css">
    <!-- FontAwesome -->
    <link rel="stylesheet" href="../../../css/fontawesome.css">
    <!-- Main Style -->
    <link rel="stylesheet" href="../../../css/styles.css">
    <title>تحقق من الركاب الخاصين بك</title>
	
	    <link rel="shortcut icon" href="../../../images/icon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,user-scalable=0"/>









		<style>
@font-face {
   font-family: myFirstFont;
   src: url(../../../fonts/GE-SS-Two-Bold.otf);
   font-size:8px;
}

body {
   font-family: myFirstFont !important;
}


@font-face {
   font-family: myFirstFont2;
   src: url(../../../fonts/GE-SS-Two-Bold.otf);
   font-size:8px;
}



</style>

 <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDemEmJPVUC9PoCzTLZLZdhwJLt5fu5XUc&libraries=places"></script>
    <script>
	
	var allMarkers = []; // Global array to store markers
	
	
	
        function initializeMap() {
			
			
			
            var mapOptions = {
                center: new google.maps.LatLng(<?php echo $lat1; ?>, <?php echo $lng1; ?>),
                zoom: 13,

                mapTypeId: google.maps.MapTypeId.roadmap  
            };
			
  
            var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
			const trafficLayer = new google.maps.TrafficLayer();
			trafficLayer.setMap(map);
			
			
	function clearMarkers() {
            for (var i = 0; i < allMarkers.length; i++) {
                allMarkers[i].setMap(null);
            }
            allMarkers = [];
        }
		
		
		
		
		

			


            function updateLocations() {
               

				clearMarkers(); // Clear old markers
				


				// Fetch driver locations from the PHP backend
                fetch("get-riders-location.php?Trip_ID=<?php echo $Trip_ID; ?>&D_ID=<?php echo $D_ID; ?>")
                .then(response => response.json())
                .then(data => {
                    for (var i = 0; i < data.length; i++) {
                        var user = data[i];
                        var marker = new google.maps.Marker({
                            position: new google.maps.LatLng(user.From_Latitude, user.From_Longitude),
                            map: map,
                            icon: "../user-icon.png", // Path to your user icon
                            title: user.UName
                        });
						
						allMarkers.push(marker); // Store marker
						
						
						
							if (user.Status=='Pending'){

						
							
							
							var infoWindow = new google.maps.InfoWindow({
                            content: 
							"<div><center><img width='120px' src='../../../../Users_App/EN/Users/" + user.UPhoto + "'/><br><br>"+

							"<div><strong>اسم العميل: " + user.UName + "</strong>"+
							"<div><strong>جنس العميل: " + user.UGender + "</strong>"+
							"<div><strong>مجموع الركاب: " + user.Total_Riders + "</strong>"+
							"<div><strong>مجموع السعر لجميع الركاب: " + user.Total_Price_All_Riders + "</strong>"+
							"<div><strong>طريقة الدفع: " + user.Payment_Type + "</strong>"+
							
							
							"<br><br>"+
							"<center><a style='border-style: dashed; border-radius: 50px; color:#011F39; border-color:#B3E207; background-color:#ebebeb'class='btn btn-sm btn-center ' href='accept-request.php?UT_ID=" + user.UT_ID +"&Trip_ID=<?php echo $Trip_ID; ?>&Max_Limit_Riders=<?php echo $Max_Limit_Riders; ?>&Gender=<?php echo $Gender; ?>&Total_KM_Distance=<?php echo $Total_KM_Distance; ?>&Date=<?php echo $Date; ?>&D_ID=<?php echo $D_ID; ?>&lng1=<?php echo $lng1; ?>&lat1=<?php echo $lat1; ?>&lng2=<?php echo $lng2; ?>&lat2=<?php echo $lat2; ?>&From_Location=<?php echo $From_Location; ?>&To_Location=<?php echo $To_Location; ?>'>قبول</a>"+
							"</div>"
							});
							
							}
							
							
							if (user.Status=='Pickedup'){

						
							
							
							var infoWindow = new google.maps.InfoWindow({
                            content: 
							"<div><center><img width='120px' src='../../../../Users_App/EN/Users/" + user.UPhoto + "'/><br><br>"+

							"<div><strong>اسم العميل: " + user.UName + "</strong>"+
							"<div><strong>جنس العميل: " + user.UGender + "</strong>"+
							"<div><strong>مجموع الركاب: " + user.Total_Riders + "</strong>"+
							"<div><strong>مجموع السعر all riders: " + user.Total_Price_All_Riders + "</strong>"+
							"<div><strong>طريقة الدفع: " + user.Payment_Type + "</strong>"+
	
							"<br><br>"+

							"<center><a style='border-style: dashed; border-radius: 50px; color:#011F39; border-color:#B3E207; background-color:#ebebeb'class='btn btn-sm btn-center ' href='geo:" + user.Spot_Latitude + "," +user.Spot_Longitude +"?q=" + user.Spot_Latitude + "," +user.Spot_Longitude +"(" +user.To_Location +")'>تتبع للعميل (خرائط جوجل)</a><br><br>"+
							"<center><a style='border-style: dashed; border-radius: 50px; color:#011F39; border-color:#B3E207; background-color:#ebebeb'class='btn btn-sm btn-center ' href='confirm-dropoff.php?Total_Riders=" + user.Total_Riders +"&UT_ID=" + user.UT_ID +"&Trip_ID=<?php echo $Trip_ID; ?>&Max_Limit_Riders=<?php echo $Max_Limit_Riders; ?>&Gender=<?php echo $Gender; ?>&Total_KM_Distance=<?php echo $Total_KM_Distance; ?>&Date=<?php echo $Date; ?>&D_ID=<?php echo $D_ID; ?>&lng1=<?php echo $lng1; ?>&lat1=<?php echo $lat1; ?>&lng2=<?php echo $lng2; ?>&lat2=<?php echo $lat2; ?>&From_Location=<?php echo $From_Location; ?>&To_Location=<?php echo $To_Location; ?>'>إنزال</a>"+
							"</div>"
							});
							
							}
							
							
							if (user.Status=='Accepted'){

						
							
							
							var infoWindow = new google.maps.InfoWindow({
                            content: 
							"<div><center><img width='120px' src='../../../../Users_App/EN/Users/" + user.UPhoto + "'/><br><br>"+

							"<div><strong>اسم العميل: " + user.UName + "</strong>"+
							"<div><strong>جنس العميل: " + user.UGender + "</strong>"+
							"<div><strong>مجموع الركاب: " + user.Total_Riders + "</strong>"+
							"<div><strong>مجموع السعر all riders: " + user.Total_Price_All_Riders + "</strong>"+
							"<div><strong>طريقة الدفع: " + user.Payment_Type + "</strong>"+
							
							
							
							"<br><br>"+
							

							"<center><a style='border-style: dashed; border-radius: 50px; color:#011F39; border-color:#B3E207; background-color:#ebebeb'class='btn btn-sm btn-center ' href='tel:" + user.UPhone_Number + "'>اتصل بالعميل</a><br><br>"+
							"<center><a style='border-style: dashed; border-radius: 50px; color:#011F39; border-color:#B3E207; background-color:#ebebeb'class='btn btn-sm btn-center ' href='geo:" + user.From_Latitude + "," +user.From_Longitude +"?q=" + user.From_Latitude + "," +user.From_Longitude +"(" +user.From_Location +")'>تتبع للعميل (خرائط جوجل)</a>"+

							
							"</div>"
							});
							
							}
							
							
							
							
							
							
                        marker.addListener("click", function() {
                            infoWindow.open(map, marker);
                        });
                    }
                });
            }
			
			
			
			
			
			
			
			
			 function updateLocations2() {
				 
				clearMarkers(); // Clear old markers


                // Fetch driver locations from the PHP backend
                fetch("get-driver-location.php?D_ID=<?php echo $D_ID; ?>")
                .then(response => response.json())
                .then(data => {
                    for (var j = 0; j < data.length; j++) {
                        var driver = data[j];
                        var marker2 = new google.maps.Marker({
                            position: new google.maps.LatLng(driver.Latitude, driver.Longitude),
                            map: map,
                            icon: "../car-icon.png", 
                            title: driver.Name
                        });
						
						
				allMarkers.push(marker2); // Store marker
						
						

                    }
                });
            }
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			

            updateLocations();
            setInterval(updateLocations, 5000); // Update every 5 seconds
			
			
			 updateLocations2();
            setInterval(updateLocations2, 5000); // Update every 5 seconds
			
        }
    </script>
	
	
	
	


 
</head>
<body onload="initializeMap()">

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script type="text/javascript">
        function getLocation() {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(function(position) {
                    var latitude = position.coords.latitude;
                    var longitude = position.coords.longitude;

                    // Send this to your PHP script via AJAX or other means
                    sendDataToServer(latitude, longitude);
                });
            } else {
                alert("Geolocation is not supported by this browser.");
            }
        }

        function sendDataToServer(latitude, longitude) {
            // Using fetch API to send data to PHP
            fetch('update-my-location-1.php?D_ID=<?php echo $D_ID; ?>	', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                },
                body: JSON.stringify({
                    latitude: latitude,
                    longitude: longitude
                })
            })
            .then(response => response.json())
            .then(data => {
                console.log('Success:', data);
            })
            .catch((error) => {
                console.error('Error:', error);
            });
        }

        // Keep updating every 5 seconds
        setInterval(getLocation, 5000);
    </script>



<!--Loading Container Start-->
<div id="load" class="loading-overlay display-flex flex-column justify-content-center align-items-center">
    <div class="primary-color font-28 fas fa-spinner fa-spin"></div>
</div>
<!--Loading Container End-->


<div class="row h-100">
    <div class="col-xs-12 col-sm-12 remaining-height">

        <!--Page Title & Icons Start-->
        <div class="header-icons-container position-relative text-center">
            <span class="float-left menu-open closed">
                    <img src="../../../icons/menu.svg" alt="Menu Hamburger Icon">
            </span>
            <span class="title"><br>تحقق من الركاب الخاصين بك ...</span>
            
 <span class="float-right" style="margin-top:-27px !important">
 <img src="../../../images/icon.png" alt="Logo" width="14px" height="20px">
                </span>
				
        </div>
        <!--Page Title & Icons End-->



    <div id="map_canvas" style="width: 100%; height: 100%;"></div>


      
	
<!--Choose a Car Container Start-->
            <div class="ride-options-bottom" style="position: fixed;">
                
               
                
                <div class="">
								<center>




  <a style="height:50px; font-size: 16px; border-style: dashed; width:150px !important;  border-style: dashed; border-radius: 50px; color:#011F39; border-color:#B3E207; background-color:#ebebeb" class="btn btn-primary" href="finish-trip.php?Trip_ID=<?php echo $Trip_ID; ?>&Max_Limit_Riders=<?php echo $Max_Limit_Riders; ?>&Gender=<?php echo $Gender; ?>&Total_KM_Distance=<?php echo $Total_KM_Distance; ?>&Date=<?php echo $Date; ?>&D_ID=<?php echo $D_ID; ?>&lng1=<?php  echo $lng1; ?>&lat1=<?php echo $lat1; ?>&lng2=<?php echo $lng2; ?>&lat2=<?php echo $lat2; ?>&From_Location=<?php echo $From_Location; ?>&To_Location=<?php echo $To_Location; ?>" >انهاء الرحلة</a>
                    <a style="height:50px; font-size: 16px; border-style: dashed; width:150px !important;  border-style: dashed; border-radius: 50px; color:red; border-color:#B3E207; background-color:#ebebeb" class="btn btn-primary" href="cancel-trip.php?Trip_ID=<?php echo $Trip_ID; ?>&Max_Limit_Riders=<?php echo $Max_Limit_Riders; ?>&Gender=<?php echo $Gender; ?>&Total_KM_Distance=<?php echo $Total_KM_Distance; ?>&Date=<?php echo $Date; ?>&D_ID=<?php echo $D_ID; ?>&lng1=<?php  echo $lng1; ?>&lat1=<?php echo $lat1; ?>&lng2=<?php echo $lng2; ?>&lat2=<?php echo $lat2; ?>&From_Location=<?php echo $From_Location; ?>&To_Location=<?php echo $To_Location; ?>" >الغاء الرحلة</a>
	

	
	</center>
	
	
                </div>
            </div>
            <!--Choose a Car Container End-->





    </div>

     <?php
   include 'menu.php';
   ?>

</body>
</html>