Saisie de suggestions locales du poste de contrôle du réexamen de fin de service
Dans un scénario de poste de contrôle du réexamen de fin de service, réaliser une saisie de suggestions locales : contenu réel, contrôles actionnables, retour d’état clair et mise en page adaptée à toutes les tailles.
Après activation de JavaScript, ce cas peut être modifié, exécuté et enregistré. Code source fixe ci-dessous :
<!doctype html>
<html lang="fr" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Saisie de suggestions locales du poste de contrôle du réexamen de fin de service</title>
<style>
:root { --ink:#ecf7f3; --paper:#071310; --accent:#c66a2d; --secondary:#b5c88d; --line:color-mix(in srgb, var(--ink) 18%, transparent); --shadow:0 24px 60px color-mix(in srgb, var(--ink) 16%, transparent); color-scheme:light; }
* { box-sizing:border-box; }
html { min-width:320px; background:var(--paper); }
body { min-height:100vh; margin:0; overflow-x:hidden; color:var(--ink); font-family:ui-monospace,"SFMono-Regular",Consolas,monospace; background:linear-gradient(color-mix(in srgb,var(--secondary) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--secondary) 5%,transparent) 1px,transparent 1px),var(--paper);background-size:24px 24px; }
button,input,select,textarea { color:inherit; font:inherit; }
button,[role="button"],input,select,textarea { accent-color:var(--accent); }
button { cursor:pointer; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
[hidden] { display:none !important; }
@media (max-width:700px) { .mast h1 { line-height:1.08 !important; letter-spacing:-.035em !important; overflow-wrap:anywhere; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } }
.page{width:min(1080px,calc(100% - 30px));margin:auto;padding:48px 0}.eyebrow{color:var(--secondary);font:700 12px/1.3 ui-monospace,monospace}.eyebrow::before{content:"> ";color:var(--accent)}.mast{display:grid;grid-template-columns:1fr auto;border:1px solid var(--secondary);padding:18px;gap:24px;align-items:center;margin-bottom:16px}.mast h1{font-family:ui-monospace,"SFMono-Regular",monospace;font-weight:700;font-size:clamp(34px,7vw,72px);letter-spacing:-.055em;margin:12px 0;line-height:1.05}.intro{margin:0;color:color-mix(in srgb,var(--ink) 72%,transparent);font:400 14px/1.7 ui-monospace,monospace}.scenario{padding:7px 10px;border:1px dashed var(--secondary);font:700 11px/1 ui-monospace,monospace}.demo{border-color:var(--secondary);border-radius:8px;box-shadow:0 0 50px color-mix(in srgb,var(--secondary) 15%,transparent);position:relative;min-height:390px;padding:26px;background:color-mix(in srgb,var(--paper) 94%,#000)}@media(max-width:700px){.page{width:calc(100% - 18px);padding:20px 0}.mast{grid-template-columns:1fr}.demo{padding:14px}}
.panel{padding:18px;border:2px solid var(--line);border-radius:26px;box-shadow:0 12px 0 color-mix(in srgb,var(--secondary) 35%,transparent)}.row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.stack{display:grid;gap:12px}.action{padding:12px 20px;border:2px solid var(--ink);border-radius:14px;background:var(--paper);box-shadow:0 5px 0 var(--ink);font-weight:800}.action:active{transform:translateY(4px);box-shadow:0 1px 0 var(--ink)}.action.primary,.action.is-active{color:var(--paper);background:var(--accent)}.status{text-align:center;min-height:26px;margin-top:18px}.metric{text-align:center;font-size:clamp(34px,8vw,70px);font-weight:900}.muted{text-align:center;opacity:.7}.meter{height:14px;padding:2px;border:2px solid var(--ink);border-radius:999px}.meter>i{display:block;height:100%;border-radius:inherit;background:var(--secondary)}.chip{padding:7px 11px;border-radius:12px;background:color-mix(in srgb,var(--accent) 12%,transparent)}
.composition-studio{display:grid;gap:14px}.studio-ruler{display:flex;justify-content:space-between;padding:0 4px;color:color-mix(in srgb,var(--ink) 55%,transparent);font:700 11px/1 ui-monospace,monospace;letter-spacing:.14em}.studio-ruler::before{content:"01 / WORKING PROTOTYPE"}.studio-ruler::after{content:"360 · 768 · 1440"}.composition-studio .demo::after{content:"";position:absolute;right:18px;bottom:18px;width:24px;height:24px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);pointer-events:none}
.suggestion-form{display:grid;gap:12px;max-width:680px;margin:auto}.suggestion-form h2{margin:.25em 0}.suggestion-form>input{width:100%;padding:13px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}.suggestion-options{display:grid;max-height:260px;overflow:auto;padding:6px;border:1px solid var(--line);border-radius:12px}.suggestion-options button{padding:12px;border:0;border-radius:8px;text-align:left;background:transparent}.suggestion-options button[aria-selected="true"]{color:var(--paper);background:var(--ink)}.suggestion-form output{padding:12px;border-left:4px solid var(--accent)}.workflow-guide{display:grid;grid-template-columns:190px minmax(0,1fr);grid-template-areas:"rail core" "rail evidence";gap:14px 18px}.guide-rail{grid-area:rail;display:grid;align-content:start;gap:15px;padding:18px;border-right:1px solid var(--line)}.guide-rail ol{display:grid;gap:8px;padding:0;margin:0;list-style:none}.guide-rail li{display:grid;grid-template-columns:30px 1fr;gap:8px;align-items:center;padding:9px;opacity:.5}.guide-rail li[aria-current="step"]{opacity:1;color:var(--paper);background:var(--ink)}.guide-rail li.is-complete{opacity:1;color:var(--accent)}.guide-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.guide-actions .action{padding-inline:8px}#workflowGuideProgress{height:6px;background:var(--line)}#workflowGuideProgress i{display:block;width:0;height:100%;background:var(--accent)}.guide-core{grid-area:core;min-width:0;padding:16px;border:1px solid var(--line)}.guide-core>p{margin:0 0 14px;padding:10px;border-left:4px solid var(--accent);background:color-mix(in srgb,var(--secondary) 12%,transparent)}.guide-core[data-guide-step="1"]{border-radius:28px}.guide-core[data-guide-step="2"]{box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--accent) 35%,transparent)}.guide-evidence{grid-area:evidence;display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:start}.guide-evidence details,.guide-evidence form{padding:12px;border:1px solid var(--line)}.guide-evidence label{display:grid;gap:7px}.guide-evidence textarea{width:100%;padding:9px;border:1px solid var(--line);background:var(--paper)}@media(max-width:900px){.workflow-guide{grid-template-columns:1fr;grid-template-areas:"core" "rail" "evidence"}.guide-rail{border-right:0;border-bottom:1px solid var(--line)}.guide-rail ol{grid-template-columns:repeat(3,1fr)}.guide-evidence{grid-template-columns:1fr}}.evidence-shell{--evidence-zoom:100;display:grid;gap:18px;padding:clamp(16px,4vw,26px);border:1px solid var(--line);border-radius:30px;background:linear-gradient(180deg,color-mix(in srgb,var(--secondary) 8%,transparent),color-mix(in srgb,var(--paper) 94%,transparent));box-shadow:var(--shadow)}.evidence-head{display:flex;justify-content:space-between;gap:18px;align-items:end}.evidence-head h2{margin:.2em 0}.evidence-tools{display:grid;gap:10px;justify-items:end}.evidence-tools output{padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:var(--paper);font-weight:900}.evidence-body{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(230px,.55fr);gap:16px}.evidence-stage{display:grid;gap:12px;min-width:0}.evidence-ribbon{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.evidence-ribbon button{display:grid;gap:6px;min-height:110px;padding:14px;border:1px solid var(--line);border-radius:18px;background:var(--paper);text-align:left}.evidence-ribbon button[aria-pressed="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent) 35%,transparent)}.evidence-ribbon span{font:800 11px/1 ui-monospace,monospace;letter-spacing:.14em}.evidence-ribbon small{opacity:.72;line-height:1.5}.evidence-core-shell{min-width:0;padding:clamp(12px,3vw,20px);overflow:auto;border:1px solid var(--line);border-radius:24px;background:color-mix(in srgb,var(--paper) 92%,transparent)}.evidence-core-shell>*{display:block;width:calc(10000%/var(--evidence-zoom));max-width:none;transform:scale(calc(var(--evidence-zoom)/100));transform-origin:top left}.evidence-rail{display:grid;align-content:start;gap:14px;padding:18px;border-radius:22px;color:var(--paper);background:var(--ink)}.evidence-rail label{display:grid;gap:8px}.evidence-rail input,.evidence-rail select{width:100%;padding:10px;border:1px solid #ffffff2e;border-radius:10px;color:inherit;background:#ffffff12}.evidence-checklist,.evidence-log{display:grid;gap:8px;padding-left:18px;margin:0}.evidence-checklist li.is-active{color:var(--secondary);font-weight:900}.evidence-checklist li.is-done{color:var(--accent);font-weight:900}.evidence-log li{line-height:1.55}.evidence-shell[data-board-mode="proof"] .evidence-core-shell{outline:4px solid color-mix(in srgb,var(--accent) 32%,transparent);outline-offset:2px}.evidence-shell[data-board-mode="handoff"] .evidence-rail{background:color-mix(in srgb,var(--ink) 82%,#0a1512)}@media(max-width:920px){.evidence-body{grid-template-columns:1fr}.evidence-ribbon{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.evidence-head{align-items:stretch;flex-direction:column}.evidence-tools{justify-items:start}.evidence-ribbon{grid-template-columns:1fr}.evidence-core-shell>*{width:100%;transform:none}}
</style>
</head>
<body data-aesthetic="terminal" data-composition="studio">
<main class="page">
<header class="mast"><div><span class="eyebrow">terminal / saisie de suggestions locales / INTERMEDIATE</span><h1>Saisie de suggestions locales du poste de contrôle du réexamen de fin de service</h1><p class="intro">Dans un scénario de poste de contrôle du réexamen de fin de service, réaliser une saisie de suggestions locales : contenu réel, contrôles actionnables, retour d’état clair et mise en page adaptée à toutes les tailles.</p></div><span class="scenario">Console de révision des équipes</span></header>
<div class="composition-studio"><div class="studio-ruler" aria-hidden="true"></div><section class="demo" aria-label="zone d’interaction de saisie avec suggestions locales pour le poste de relecture des équipes"><section id="evidenceShell" class="evidence-shell" data-board-mode="scan"><header class="evidence-head"><div><span class="eyebrow">Poste de revue des équipes / EVIDENCE BOARD</span><h2>Panneau d’observation des saisies avec suggestions locales</h2><p>Placer le cas principal dans le tableau de preuves, avec des cartes d’observation distinctes, des journaux et des changements de mode pour consigner le résultat actuel.</p></div><div class="evidence-tools"><div class="row"><button class="action primary" type="button" data-board-mode="scan">Scanner</button><button class="action" type="button" data-board-mode="proof">Vérification</button><button class="action" type="button" data-board-mode="handoff">Transfert</button></div><output id="evidenceStatus">En attente d’échantillonnage</output></div></header><div class="evidence-body"><section class="evidence-stage"><div class="evidence-ribbon"><button type="button" data-evidence-card="0" aria-pressed="true"><span>01</span><strong>Journal du poste de contrôle des équipes</strong><small>Vérifier si les changements d’état sont visibles</small></button><button type="button" data-evidence-card="1" aria-pressed="false"><span>02</span><strong>Collaboration du poste de revue des rotations</strong><small>Confirmer la cohérence entre l’entrée au clavier et le clic</small></button><button type="button" data-evidence-card="2" aria-pressed="false"><span>03</span><strong>Progression du bureau de révision des équipes</strong><small>Vérifiez si la disposition se replie sur les écrans étroits</small></button><button type="button" data-evidence-card="3" aria-pressed="false"><span>04</span><strong>Rappel du poste de contrôle des relances de garde</strong><small>Enregistrer la conclusion de la révision en cours</small></button></div><div id="evidenceCoreShell" class="evidence-core-shell"><div class="workflow-guide"><nav class="guide-rail" aria-label="Guide du poste de relecture en rotation"><span class="eyebrow">Poste de vérification de relève GUIDE</span><ol><li data-workflow-guide-step="0" aria-current="step"><b>1</b><span>Données de base du poste de révision par roulement</span></li><li data-workflow-guide-step="1"><b>2</b><span>Compléments pour la station de révision des équipes de rotation</span></li><li data-workflow-guide-step="2"><b>3</b><span>Confirmation finale du poste de révision</span></li></ol><div class="guide-actions"><button id="workflowGuideBack" class="action" type="button" disabled>Étape précédente</button><button id="workflowGuideNext" class="action primary" type="button">Terminer cette étape</button></div><div id="workflowGuideProgress" role="progressbar" aria-label="Taux d’achèvement du tableau de révision des équipes" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"><i></i></div></nav><section id="workflowCore" class="workflow-core guide-core" data-guide-step="0" aria-describedby="workflowGuideInstruction"><p id="workflowGuideInstruction">Veuillez effectuer les opérations liées aux « informations de base du poste de vérification des rotations » dans le cas principal.</p><!-- 11DZ_CORE_START:forms-input-local-suggestions --><div class="suggestion-form panel"><span class="eyebrow">LOCAL COMBOBOX</span><h2>Recherche rapide du poste de relecture de rotation</h2><label for="suggestionInput">Nom du projet</label><input id="suggestionInput" type="text" role="combobox" aria-autocomplete="list" aria-expanded="false" aria-controls="suggestionOptions" autocomplete="off" placeholder="Saisissez un mot-clé"><div id="suggestionOptions" class="suggestion-options" role="listbox" aria-label="Suggestions locales"><button type="button" role="option" aria-selected="true" tabindex="0" data-core-bridge="forms-input-local-suggestions">Journal du poste de contrôle des équipes</button><button type="button" role="option" aria-selected="false" tabindex="-1">Collaboration du poste de revue des rotations</button><button type="button" role="option" aria-selected="false" tabindex="-1">Progression du bureau de révision des équipes</button><button type="button" role="option" aria-selected="false" tabindex="-1">Rappel du poste de contrôle des relances de garde</button><button type="button" role="option" aria-selected="false" tabindex="-1">Collection du poste de vérification du relais</button><button type="button" role="option" aria-selected="false" tabindex="-1">Vue d’ensemble du poste de vérification des équipes</button><button type="button" role="option" aria-selected="false" tabindex="-1">Plan du poste de révision de poste</button></div><output id="suggestionChoice">Non sélectionné</output></div><!-- 11DZ_CORE_END --></section><aside class="guide-evidence"><details id="workflowGuideDetails"><summary>Voir les exigences d’acceptation</summary><ul><li>Le panneau de révision par équipe nécessite un changement d’état visible en une seule fois des données de base</li><li>Le poste de révision des quarts nécessite un changement d’état visible en une seule fois pour les informations complémentaires.</li><li>La confirmation finale du poste de révision de rotation nécessite un changement d’état visible</li></ul></details><form id="workflowGuideEvidenceForm"><label>Preuve de cette étape<textarea id="workflowGuideEvidence" rows="3" placeholder="Enregistrer l’état observé"></textarea></label><input class="action" type="submit" value="Enregistrer la preuve"></form><output id="workflowGuideSummary">0 / 3 étapes terminées</output></aside></div></div></section><aside class="evidence-rail"><label>Zoom du canevas<input id="evidenceZoom" type="range" min="88" max="128" value="100"><output id="evidenceZoomValue">100%</output></label><label>Prélèvement actuel<select id="evidenceStep"><option value="0">Journal du poste de contrôle des équipes</option><option value="1">Collaboration du poste de revue des rotations</option><option value="2">Progression du bureau de révision des équipes</option><option value="3">Rappel du poste de contrôle des relances de garde</option></select></label><ul id="evidenceChecklist" class="evidence-checklist"><li>Journal du poste de contrôle des équipes</li><li>Collaboration du poste de revue des rotations</li><li>Progression du bureau de révision des équipes</li><li>Rappel du poste de contrôle des relances de garde</li></ul><button id="evidenceCapture" class="action primary" type="button">preuve d’écriture</button><ol id="evidenceLog" class="evidence-log"><li>Preuve non encore enregistrée</li></ol></aside></div></section><p id="status" class="status" role="status" aria-live="polite"></p></section></div>
</main>
<script>
'use strict';
const statusOutput = document.querySelector('#status');
const announce = message => { statusOutput.textContent = message; };
/* 11DZ_CORE_SCRIPT_START:forms-input-local-suggestions */
const suggestionInput=document.querySelector('#suggestionInput');const suggestionButtons=[...document.querySelectorAll('#suggestionOptions [role="option"]')];let suggestionIndex=0;function selectSuggestion(index,focus=false){const visible=suggestionButtons.filter(button=>!button.hidden);if(!visible.length)return;suggestionIndex=(index+visible.length)%visible.length;const target=visible[suggestionIndex];suggestionButtons.forEach(button=>{const selected=button===target;button.setAttribute('aria-selected',String(selected));button.tabIndex=selected?0:-1;});if(focus)target.focus();}function filterSuggestions(){const query=suggestionInput.value.normalize('NFKC').trim().toLowerCase();let count=0;suggestionButtons.forEach(button=>{const searchable=button.textContent.normalize('NFKC').toLowerCase();button.hidden=Boolean(query&&!searchable.includes(query));if(!button.hidden)count+=1;});suggestionInput.setAttribute('aria-expanded',String(count>0));suggestionIndex=0;selectSuggestion(0);announce('Suggestions locales '+count+' élément');}function chooseSuggestion(button){suggestionInput.value=button.textContent;document.querySelector('#suggestionChoice').textContent='Sélectionné '+button.textContent;suggestionInput.setAttribute('aria-expanded','false');announce('Sélectionné '+button.textContent);}suggestionButtons.forEach(button=>button.addEventListener('click',()=>chooseSuggestion(button)));suggestionInput.addEventListener('input',filterSuggestions);suggestionInput.addEventListener('keydown',event=>{if(!['ArrowDown','ArrowUp','Enter'].includes(event.key))return;event.preventDefault();if(event.key==='Enter'){const visible=suggestionButtons.filter(button=>!button.hidden);if(visible[suggestionIndex])chooseSuggestion(visible[suggestionIndex]);return;}selectSuggestion(suggestionIndex+(event.key==='ArrowDown'?1:-1));});filterSuggestions();
/* 11DZ_CORE_SCRIPT_END */
const workflowBridgeSpec={"name":"forms-input-local-suggestions","selector":"[data-core-bridge=\"forms-input-local-suggestions\"]","mode":"click","key":"Enter"};const workflowBridgeCore=document.querySelector('#workflowCore');const workflowBridgeControl=workflowBridgeCore.querySelector(workflowBridgeSpec.selector);if(!workflowBridgeControl)throw new Error('Missing core bridge: '+workflowBridgeSpec.name);const workflowBridgeControlledId=workflowBridgeControl.getAttribute('aria-controls');const workflowBridgeControlled=workflowBridgeControlledId?document.getElementById(workflowBridgeControlledId):null;workflowBridgeCore.dataset.workflowBridge=workflowBridgeSpec.name;workflowBridgeCore.dataset.workflowVersion='0';function workflowBridgeSerialize(){const visualNode=workflowBridgeCore.firstElementChild||workflowBridgeCore;const visual=getComputedStyle(visualNode);const outputs=[...workflowBridgeCore.querySelectorAll('output,[role="status"],[aria-live],meter,progress')].map(node=>node.textContent.trim()+'|'+node.getAttribute('aria-valuenow')+'|'+node.getAttribute('value'));const canvas=[...workflowBridgeCore.querySelectorAll('canvas')].map(node=>{try{return node.toDataURL().slice(-160);}catch{return 'canvas-unavailable';}});return JSON.stringify({html:workflowBridgeCore.innerHTML,status:statusOutput.textContent,outputs,canvas,visual:[visual.display,visual.visibility,visual.opacity,visual.transform,visual.filter,visual.backgroundColor,visual.width,visual.height],scroll:workflowBridgeSpec.mode==='scroll'?workflowBridgeControl.scrollTop:null});}let workflowBridgeLastEffect=workflowBridgeSerialize();function workflowBridgeSummary(){const label=(workflowBridgeControl.getAttribute('aria-label')||workflowBridgeControl.textContent||workflowBridgeControl.value||workflowBridgeSpec.name).trim().replace(/\s+/g,' ').slice(0,72);return label+' · Version de base '+workflowBridgeCore.dataset.workflowVersion;}function workflowBridgeCommit(){const effect=workflowBridgeSerialize();if(effect===workflowBridgeLastEffect)return {changed:false,summary:workflowBridgeSummary()};workflowBridgeLastEffect=effect;workflowBridgeCore.dataset.workflowVersion=String(Number(workflowBridgeCore.dataset.workflowVersion||0)+1);return {changed:true,summary:workflowBridgeSummary()};}function workflowBridgeScheduleCommit(){queueMicrotask(workflowBridgeCommit);setTimeout(workflowBridgeCommit,0);}workflowBridgeControl.addEventListener("click",workflowBridgeScheduleCommit);const workflowBridgeStateTargets=new Set(workflowBridgeCore.querySelectorAll('dialog'));if(workflowBridgeControlled&&workflowBridgeCore.contains(workflowBridgeControlled))workflowBridgeStateTargets.add(workflowBridgeControlled);workflowBridgeStateTargets.forEach(target=>['close','cancel','toggle'].forEach(eventName=>target.addEventListener(eventName,workflowBridgeScheduleCommit)));function workflowBridgeActivate(){workflowBridgeControl.focus();workflowBridgeControl.click();const result=workflowBridgeCommit();setTimeout(workflowBridgeCommit,0);return result;}function workflowBridgeReset(){workflowBridgeCore.dataset.workflowVersion='0';workflowBridgeLastEffect=workflowBridgeSerialize();}
const workflowGuideCore=document.querySelector('#workflowCore');const workflowGuideStages=["Données de base du poste de révision par roulement","Compléments pour la station de révision des équipes de rotation","Confirmation finale du poste de révision"];const workflowGuideState={step:0,completed:new Set(),evidence:new Map(),consumedVersion:0};function workflowGuideDrive(){const step=workflowGuideState.step;workflowGuideCore.dataset.guideStep=String(step);document.querySelector('#workflowGuideInstruction').textContent='Veuillez terminer «'+workflowGuideStages[step]+'Opérations associées à « ».';document.querySelectorAll('[data-workflow-guide-step]').forEach((item,index)=>{item.classList.toggle('is-complete',workflowGuideState.completed.has(index));if(index===step)item.setAttribute('aria-current','step');else item.removeAttribute('aria-current');});document.querySelector('#workflowGuideBack').disabled=step===0;document.querySelector('#workflowGuideNext').textContent=step===workflowGuideStages.length-1?'Confirmer l’envoi':'Terminer cette étape';const percent=Math.round(workflowGuideState.completed.size/workflowGuideStages.length*100);const progress=document.querySelector('#workflowGuideProgress');progress.setAttribute('aria-valuenow',String(percent));progress.querySelector('i').style.width=percent+'%';document.querySelector('#workflowGuideSummary').textContent=workflowGuideState.completed.size+' / '+workflowGuideStages.length+' Étapes complétées · '+workflowBridgeSummary();announce('Étape actuelle du poste de relecture de rotation :'+workflowGuideStages[step]);}function workflowGuideAdvance(direction){if(direction>0){const bridge=workflowBridgeActivate();const version=Number(workflowGuideCore.dataset.workflowVersion||0);if(version<=workflowGuideState.consumedVersion){announce('Veuillez d’abord effectuer la modification d’état visible du cas principal');return;}workflowGuideState.consumedVersion=version;workflowGuideState.completed.add(workflowGuideState.step);announce('Variation du cas principal enregistrée · '+bridge.summary);}workflowGuideState.step=Math.max(0,Math.min(workflowGuideStages.length-1,workflowGuideState.step+direction));workflowGuideDrive();}document.querySelector('#workflowGuideBack').addEventListener('click',()=>workflowGuideAdvance(-1));document.querySelector('#workflowGuideNext').addEventListener('click',()=>workflowGuideAdvance(1));document.querySelector('#workflowGuideEvidenceForm').addEventListener('submit',event=>{event.preventDefault();const version=Number(workflowGuideCore.dataset.workflowVersion||0);if(version<=workflowGuideState.consumedVersion){announce('La preuve n’a pas été enregistrée : le cas principal n’a encore subi aucun changement nouveau');return;}const text=document.querySelector('#workflowGuideEvidence').value.trim();workflowGuideState.evidence.set(workflowGuideState.step,text||'Vérification de l’état visible terminée');workflowGuideState.completed.add(workflowGuideState.step);workflowGuideState.consumedVersion=version;workflowGuideDrive();announce('Les preuves de cette étape ont été enregistrées · '+workflowBridgeSummary());});document.querySelector('#workflowGuideDetails').addEventListener('toggle',event=>announce(event.currentTarget.open?'Exigences d’acceptation développées':'Exigences d’acceptation repliées'));workflowGuideDrive();
workflowBridgeReset();
const evidenceShell=document.querySelector('#evidenceShell');const evidenceStatus=document.querySelector('#evidenceStatus');const evidenceZoom=document.querySelector('#evidenceZoom');const evidenceZoomValue=document.querySelector('#evidenceZoomValue');const evidenceStep=document.querySelector('#evidenceStep');const evidenceChecklistItems=[...document.querySelectorAll('#evidenceChecklist li')];const evidenceCards=[...document.querySelectorAll('[data-evidence-card]')];const evidenceLog=document.querySelector('#evidenceLog');const evidenceModeButtons=[...evidenceShell.querySelectorAll('button[data-board-mode]')];const evidenceNotes=["Journal du poste de contrôle des équipes","Collaboration du poste de revue des rotations","Progression du bureau de révision des équipes","Rappel du poste de contrôle des relances de garde"];const evidenceCore=document.querySelector('#workflowCore');let evidenceCaptures=0;function evidenceSetCard(index){evidenceCards.forEach((card,cardIndex)=>{const active=cardIndex===index;card.setAttribute('aria-pressed',String(active));});evidenceChecklistItems.forEach((item,itemIndex)=>{item.classList.toggle('is-active',itemIndex===index);item.classList.toggle('is-done',itemIndex<evidenceCaptures);});}function evidenceRender(reason){const version=evidenceCore?.dataset.workflowVersion||'0';const zoom=Number(evidenceZoom.value);const active=Math.min(evidenceNotes.length-1,Number(evidenceStep.value)||0);evidenceShell.style.setProperty('--evidence-zoom',String(zoom));evidenceZoomValue.textContent=zoom+'%';evidenceSetCard(active);evidenceStatus.textContent=reason+' · Version de base '+version;}evidenceModeButtons.forEach(button=>button.addEventListener('click',()=>{evidenceModeButtons.forEach(item=>item.classList.toggle('primary',item===button));evidenceShell.dataset.boardMode=button.dataset.boardMode;evidenceRender('Basculé vers'+button.textContent);announce('Mode preuve :'+button.textContent);}));evidenceCards.forEach((card,index)=>card.addEventListener('click',()=>{evidenceStep.value=String(index);evidenceRender('Carte d’observation basculée');announce('Carte d’observation :'+evidenceNotes[index]);}));evidenceZoom.addEventListener('input',()=>{evidenceRender('Le zoom du canevas a été mis à jour');announce('Observation de l’échelle '+evidenceZoom.value+'%');});evidenceStep.addEventListener('change',()=>{const index=Number(evidenceStep.value)||0;evidenceRender('Échantillonnage activé');announce('Échantillon actuel :'+evidenceNotes[index]);});document.querySelector('#evidenceCapture').addEventListener('click',()=>{const index=Math.min(evidenceNotes.length-1,Number(evidenceStep.value)||0);const note=evidenceNotes[index];const version=evidenceCore?.dataset.workflowVersion||'0';evidenceCaptures+=1;const item=document.createElement('li');item.textContent='preuve '+evidenceCaptures+' · '+note+' · Version de base '+version;const empty=evidenceLog.querySelector('li')?.textContent==='Preuve non encore enregistrée';if(empty)evidenceLog.replaceChildren(item);else evidenceLog.prepend(item);while(evidenceLog.children.length>6)evidenceLog.lastElementChild.remove();evidenceRender('Preuve enregistrée '+evidenceCaptures);announce('Preuve enregistrée '+evidenceCaptures+' · '+note);});evidenceCore?.addEventListener('focusin',()=>evidenceRender('L’élément principal a le focus'));evidenceCore?.addEventListener('click',()=>evidenceRender('Interaction de l’exemple principal'));evidenceRender('En attente d’échantillonnage');
</script>
</body>
</html>