{{define "music_player"}}
<script type="module" src="/static/get?file=music_player.js"></script>
<div id="music_player">
    <div class="vert_align center">
        <div class="vert_align">
            <div id="mp_prev_track" class="vert_align">
                <img src="/static/get?file=images/chevron_left.svg" alt="Previous Track">
            </div>
            <div id="mp_pp_track" class="vert_align">
                <img src="/static/get?file=images/play.svg" alt="Play">
            </div>
            <div id="mp_next_track" class="vert_align">
                <img src="/static/get?file=images/chevron_right.svg" alt="Next Track">
            </div>
        </div>
        <div class="slider_container vert_align">
            <div id="mp_current_time" class="vert_align">00:00</div>
            <input type="range" id="mp_seek_slider" class="vert_align" min="1" max="100" value="0">
            <div id="mp_total_duration" class="vert_align">00:00</div>
        </div>
        <select name="Tracks" id="mp_tracks"></select>
    </div>
</div>
{{end}}