PostERG/xamxam
1
0
Fork 0
mirror of https://codeberg.org/PostERG/xamxam.git synced 2026-06-25 16:19:19 +02:00
Code Issues Packages Projects Releases Wiki Activity

Rework contenus-edit: auto-save, OverType toolbar, dynamic sidebar links

Browse Source 
- Auto-save: new autosave.js with 1.5s debounce, watches all forms with
  data-autosave, POSTs to form action with Accept: application/json, shows
  saving/saved/error status indicator
- All action handlers (page.php, apropos.php, form-help.php) now detect
  JSON Accept header and return {success, csrf_token} or {error} responses
- OverType toolbar enabled (toolbar:true) on all three markdown editors
  (page, about_page, form_help)
- Sidebar links: replaced fixed erg_site_url / source_code_url rows with
  dynamic sidebar_links array of {label, url} objects. Add/remove via JS.
  Fallback migration reads legacy keys if sidebar_links is empty.
- Updated AboutController and about.php template to render dynamic links
- Updated apropos.css: unified .apropos-toc-link replacing .apropos-toc-erg
  and .apropos-toc-source
- New CSS: autosave-status states, sidebar-link-row layout
- Removed all Enregistrer + Annuler buttons — auto-save and h1 back-arrow
  make them redundant
This commit is contained in:
Pontoporeia
2026-06-09 17:10:49 +02:00
parent a45a2c9ac4
commit c4a550f9d1
13 changed files with 441 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/templates/admin/apropos-groups-form.php
View File

@@ -6,7 +6,7 @@
* $groups array Existing groups data
*/
?>
<form action="/admin/actions/apropos.php" method="post" class="admin-form" id="apropos-form-<?= $aproposKey ?>">
<form action="/admin/actions/apropos.php" method="post" class="admin-form" id="apropos-form-<?= $aproposKey ?>" data-autosave>
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
<input type="hidden" name="apropos_key" value="<?= htmlspecialchars($aproposKey) ?>">
@@ -55,10 +55,7 @@
<button type="button" class="btn btn--primary add-group-btn-f"
data-key="<?= $aproposKey ?>">+ Ajouter un contact</button>
<div class="admin-form-footer">
<button type="submit" class="btn btn--primary">Enregistrer</button>
<a href="/admin/contenus.php" class="btn btn--secondary admin-cancel-link">Annuler</a>
</div>
<div class="autosave-status" data-autosave-status></div>
<template id="entry-template-f-<?= $aproposKey ?>">
<div class="apropos-entry">

131
app/templates/admin/contenus-edit.php
View File

