246 lines
16 KiB
PHP
246 lines
16 KiB
PHP
<?php require __DIR__ . '/settings_nav.php'; ?>
|
|
<div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-3">
|
|
<div>
|
|
<h2 class="mb-1"><?= h(t('public_site.settings_heading')) ?></h2>
|
|
<div class="text-muted"><?= h(t('public_site.settings_intro')) ?></div>
|
|
</div><a class="btn btn-outline-primary" href="<?= h(PublicSiteController::url()) ?>" target="_blank">↗
|
|
<?= h(t('public_site.preview')) ?></a>
|
|
</div>
|
|
<?php if ($saved): ?><div class="alert alert-success">✅ <?= h(t('public_site.saved')) ?></div>
|
|
<?php endif; ?><?php if ($error): ?><div class="alert alert-danger">⚠️ <?= h($error) ?></div><?php endif; ?>
|
|
<div class="card mb-3">
|
|
<div class="card-header"><h3 class="card-title">🖼️ <?= h(t('public_site.image_library')) ?></h3></div>
|
|
<div class="card-body">
|
|
<form id="public-image-upload" method="post" action="/settings/public-site/image" enctype="multipart/form-data" class="row g-2 align-items-end mb-3">
|
|
<input type="hidden" name="csrf" value="<?= h(Auth::csrf()) ?>">
|
|
<div class="col-md"><label class="form-label"><?= h(t('public_site.image_file')) ?></label><input class="form-control" type="file" name="public_site_image" accept="image/jpeg,image/png,image/webp" required></div>
|
|
<div class="col-md-auto"><button class="btn btn-outline-primary"><?= h(t('public_site.image_upload')) ?></button></div>
|
|
</form>
|
|
<div class="form-hint mb-3" id="public-image-help"><?= h(t('public_site.image_help')) ?></div>
|
|
<div class="text-muted<?= $images ? ' d-none' : '' ?>" id="public-image-empty"><?= h(t('public_site.image_none')) ?></div>
|
|
<div class="row g-3" id="public-image-library">
|
|
<?php foreach ($images as $image): ?><div class="col-6 col-md-3 col-xl-2">
|
|
<div class="card h-100"><img src="<?= h($image['url']) ?>" alt="" class="card-img-top" style="height:110px;object-fit:cover">
|
|
<div class="card-body p-2"><button type="button" class="btn btn-sm btn-outline-secondary w-100 public-image-insert" data-url="<?= h($image['url']) ?>"><?= h(t('public_site.image_insert')) ?></button></div>
|
|
</div>
|
|
</div><?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<form method="post" action="/settings/public-site/save"><input type="hidden" name="csrf" value="<?= h(Auth::csrf()) ?>">
|
|
<div class="card mb-3">
|
|
<div class="card-status-top bg-green"></div>
|
|
<div class="card-header">
|
|
<h3 class="card-title"><?= h(t('public_site.activation_style')) ?></h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-12"><label class="form-check form-switch"><input class="form-check-input"
|
|
type="checkbox" name="public_site_enabled" value="1"
|
|
<?= ($settings['public_site_enabled'] ?? '0') === '1' ? 'checked' : '' ?>><span
|
|
class="form-check-label fw-bold"><?= h(t('public_site.enable')) ?></span></label>
|
|
<div class="form-hint"><?= h(t('public_site.enable_help')) ?></div>
|
|
</div>
|
|
<div class="col-12"><label class="form-label"><?= h(t('public_site.main_address')) ?></label>
|
|
<div class="row g-2">
|
|
<div class="col-md-6"><label class="form-selectgroup-item w-100"><input
|
|
class="form-selectgroup-input" type="radio" name="public_site_routing"
|
|
value="integrated"
|
|
<?= ($settings['public_site_routing'] ?? 'integrated') === 'integrated' ? 'checked' : '' ?>><span
|
|
class="form-selectgroup-label d-block"><strong><?= h(t('public_site.routing_management')) ?></strong><span
|
|
class="d-block text-muted small"><?= h(t('public_site.routing_management_help')) ?></span></span></label>
|
|
</div>
|
|
<div class="col-md-6"><label class="form-selectgroup-item w-100"><input
|
|
class="form-selectgroup-input" type="radio" name="public_site_routing" value="root"
|
|
<?= ($settings['public_site_routing'] ?? 'integrated') === 'root' ? 'checked' : '' ?>><span
|
|
class="form-selectgroup-label d-block"><strong><?= h(t('public_site.routing_public')) ?></strong><span
|
|
class="d-block text-muted small"><?= h(t('public_site.routing_public_help')) ?></span></span></label>
|
|
</div>
|
|
</div>
|
|
<div class="form-hint mt-2"><?= h(t('public_site.routing_no_server')) ?></div>
|
|
</div>
|
|
<div class="col-12"><label class="form-label"><?= h(t('public_site.theme')) ?></label>
|
|
<div class="row g-2">
|
|
<?php foreach (['warm' => ['🧡',t('public_site.theme_warm')],'nature' => ['🌿',t('public_site.theme_nature')],'minimal' => ['◻️',t('public_site.theme_minimal')],'custom' => ['🎨',t('public_site.theme_custom')]] as $key => $theme): ?>
|
|
<div class="col-md-3"><label class="form-selectgroup-item w-100"><input type="radio"
|
|
name="public_site_theme" value="<?= h($key) ?>" class="form-selectgroup-input"
|
|
<?= ($settings['public_site_theme'] ?? 'warm') === $key ? 'checked' : '' ?>><span
|
|
class="form-selectgroup-label d-flex align-items-center gap-2"><?= $theme[0] ?>
|
|
<strong><?= h($theme[1]) ?></strong></span></label></div><?php endforeach; ?></div>
|
|
</div>
|
|
<div class="col-md-6"><label class="form-label"><?= h(t('public_site.site_name')) ?></label><input
|
|
class="form-control" name="public_site_name" value="<?= h($settings['public_site_name']) ?>"
|
|
placeholder="<?= h($settings['association_name']) ?>"></div>
|
|
<div class="col-12"><label class="form-label"><?= h(t('public_site.custom_css')) ?></label><textarea
|
|
class="form-control font-monospace" name="public_site_custom_css" rows="8"
|
|
placeholder=":root { --accent: #d87945; }"><?= h($settings['public_site_custom_css']) ?></textarea>
|
|
<div class="form-hint"><?= h(t('public_site.custom_css_help')) ?></div></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<h3 class="card-title">🏠 <?= h(t('public_site.home')) ?></h3>
|
|
</div>
|
|
<div class="card-body row g-3">
|
|
<div class="col-12"><label class="form-label"><?= h(t('common.title')) ?></label><input class="form-control"
|
|
name="public_site_home_title" value="<?= h($settings['public_site_home_title']) ?>" required></div>
|
|
<div class="col-12"><label class="form-label"><?= h(t('common.text')) ?></label><textarea
|
|
class="form-control public-rich-text" name="public_site_home_text"
|
|
rows="4"><?= h($settings['public_site_home_text']) ?></textarea></div>
|
|
</div>
|
|
</div>
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<h3 class="card-title">📖 <?= h(t('public_site.free_page')) ?></h3>
|
|
</div>
|
|
<div class="card-body row g-3">
|
|
<div class="col-12"><label class="form-check form-switch"><input class="form-check-input" type="checkbox"
|
|
name="public_site_about_enabled" value="1"
|
|
<?= ($settings['public_site_about_enabled'] ?? '0') === '1' ? 'checked' : '' ?>><span
|
|
class="form-check-label"><?= h(t('public_site.show_free_page')) ?></span></label></div>
|
|
<div class="col-md-4"><label class="form-label"><?= h(t('common.title')) ?></label><input
|
|
class="form-control" name="public_site_about_title"
|
|
value="<?= h($settings['public_site_about_title']) ?>"></div>
|
|
<div class="col-md-8"><label class="form-label"><?= h(t('common.text')) ?></label><textarea
|
|
class="form-control public-rich-text" name="public_site_about_text"
|
|
rows="5"><?= h($settings['public_site_about_text']) ?></textarea></div>
|
|
</div>
|
|
</div>
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<h3 class="card-title">💝 <?= h(t('public_site.donation')) ?></h3>
|
|
</div>
|
|
<div class="card-body row g-3">
|
|
<div class="col-md-4"><label class="form-label"><?= h(t('common.title')) ?></label><input
|
|
class="form-control" name="public_site_donation_title"
|
|
value="<?= h($settings['public_site_donation_title']) ?>"></div>
|
|
<div class="col-md-8"><label class="form-label"><?= h(t('public_site.donation_url')) ?></label><input
|
|
class="form-control" type="url" name="public_site_donation_url"
|
|
value="<?= h($settings['public_site_donation_url']) ?>" placeholder="https://..."></div>
|
|
<div class="col-12"><label class="form-label"><?= h(t('common.text')) ?></label><textarea
|
|
class="form-control public-rich-text" name="public_site_donation_text"
|
|
rows="4"><?= h($settings['public_site_donation_text']) ?></textarea></div>
|
|
</div>
|
|
</div>
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<h3 class="card-title">✉️ <?= h(t('public_site.contact')) ?></h3>
|
|
</div>
|
|
<div class="card-body row g-3">
|
|
<div class="col-12">
|
|
<div class="alert alert-info py-2"><?= h(t('public_site.contact_reuse')) ?></div><label
|
|
class="form-label"><?= h(t('common.text')) ?></label><textarea class="form-control public-rich-text"
|
|
name="public_site_contact_text" rows="3"><?= h($settings['public_site_contact_text']) ?></textarea>
|
|
</div>
|
|
<div class="col-md-6"><label class="form-label">Facebook</label><input class="form-control" type="url"
|
|
name="public_site_facebook_url" value="<?= h($settings['public_site_facebook_url']) ?>"></div>
|
|
<div class="col-md-6"><label class="form-label">Instagram</label><input class="form-control" type="url"
|
|
name="public_site_instagram_url" value="<?= h($settings['public_site_instagram_url']) ?>"></div>
|
|
<?php foreach (['youtube' => 'YouTube','tiktok' => 'TikTok','whatsapp' => 'WhatsApp','linkedin' => 'LinkedIn','x' => 'X','snapchat' => 'Snapchat'] as $network => $label): ?>
|
|
<div class="col-md-6"><label class="form-label"><?= h($label) ?></label><input class="form-control"
|
|
type="url" name="public_site_<?= h($network) ?>_url"
|
|
value="<?= h($settings['public_site_' . $network . '_url']) ?>" placeholder="https://..."></div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<h3 class="card-title">⚖️ <?= h(t('public_site.legal_privacy')) ?></h3>
|
|
</div>
|
|
<div class="card-body row g-3">
|
|
<div class="col-md-6"><label class="form-label"><?= h(t('public_site.legal')) ?></label><textarea
|
|
class="form-control" name="public_site_legal_text"
|
|
rows="16"><?= h(PublicSiteController::legalText($settings)) ?></textarea></div>
|
|
<div class="col-md-6"><label class="form-label"><?= h(t('public_site.privacy')) ?></label><textarea
|
|
class="form-control" name="public_site_privacy_text"
|
|
rows="16"><?= h(PublicSiteController::privacyText($settings)) ?></textarea></div>
|
|
<div class="col-12 form-hint"><?= h(t('public_site.legal_hint')) ?></div>
|
|
</div>
|
|
</div>
|
|
<div class="text-end mb-4"><button class="btn btn-primary"><?= h(t('common.save')) ?></button></div>
|
|
</form>
|
|
<script>
|
|
let activePublicEditor = null;
|
|
const imageLibrary = document.getElementById('public-image-library');
|
|
const imageHelp = document.getElementById('public-image-help');
|
|
const insertImage = (button) => {
|
|
const textarea = activePublicEditor || document.querySelector('.public-rich-text');
|
|
if (!textarea) return;
|
|
const alt = window.prompt(<?= json_encode(t('public_site.image_alt_prompt'), JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>, '');
|
|
if (alt === null) return;
|
|
const safeAlt = alt.replace(/[\[\]]/g, '').trim() || <?= json_encode(t('public_site.image_default_alt'), JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>;
|
|
textarea.setRangeText(`\n`, textarea.selectionStart, textarea.selectionEnd, 'end');
|
|
textarea.focus();
|
|
};
|
|
document.querySelectorAll('textarea').forEach((textarea) => {
|
|
const resize = () => {
|
|
textarea.style.height = 'auto';
|
|
textarea.style.height = Math.max(140, textarea.scrollHeight + 8) + 'px';
|
|
};
|
|
textarea.addEventListener('input', resize);
|
|
resize();
|
|
});
|
|
document.querySelectorAll('.public-rich-text').forEach((textarea) => {
|
|
textarea.addEventListener('focus', () => { activePublicEditor = textarea; });
|
|
const toolbar = document.createElement('div');
|
|
toolbar.className = 'btn-list mb-2';
|
|
const actions = [['B', '**', '**'], ['I', '*', '*'], ['Titre', '## ', ''], ['Liste', '- ', ''], ['Lien', '[', '](https://)']];
|
|
actions.forEach(([label, before, after]) => {
|
|
const button = document.createElement('button');
|
|
button.type = 'button';
|
|
button.className = 'btn btn-sm btn-outline-secondary';
|
|
button.textContent = label;
|
|
button.addEventListener('click', () => {
|
|
const start = textarea.selectionStart;
|
|
const end = textarea.selectionEnd;
|
|
const selected = textarea.value.slice(start, end);
|
|
textarea.setRangeText(before + selected + after, start, end, 'select');
|
|
textarea.focus();
|
|
});
|
|
toolbar.append(button);
|
|
});
|
|
const imageButton = document.createElement('button');
|
|
imageButton.type = 'button';
|
|
imageButton.className = 'btn btn-sm btn-outline-primary';
|
|
imageButton.textContent = <?= json_encode('🖼️ ' . t('public_site.image_insert'), JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>;
|
|
imageButton.addEventListener('click', () => {
|
|
activePublicEditor = textarea;
|
|
imageHelp.textContent = <?= json_encode(t('public_site.image_target_selected'), JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>;
|
|
imageLibrary.scrollIntoView({behavior: 'smooth', block: 'center'});
|
|
});
|
|
toolbar.append(imageButton);
|
|
textarea.before(toolbar);
|
|
});
|
|
document.querySelectorAll('.public-image-insert').forEach((button) => {
|
|
button.addEventListener('click', () => insertImage(button));
|
|
});
|
|
document.getElementById('public-image-upload').addEventListener('submit', async (event) => {
|
|
event.preventDefault();
|
|
const form = event.currentTarget;
|
|
const submit = form.querySelector('button');
|
|
submit.disabled = true;
|
|
try {
|
|
const response = await fetch(form.action, {method: 'POST', headers: {'Accept': 'application/json'}, body: new FormData(form)});
|
|
const data = await response.json();
|
|
if (!response.ok) throw new Error(data.error || <?= json_encode(t('public_site.image_invalid'), JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>);
|
|
const column = document.createElement('div');
|
|
column.className = 'col-6 col-md-3 col-xl-2';
|
|
column.innerHTML = '<div class="card h-100"><img alt="" class="card-img-top" style="height:110px;object-fit:cover"><div class="card-body p-2"><button type="button" class="btn btn-sm btn-outline-secondary w-100 public-image-insert"></button></div></div>';
|
|
const image = column.querySelector('img');
|
|
const insert = column.querySelector('button');
|
|
image.src = data.url;
|
|
insert.dataset.url = data.url;
|
|
insert.textContent = <?= json_encode(t('public_site.image_insert'), JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>;
|
|
insert.addEventListener('click', () => insertImage(insert));
|
|
imageLibrary.prepend(column);
|
|
document.getElementById('public-image-empty').classList.add('d-none');
|
|
form.reset();
|
|
insert.click();
|
|
} catch (error) {
|
|
window.alert(error.message);
|
|
} finally {
|
|
submit.disabled = false;
|
|
}
|
|
});
|
|
</script>
|