Fixes HTML of config page

main
Yasen Pramatarov 2025-01-26 15:33:45 +02:00
parent 71d0984e9d
commit 4a8185839d
1 changed files with 92 additions and 105 deletions

View File

@ -1,113 +1,101 @@
<!-- config file -->
<div class="container-fluid mt-2">
<div id="messages-container"></div>
<div class="row mb-4"> <!-- config file -->
<div class="col-12 mb-4"> <div class="container-fluid mt-2">
<h2>Configuration</h2> <div class="row mb-4">
<?php if ($configMessage): ?> <div class="col-12 mb-5">
<?= $configMessage ?> <h2>Configuration</h2>
<?php endif; ?> <?php if ($configMessage): ?>
</div> <?= $configMessage ?>
</div> <?php endif; ?>
</div>
<div class="card shadow-sm"> <div class="card shadow-sm">
<div class="card-header bg-light d-flex justify-content-between align-items-center py-3"> <div class="card-header bg-light d-flex justify-content-between align-items-center py-3">
<h5 class="card-title mb-0"> <h5 class="card-title mb-0">
<i class="fas fa-wrench me-2 text-secondary"></i> <i class="fas fa-wrench me-2 text-secondary"></i>
Jilo Web app configuration Jilo Web app configuration
</h5> </h5>
<?php if ($userObject->hasRight($user_id, 'edit config file')): ?> <?php if ($userObject->hasRight($user_id, 'edit config file')) { ?>
<div> <div>
<button type="button" class="btn btn-outline-primary btn-sm toggle-edit" <?= !$isWritable ? 'disabled' : '' ?>> <button type="button" class="btn btn-outline-primary btn-sm toggle-edit" <?= !$isWritable ? 'disabled' : '' ?>>
<i class="fas fa-edit me-2"></i>Edit <i class="fas fa-edit me-2"></i>Edit
</button> </button>
<div class="edit-controls d-none"> <div class="edit-controls d-none">
<button type="button" class="btn btn-danger btn-sm save-config"> <button type="button" class="btn btn-danger btn-sm save-config">
<i class="fas fa-save me-2"></i>Save <i class="fas fa-save me-2"></i>Save
</button> </button>
<button type="button" class="btn btn-outline-secondary btn-sm ms-2 cancel-edit"> <button type="button" class="btn btn-outline-secondary btn-sm ms-2 cancel-edit">
Cancel Cancel
</button> </button>
</div> </div>
</div> </div>
<?php endif; ?> <?php } ?>
</div>
<div class="card-body p-4">
<form id="configForm">
<?php
function renderConfigItem($key, $value, $path = '') {
$fullPath = $path ? $path . '[' . $key . ']' : $key;
// Only capitalize first letter, not every word
$displayName = ucfirst(str_replace('_', ' ', $key));
if (is_array($value)) {
echo '<div class="config-section mb-4">';
echo '<h6 class="border-bottom pb-2 mb-3">' . htmlspecialchars($displayName) . '</h6>';
echo '<div class="ps-4">';
foreach ($value as $subKey => $subValue) {
renderConfigItem($subKey, $subValue, $fullPath);
}
echo '</div>';
echo '</div>';
} else {
?>
<div class="config-item row mb-3 align-items-center">
<div class="col-md-4 text-end">
<label class="form-label mb-0"><?= htmlspecialchars($displayName) ?></label>
</div> </div>
<div class="col-md-8">
<div class="view-mode"> <div class="card-body p-4">
<?php if (is_bool($value) || $key === 'registration_enabled'): ?> <form id="configForm">
<span class="badge <?= $value ? 'bg-success' : 'bg-secondary' ?>"> <?php
<?= $value ? 'Enabled' : 'Disabled' ?> function renderConfigItem($key, $value, $path = '') {
</span> $fullPath = $path ? $path . '[' . $key . ']' : $key;
<?php elseif ($key === 'environment'): ?> // Only capitalize first letter, not every word
<span class="badge <?= $value === 'production' ? 'bg-danger' : 'bg-info' ?>"> $displayName = ucfirst(str_replace('_', ' ', $key));
<?= htmlspecialchars($value) ?>
</span> if (is_array($value)) {
<?php else: ?> echo "\t\t\t\t\t\t\t\t\t<div class=\"config-section mb-4\">";
<?php if (empty($value) && $value !== '0'): ?> echo "\n\t\t\t\t\t\t\t\t\t\t<h6 class=\"border-bottom pb-2 mb-3\">" . htmlspecialchars($displayName) . '</h6>';
<span class="text-muted fst-italic">blank</span> echo "\n\t\t\t\t\t\t\t\t\t\t<div class=\"ps-4\">\n";
<?php else: ?> foreach ($value as $subKey => $subValue) {
<span class="text-body"> renderConfigItem($subKey, $subValue, $fullPath);
<?= htmlspecialchars($value) ?> }
</span> echo "\t\t\t\t\t\t\t\t\t\t</div>\n";
<?php endif; ?> echo "\t\t\t\t\t\t\t\t\t</div>\n";
<?php endif; ?> } else {
</div> ?>
<div class="edit-mode d-none"> <div class="config-item row mb-3 align-items-center">
<?php if (is_bool($value) || $key === 'registration_enabled'): ?> <div class="col-md-4 text-end">
<div class="form-check form-switch"> <label class="form-label mb-0"><?= htmlspecialchars($displayName) ?></label>
<input class="form-check-input" type="checkbox"
name="<?= htmlspecialchars($fullPath) ?>"
<?= $value ? 'checked' : '' ?>>
</div> </div>
<?php elseif ($key === 'environment'): ?> <div class="col-md-8">
<select class="form-select form-select-sm" name="<?= htmlspecialchars($fullPath) ?>"> <div class="view-mode">
<option value="development" <?= $value === 'development' ? 'selected' : '' ?>>Development</option> <?php if (is_bool($value) || $key === 'registration_enabled') { ?>
<option value="production" <?= $value === 'production' ? 'selected' : '' ?>>Production</option> <span class="badge <?= $value ? 'bg-success' : 'bg-secondary' ?>"><?= $value ? 'Enabled' : 'Disabled' ?></span>
</select> <?php } elseif ($key === 'environment') { ?>
<?php else: ?> <span class="badge <?= $value === 'production' ? 'bg-danger' : 'bg-info' ?>"><?= htmlspecialchars($value) ?></span>
<input type="text" class="form-control form-control-sm" <?php } else {
name="<?= htmlspecialchars($fullPath) ?>" if (empty($value) && $value !== '0') { ?>
value="<?= htmlspecialchars($value ?? '') ?>"> <span class="text-muted fst-italic">blank</span>
<?php endif; ?> <?php } else { ?>
</div> <span class="text-body"><?= htmlspecialchars($value) ?></span>
<?php } ?>
<?php } ?>
</div>
<div class="edit-mode d-none">
<?php if (is_bool($value) || $key === 'registration_enabled') { ?>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" name="<?= htmlspecialchars($fullPath) ?>" <?= $value ? 'checked' : '' ?>>
</div>
<?php } elseif ($key === 'environment') { ?>
<select class="form-select form-select-sm" name="<?= htmlspecialchars($fullPath) ?>">
<option value="development" <?= $value === 'development' ? 'selected' : '' ?>>Development</option>
<option value="production" <?= $value === 'production' ? 'selected' : '' ?>>Production</option>
</select>
<?php } else { ?>
<input type="text" class="form-control form-control-sm" name="<?= htmlspecialchars($fullPath) ?>" value="<?= htmlspecialchars($value ?? '') ?>">
<?php } ?>
</div>
</div>
</div>
<?php }
}
foreach ($config as $key => $value) {
renderConfigItem($key, $value);
} ?>
</form>
</div> </div>
</div> </div>
<?php </div>
} </div>
} <!-- /config file -->
foreach ($config as $key => $value) {
renderConfigItem($key, $value);
}
?>
</form>
</div>
</div>
</div>
<script> <script>
$(function() { $(function() {
@ -251,4 +239,3 @@ $(function() {
}); });
}); });
</script> </script>
<!-- /config file -->