Server list

McServery API: Žebříček hlasujících na Váš web

V dnešním článku se podíváme na dva různé způsoby, jak zobrazit žebříček počtu hlasů od jednotlivých hráčů ze server listu u Vás na stránkách vašeho Minecraft serveru. Tento žebříček hlasujících může být užitečný pro majitele Minecraft serveru, kteří chtějí ukázat nejaktivnější hráče a odměnit je za jejich přispění.

Kód by měl být brán především jako inspirace, jak implementovat tuto pro hráče zajímavou statistiku která je bude motivovat k aktivnějšímu hlasování pro Váš server. Pro tento příklad budeme používat endpoit /players/ který zobrazuje jednotlivě všechny hlasy pro Váš server za posledních 30 dní.

Máme zde dvě hodnoty a to je username pro jméno hráče který hlasoval pro daný server a time která zobrazuje čas kdy byl hlas serveru udělen.

kód zpracovává JSON s daty obsahujícími informace o jednotlivých udělených hlasech uživateli a vytváří tabulku, která zobrazuje počet odeslaných hlasů od každého uživatele, seřazenou sestupně podle počtu aktivit. Kód začíná převedením JSON na pole asociativních polí. Následně prochází každý záznam a zaznamenává počet aktivit pro každého uživatele. Poté se uživatelé seřadí podle počtu aktivit a vytvoří se tabulka, která zobrazuje počet aktivit pro každého uživatele.

Prvním krokem bude získání API klíče pro Váš server. Ten získáte po přihlášení na detailní stránce Vašeho serveru. Zde přesný návod, jak klíč získat.

Box pro úpravu Vašeho serveru - zde získáte potřebný API klíč.

PHP

První způsob využívá PHP. Pomocí API lze získat data v JSON formátu a následně je zpracovat v PHP. Výsledkem je tabulka s počtem hlasů a jménem hráče, seřazená dle pořadí. Tento přístup může být užitečný pro majitele serveru, kteří mají webové stránky postavené na PHP a chtějí data zpracovávat na serverové straně.

<?php

$apiKey = ''; // API Klíč Vašeho serveru

// převést JSON na pole asociativních polí
$data = json_decode(file_get_contents('https://api.mcservery.eu/players/?api_key=' . $apiKey), true);

// spočítat počet záznamů od každého uživatele
$counts = array();
foreach ($data as $record) {
    $username = $record['username'];
    if (isset($counts[$username])) {
        $counts[$username]++;
    } else {
        $counts[$username] = 1;
    }
}

// seřadit uživatele podle počtu záznamů
arsort($counts);

// vytvořit seznam ve formátu tabulky
echo '<table>';
echo '<tr><th>Hráč</th><th>Počet hlasů</th></tr>';
foreach ($counts as $username => $count) {
    echo '<tr><td>' . $username . '</td><td>' . $count . '</td></tr>';
}
echo '<tr><td>Hlasuj na <a href="https://mcservery.eu">mcservery.eu</a></td></tr>';
echo '</table>';

JavaScript

Druhý způsob využívá JavaScript. Data se stahují pomocí API v JSON formátu a jsou následně zpracovávána v JavaScriptu. Výsledkem je opět tabulka s počtem hlasů a jménem hráče, seřazená dle pořadí. Tento přístup může být užitečný pro majitele serveru, kteří chtějí data zpracovávat na straně klienta a využívat dynamického zobrazování.

Pomocí tohoto kódu získáme pomocí API data a následně je zpracujeme:

const apiURL = "https://api.mcservery.eu/players/?api_key=";
const apiKey = "";
const usersTableBody = document.getElementById("users-table-body");

fetch(apiURL + apiKey)
  .then((response) => response.json())
  .then((data) => {
    const usersMap = new Map();

    data.forEach((entry) => {
      const username = entry.username;
      const count = usersMap.has(username) ? usersMap.get(username) + 1 : 1;
      usersMap.set(username, count);
    });

    const usersArray = Array.from(usersMap);

    usersArray.sort((a, b) => b[1] - a[1]);

    usersArray.forEach((entry) => {
      const row = document.createElement("tr");
      const usernameCell = document.createElement("td");
      const countCell = document.createElement("td");

      usernameCell.innerText = entry[0];
      countCell.innerText = entry[1];

      row.appendChild(usernameCell);
      row.appendChild(countCell);

      usersTableBody.appendChild(row);
    });
  })
  .catch((error) => console.error(error));

Pro zobrazení tabulky s daty na stránce bude ještě nutné přidat html kód, jako je například tento:

<html>
  <head>
    <title>Seznam uživatelů</title>
  </head>

  <body>
    <table>
      <thead>
        <tr>
          <th>Hráč</th>
          <th>Počet hlasů</th>
        </tr>
      </thead>
      <tbody id="users-table-body"></tbody>
      <td>Hlasuj na: <a href="https://mcservery.eu">mcservery.eu</a></td>
    </table>
  </body>
</html>
Výsledek

Doufám, že vám tyto ukázky pomohou lépe pochopit, jak můžete použít API pro získání dat z mcservery.eu o Vašem Minecraft serveru. U obou ukázek jsem záměrně neuvedl CSS, jelikož věřím že kód poslouží jako inspirace pro vaši vlastní tvorbu.

💡
Zajímaly by Tě další ukázky, jak lze použít naše API? Navrhni na Discordu jakou další ukázku bys chtěl vidět!

Read next