©(à compléter par vos références MCF + tarifs) ———-
// Tarifs fournis :
// – Tous (par défaut/CLOE/English 360/Management): 20h=1560, 30h=2220, 40h=2880, 50h=ND, 60h=4200
// – TOEIC: 20h=1620, 30h=2280, 40h=2940, 50h=3600, 60h=4260
// –
LEVELTEL & BRIGHT: 15h=1260, 30h=ND, 45h=3210, 60h=ND
const PRICING = {
DEFAULT: { // Ex. CLOE, English 360, Management
20: 1560,
30: 2220,
40: 2880,
50: null, // prix non fourni
60: 4200
},
TOEIC: {
20: 1620,
30: 2280,
40: 2940,
50: 3600,
60: 4260
},
LEVELTEL: {
15: 1260,
30: null, // prix non fourni
45: 3210,
60: null // prix non fourni
},
BRIGHT: {
15: 1260,
30: null, // prix non fourni
45: 3210,
60: null // prix non fourni
}
};
const PROGRAMS = [
{ cat: ‘Anglais’, test: ‘TOEIC’, base: ‘TOEIC’, hours: [20,30,40,50,60], villes:[‘Paris’,’Marseille’,’Lyon’] },
{ cat: ‘Anglais’, test: ‘CLOE’, base: ‘DEFAULT’, hours: [20,30,40,50,60], villes:[‘Paris’,’Marseille’,’Lyon’] },
{ cat: ‘Anglais’, test: ‘Bright’, base: ‘BRIGHT’, hours: [15,30,45,60], villes:[‘Paris’,’Lille’] },
{ cat: ‘Anglais’, test: ‘LEVELTEL’, base: ‘LEVELTEL’, hours: [15,30,45,60], villes:[‘Lyon’,’Bordeaux’] },
{ cat: ‘Anglais’, test: ‘English 360’, base: ‘DEFAULT’, hours: [20,30,40,60], villes:[‘A distance’,’Marseille’] },
{ cat: ‘Management / RH’, test: », base: ‘DEFAULT’, hours: [20,30,40,50,60], villes:[‘Paris’,’Lyon’,’Marseille’] }
];
function makeTitle(cat, test, h){
if(cat === ‘Anglais’){
const t = test ? ` – ${h}h + Test ${test}` : ` – ${h}h`;
return `Anglais${t}`;
}
if(cat === ‘Management / RH’){
return `Management / RH – ${h}h`;
}
return `${cat} – ${h}h`;
}
function formatPrice(p){
if(p == null) return ‘À demander’;
try {return new Intl.NumberFormat(‘fr-FR’,{style:’currency’,currency:’EUR’}).format(p);} catch(e){return `${p} €`}
}
const formations = PROGRAMS.flatMap(p => p.hours.map(h => {
const priceTable = PRICING[p.base] || {};
const price = priceTable[h] ?? null;
return {
id: `${p.cat.substring(0,3).toUpperCase()}-${(p.test||’GEN’).replace(/\s+/g, »).toUpperCase()}-${h}`,
cat: p.cat,
titre: makeTitle(p.cat, p.test, h),
tests: p.test ? [p.test] : [],
villes: p.villes,
prix: price,
duree: `${h}h`,
mcf: ‘https://www.moncompteformation.gouv.fr/…/A_COMPLETER’,
mots: [p.test?.toLowerCase()|| », `${h}h`]
};
}));
// ———- RENDERING ———-
const grids = {
« Anglais »: document.getElementById(‘grid-anglais’),
« Management / RH »: document.getElementById(‘grid-management’)
};
function fmtPrice(eur){return new Intl.NumberFormat(‘fr-FR’,{style:’currency’,currency:’EUR’}).format(eur)}
function card(f){
const tests = f.tests?.length ? `
${f.tests.map(t=>`${t}`).join( »)}
` : »;
const cities = f.villes.join(‘, ‘);
const utm = ‘?utm_source=site&utm_medium=cta&utm_campaign=cpf-catalogue’;
return `
${f.titre}
${tests}
📍 ${cities}
⏱️ ${f.duree}
${fmtPrice(f.prix)}
`
}
function render(list){
Object.values(grids).forEach(g=>g.innerHTML= »);
list.forEach(f=>{ grids[f.cat].insertAdjacentHTML(‘beforeend’, card(f)); });
}
// initial render
render(formations);
// filters
const citySel = document.getElementById(‘city’);
const qSel = document.getElementById(‘q’);
const catSel = document.getElementById(‘category’);
function applyFilters(){
const city = citySel.value;
const q = qSel.value.trim().toLowerCase();
const cat = catSel.value;
const filtered = formations.filter(f=>{
const okCity = !city || f.villes.includes(city);
const okCat = !cat || f.cat === cat;
const okQ = !q || (f.titre.toLowerCase().includes(q) || (f.tests||[]).join(‘ ‘).toLowerCase().includes(q) || (f.mots||[]).join(‘ ‘).toLowerCase().includes(q));
return okCity && okCat && okQ;
});
render(filtered);
}
citySel.addEventListener(‘change’, applyFilters);
qSel.addEventListener(‘input’, applyFilters);
catSel.addEventListener(‘change’, applyFilters);
// city quick pills
document.querySelectorAll(‘.city-pill’).forEach(p=>{
p.addEventListener(‘click’, e=>{e.preventDefault(); citySel.value = p.dataset.city; applyFilters(); document.getElementById(‘catalogue’)?.scrollIntoView({behavior:’smooth’});});
});
// anchor target
const year = document.getElementById(‘year’);
year.textContent = new Date().getFullYear();
