Sindbad~EG File Manager

<?php
// DrawSolution.php
// Set HTTP header and prevent caching
header('Content-Type: text/html; charset=UTF-8');
header("Cache-Control: no-cache, must-revalidate");

// echo "<pre>";   // debug code to see what is posted
// print_r($_POST);
// echo "</pre>";
// Start or resume the session
session_start();
$sessionId = session_id();  // guaranteed not to contain a tilde
ini_set('display_errors', 1);
error_reporting(E_ALL);

// Server connection settings
if ($_SERVER['SERVER_NAME'] == 'localhost') {
    $serverAddress = 'localhost';
    $username = $password = null;
} else {
    $serverAddress = 'mathxpert.org';
    $username = 'beeson';
    $password = 'Turing2024';
}
$serverPort = 12350;
$timeout = 3600;
$startupDelay = 5;

// Force HTTPS if not in use
if (!(isset($_SERVER['HTTPS']) && ($_SERVER['HTTPS']=='on' || $_SERVER['HTTPS']==1)
   || isset($_SERVER['HTTP_X_FORWARDED_PROTO']) && $_SERVER['HTTP_X_FORWARDED_PROTO']=='https')) {
    $redirect = 'https://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
    header('HTTP/1.1 301 Moved Permanently');
    header('Location: ' . $redirect);
    exit();
}

require("SendMessage.php");
$clientSocket = createClientSocket($serverAddress, $serverPort, $timeout);

// Helper: Convert "rgb(R, G, B)" to "R,G,B"
function convertColor($colorStr) {
    $colorStr = trim($colorStr);
    if (strpos($colorStr, "rgb(") === 0) {
        $inside = substr($colorStr, 4, -1);
        return str_replace(' ', '', $inside);
    }
    return $colorStr;
}

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // Retrieve DOCDATA3 fields from POST.
    // Expected fields:
    // sessionId, pxmin, pxmax, pymin, pymax, border, background, nbodies,
    // plus arrays: mass[], color[], r[], x0[], y0[], p0[], q0[]
    $sessionIdField = isset($_POST['sessionId']) ? $_POST['sessionId'] : $sessionId;
    $pxmin = isset($_POST['pxmin']) ? $_POST['pxmin'] : 0;
    $pxmax = isset($_POST['pxmax']) ? $_POST['pxmax'] : 0;
    $pymin = isset($_POST['pymin']) ? $_POST['pymin'] : 0;
    $pymax = isset($_POST['pymax']) ? $_POST['pymax'] : 0;
    $border = isset($_POST['border']) ? $_POST['border'] : '';
    $background = isset($_POST['background']) ? $_POST['background'] : "rgb(255,255,255)";
 

    // Retrieve arrays of body data.
    $masses = isset($_POST['mass']) ? $_POST['mass'] : array();
    $colors = isset($_POST['color']) ? $_POST['color'] : array();
    $rs = isset($_POST['r']) ? $_POST['r'] : array();
    $x0s = isset($_POST['x0']) ? $_POST['x0'] : array();
    $y0s = isset($_POST['y0']) ? $_POST['y0'] : array();
    $p0s = isset($_POST['p0']) ? $_POST['p0'] : array();
    $q0s = isset($_POST['q0']) ? $_POST['q0'] : array(); 
    $integrationMethod = isset($_POST['integrationMethod']) ? $_POST['integrationMethod'] : "rk4";  
    $graphpaper = isset($_POST['graphpaper']) ? $_POST['graphpaper'] : "-1";    // no graph paper 
    $tmax = isset($_POST['tmax']) ? $_POST['tmax'] : "1000"; 
    $caption = isset($_POST['caption']) ? $_POST['caption'] : ""; 

    // Use actual count if available
    $actualCount = $nbodies = count($masses);

    // Build the parameter string.
    // The param string format is:
     // sessionId~pxmin~pxmax~pymin~pymax~border~background
     //        ~tmax
     //        ~integrationMethod    ("rk4" or "leapfrog")
     //        ~graphpaper           (index, -1 means no graph paper)
     //        ~numBodies
     //        ~body1~body2~...~bodyN
     // where each body is encoded as:
     // mass;R,G,B;radius;x0;y0;p0;q0
    // Each body: mass;R,G,B;r;x0;y0;p0;q0 
    
    $bodyStrings = array();
    for ($i = 0; $i < $nbodies; $i++) {
        $mass = $masses[$i];
        $colorConverted = convertColor($colors[$i]);
        $r = $rs[$i];
        $x0 = $x0s[$i];
        $y0 = $y0s[$i];
        $p0 = $p0s[$i];
        $q0 = $q0s[$i]; 
		  $bodyString = sprintf("%.10f;%s;%.10f;%.10f;%.10f;%.10f;%.10f",
		                        $mass, $colorConverted, $r, $x0, $y0, $p0, $q0);
        $bodyStrings[] = $bodyString;
    } 
    $param = $sessionIdField . "~" . $pxmin . "~" . $pxmax . "~" . $pymin . "~" . $pymax . "~" . $border . "~" . $background 
                              . "~" . $tmax . "~" . $integrationMethod . "~" . $graphpaper . "~" . $nbodies;
    if (!empty($bodyStrings)) {
        $param .= "~" . implode("~", $bodyStrings);
    } 
	if (isset($_GET['indatabase']) && $_GET['indatabase'] === "true") {
		echo("<script>let indatabase = true;</script>");
	} else {
			echo("<script>let indatabase = false;</script>"); 
		}
    ?>
    <!DOCTYPE html>
    <html>
    <head>
        <title>Three Body Solution</title>
        <style>
            body { font-family: Arial, sans-serif; }
            pre { background-color: #eee; padding: 10px; }
            .button-group button {
                padding: 10px 20px;
                font-size: 16px;
                background-color: rgb(0,0,128);
                color: white;
                border: none;
                cursor: pointer;
                margin-right: 5px;
            }
            .button-group button:hover {
                background-color: rgb(0,0,150);
					 html, body {
					     margin: 0;
					     padding: 0;
					     height: 100%;
					 }
            }
				#graph0 {
					     width: 100%;
					     height: 100%;
				} 
				html, body {
				    margin: 0;
				    padding: 0;
				    height: 100%;
				}

				#svgContainer {
				    width: 100%;
				    height: 100%;
				}

				/* Style for the slider */
				#timeSlider {
				  -webkit-appearance: none;
				  appearance: none;
				  width: 200px;
				  height: 20px;
				  background: darkblue;
				  outline: none;
				  margin: 0;
				  padding: 0;
				}

				/* Webkit-based browsers */
				#timeSlider::-webkit-slider-thumb {
				  -webkit-appearance: none;
				  appearance: none;
				  width: 32px;  /* Adjust width and height to suit your design */
				  height: 32px;
				  background: white;
				  border: 1px solid #000;
				  border-radius: 50%;  /* Makes the knob circular */
				  cursor: pointer;
				}

				/* Firefox */
				#timeSlider::-moz-range-thumb {
				  width: 32px;
				  height: 32px;
				  background: white;
				  border: 1px solid #000;
				  border-radius: 50%;
				  cursor: pointer;
				}
		  </style> 
    </head>
    <body>  
      <div id="svgContainer" style="position:absolute; top:0; left:66; width:100%; height:100%;">
		    <?php
		    // Call sendMessage with the constructed param 
			 // the response is SVG for the solution graph
    		echo sendMessage($clientSocket, "newDocument", $param); 
			// this echoes not only the SVG code for the drawing but also the Javascript for the document data
    		?>
    </div>
    <script src="GetCaption.js"></script> 
    <!-- ThreeBodyControls.js needs these variables: --> 
	 <script>
	   document.write('<input type="hidden" id="tmax" value="' + tmax + '">');
	   document.write('<input type="hidden" id="nbodies" value="' + bodies.length + '">');
	   document.write('<input type="hidden" id="integrationMethod" value="' + integrationMethod + '">');
		console.log("tmax = ", tmax);
	 </script>	
    <script src="ThreeBodyControls.js"></script>  
	 <!--  ThreeBodyControls.js  must come AFTER echoing the response to SendMessage, so it gets the edited values -->
    </body>
    </html>
