<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>⇆🎉 {{ title }}</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=0.8">
    <link rel="stylesheet" type="text/css" media="screen" href="/.cpr/browser.css{{ ts }}">
    {%- if can_upload %}
    <link rel="stylesheet" type="text/css" media="screen" href="/.cpr/upload.css{{ ts }}">
    {%- endif %}
</head>

<body>
    {%- if can_upload %}
    {%- include 'upload.html' %}
    {%- endif %}
    
    <h1 id="path">
        {%- for n in vpnodes %}
        <a href="/{{ n[0] }}">{{ n[1] }}</a>
        {%- endfor %}
    </h1>
    
    {%- if can_read %}
    {%- if prologue %}
    <div id="pro" class="logue">{{ prologue }}</div>
    {%- endif %}

    <table id="files">
        <thead>
            <tr>
                <th></th>
                <th>File Name</th>
                <th sort="int">File Size</th>
                <th>Date</th>
            </tr>
        </thead>
        <tbody>

{%- for f in files %}
<tr><td>{{ f[0] }}</td><td><a href="{{ f[1] }}">{{ f[2] }}</a></td><td>{{ f[3] }}</td><td>{{ f[4] }}</td></tr>
{%- endfor %}

        </tbody>
    </table>
    
    {%- if epilogue %}
    <div id="epi" class="logue">{{ epilogue }}</div>
    {%- endif %}
    {%- endif %}

    <h2><a href="?h">control-panel</a></h2>

    {%- if srv_info %}
    <div id="srv_info"><span>{{ srv_info }}</span></div>
    {%- endif %}

    <div id="widget">
        <div id="wtoggle">♫</div>
        <div id="widgeti">
            <div id="pctl"><a href="#" id="bprev">⏮</a><a href="#" id="bplay">▶</a><a href="#" id="bnext">⏭</a></div>
            <canvas id="pvol" width="288" height="38"></canvas>
            <canvas id="barpos"></canvas>
            <canvas id="barbuf"></canvas>
        </div>
    </div>
    
    {%- if can_read %}
    <script src="/.cpr/browser.js{{ ts }}"></script>
    {%- endif %}
    
    {%- if can_upload %}
    <script src="/.cpr/up2k.js{{ ts }}"></script>
    {%- endif %}
</body>

</html>
