Blue Youngstars

    Kurzform des Namens:
    BY
    Name mittlere Größe:
    Blue Youngstars
    <!DOCTYPE html>
    <html lang="de">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mannschaftsstatistiken</title>
    <style>
    body { font-family: Arial, sans-serif; padding: 20px; }
    table { width: 100%; border-collapse: collapse; margin-top: 20px; }
    th, td { border: 1px solid #ddd; padding: 8px; text-align: center; }
    th { background-color: #f2f2f2; }
    .error { color: red; }
    select { padding: 5px; margin-bottom: 10px; }
    </style>
    </head>
    <body>
    <h1>Mannschaftsstatistiken</h1>
    <label for="team-filter">Wähle eine Mannschaft:</label>
    <select id="team-filter">
    <option value="">Alle Teams</option>
    <!-- Dynamische Teams werden hier hinzugefügt -->
    </select>

    <div id="team-stats">Lade Mannschaftsstatistiken...</div>

    <script>
    document.addEventListener("DOMContentLoaded", function() {
    const apiToken = "NTVhMDE4YTdlZmY1ZjhkNGIzYmM1YWM0MWVmMTg0YjhhYjFhYzFiOTViNjAyMjBhMjM2ZmE3YmQyZWRiNDIwOWQ3ODVlYWM2YTdkMWMxZGFiYWMwN2JjMGE5YzZmZmM0"; //
    const apiUrl = "https://api.tyg.rocks/external/v1/competitions/COZBOC6G/stats/team/TEJGHFCM/players"; //

    function loadTeamStats(selectedTeam = "") {
    fetch(apiUrl, {
    method: "GET",
    headers: {
    "Authorization": `Bearer ${apiToken}`,
    "Content-Type": "application/json"
    }
    })
    .then(response => response.json())
    .then(data => {
    // Filterung der Teams
    const teams = [...new Set(data.players.map(player => player.team))];
    const teamFilter = document.getElementById("team-filter");

    if (teamFilter.options.length === 1) { // Nur einmal befüllen
    teams.forEach(team => {
    const option = document.createElement("option");
    option.value = team;
    option.textContent = team;
    teamFilter.appendChild(option);
    });
    }

    let filteredPlayers = selectedTeam ? data.players.filter(player => player.team === selectedTeam) : data.players;

    let table = '<table><tr><th>Spielername</th><th>Position</th><th>Tore</th><th>Assists</th></tr>';
    filteredPlayers.forEach(player => {
    table += `<tr><td>${player.name}</td><td>${player.position}</td><td>${player.goals}</td><td>${player.assists}</td></tr>`;
    });
    table += '</table>';

    document.getElementById("team-stats").innerHTML = table;
    })
    .catch(error => {
    console.error("Fehler beim Abrufen der Daten:", error);
    document.getElementById("team-stats").innerHTML = "<p class='error'>Fehler beim Laden der Daten.</p>";
    });
    }

    // Initiales Laden der Daten
    loadTeamStats();

    // Filter-Änderung überwachen
    document.getElementById("team-filter").addEventListener("change", function() {
    loadTeamStats(this.value);
    });
    });
    </script>
    </body>
    </html>

    Open chat
    Scan the code
    Kontaktdaten werden gemäß unserer "privcy policy" verarbeitet und gespeichert.