php battlebit json data parser

gamemodes.php

<?php
// Step 1: Fetch the JSON data
$jsonData = file_get_contents('https://raw.githubusercontent.com/Bluscream/battlebitapirunner-modules/master/data/gamemodes.json');

// Step 2: Parse the JSON data into a PHP array
$data = json_decode($jsonData, true);

// Step 3: Generate the HTML code for the Bootstrap table
$html = '<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">';

$html .= '<nav class="navbar navbar-expand-lg navbar-light bg-light">';
$html .= '<a class="navbar-brand" href="#">BattleBit</a>';
$html .= '<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">';
$html .= '<span class="navbar-toggler-icon"></span>';
$html .= '</button>';
$html .= '<div class="collapse navbar-collapse" id="navbarNav">';
$html .= '<ul class="navbar-nav">';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="/maps/">Maps</a>';
$html .= '</li>';
$html .= '<li class="nav-item active">';
$html .= '<a class="nav-link" href="/gamemodes/">Gamemodes</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="/sizes/">Sizes</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="//github.com/Bluscream/battlebitapirunner-modules/tree/master/data">Raw Data</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="//gist.github.com/Bluscream/419186d37ebbeda61f7fa38276515975">Source Code</a>';
$html .= '</li>';
$html .= '</ul>';
$html .= '</div>';
$html .= '</nav>';

$html .= '<table class="table table-striped">';
$html .= '<thead><tr><th>Name</th><th>Description</th></tr></thead>';
$html .= '<tbody>';

foreach ($data as $gamemode) {
    $html .= '<tr>';
    if ($gamemode['DisplayName']) $html .= '<td><b>' . $gamemode['DisplayName'] . '</b> (' . $gamemode['Name'] . ')</td>';
    else $html .= '<td><b>' . $gamemode['Name'] . '</b></td>';
    $html .= '<td>' . (isset($gamemode['Description']) ? $gamemode['Description'] : '') . '</td>';
    // $html .= '<td>' . ($gamemode['Available'] ? 'Yes' : 'No') . '</td>';
    $html .= '</tr>';
}

$html .= '</tbody></table>';

// Step 4: Add sorting functionality to the table using JavaScript
$html .= '<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>';
$html .= '<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>';
$html .= '<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>';
$html .= '<script src="https://cdn.jsdelivr.net/npm/tablesort@5"></script>';
$html .= '<script>new Tablesort(document.getElementsByTagName("table")[0]);</script>';

// Step 5: Output the HTML code
echo $html;
?>

maps.php

<?php

function filterArrayByProperty($array, $property, $value) {
    return array_filter($array, function($item) use ($property, $value) {
        return $item[$property] === $value;
    });
}

function getMapSize($size, $sizes) {
    switch ($size) {
        case 90:
            return "127v127";
        default:
            return ($size / 2) . 'v' . ($size / 2);
    }
}

function ImageLink($imgurl) {
    $url = $imgurl ?? "https://static.wikia.nocookie.net/battlebit_gamepedia_en/images/";
    return '<a href="' . $url . '" ><img src="' . $url . '" alt="" style="max-width: 215px;"></a>';
}

// Step 1: Fetch the JSON data
$maps_json = file_get_contents('https://raw.githubusercontent.com/Bluscream/battlebitapirunner-modules/master/data/maps.json');
$gamemodes_json = file_get_contents('https://raw.githubusercontent.com/Bluscream/battlebitapirunner-modules/master/data/gamemodes.json');
$sizes_json = file_get_contents('https://raw.githubusercontent.com/Bluscream/battlebitapirunner-modules/master/data/sizes.json');

// Step 2: Parse the JSON data into a PHP array
$maps = json_decode($maps_json, true);
$gamemodes = json_decode($gamemodes_json, true);
$sizes = json_decode($sizes_json, true);

// Step 3: Generate the HTML code for the Bootstrap table
$html = '<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">';

$html .= '<nav class="navbar navbar-expand-lg navbar-light bg-light">';
$html .= '<a class="navbar-brand" href="#">BattleBit</a>';
$html .= '<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">';
$html .= '<span class="navbar-toggler-icon"></span>';
$html .= '</button>';
$html .= '<div class="collapse navbar-collapse" id="navbarNav">';
$html .= '<ul class="navbar-nav">';
$html .= '<li class="nav-item active">';
$html .= '<a class="nav-link" href="/maps/">Maps</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="/gamemodes/">Gamemodes</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="/sizes/">Sizes</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="//github.com/Bluscream/battlebitapirunner-modules/tree/master/data">Raw Data</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="//gist.github.com/Bluscream/419186d37ebbeda61f7fa38276515975">Source Code</a>';
$html .= '</li>';
$html .= '</ul>';
$html .= '</div>';
$html .= '</nav>';

$html .= '<table class="table table-striped">';
$html .= '<thead><tr><th>Preview</th><th>Name</th><th>Description</th><th>Supported Gamemodes</th></tr></thead>';
$html .= '<tbody>';

