https://vipcrossing.com/dev/front/js/mondial2026-groupes.js?v=3

1(function(){
2  function e(v){
3    return String(v||'')
4      .replace(/&/g,'&')
5      .replace(/</g,'&lt;')
6      .replace(/>/g,'&gt;')
7      .replace(/"/g,'&quot;')
8      .replace(/'/g,'&#039;');
9  }
10
11  function renderGroups(c,d){
12    var h = '<div class="vpx-wc2026-groups" data-vpx-sort="1">';
13
14    h += '<div class="vpx-wc2026-header">';
15    h += '<div class="vpx-wc2026-subtitle">'+e(d.subtitle||'48 équipes • 12 groupes')+'</div>';
16
17    if (d.collectionButton && d.collectionButton.url) {
18      h += '<div class="vpx-wc2026-collection-btn-wrap">';
19      h += '<a class="vpx-wc2026-collection-btn" href="'+e(d.collectionButton.url)+'" target="_blank" rel="noopener">';
20      h += e(d.collectionButton.label || 'La collection du Mondial');
21      h += '</a></div>';
22    }
23
24    h += '</div><div class="vpx-wc2026-grid">';
25
26    d.groups.forEach(function(g){
27      h += '<div class="vpx-wc2026-card">';
28      h += '<div class="vpx-wc2026-card-title '+e(g.className)+'">'+e(g.label)+'</div>';
29      h += '<div class="vpx-wc2026-teams">';
30
31      g.teams.slice()
32        .sort(function(a,b){ return (parseInt(b.points,10)||0) - (parseInt(a.points,10)||0); })
33        .forEach(function(t){
34          var p = parseInt(t.points,10) || 0;
35          h += '<a class="vpx-wc2026-team" href="'+e(t.link||'#')+'" target="_blank" rel="noopener" data-points="'+p+'">';
36          h += '<span class="vpx-wc2026-flag"><img src="'+e(t.flag)+'" alt="Drapeau '+e(t.name)+'"></span>';
37          h += '<span class="vpx-wc2026-name">'+e(t.name)+'</span>';
38          h += '<span class="vpx-wc2026-points">'+p+(p>1?' pts':' pt')+'</span>';
39          h += '</a>';
40        });
41
42      h += '</div></div>';
43    });
44
45    h += '</div></div>';
46    c.innerHTML = h;
47  }
48
49  function renderKnockout(container, data){
50    if (!data.knockout) {
51      container.innerHTML = '<p>Tableau des éliminations non disponible.</p>';
52      return;
53    }
54
55    var flags = {};
56    data.groups.forEach(function(group){
57      group.teams.forEach(function(team){
58        flags[team.name] = team.flag;
59      });
60    });
61
62    var html = '';
63    html += '<div class="vpx-ko-title">' + e(data.knockout.title) + '</div>';
64    html += '<div class="vpx-ko-bracket">';
65
66    data.knockout.rounds.forEach(function(round){
67      html += '<div class="vpx-ko-round">';
68      html += '<div class="vpx-ko-round-title">' + e(round.name) + '</div>';
69
70      round.matches.forEach(function(match){
71        html += '<div class="vpx-ko-match">';
72        html += renderTeam(match.team1, match.winner, flags);
73        html += renderTeam(match.team2, match.winner, flags);
74        html += '</div>';
75      });
76
77      html += '</div>';
78    });
79
80    html += '</div>';
81    container.innerHTML = html;
82  }
83
84  function renderTeam(name, winner, flags){
85    var isWinner = winner && winner === name;
86    var flag = flags[name] || '';
87    var placeholder =
88      name.indexOf('Vainqueur') === 0 ||
89      name.indexOf('3e') === 0 ||
90      name.indexOf('2e') === 0 ||
91      name.indexOf('1er') === 0 ||
92      name.indexOf('Finaliste') === 0;
93
94    return '' +
95      '<div class="vpx-ko-team ' + (isWinner ? 'winner' : '') + (placeholder ? ' vpx-ko-placeholder' : '') + '">' +
96        (flag ? '<img class="vpx-ko-flag" src="' + e(flag) + '" alt="">' : '') +
97        '<span>' + e(name) + '</span>' +
98      '</div>';
99  }
100
101  function load(){
102    var groupContainers = document.querySelectorAll('.vpx-wc2026-groups-auto');
103    var knockoutContainers = document.querySelectorAll('.vpx-worldcup-knockout');
104
105    if(!groupContainers.length && !knockoutContainers.length) return;
106
107    fetch('/assets/data/mondial2026-groupes.json?v=' + Date.now())
108      .then(function(r){ return r.json(); })
109      .then(function(d){
110        groupContainers.forEach(function(c){
111          renderGroups(c,d);
112        });
113
114        knockoutContainers.forEach(function(c){
115          renderKnockout(c,d);
116        });
117      })
118      .catch(function(err){
119        console.error('Erreur chargement mondial2026-groupes.json', err);
120
121        groupContainers.forEach(function(c){
122          c.innerHTML = '<p>Groupes momentanément indisponibles.</p>';
123        });
124

125        knockoutContainers.forEach(function(c){
126          c.innerHTML = '<p>Tableau des éliminations momentanément indisponible.</p>';
127        });
128      });
129  }
130
131  document.readyState === 'loading'
132    ? document.addEventListener('DOMContentLoaded', load)
133    : load();
134})();