42 lines
2.5 KiB
JavaScript
42 lines
2.5 KiB
JavaScript
/* DONA_V7_CONFIG accordéons : les champs demeurent dans le DOM et leurs événements fonctionnent. */
|
|
(() => {
|
|
'use strict';
|
|
function init(){
|
|
const main=document.getElementById('mainArea');
|
|
if(!main || document.body.dataset.page!=='config') return;
|
|
if(main.dataset.donaAccordions==='ready')return;
|
|
main.dataset.donaAccordions='ready';
|
|
const panels=[...main.querySelectorAll('section.panel')];
|
|
const entries=[];
|
|
panels.forEach((panel,index)=>{
|
|
let head=panel.querySelector(':scope > .panel-title');
|
|
if(!head){
|
|
const label=panel.querySelector('h2')?.textContent?.trim()||'Maintenance';
|
|
head=document.createElement('div');head.className='panel-title';
|
|
const heading=document.createElement('h2');heading.textContent=label;head.append(heading);
|
|
panel.prepend(head);
|
|
}
|
|
const body=document.createElement('div');body.className='dona-accordion-body';body.id='donaConfigBody'+index;
|
|
[...panel.childNodes].filter(node=>node!==head).forEach(node=>body.append(node));
|
|
const toggle=document.createElement('button');toggle.type='button';toggle.className='dona-accordion-toggle';
|
|
toggle.setAttribute('aria-controls',body.id);toggle.setAttribute('aria-expanded','false');
|
|
toggle.setAttribute('aria-label','Déplier la section '+(head.querySelector('h2')?.textContent||''));
|
|
toggle.textContent='⌄';head.append(toggle);panel.append(body);
|
|
panel.classList.add('dona-collapsible');
|
|
const setOpen = open=>{body.hidden=!open;toggle.textContent=open?'⌃':'⌄';toggle.setAttribute('aria-expanded',String(open));};
|
|
setOpen(false);
|
|
toggle.addEventListener('click',e=>{e.stopPropagation();setOpen(body.hidden);});
|
|
head.addEventListener('click',e=>{if(!e.target.closest('button,a,input,select'))setOpen(body.hidden);});
|
|
entries.push(setOpen);
|
|
});
|
|
if(entries.length){
|
|
const tools=document.createElement('div');tools.className='dona-config-tools';
|
|
const open=document.createElement('button');open.type='button';open.textContent='Tout déplier';open.addEventListener('click',()=>entries.forEach(fn=>fn(true)));
|
|
const close=document.createElement('button');close.type='button';close.textContent='Tout replier';close.addEventListener('click',()=>entries.forEach(fn=>fn(false)));
|
|
tools.append(open,close);
|
|
const grid=main.querySelector('.two-col');if(grid)grid.before(tools);else main.prepend(tools);
|
|
}
|
|
}
|
|
if(document.readyState==='loading')document.addEventListener('DOMContentLoaded',init,{once:true});else init();
|
|
})();
|