first commit with client and server

This commit is contained in:
Kfir Dayan 2023-12-12 21:46:11 +02:00
commit b8595cdca8
5 changed files with 180 additions and 0 deletions

17
server/params.php Normal file
View file

@ -0,0 +1,17 @@
<?php
// generate random params like ["param1", "param2", "param3"] with random values
$params = [
"cl1",
"cl2",
"Kiran",
"Kir2n",
"stam",
"stam2",
"stam3",
"stam4",
"stam5",
"stam6",
"stam7",
]
?>

79
server/process.php Normal file
View file

@ -0,0 +1,79 @@
<?php
class UrlManipulator
{
private $paramsArray = ['param1', 'param2', 'param3', 'param4'];
public function manipulateUrl($url)
{
if (!filter_var($url, FILTER_VALIDATE_URL)) {
return ['error' => 'Invalid URL', 'input' => $url];
}
$parsedUrl = parse_url($url);
$existingParams = [];
if (isset($parsedUrl['query'])) {
parse_str($parsedUrl['query'], $existingParams);
}
if (empty($this->paramsArray)) {
return ['error' => 'Params array is full', 'input' => $url];
}
$newParam = $this->getNewParam($existingParams);
if (!$newParam) {
return ['error' => 'Unable to find a unique parameter to add', 'input' => $url];
}
$randomValue = $this->generateRandomValue();
$modifiedUrl = $this->addParamToUrl($url, $newParam, $randomValue);
return [
'before' => $url,
'after' => $modifiedUrl,
];
}
private function addParamToUrl($url, $param, $value)
{
$separator = (parse_url($url, PHP_URL_QUERY) == null) ? '?' : '&';
if (strpos($url, $param . '=') !== false) {
$modifiedUrl = preg_replace('/(' . $param . '=)[^&]+/', '$1' . urlencode($value), $url);
} else {
$modifiedUrl = $url . $separator . urlencode($param) . '=' . urlencode($value);
}
return $modifiedUrl;
}
private function generateRandomValue()
{
return uniqid();
}
private function getNewParam($existingParams){
while (!empty($this->paramsArray)) {
$newParam = array_pop($this->paramsArray);
if (!array_key_exists($newParam, $existingParams)) {
return $newParam;
}
}
return null;
}
}
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$urlManipulator = new UrlManipulator();
$url = $_POST['url'];
$result = $urlManipulator->manipulateUrl($url);
header('Content-Type: application/json');
echo json_encode($result);
}

24
web-client/index.html Normal file
View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>URL Manipulator</title>
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div class="container">
<h2>URL Manipulator</h2>
<div id="result-container">
<!-- Results or errors will be displayed here -->
</div>
<form id="url-form">
<label for="url">Enter a valid URL:</label>
<textarea id="url" name="url" rows="4" cols="50" required></textarea>
<button type="button" onclick="manipulateUrl()">Manipulate URL</button>
</form>
</div>
</body>
</html>

35
web-client/script.js Normal file
View file

@ -0,0 +1,35 @@
function manipulateUrl() {
var url = $('#url').val();
$.ajax({
type: 'POST',
url: '../server/process.php',
data: { url: url },
dataType: 'json',
success: function (result) {
displayResult(result);
},
error: function (xhr, status, error) {
displayError(error);
}
});
}
function displayResult(result) {
console.log(result);
var resultContainer = $('#result-container');
resultContainer.empty();
if (result.hasOwnProperty('error')) {
resultContainer.append('<p class="error">' + result.error + '</p>');
} else {
// Update the text area with the modified URL
$('#url').val(result.after.replace(/&amp;/g, '&'));
}
}
function displayError(error) {
var resultContainer = $('#result-container');
resultContainer.empty();
resultContainer.append('<p class="error">Error: ' + error + '</p>');
}

25
web-client/style.css Normal file
View file

@ -0,0 +1,25 @@
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.container {
background-color: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
button {
background-color: #4caf50;
color: #fff;
padding: 10px;
border: none;
border-radius: 4px;
cursor: pointer;
}