Pipeline de stades : 3 sections (À revoir / À garder / À étudier) + renommage Notes + zone collapsible

This commit is contained in:
Etienne Delvarre
2026-07-23 11:32:00 +02:00
parent 04b436a9c7
commit acd09c92e6
3 changed files with 80 additions and 20 deletions
+46 -15
View File
@@ -1,4 +1,11 @@
const ACTES_FRISE = ["Prologue", "Acte 1", "Acte 2", "Acte 3", "Épilogue"];
const STATUT_TAGS = ['À revoir', 'À garder', 'À étudier'];
function getStatutTag(r) {
const tags = (r.Tags || '').split(',').map(s => s.trim());
return STATUT_TAGS.find(s => tags.includes(s)) || 'À étudier';
}
let records = [];
let columns = {};
let editingId = null;
@@ -316,22 +323,31 @@ function renderFrise() {
area.appendChild(container);
// Waiting zone
const waitingCards = document.getElementById('waiting-cards');
waitingCards.innerHTML = '';
const waitingRecords = records
.filter(r => !r.Acte || r.Acte === 'En attente')
.sort((a, b) => sortRecords(a, b, sortMode));
// Waiting zone — pipeline de stades
const waitingRecords = records.filter(r => !r.Acte || r.Acte === 'En attente');
waitingRecords.forEach(r => waitingCards.appendChild(makeCard(r)));
STATUT_TAGS.forEach(statut => {
const slug = statut === 'À revoir' ? 'a-revoir' : statut === 'À garder' ? 'a-garder' : 'a-etudier';
const container = document.getElementById(`cards-${slug}`);
const counter = document.getElementById(`count-${slug}`);
if (!container) return;
container.innerHTML = '';
new Sortable(waitingCards, {
group: 'frise',
animation: 200,
direction: 'horizontal',
ghostClass: 'sortable-ghost',
chosenClass: 'sortable-chosen',
onEnd: handleDrop,
const forStatut = waitingRecords
.filter(r => getStatutTag(r) === statut)
.sort((a, b) => sortRecords(a, b, sortMode));
forStatut.forEach(r => container.appendChild(makeCard(r)));
if (counter) counter.textContent = forStatut.length || '';
new Sortable(container, {
group: 'frise',
animation: 200,
direction: 'horizontal',
ghostClass: 'sortable-ghost',
chosenClass: 'sortable-chosen',
onEnd: handleDrop,
});
});
}
@@ -649,6 +665,21 @@ document.addEventListener('keydown', e => {
}
});
// Zone En attente — toggles collapsibles par section
(function initWaitingToggles() {
['a-revoir', 'a-garder', 'a-etudier'].forEach(slug => {
const toggle = document.getElementById(`toggle-${slug}`);
const section = document.getElementById(`section-${slug}`);
if (!toggle || !section) return;
const key = `tdb-${slug}-collapsed`;
try { if (localStorage.getItem(key) === '1') section.classList.add('collapsed'); } catch(e) {}
toggle.addEventListener('click', () => {
section.classList.toggle('collapsed');
try { localStorage.setItem(key, section.classList.contains('collapsed') ? '1' : '0'); } catch(e) {}
});
});
})();
loadData();
// ══════════════════════════════════════
@@ -1897,7 +1928,7 @@ function buildFichePanel(scene) {
{ label: 'Intérêt narratif', value: scene['Intérêt narratif'] },
{ label: 'Implications', value: scene.Implications },
{ label: 'Origine', value: scene.Origine },
{ label: 'Lien rédaction', value: scene['Lien rédaction'] },
{ label: 'Notes', value: scene['Lien rédaction'] },
];
let hasContent = false;
+26 -4
View File
@@ -95,8 +95,30 @@ window.dispatchEvent(new Event('tiptap-loaded'));
<div class="loading" id="loading">Chargement...</div>
</div>
<div class="waiting-zone">
<div class="waiting-header">En attente — glisser sur la frise</div>
<div class="waiting-cards" id="waiting-cards"></div>
<div class="waiting-section" id="section-a-revoir">
<div class="waiting-header" id="toggle-a-revoir">
<span>À revoir</span>
<span class="waiting-count" id="count-a-revoir"></span>
<span class="waiting-arrow"></span>
</div>
<div class="waiting-cards" id="cards-a-revoir" data-acte="En attente"></div>
</div>
<div class="waiting-section" id="section-a-garder">
<div class="waiting-header" id="toggle-a-garder">
<span>À garder</span>
<span class="waiting-count" id="count-a-garder"></span>
<span class="waiting-arrow"></span>
</div>
<div class="waiting-cards" id="cards-a-garder" data-acte="En attente"></div>
</div>
<div class="waiting-section" id="section-a-etudier">
<div class="waiting-header" id="toggle-a-etudier">
<span>À étudier</span>
<span class="waiting-count" id="count-a-etudier"></span>
<span class="waiting-arrow"></span>
</div>
<div class="waiting-cards" id="cards-a-etudier" data-acte="En attente"></div>
</div>
</div>
</div>
</div>
@@ -289,8 +311,8 @@ window.dispatchEvent(new Event('tiptap-loaded'));
<textarea id="f-origine" placeholder="D'ou vient cette idee..."></textarea>
</div>
<div class="field">
<label>Lien redaction</label>
<textarea id="f-lien" placeholder="Notes pour la redaction..."></textarea>
<label>Notes</label>
<textarea id="f-lien" placeholder="Notes, réflexions..."></textarea>
</div>
<div class="modal-comments" id="card-comments-section" style="display:none;">
<h4>Commentaires</h4>
+8 -1
View File
@@ -205,7 +205,14 @@
/* ── Waiting zone (bottom) ── */
.waiting-zone { border-top: 2px dashed var(--border); padding: 14px 24px; background: var(--bg-alt); flex-shrink: 0; }
.waiting-header { font-size: 13px; color: var(--text-hint); text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 10px; font-weight: 600; }
.waiting-header { font-size: 13px; color: var(--text-hint); text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 10px; font-weight: 600; cursor: pointer; display: flex; align-items: center; gap: 8px; user-select: none; }
.waiting-header:hover { color: var(--text); }
.waiting-count { background: var(--border); color: var(--text-hint); border-radius: 10px; padding: 1px 7px; font-size: 11px; font-weight: 700; }
.waiting-arrow { margin-left: auto; transition: transform 0.2s ease; display: inline-block; }
.waiting-section { margin-bottom: 12px; }
.waiting-section:last-child { margin-bottom: 0; }
.waiting-section.collapsed .waiting-arrow { transform: rotate(-90deg); }
.waiting-section.collapsed .waiting-cards { display: none; }
.waiting-cards { display: flex; gap: 12px; overflow-x: auto; min-height: 100px; padding: 4px 0; align-items: flex-start; }
.waiting-cards .card { border-style: dashed; border-top: 4px dashed var(--border); }