foreach ($maps as $map) {
    $html .= '<tr>';
    $html .= '<td>';
    $html .= ImageLink($map['ImageUrls']['LoadingScreen']);
    if (isset($map['ImageUrls']['MainMap'])) $html .= '<br><br>'.ImageLink($map['ImageUrls']['MainMap']);
    $html .= '</td>';
    if (key_exists('DisplayName', $map)) $html .= '<td><b>' . $map['DisplayName'] . '</b><br><br>' . $map['Name'] . '</td>';
    else $html .= '<td><b>' . $map['Name'] . '</b></td>';
    $html .= '<td>' . $map['Description'] . '</td>';
    $html .= '<td>';
    foreach ($map['SupportedGamemodes'] as $gamemode) {
        $name = $gamemode['GameMode'];
        // $displayname = filterArrayByProperty($gamemodes, "Name", $name)[0]['DisplayName'];
        $displayname = array_filter($gamemodes, function ($obj) use ($name) {
            return $obj["Name"] === $name;
        });
        // $gameModeSizes = $gamemode['SupportedMapSizes'];
        $gameModeSizes = array_map(function ($size) use ($sizes) {
            return getMapSize($size, $sizes) ?? $size; // ["LongName"]
        }, $gamemode['SupportedMapSizes']);
        $html .= ( array_values($displayname)[0]['DisplayName'] ?? $name ) . ' (' . implode(', ', $gameModeSizes) . ')<br>';
    }
    $html .= '</td>';
    // $html .= '<td>' . ($map['Available'] ? 'Yes' : 'No') . '</td>';
    $html .= '</tr>';
}

$html .= '</tbody></table>';

// Step 4: Add sorting functionality to the table using JavaScript
$html .= '<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>';
$html .= '<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>';
$html .= '<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>';
$html .= '<script src="https://cdn.jsdelivr.net/npm/tablesort@5"></script>';
$html .= '<script>new Tablesort(document.getElementsByTagName("table")[0]);</script>';

// Step 5: Output the HTML code
echo $html;
?>

sizes.php

<?php
// Step 1: Fetch the JSON data
$jsonData = file_get_contents('https://raw.githubusercontent.com/Bluscream/battlebitapirunner-modules/master/data/sizes.json');

// Step 2: Parse the JSON data into a PHP array
$data = json_decode($jsonData, true);

// Step 3: Generate the HTML code for the Bootstrap table
$html = '<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">';

$html .= '<nav class="navbar navbar-expand-lg navbar-light bg-light">';
$html .= '<a class="navbar-brand" href="#">BattleBit</a>';
$html .= '<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">';
$html .= '<span class="navbar-toggler-icon"></span>';
$html .= '</button>';
$html .= '<div class="collapse navbar-collapse" id="navbarNav">';
$html .= '<ul class="navbar-nav">';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="/maps/">Maps</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="/gamemodes/">Gamemodes</a>';
$html .= '</li>';
$html .= '<li class="nav-item active">';
$html .= '<a class="nav-link" href="/sizes/">Sizes</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="//github.com/Bluscream/battlebitapirunner-modules/tree/master/data">Raw Data</a>';
$html .= '</li>';
$html .= '<li class="nav-item">';
$html .= '<a class="nav-link" href="//gist.github.com/Bluscream/419186d37ebbeda61f7fa38276515975">Source Code</a>';
$html .= '</li>';
$html .= '</ul>';
$html .= '</div>';
$html .= '</nav>';

$html .= '<table class="table table-striped table-bordered">';

$tableRows = '';
foreach ($data as $item) {
    $tableRows .= '<tr>';
    $tableRows .= '<td>' . $item['ShortName'] . '</td>';
    $tableRows .= '<td>' . $item['LongName'] . '</td>';
    $tableRows .= '<td>' . $item['Description'] . '</td>';
    $tableRows .= '<td>' . $item['TotalSize'] . '</td>';
    $tableRows .= '<td>' . $item['PlayersPerTeam'] . '</td>';
    $tableRows .= '<td>' . ($item['Available'] ? 'Yes' : 'No') . '</td>';
    $tableRows .= '</tr>';
}

$html .= '
    <table class="table table-striped">
        <thead>
            <tr>
                <th>Short Name</th>
                <th>Long Name</th>
                <th>Description</th>
                <th>Total Size</th>
                <th>Players Per Team</th>
                <th>Available</th>
            </tr>
        </thead>
        <tbody>
            ' . $tableRows . '
        </tbody>
    </table>
';

// Step 4: Add sorting functionality to the table using JavaScript
$html .= '<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>';
$html .= '<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>';
$html .= '<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>';
$html .= '<script src="https://cdn.jsdelivr.net/npm/tablesort@5"></script>';
$html .= '<script>new Tablesort(document.getElementsByTagName("table")[0]);</script>';

// Step 5: Output the HTML code
echo $html;
?>