{% extends 'layout.html' %}
{% block content %}
<div class="container" style="width: 900px;">
    {% include 'nav.html' %}
    <h2 class="center">{{file[2]}}</h2>
    <p class="center">Expires at: {{file[5]|expirein}}</p>
    <div class="filebox">
        <div class="box">
            {% if file[2].split('.')[-1] in ['png', 'jpg', 'jpeg', 'gif', 'webp'] %}
                <img src="/static/files/{{ file[1] }}.{{ file[2].split('.')[-1] }}">
            {% elif file[2].split('.')[-1] in ['mp4', 'webm', 'ogg'] %}
                <video controls>
                    <source src="/static/files/{{ file[1] }}.{{ file[2].split('.')[-1] }}" type="video/{{ file[2].split('.')[-1] }}">
                </video>
            {% elif file[2].split('.')[-1] in ['mp3', 'wav', 'ogg'] %}
                <audio controls>
                    <source src="/static/files/{{ file[1] }}.{{ file[2].split('.')[-1] }}" type="audio/{{ file[2].split('.')[-1] }}">
                </audio>
            {% elif file[2].split('.')[-1] in ['txt', "py", "php", "htm", "html", "css", "js", "ts", "cr", "c", "cpp", "rs", "rst"] %}
                {% set filed = file[1] + '.' + file[2].split('.')[-1] %}
                <p class="text" readonly style="width: 900px">{{ filed|gettxt|replace('&', '&amp;')|replace('<', '&lt;')|replace('>', '&gt;')|replace('\n', '<br>')|safe}}</p>
            {% elif file[2].split('.')[-1] in ['md'] %}
                {% set filed = file[1] + '.' + file[2].split('.')[-1] %}
                <p class="text-md">{{ filed|gettxt|markdown|safe}}</p>
            {% else %}
                <p>This file cannot be previewed</p>
            {% endif %}


        </div>
        <a href="/static/files/{{file[1]}}.{{file[2].split('.')[-1]}}" class="download-button"><button >Raw</button></a>
        <br>
        
    </div>
    
    
</div>
{% endblock %}