- viewMesActivites : data-table avec thumbnail colorée, badge statut toggle - viewUneActivite : tabs GMS connectés, data-table pour l'onglet Classes, metric-cards sur Résultats - viewSuiviEleves : 3 metric-cards + accordion avec data-table intérieur - Nav tabs GMS branchés sur les 3 routes (accueil, mes-activites, suivi-eleves) - CSS : règles route-* étendues à mes-activites, une-activite, suivi-eleves pour masquer l'ancienne sidebar - CLAUDE.md : proto.html est une référence à lire avant d'implémenter, ne jamais modifier Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
50 lines
2.5 KiB
JavaScript
50 lines
2.5 KiB
JavaScript
// ===================== SIDEBAR & ROUTER =====================
|
|
function renderSidebar(){
|
|
const items=[
|
|
{id:'mes-classes',icon:'🏫',label:'Mes classes'},
|
|
{id:'mes-activites',icon:'📋',label:'Mes modules'},
|
|
{id:'suivi-eleves',icon:'📊',label:'Suivi des élèves'},
|
|
];
|
|
const r=S.route;
|
|
document.getElementById('sbNav').innerHTML=items.map(i=>{
|
|
const active=(i.id==='mes-classes'&&(r==='mes-classes'||r==='une-classe'))
|
|
||(i.id==='mes-activites'&&(r==='mes-activites'||r==='une-activite'||r==='creer-activite'))
|
|
||(i.id===r);
|
|
return`<div class="sb-item${active?' active':''}" onclick="S.navigate('${i.id}',{year:S.params.year});closeSb()"><span class="ico">${i.icon}</span>${i.label}</div>`;
|
|
}).join('');
|
|
renderYearSelector();
|
|
}
|
|
function renderBackButton(){
|
|
const prev=S.history[S.history.length-1];
|
|
const bc=document.getElementById('breadcrumb');
|
|
if(!prev){bc.innerHTML='';return;}
|
|
const routeLabels={'accueil':'Accueil','mes-classes':'Mes classes','mes-activites':'Mes modules',
|
|
'suivi-eleves':'Suivi des élèves','creer-activite':'Modifier le module'};
|
|
let label=routeLabels[prev.route]||prev.route;
|
|
if(prev.route==='une-classe'&&prev.params?.classId){const c=cls(prev.params.classId);if(c)label=c.name;}
|
|
if(prev.route==='une-activite'&&prev.params?.activityId){const a=act(prev.params.activityId);if(a)label=a.name;}
|
|
bc.innerHTML=`<button class="back-btn" onclick="S.back()">← ${label}</button>`;
|
|
}
|
|
|
|
function render(){
|
|
const {route,params}=S;
|
|
document.body.className=document.body.className
|
|
.replace(/\broute-\S+/g,'').trim();
|
|
document.body.classList.add('route-'+route);
|
|
renderSidebar();renderBackButton();
|
|
const page=document.getElementById('pageContent');
|
|
if(route==='accueil')page.innerHTML=viewAccueil();
|
|
else if(route==='mes-classes')page.innerHTML=viewMesClasses();
|
|
else if(route==='une-classe')page.innerHTML=viewUneClasse(params);
|
|
else if(route==='mes-activites')page.innerHTML=viewMesActivites();
|
|
else if(route==='creer-activite')page.innerHTML=viewCreerActivite(params);
|
|
else if(route==='une-activite')page.innerHTML=viewUneActivite(params);
|
|
else if(route==='suivi-eleves')page.innerHTML=viewSuiviEleves(params);
|
|
else if(route==='acces-libre')page.innerHTML=viewAccesLibre(params);
|
|
else if(route==='tableau-de-bord')page.innerHTML=viewTableauDeBord(params);
|
|
window.scrollTo(0,0);
|
|
if(route==='creer-activite')initDragDrop();
|
|
if(route==='une-classe'||route==='suivi-eleves'||route==='une-activite')setTimeout(initStudentNames,0);
|
|
}
|
|
|
|
render();
|