<?php  // close the if  
} 
else{ 
	// exit PHP without closing the else yet
?>  
<!DOCTYPE html>
<html>
<head>
    <title>Draw Solution - Send Data</title>
    <style>
        body { font-family: Arial, sans-serif; }
        .button-group button {
            padding: 10px 20px;
            font-size: 16px;
            background-color: rgb(0,0,128);
            color: white;
            border: none;
            cursor: pointer;
            margin-right: 5px;
        }
        .button-group button:hover {
            background-color: rgb(0,0,150);
        }
    </style>
</head>
<body>
    <h1>Draw Solution</h1>
    <p>This form, when processed,  will cause DOCDATA3 data to be sent to the engine.</p>
        <form id="drawForm" method="post" action="DrawSolution.php" onsubmit="return updateFields();">
        <!-- Hidden fields corresponding to DOCDATA3 -->
        <input type="hidden" name="sessionId" value="<?php echo htmlspecialchars($sessionId); ?>">
        <input type="hidden" name="pxmin" id="pxminField">
        <input type="hidden" name="pxmax" id="pxmaxField">
        <input type="hidden" name="pymin" id="pyminField">
        <input type="hidden" name="pymax" id="pymaxField"> 
        <input type="hidden" name="integrationMethod" id="integrationMethod" value=<?php echo($integrationMethod);?>>
        <input type="hidden" name="tmax" id="tmax" value=<?php echo($tmax);?>>  
        <input type="hidden" name="caption" id="caption" value=<?php echo($caption);?>> 
        <input type="hidden" name="border" value="16777215"> <!-- white in decimal -->
        <input type="hidden" name="background" value="0">      <!-- black -->
        <input type="hidden" name="nbodies" value="0" id="nbodiesField">
        <div class="button-group">
            <button type="submit">Send DrawSolution Data</button>
        </div>
    </form> 
</body>  
<?php  // enter PHP again and close the else
} 
?>
</html>