<?php 
$page = preg_split('/[\/]/', $_SERVER['REQUEST_URI']);
if ($page[count($page)-2] != 'viewAlbum'): ?>
    <h5>Filter Albums</h5>
    <button type="button" onclick="toggleFilterOptions()">Filter</button>

    <div id="filter-options" class="filter-options">
        <form method="get">
            <div id="filter-buttons" class="filter-buttons">
                <button type="button" onclick="toggleCheckboxes('genre')">Genres</button>
                <button type="button" onclick="toggleCheckboxes('artist')">Artists</button>
                <button type="button" onclick="toggleCheckboxes('year')">Years</button>
            </div>

            <div id="genre-checkboxes" style="display:none;">
                <?php foreach ($genres as $genre): ?>
                    <label>
                        <input type="checkbox" name="genre[]" value="<?= $genre->genreName; ?>">
                        <?= $genre->genreName; ?>
                    </label><br>
                <?php endforeach; ?>
            </div>

            <div id="artist-checkboxes" style="display:none;">
                <?php foreach ($artists as $artist): ?>
                    <label>
                        <input type="checkbox" name="artist[]" value="<?= $artist->artistName; ?>">
                        <?= $artist->artistName; ?>
                    </label><br>
                <?php endforeach; ?>
            </div>

            <div id="year-checkboxes" style="display:none;">
                <?php foreach ($years as $year): ?>
                    <label>
                        <input type="checkbox" name="year[]" value="<?= $year->year; ?>">
                        <?= $year->year; ?>
                    </label><br>
                <?php endforeach; ?>
            </div>

            <button type="submit">Apply Filters</button>
        </form>
    </div> 

    <h5>Sort Albums</h5>
    <button type="button" onclick="toggleSortButtons()">Sort</button>
    <div id="sort-buttons" class="sort-buttons">
        <button onclick="sortAlbums('year', 'asc')">Sort by Year Asc</button>
        <button onclick="sortAlbums('year', 'desc')">Sort by Year Desc</button>
        <button onclick="sortAlbums('artistName', 'asc')">Sort by Artist Asc</button>
        <button onclick="sortAlbums('artistName', 'desc')">Sort by Artist Desc</button>
        <button onclick="sortAlbums('name', 'asc')">Sort by Album Name Asc</button>
        <button onclick="sortAlbums('name', 'desc')">Sort by Album Name Desc</button>
        <button onclick="sortAlbums('genreName', 'asc')">Sort by Genre Asc</button>
        <button onclick="sortAlbums('genreName', 'desc')">Sort by Genre Desc</button>
    </div>
<?php endif; ?>

<h5>Albums list</h5>
<section class="list">

<?php
foreach ($albums as $album):
?>
    <div>
        <article>
            <header class="short-text">
                <?= anchor("albums/viewMusique/{$album->albumId}", $album->name); ?>
                <?php if ($this->session->userdata('logged_in')): 
                    echo anchor("albums/addAlbumtoPlaylist/{$album->albumId}", "<i class='fa fa-plus'></i>");
                 endif; ?>
            </header>
            <img src="data:image/jpeg;base64,<?= base64_encode($album->jpeg); ?>" alt="cover de l'album" />
            <nav class="short-text">Genre: <?= $album->genreName; ?></nav>
            <footer class="short-text"><?= $album->year; ?> - <?= $album->artistName; ?></footer>
        </article>
    </div>
<?php endforeach; ?>
</section>
