<!DOCTYPE html>
<head>
    <link rel="stylesheet" href="/css/style.css">
    <link rel="stylesheet" href="/css/loader.css">
</head>
<html>
    <body>
        <h1>Spotify To Bandcamp</h1>
        <p>Recherche dans une playlist les artistes se trouvant aussi sur Bandcamp !</p>
        <hr />

        {{ if .error }}

        {{ else }}
        <div id="inf-loader">
            <div id="loader"></div>
            <p>La playlist est en cours de traitement [<span id="nb-fait">0</span>/<span id="nb-total">0</span>]…</p>
            <p><a href="https://codepen.io/brunjo/pen/bNEWjV">Code Source du loader</a> sous <a href="https://blog.codepen.io/documentation/licensing/">licence MIT</a>.</p>
        </div>

        <div>
            <h2>Albums trouvés</h2>
            <table id="found">
                <tr>
                    <th>Artiste</th>
                    <th>Album</th>
                    <th>Spotify</th>
                    <th>Bandcamp</th>
                </tr>
            </table>

            <h2>Artistes trouvés</h2>
            <table id="artist-found">
                <tr>
                    <th>Artiste</th>
                    <th>Album</th>
                    <th>Spotify</th>
                    <th>Bandcamp</th>
                </tr>
            </table>

            <h2>Artistes non trouvés</h2>
            <table id="notfound">
                <tr>
                    <th>Artiste</th>
                    <th>Album</th>
                    <th>Spotify</th>
                </tr>
            </table>
        </div>
        {{ end }}

        <hr />
        <footer>
            <img src="https://www.gnu.org/graphics/gplv3-or-later-sm.png" alt="logo GPL3" *>
            <p>Ce site est en aucun cas affilié avec Bandcamp ou Spotify.</p>
        </footer>
    </body>
    {{ if not .error }}
    <script src="/script.js"></script>
    {{ end }}
<html>