diff --git a/html/header.php b/html/header.php index a3e3d3a..1bc34ec 100755 --- a/html/header.php +++ b/html/header.php @@ -20,7 +20,7 @@ include 'static.php'; - ShreeBhattJi - URMI Digital Transcoder + ShreeBhattJi @@ -29,7 +29,7 @@ include 'static.php';
- URMI Digital Transcoder + URMIC Digital Transcoder
diff --git a/html/input.php b/html/input.php index 5ddc04d..955e7c9 100755 --- a/html/input.php +++ b/html/input.php @@ -270,6 +270,7 @@ foreach ($data as $k => $d) { } file_put_contents($jsonFile, json_encode($data, JSON_PRETTY_PRINT)); +// Process POST requests if ($_SERVER["REQUEST_METHOD"] === "POST") { switch ($_POST["action"]) { case "add": @@ -315,7 +316,8 @@ if ($_SERVER["REQUEST_METHOD"] === "POST") { exec("sudo systemctl enable encoder@{$new["id"]}"); exec("sudo systemctl restart encoder@{$new["id"]}"); } - echo "OK"; + // Redirect to refresh page after adding + header("Location: " . $_SERVER["PHP_SELF"]); exit; break; case "delete": @@ -333,17 +335,16 @@ if ($_SERVER["REQUEST_METHOD"] === "POST") { if (file_exists("/var/www/encoder/$id.sh")) unlink("/var/www/encoder/$id.sh"); - echo "OK"; + // Redirect to refresh page after deleting + header("Location: " . $_SERVER["PHP_SELF"]); exit; break; case "edit": - $id = intval($_POST["id"]); $newData = []; foreach ($data as $row) { if ($row["id"] == $id) { - $row = [ "id" => $id, "service_name" => $_POST["service_name"], @@ -392,27 +393,46 @@ if ($_SERVER["REQUEST_METHOD"] === "POST") { } file_put_contents($jsonFile, json_encode($newData, JSON_PRETTY_PRINT)); - echo "OK"; + // Redirect to refresh page after editing + header("Location: " . $_SERVER["PHP_SELF"]); exit; break; case "restart": $id = intval($_POST["id"]); exec("sudo systemctl restart encoder@$id"); - echo "OK"; + // Redirect to refresh page after restart + header("Location: " . $_SERVER["PHP_SELF"]); exit; break; case "start_all": all_service_start(); + // Redirect to refresh page after start_all + header("Location: " . $_SERVER["PHP_SELF"]); + exit; break; case "stop_all": all_service_stop(); + // Redirect to refresh page after stop_all + header("Location: " . $_SERVER["PHP_SELF"]); + exit; break; case "update_all": all_service_update(); + // Redirect to refresh page after update_all + header("Location: " . $_SERVER["PHP_SELF"]); + exit; break; } } +// Reload data after processing POST +$data = json_decode(file_get_contents($jsonFile), true); +foreach ($data as $k => $d) { + if (!isset($d["service_name"])) $data[$k]["service_name"] = ""; + if (!isset($d["volume"])) $data[$k]["volume"] = "0"; +} +file_put_contents($jsonFile, json_encode($data, JSON_PRETTY_PRINT)); + ?>
@@ -431,215 +451,263 @@ if ($_SERVER["REQUEST_METHOD"] === "POST") {
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
NoIDService NameInputOutputVideoAudioResolutionV-BitrateA-BitrateVolume (dB)StatusActions
dB - - - -
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NoIDService NameInputOutputVideoAudioResolutionV-BitrateA-BitrateVolume (dB)StatusActions
dB +
+ + + +
+
+
+
- + + + + + + +
+ +
+ document.getElementById('saveBtn').addEventListener('click', function() { + const id = document.getElementById('service_id').value; + const serviceData = { + service_name: document.getElementById('service_name').value, + input_udp: document.getElementById('in_udp').value, + output_udp: document.getElementById('out_udp').value, + video_format: document.getElementById('video_format').value, + audio_format: document.getElementById('audio_format').value, + resolution: document.getElementById('resolution').value, + video_bitrate: document.getElementById('video_bitrate').value, + audio_bitrate: document.getElementById('audio_bitrate').value, + volume: document.getElementById('volume').value, + service: document.getElementById('service_status').value + }; + const form = document.createElement('form'); + form.method = 'post'; + form.action = ''; // Current page + + const actionInput = document.createElement('input'); + actionInput.type = 'hidden'; + actionInput.name = 'action'; + actionInput.value = id ? 'edit' : 'add'; + + const idInput = document.createElement('input'); + idInput.type = 'hidden'; + idInput.name = 'id'; + idInput.value = id; + + // Add all service data fields + for (const [key, value] of Object.entries(serviceData)) { + const input = document.createElement('input'); + input.type = 'hidden'; + input.name = key; + input.value = value; + form.appendChild(input); + } + + form.appendChild(actionInput); + form.appendChild(idInput); + document.body.appendChild(form); + form.submit(); + }); + + function submitAction(action) { + document.getElementById('action').value = action; + document.getElementById('actionForm').submit(); + } + + window.onclick = function(event) { + if (event.target == document.getElementById('overlay')) { + closePopup(); + } + } + + document.addEventListener('keydown', function(event) { + if (event.key === 'Escape') { + closePopup(); + } + }); + + document.getElementById('cancelBtn').addEventListener('click', closePopup); + \ No newline at end of file diff --git a/html/style.css b/html/style.css index 1cdeeca..94022af 100644 --- a/html/style.css +++ b/html/style.css @@ -181,7 +181,8 @@ main { justify-content: center; color: var(--text-primary); font-size: 17px; - z-index: 1003; /* Higher than popup */ + z-index: 1003; + /* Higher than popup */ border-bottom: 1px solid rgba(92, 158, 255, 0.2); background: rgba(10, 25, 41, 0.95); backdrop-filter: blur(10px); @@ -199,7 +200,8 @@ main { justify-content: center; color: var(--text-primary); font-size: 14px; - z-index: 1002; /* Higher than popup but below top-header-1 */ + z-index: 1002; + /* Higher than popup but below top-header-1 */ border-bottom: 1px solid rgba(92, 158, 255, 0.2); background: rgba(10, 25, 41, 0.95); backdrop-filter: blur(10px); @@ -255,7 +257,8 @@ main { letter-spacing: 0.4px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); border-bottom: 1px solid rgba(92, 158, 255, 0.2); - z-index: 1001; /* Lower than popup */ + z-index: 1001; + /* Lower than popup */ transition: all 0.3s ease; backdrop-filter: blur(10px); } @@ -854,6 +857,25 @@ main { .multicast-toggle .form-check-input:checked::before { transform: translateX(20px); } + + table { + font-size: 0.8rem; + } + + th, + td { + padding: 8px; + } + + td:nth-child(13) { + width: 100px; + } + + td:nth-child(13) button { + padding: 6px; + font-size: 0.8rem; + } + } .switch-container { @@ -929,7 +951,7 @@ input:checked+.slider:before { max-width: 90vw; max-height: 90vh; overflow-y: auto; - z-index: 1007; /* Increased z-index to be above header */ + z-index: 99999; border-radius: 14px; box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5); backdrop-filter: blur(10px); @@ -943,7 +965,7 @@ input:checked+.slider:before { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.7); - z-index: 1006; /* Lower than popup but higher than other elements */ + z-index: 1006; width: 100%; height: 100%; } @@ -984,3 +1006,62 @@ input:checked+.slider:before { background: #ccc; color: black; } + +td:nth-child(13) div { + display: flex; + flex-direction: column; + gap: 5px; +} + +td:nth-child(13) button { + width: 100%; + padding: 8px; + margin: 0; + font-size: 0.9rem; +} + +table { + width: 100%; + border-collapse: collapse; + margin-top: 20px; + border: 1px solid var(--accent-blue); +} + +th, +td { + padding: 12px; + text-align: left; + border-bottom: 1px solid var(--accent-blue); + border-right: 1px solid var(--accent-blue); +} + +th { + background: rgba(10, 25, 41, 0.7); + position: sticky; + top: 0; + border-top: 1px solid var(--accent-blue); + border-left: 1px solid var(--accent-blue); +} + +td:nth-child(13) { + border-right: 1px solid var(--accent-blue); +} + +.table-container { + width: 100%; + overflow-x: auto; + padding: 10px 0; +} + +.table-wrapper { + min-width: 100%; + overflow: auto; +} + +.service-table { + width: 100%; + min-width: 800px; + border-collapse: collapse; + margin-top: 20px; + border: 1px solid var(--accent-blue); +} \ No newline at end of file