@@ -5,7 +5,7 @@
<!-- ── Markdown content ──────────────────────────────────────────────── -->
<h2>Contenu de la page</h2>
<form action="/admin/actions/page.php" method="post" class="admin-form">
<form action="/admin/actions/page.php" method="post" class="admin-form" data-autosave>
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION["csrf_token"]) ?>">
<input type="hidden" name="slug" value="about">
@@ -13,11 +13,7 @@
<input type="hidden" id="content" name="content"
value="<?= htmlspecialchars($initialContent) ?>">
<div id="editor"></div>
<div class="admin-form-footer">
<button type="submit" class="btn btn--primary">Enregistrer</button>
<a href="/admin/contenus.php" class="btn btn--secondary admin-cancel-link">Annuler</a>
</div>
<div class="autosave-status" data-autosave-status></div>
</form>
<!-- ── Contacts ──────────────────────────────────────────────────────── -->
@@ -30,32 +26,103 @@
<!-- ── Sidebar links ─────────────────────────────────────────────────── -->
<h2 style="margin-top:3rem;">Liens de la barre latérale</h2>
<form action="/admin/actions/apropos.php" method="post" class="admin-form">
<form action="/admin/actions/apropos.php" method="post" class="admin-form" id="sidebar-links-form" data-autosave>
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
<input type="hidden" name="apropos_key" value="erg_site_url">
<label for="apropos-erg-site-url">Site de l'erg :</label>
<input type="url" id="apropos-erg-site-url" name="url"
value="<?= htmlspecialchars($ergSiteUrl ?? '') ?>"
placeholder="https://erg.be">
<div class="admin-form-footer">
<button type="submit" class="btn btn--primary">Enregistrer</button>
<input type="hidden" name="apropos_key" value="sidebar_links">
<?php foreach ($sidebarLinks as $li => $link): ?>
<div class="sidebar-link-row">
<div class="sidebar-link-fields">
<div>
<label for="sl_<?= $li ?>_label">Label :</label>
<input type="text" id="sl_<?= $li ?>_label"
name="links[<?= $li ?>][label]"
value="<?= htmlspecialchars($link['label'] ?? '') ?>"
placeholder="Site de l'erg">
</div>
<div>
<label for="sl_<?= $li ?>_url">URL :</label>
<input type="url" id="sl_<?= $li ?>_url"
name="links[<?= $li ?>][url]"
value="<?= htmlspecialchars($link['url'] ?? '') ?>"
placeholder="https://erg.be">
</div>
</div>
<button type="button" class="admin-icon-btn admin-icon-btn--delete remove-sidebar-link-btn"
title="Supprimer ce lien">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 256 256"><path d="M216,48H176V40a24,24,0,0,0-24-24H104A24,24,0,0,0,80,40v8H40a8,8,0,0,0,0,16h8V208a16,16,0,0,0,16,16H192a16,16,0,0,0,16-16V64h8a8,8,0,0,0,0-16ZM112,168V104a8,8,0,0,1,16,0v64a8,8,0,0,1-16,0Zm48,0V104a8,8,0,0,1,16,0v64a8,8,0,0,1-16,0Z"></path></svg>
</button>
</div>
<?php endforeach; ?>
<button type="button" class="btn btn--primary btn--sm" id="add-sidebar-link-btn">+ Ajouter un lien</button>
<div class="autosave-status" data-autosave-status></div>
</form>
<form action="/admin/actions/apropos.php" method="post" class="admin-form" style="margin-top:var(--space-m)">
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
<input type="hidden" name="apropos_key" value="source_code_url">
<label for="apropos-source-code-url">Code source :</label>
<input type="url" id="apropos-source-code-url" name="url"
value="<?= htmlspecialchars($sourceCodeUrl ?? '') ?>"
placeholder="https://git.erg.school/PostERG/xamxam">
<div class="admin-form-footer">
<button type="submit" class="btn btn--primary">Enregistrer</button>
<template id="sidebar-link-tpl">
<div class="sidebar-link-row">
<div class="sidebar-link-fields">
<div>
<label>Label :</label>
<input type="text" name="links[{{li}}][label]" placeholder="Site de l'erg">
</div>
<div>
<label>URL :</label>
<input type="url" name="links[{{li}}][url]" placeholder="https://erg.be">
</div>
</div>
<button type="button" class="admin-icon-btn admin-icon-btn--delete remove-sidebar-link-btn"
title="Supprimer ce lien">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 256 256"><path d="M216,48H176V40a24,24,0,0,0-24-24H104A24,24,0,0,0,80,40v8H40a8,8,0,0,0,0,16h8V208a16,16,0,0,0,16,16H192a16,16,0,0,0,16-16V64h8a8,8,0,0,0,0-16ZM112,168V104a8,8,0,0,1,16,0v64a8,8,0,0,1-16,0Zm48,0V104a8,8,0,0,1,16,0v64a8,8,0,0,1-16,0Z"></path></svg>
</button>
</div>
</form>
</template>
<script>
(function() {
var form = document.getElementById('sidebar-links-form');
var tpl = document.getElementById('sidebar-link-tpl');
var tplHtml = tpl.innerHTML;
function reindexLinks() {
var rows = form.querySelectorAll('.sidebar-link-row');
rows.forEach(function(row, i) {
row.querySelectorAll('input').forEach(function(inp) {
if (inp.name) {
inp.name = inp.name.replace(/links\[\d+\]/, 'links[' + i + ']');
}
if (inp.id) {
inp.id = inp.id.replace(/sl_\d+/, 'sl_' + i);
}
});
row.querySelectorAll('label[for]').forEach(function(lbl) {
lbl.setAttribute('for', lbl.getAttribute('for').replace(/sl_\d+/, 'sl_' + i));
});
});
}
// Event delegation for remove buttons (including dynamically added)
form.addEventListener('click', function(e) {
if (!e.target.closest('.remove-sidebar-link-btn')) return;
e.preventDefault();
e.target.closest('.sidebar-link-row').remove();
reindexLinks();
});
// Add button
var addBtn = document.getElementById('add-sidebar-link-btn');
addBtn.addEventListener('click', function() {
var rows = form.querySelectorAll('.sidebar-link-row');
var idx = rows.length;
var html = tplHtml.split('{{li}}').join(idx);
this.insertAdjacentHTML('beforebegin', html);
});
})();
</script>
<?php elseif ($editType === 'page' && $pageSlug !== 'about'): ?>
<form action="/admin/actions/page.php" method="post" class="admin-form">
<form action="/admin/actions/page.php" method="post" class="admin-form" data-autosave>
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION["csrf_token"]) ?>">
<input type="hidden" name="slug" value="<?= htmlspecialchars($pageSlug) ?>">
@@ -63,16 +130,12 @@
<input type="hidden" id="content" name="content"
value="<?= htmlspecialchars($initialContent) ?>">
<div id="editor"></div>
<div class="admin-form-footer">
<button type="submit" class="btn btn--primary">Enregistrer</button>
<a href="/admin/contenus.php" class="btn btn--secondary admin-cancel-link">Annuler</a>
</div>
<div class="autosave-status" data-autosave-status></div>
</form>
<?php elseif ($editType === 'form_help'): ?>
<p class="param-note">Ce texte est affiché dans le formulaire de soumission des étudiant·es (lien de partage). Supporte le Markdown.</p>
<form action="/admin/actions/form-help.php" method="post" class="admin-form">
<form action="/admin/actions/form-help.php" method="post" class="admin-form" data-autosave>
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
<input type="hidden" name="form_help_key" value="<?= htmlspecialchars($formHelpKey) ?>">
@@ -80,11 +143,7 @@
<input type="hidden" id="content" name="content"
value="<?= htmlspecialchars($initialContent) ?>">
<div id="editor"></div>
<div class="admin-form-footer">
<button type="submit" class="btn btn--primary">Enregistrer</button>
<a href="/admin/contenus.php#form-help-blocks" class="btn btn--secondary admin-cancel-link">Annuler</a>
</div>
<div class="autosave-status" data-autosave-status></div>
</form>
<?php else: ?>