Web/scripts/projects.js

const projects = [{
        'name': "Nature's Aura",
        'desc': "Nature's Aura is a new Minecraft mod about collecting, using and replenishing the Aura naturally present in the world to create useful devices and unique mechanics.",
        'status': 'In development',
        'links': {
            'CurseForge page': 'https://minecraft.curseforge.com/projects/natures-aura'
        },
        'icon': 'na'
    },
    {
        "name": "Tetro",
        "desc": "Tetro is a Tetris clone I wrote in an afternoon and a bit. You can play it in the browser. It also features multiple game piece designs and some custom game modes. It was pretty fun to make, and it's pretty fun to play.",
        "status": "In development",
        "links": {
            "Play it": "https://ellpeck.github.io/Tetro",
            "Code on GitHub": "https://github.com/Ellpeck/Tetro"
        },
        "icon": "tetro"
    },
    {
        'name': 'Actually Additions',
        'desc': 'Actually Additions is a rather popular Minecraft mod that I used to work on. It\'s become widely known in the modding community and has reached over 10 million downloads by now, which is crazy. I don\'t work on it anymore myself, but it\'s being maintained for current versions by someone else.',
        'links': {
            'CurseForge page': 'https://www.ellpeck.de/actadd',
            'Online manual': 'https://www.ellpeck.de/actaddmanual/'
        },
        'status': 'Handed off',
        'icon': 'aa'
    },
    {
        'name': 'Rock Bottom',
        'desc': 'Rock Bottom is a game I\'ve been working on for a little more than a year now. It\'s a 2D-sidescrolling sandbox game with a storyline that has multiplayer support, a modding API and a lot more fun stuff. It\'s currently still in early development, but I\'m kind of taking a break from it for a while.',
        'links': {
            'Website': 'https://rockbottom.ellpeck.de',
            'API on GitHub': 'https://github.com/RockBottomGame/API'
        },
        'status': 'On hold',
        'icon': 'rb'
    },
];

let p = '';
for (project of projects) {
    p += '<div class="card bg-light project rounded-0">';
    p += '<div class="card-body">';
    p += '<img class="project-image" src="res/projects/' + project['icon'] + '.png" alt="">';

    p += '<h4 class="card-title">' + project['name'] + '</h4>';
    p += '<p class="card-text">' + project['desc'] + '</p>';
    p += '<span class="text-muted project-status">' + project['status'] + '</span>';

    let links = project['links'];
    if (links) {
        for (let name in links) {
            p += '<a href="' + links[name] + '" class="card-link btn ' + (dark ? "btn-outline-light" : "btn-outline-info") + ' rounded-0">' + name + '</a>';
        }
    }

    p += '</div>';
    p += '</div>';
}
$('#project-list').html(p);