Calendrier coupe du monde de rugby
Tableau de Rencontresasync function fetchTeams() {
document.getElementById(«
loader »).style.display = « block »;
clearMainContainer();
const response = await fetch(« https://rugby-data-api-255d6a9bb3a5.herokuapp.com/rencontres?type_team=cp2023 »);
const data = await response.json();
const rencontres = data.rencontres;
const poulesOrdre = [‘quarts-de-finale’, ‘demi-finales’, ‘match-pour-la-3e-place’, ‘finale’, ‘A’, ‘B’, ‘C’, ‘D’];
//const poulesOrdre = [‘1’, ‘2’, ‘3’, ‘4’, ‘5’, ‘6’, ‘7’, ‘8’, ‘9’, ’10’];
const poules = […new Set(rencontres.map(r => r.poule))];
const poulesTrie = poules.sort((a, b) => poulesOrdre.indexOf(a) – poulesOrdre.indexOf(b));
document.getElementById(« loader »).style.display = « none »;
poulesTrie.forEach(poule => {
const filteredRencontres = rencontres.filter(r => r.poule === poule);
const journees = […new Set(filteredRencontres.map(r => r.day))];const pouleContainer = document.createElement(« div »);
pouleContainer.className = ‘my-poule-container’;const pouleTitle = document.createElement(« span »);
pouleTitle.innerText = `Poule ${poule}`;
pouleTitle.className = ‘my-poule-title’;const table = document.createElement(« table »);
table.className = ‘my-table’;
pouleContainer.appendChild(table);const titleSelectDiv = document.createElement(« div »);
titleSelectDiv.className = ‘my-title-select-div’;
titleSelectDiv.appendChild(pouleTitle);const journeeSelect = document.createElement(« select »);
journeeSelect.className = ‘my-journee-select’;
journeeSelect.id = `journeeSelect${poule}`;const journeesSorted = journees.sort((a, b) => {
const numberA = parseInt(a.replace(/[^0-9]/g, »));
const numberB = parseInt(b.replace(/[^0-9]/g, »));
return numberA – numberB;
});journeesSorted.forEach(journee => {
const option = document.createElement(« option »);
option.value = journee;
option.innerText = journee;
journeeSelect.appendChild(option);
});titleSelectDiv.appendChild(journeeSelect);
pouleContainer.insertBefore(titleSelectDiv, table);
document.getElementById(« myMainContainer »).appendChild(pouleContainer);const firstJournee = journees.find(journee => {
const rencontresForJournee = filteredRencontres.filter(r => r.day === journee);
const today = new Date();
today.setHours(0, 0, 0, 0); // Réinitialise l’heure à minuit pour une comparaison de jour
return rencontresForJournee.some(r => {
const rencontreDate = new Date(r.date);
rencontreDate.setHours(0, 0, 0, 0);
return rencontreDate.getTime() === today.getTime();
});
});journeeSelect.value = firstJournee || journees[0];
journeeSelect.addEventListener(« change », () => populateTable(poule, journeeSelect.value, filteredRencontres, pouleContainer));
populateTable(poule, journeeSelect.value, filteredRencontres, pouleContainer);
});
}function populateTable(poule, selectedJournee, rencontres, pouleContainer) {
const existingTable = pouleContainer.querySelector(‘.my-table’);
if (existingTable) {
existingTable.remove();
}const table = document.createElement(« table »);
table.className = ‘my-table’;
table.id = ‘table’ + poule;
pouleContainer.appendChild(table);
const filteredRencontres = rencontres.filter(r => r.day === selectedJournee).sort((a, b) => new Date(a.date) – new Date(b.date));
const now = new Date();filteredRencontres.forEach(rencontre => {
const row = table.insertRow();
const cell1 = row.insertCell(0);
const localEmbleme = document.createElement(« img »);
localEmbleme.className = ‘my-embleme’;
localEmbleme.src = `data:image/jpeg;base64 + ${rencontre.local_team.img_base64}`;
cell1.appendChild(localEmbleme);
const localNameText = rencontre.local_team.name;
const localName = document.createElement(« a »);
localName.href = `https://vibrez-rugby.com/live-en-direct/?id=${rencontre.id}`;
localName.className = ‘my-club-link’;
localName.innerText = localNameText;
cell1.appendChild(localName);const cell2 = row.insertCell(1);
cell2.className = ‘my-cell2’;
const rencontreDate = new Date(rencontre.date);
const timeDifference = (rencontreDate – now) / 1000 / 60 / 60; //
const date = new Date(rencontre.date);const dateOptions = {
year: ‘numeric’,
month: ‘long’,
day: ‘numeric’,
timeZone: ‘UTC’
};const timeOptions = {
hour: ‘2-digit’,
minute: ‘2-digit’,
second: ‘2-digit’,
timeZone: ‘UTC’
};const dateDiv = document.createElement(« div »);
dateDiv.className = « my-datetime »;
dateDiv.innerHTML = `
${date.toLocaleDateString(‘fr-FR’, dateOptions)}
${date.toLocaleTimeString(‘fr-FR’, timeOptions)} `;
cell2.appendChild(dateDiv);if (rencontre.etat === ‘endirect’) { // Vérifie le statut de la rencontre
const scoreDiv = document.createElement(« a »);
scoreDiv.className = « my-score-box my-live-text »; // Ajout de la classe my-live-text
const pointsLocal = rencontre.rencontre_resultat_locale.pointsDeMarque;
const pointsVisitor = rencontre.rencontre_resultat_visiteuse.pointsDeMarque;
scoreDiv.innerHTML = `${pointsLocal} – ${pointsVisitor}`;
scoreDiv.href = `https://vibrez-rugby.com/live-en-direct/?id=${rencontre.id}`;
cell2.innerHTML = « »;
const dateOnlyDiv = document.createElement(« div »);
dateOnlyDiv.className = « my-date-only »;
dateOnlyDiv.innerHTML = `${date.toLocaleDateString(‘fr-FR’, dateOptions)}`;
// cell2.appendChild(dateOnlyDiv);
cell2.appendChild(scoreDiv);
}
else if (rencontre.etat === ‘termine’) { // Vérifie le statut de la rencontre
const scoreDiv = document.createElement(« a »);
scoreDiv.className = « my-score-box »; // Score sans classe de couleur
const pointsLocal = rencontre.rencontre_resultat_locale.pointsDeMarque;
const pointsVisitor = rencontre.rencontre_resultat_visiteuse.pointsDeMarque;
scoreDiv.innerHTML = `${pointsLocal} – ${pointsVisitor}`;
cell2.innerHTML = « »;
scoreDiv.href = `https://vibrez-rugby.com/live-en-direct/?id=${rencontre.id}`;
const dateOnlyDiv = document.createElement(« div »);
cell2.appendChild(dateOnlyDiv);
cell2.appendChild(scoreDiv);
} else {
const dateDiv = document.createElement(« div »);
dateDiv.className = « my-datetime »;
dateDiv.innerHTML = `${date.toLocaleDateString(‘fr-FR’, dateOptions)}
${date.toLocaleTimeString(‘fr-FR’, timeOptions)}`;
cell2.innerHTML = « »;
cell2.appendChild(dateDiv);
}const cell3 = row.insertCell(2);
cell3.className = ‘my-cell3’;
const visitorEmbleme = document.createElement(« img »);
visitorEmbleme.className = ‘my-embleme’;
visitorEmbleme.src = `data:image/jpeg;base64 + ${rencontre.visitor_team.img_base64}`;
cell3.appendChild(visitorEmbleme);
const visitorNameText = rencontre.visitor_team.name;
const visitorName = document.createElement(« a »);
visitorName.href = `https://vibrez-rugby.com/live-en-direct/?id=${rencontre.id}`;
visitorName.className = ‘my-club-link’;
visitorName.innerText = visitorNameText;
cell3.appendChild(visitorName);
});
}function clearMainContainer() {
const mainContainer = document.getElementById(« myMainContainer »);
while (mainContainer.firstChild) {
mainContainer.removeChild(mainContainer.firstChild);
}
}
async function updateScores() {
const response = await fetch(« https://rugby-data-api-255d6a9bb3a5.herokuapp.com/rencontres?type_team=cp2023 »);
const data = await response.json();
const rencontres = data.rencontres;rencontres.forEach(rencontre => {
const rowId = `row${rencontre.id}`;
const existingRow = document.getElementById(rowId);
if (existingRow) {
const cell2 = existingRow.cells[1];
cell2.innerHTML = « »;if (rencontre.etat === ‘endirect’) {
const scoreDiv = document.createElement(« a »);
scoreDiv.className = « my-score-box my-live-text »;
scoreDiv.innerHTML = `${rencontre.rencontre_resultat_locale.pointsDeMarque} – ${rencontre.rencontre_resultat_visiteuse.pointsDeMarque}`;
scoreDiv.href = `https://vibrez-rugby.com/live-en-direct/?id=${rencontre.id}`;
cell2.appendChild(scoreDiv);
} else if (rencontre.etat === ‘termine’) {
const scoreDiv = document.createElement(« a »);
scoreDiv.className = « my-score-box »;
scoreDiv.innerHTML = `${rencontre.rencontre_resultat_locale.pointsDeMarque} – ${rencontre.rencontre_resultat_visiteuse.pointsDeMarque}`;
scoreDiv.href = `https://vibrez-rugby.com/live-en-direct/?id=${rencontre.id}`;
cell2.appendChild(scoreDiv);
} else {
const dateDiv = document.createElement(« div »);
dateDiv.className = « my-datetime »;
dateDiv.innerHTML = `${new Date(rencontre.date).toLocaleDateString(‘fr-FR’, dateOptions)}
${new Date(rencontre.date).toLocaleTimeString(‘fr-FR’, timeOptions)}`;
cell2.appendChild(dateDiv);
}
}
});
}fetchTeams();
setInterval(updateScores, 60000);
.my-container {
font-family: Arial, sans-serif;
}
.my-table {
border-collapse: collapse; /* Fusionne les bordures horizontales et verticales */
width: 100%;
margin: auto;
transition: all 0.3s;
table-layout: fixed;
border-spacing: 0; /* Supprime l’espacement entre les cellules */
border: none; /* Supprime toute bordure par défaut */
}
table, tr, th, td {
vertical-align: middle;
}
.my-table th, .my-table td {
border: none !important; /* Supprime les bordures individuelles */
padding: 8px;
text-align: center;
transition: all 0.3s;
}.my-table tr:nth-child(odd) {
background-color: #f8f8f82f;
}.my-table tr:nth-child(even) {
background-color: #7d7d8d23;
}.my-datetime {
text-align: center;
}.my-embleme {
display: block;
margin: auto;
max-height: 30px;
max-width: 30px;
}.my-time {
font-size: 0.8em;
display: block;
margin-top: 5px;
}.my-score-box {
display: inline-block;
background-color:
black;
color:
white;
margin: 10px;
padding: 10px;
border-radius: 5px;
text-decoration: none;
transition: transform .1s;
}
.my-score-box:hover {
transform: scale(1.5);
text-decoration: none;
color: white;
}.my-live-text {
background-color: rgb(230, 11, 11);
color: white;
}.my-poule-container {
flex-direction: column;
align-items: flex-start;
margin-top: 30px;
}.my-poule-title, .my-journee-select {
margin-right: 10px;
}.my-club-link {
display: block;
margin-top: 5px;
}
.my-title-select-div {
width: 100%;
margin-bottom: 5px;
text-align: center;
}
.my-journee-select {
width: 100%;}
.loader {
display: block;
position: fixed; /* Modifié de ‘relative’ à ‘fixed’ */
top: 50%; /* Ajouté */
left: 50%; /* Ajouté */
transform: translate(-50%, -50%); /* Ajouté */
height: 32px;
width: 200px;
background: #fff;
border: 2px solid #fff;
color: red;
overflow: hidden;
z-index: 1000; /
}
.loader::before{
content: »;
background: red;
position: absolute;
left: 0;
top: 0;
width: 0;
height: 100%;
animation: loading 10s linear infinite;
}
.loader:after{
content: »;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
text-align: center;
font-size: 24px;
line-height: 32px;
color: rgb(0,255,255);
mix-blend-mode: difference;
animation: percentage 10s linear infinite;
}
@keyframes loading {
0% { width: 0 }
100% { width: 100% }
}
@keyframes percentage {
0% { content: « 0% »}
5% { content: « 5% »}
10% { content: « 10% »}
20% { content: « 20% »}
30% { content: « 30% »}
40% { content: « 40% »}
50% { content: « 50% »}
60% { content: « 60% »}
70% { content: « 70% »}
80% { content: « 80% »}
90% { content: « 90% »}
95% { content: « 95% »}
96% { content: « 96% »}
97% { content: « 97% »}
98% { content: « 98% »}
99% { content: « 99% »}
100% { content: « 100% »}
}
Calendrier Coupe du Monde de Rugby 2023 qui se déroulera en France ! La compétition aura lieu du 8 septembre au 28 octobre prochain. Découvrez le calendrier, les dates et le programme complet de la Coupe du Monde de Rugby 2023
LES GROUPES DE LA COUPE DU MONDE RUGBY 2023
20 équipes sont qualifiées pour la Coupe du Monde de Rugby qui se déroulera en France du 8 septembre au 28 octobre prochain.
- Poule A : Nouvelle-Zélande, France, Italie, Namibie, Uruguay
- Poule B : Afrique du sud, Irlande, Écosse , Roumanie , Tonga
- Poule C : Australie, pays de Galles, Fidji, Géorgie, Portugal
- Poule D : Angleterre, Argentine, Japon, Samoa, Chili
LE CALENDRIER DE LA COUPE DU MONDE RUGBY 2023
LE PROGRAMME DE LA PHASE DE POULES
France-Nouvelle Zélande (poule A) au Stade France (Saint-Denis) – 21 heures
Italie-Namibie (poule A) au stade Geoffroy-Guichard (Saint-Etienne) – 13 heures
Irlande-Roumanie (poule B) au stade Matmut Atlantique (Bordeaux) – 15h30
Australie-Géorgie (poule C) au Stade France (Saint-Denis) – 18 heures
Angleterre-Argentine (poule D) au stade Vélodrome (Marseille) – 21 heures
Japon-Chili (poule D) au Stadium (Toulouse) – 13 heures
Afrique du Sud-Ecosse (poule B) au stade Vélodrome (Marseille) – 17h45
Pays de Galles-Fidji (poule C) au stade Matmut Atlantique (Bordeaux) – 21 heures
France-Uruguay (poule A) au stade Pierre Mauroy (Lille) – 21 heures
Nouvelle-Zélande-Namibie (poule A) au Stadium (Toulouse) – 21 heures
Samoa-Chili (poule D) au stade Matmut Atlantique (Bordeaux) – 15 heures
Pays de Galles-Portugal (poule C) à l’Allianz Riviera (Nice) – 17h45
Irlande-Tonga (poule B) à la Beaujoire (Nantes) – 21 heures
Afrique du sud-Roumanie (poule B) au stade Matmut Atlantique (Bordeaux) – 15 heures
Australie-Fidji (poule C) au stade Geoffroy-Guichard (Saint-Etienne) – 17h45
Angleterre-Japon (poule D) à l’Allianz Riviera (Nice) – 21 heures
Italie-Uruguay (poule A) à l’Allianz Riviera (Nice) – 17h45
France-Namibie (poule A) au stade Vélodrome (Marseille) – 21 heures
Argentine-Samoa (poule D) au stade Geoffroy-Guichard (Saint-Etienne) – 17h45 heures
Géorgie – Portugal (poulre C) au Stadium (Toulouse) – 14 heures
Angleterre-Chili (poule D) au stade Pierre Mauroy (Lille) – 17h45
Afrique du sud-Irlande (poule B) au Stade de France (Saint-Denis) – 21 heures
Ecosse-Tonga (poule B) à l’Allianz Riviera (Nice) – 17h45
Pays de Galles-Australie (poule C) au Parc OL (Lyon) – 21 heures
Uruguay-Namibie (poule A) au Parc OL (Lyon) – 17h45
Japon-Samoa (poule D) au Stadium (Toulouse) – 21 heures
Nouvelle-Zélande-Italie (poule A) au Parc OL (Lyon) – 21 heures
Argentine-Chili (poule D) à la Beaujoire (Nantes) – 15 heures
Fidji-Géorgie (poule C) au stade Matmut Atlantique (Bordeaux) – 17h45
Ecosse-Roumanie (poule B) au stade Pierre Mauroy (Lille) – 21 heures
Australie-Portugal (poule C) au stade Geoffroy-Guichard (Saint-Etienne) – 17h45
Afrique du Sud-Tonga (poule B) au stade Vélodrome (Marseille) – 21 heures
Nouvelle-Zélande-Uruguay (poule A) au Parc OL (Lyon) – 21 heures
France-Italie (poule A) au Parc OL (Lyon) – 21 heures
Pays de Galles-Géorgie (poule C) à la Beaujoire (Nantes) – 15 heures
Angleterre-Samoa (poule D) au stade Pierre Mauroy (Lille) – 17h45
Irlande-Ecosse (poule B) au Stade de France (Saint-Denis) – 21 heures
Japon-Argentine (poule D) à la Beaujoire (Nantes) – 13 heures
Tonga-Roumanie (poule B) au stade Pierre Mauroy (Lille) – 17h45
Fidji-Portugal (poule C) au Stadium (Toulouse) – 21 heures
LE PROGRAMME DE LA PHASE FINALE
Quart de finale 1 : 1er poule C – 2e poule D au stade Vélodrome (Marseille) – 17 heures
Quart de finale 2 : 1er poule B – 2e poule A au Stade de France (Saint-Denis) – 21 heures
Quart de finale 3 : 1er poule D – 2e poule C au stade Vélodrome (Marseille) – 17 heures
Quart de finale 4 : 1er poule A – 2e poule B au Stade de France (Saint-Denis) – 21 heures
Demi-finale 1 : vainqueur QF 1 – vainqueur QF 2 au Stade de France (Saint-Denis) – 21 heures
Demi-finale 2 : vainqueur QF 3 – vainqueur QF 4 au Stade de France (Saint-Denis) – 21 heures
Match pour la 3e place : perdant DF 1 – perdant DF 2 au Stade de France (Saint-Denis) – 21 heures
Finale : vainqueur DF 1 – vainqueur DF 2 au Stade de France (Saint-Denis) – 21 heures
