{% extends 'develop/template.html' %}
{% block subcontent %}
    <form action="/develop/create/3" method="post" enctype="multipart/form-data">
        <div>
            <input class="form-control" type="file" id="file" name="file" required>
        </div>
        <p class="m-0 text-secondary mb-2" style="font-size:12px;">Sound has to be a MP3 File, Lesser than 8MB and shorter than 8 minutes. Minimum: 20 Robux, every second of audio costs 0.5 robux, will round down if total is decimal point. </p>
        <div class="mb-2">
            <input class="form-control" type="text" id="name" name="name" placeholder="Name" required>
        </div>
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        {% if GroupIdContext != None %}<input type="hidden" name="groupIdContext" value="{{GroupIdContext}}">{%endif%}
        <button type="submit" class="btn btn-success btn-sm w-100">Create Sound</button>
    </form>
    <div class="mt-2">
        {% for sound in UserSounds.items: %}
            <div class="w-100 m-1 p-1 d-flex">
                <img src="/Thumbs/Asset.ashx?assetId={{sound.id}}&x=100&y=100" class="rounded" height="100px" width="100px">
                <div class="ms-2">
                    <a class="text-white text-decoration-none" href="/library/{{sound.id}}/"><h5 class="m-0">{{sound.name}}</h5></a>
                    <p class="text-secondary m-0" style="font-size:13px;">Sales: <span class="text-white">{{sound.sale_count}}</span></p>
                </div>
                <div class="ms-auto mt-auto mb-auto">
                    <a class="btn btn-sm border-primary text-white" href="/develop/{{sound.id}}/edit">Edit</a>
                </div>
            </div>
        {%endfor%}
        {% if len(UserSounds.items) == 0: %}
            <h5 class="text-center mt-3 mb-3">No items found</h5>
        {%endif%}
    </div>
{% endblock %}