tapes/brain/views/front.php

<?php

use brain\controllers\TapesAPI;

$tapes = new TapesAPI();
$covers = $tapes->getList(true);
include "parts/top.php";
?>
<header>
    <img alt="The Vicious Tapes" class="the-logo" src="assets/images/global/logo-primary.png" />
    <div class="audio-progress"></div>
</header>
<div id="tape-controls" class="control-closed">
    <img alt="Previous" id="control-back" class="tape-control-button" src='assets/images/global/btn_back.png' />
    <label class="control-text">NOTHING PLAYING</label>
    <img alt="Next" id="control-next" class="tape-control-button" src='assets/images/global/btn_forward.png' />
</div>
<main>
    <article class="tape-select front">
        <?php foreach ($covers as $cover) {
            $title = $cover["title"]; ?>

        <img alt="<?php echo $title ?>" id="<?php echo urlencode($title); ?>" class="covers" src="
            <?php echo "/assets/audio/tapes/" . $title . "/cover.jpg"; ?>" />

        <?php
            //end for each loop
        } ?>
    </article>
    <article class="tape-tracklist back-right">

        <img  alt="" id="tape-cover" src='' />
        <h1 id="tape-title"></h1>
        <section id="playlist"></section>

    </article>

</main>
<?php include "parts/bottom.php"; ?>