{% extends 'base.html.twig' %}
{% block title %}{{ collection.title }}{% endblock %}
{% block footer %}{% endblock %}
{% block styles %}{{ parent() }}{{ encore_entry_link_tags('collect') }}{% endblock %}
{% block body %}
<div class="sign-page"><div class="container sign-container">
    <div class="sign-header">
        <div>
            <p class="sign-help mb-1">{{ 'collect.wizard.step'|trans({'%step%': step, '%total%': 6}) }}</p>
            <h1 class="sign-header__title">{{ collection.title }}</h1>
        </div>
        <a class="button" href="{{ path('app_collect_show', {id: collection.id}) }}">{{ 'collect.back'|trans }}</a>
    </div>

    {% if step == 1 %}
        <form method="post" class="sign-form">
            <label class="form-label">{{ 'collect.field.title'|trans }}</label>
            <input class="form-control mb-3" name="title" value="{{ collection.title }}" required>
            <label class="form-label">{{ 'collect.field.description'|trans }}</label>
            <textarea class="form-control mb-3" name="description" rows="3">{{ collection.description }}</textarea>
            <label class="form-label">{{ 'collect.field.type'|trans }}</label>
            <select class="form-select mb-3" name="type">
                <option value="share" {% if collection.type == 'share' %}selected{% endif %}>{{ 'collect.type.share'|trans }}</option>
                <option value="collect" {% if collection.type == 'collect' %}selected{% endif %}>{{ 'collect.type.collect'|trans }}</option>
                <option value="collab" {% if collection.type == 'collab' %}selected{% endif %}>{{ 'collect.type.collab'|trans }}</option>
            </select>
            <label class="form-label">{{ 'collect.field.expiresAt'|trans }}</label>
            <input class="form-control mb-3" type="datetime-local" name="expiresAt" value="{{ collection.expiresAt ? collection.expiresAt|date('Y-m-d\\TH:i') : '' }}">
            <label class="form-label">{{ 'collect.field.timezone'|trans }}</label>
            <input class="form-control mb-4" name="timezone" value="{{ collection.timezone ?: 'Europe/Berlin' }}">
            <button class="button button-blue" type="submit">{{ 'collect.continue'|trans }}</button>
        </form>
    {% elseif step == 2 %}
        <p class="sign-help">{{ 'collect.wizard.filesHelp'|trans }}</p>
        <div id="collectUpload" data-upload-url="{{ path('app_collect_upload', {id: collection.id}) }}">
            <input type="file" id="collectFileInput" multiple>
            <ul id="collectUploadList" class="mt-3"></ul>
        </div>
        {% if availableFiles|length %}
            <ul class="mt-3">
                {% for f in availableFiles %}
                    <li>{{ f.originalFilename }} ({{ f.sizeBytes }} B)</li>
                {% endfor %}
            </ul>
        {% endif %}
        <form method="post" class="mt-4">
            <button class="button button-blue" type="submit">{{ 'collect.continue'|trans }}</button>
        </form>
    {% elseif step == 3 %}
        <form method="post" class="sign-form">
            <label class="form-label">{{ 'collect.field.profile'|trans }}</label>
            <select class="form-select mb-3" name="profile" id="collectProfile">
                <option value="view">{{ 'collect.profile.view'|trans }}</option>
                <option value="upload">{{ 'collect.profile.upload'|trans }}</option>
                <option value="collab" selected>{{ 'collect.profile.collab'|trans }}</option>
                <option value="custom">{{ 'collect.profile.custom'|trans }}</option>
            </select>
            <div class="form-check"><input class="form-check-input" type="checkbox" name="allowView" value="1" {% if collection.allowView %}checked{% endif %}><label class="form-check-label">{{ 'collect.perm.view'|trans }}</label></div>
            <div class="form-check"><input class="form-check-input" type="checkbox" name="allowDownload" value="1" {% if collection.allowDownload %}checked{% endif %}><label class="form-check-label">{{ 'collect.perm.download'|trans }}</label></div>
            <div class="form-check"><input class="form-check-input" type="checkbox" name="allowUpload" value="1" {% if collection.allowUpload %}checked{% endif %}><label class="form-check-label">{{ 'collect.perm.upload'|trans }}</label></div>
            <div class="form-check"><input class="form-check-input" type="checkbox" name="allowDeleteOwn" value="1" {% if collection.allowDeleteOwn %}checked{% endif %}><label class="form-check-label">{{ 'collect.perm.deleteOwn'|trans }}</label></div>
            <div class="form-check"><input class="form-check-input" type="checkbox" name="allowShowUploader" value="1" {% if collection.allowShowUploader %}checked{% endif %}><label class="form-check-label">{{ 'collect.perm.showUploader'|trans }}</label></div>
            <div class="form-check mb-4"><input class="form-check-input" type="checkbox" name="allowZipDownload" value="1" {% if collection.allowZipDownload %}checked{% endif %}><label class="form-check-label">{{ 'collect.perm.zip'|trans }}</label></div>
            <button class="button button-blue" type="submit">{{ 'collect.continue'|trans }}</button>
        </form>
    {% elseif step == 4 %}
        <form method="post" class="sign-form">
            <div class="form-check"><input class="form-check-input" type="checkbox" name="requirePassword" value="1" {% if collection.requirePassword %}checked{% endif %}><label class="form-check-label">{{ 'collect.sec.password'|trans }}</label></div>
            <input class="form-control mb-3" type="password" name="password" placeholder="{{ 'collect.sec.passwordPlaceholder'|trans }}">
            <div class="form-check"><input class="form-check-input" type="checkbox" name="requireEmailCode" value="1" {% if collection.requireEmailCode %}checked{% endif %}><label class="form-check-label">{{ 'collect.sec.emailCode'|trans }}</label></div>
            <div class="form-check mb-3"><input class="form-check-input" type="checkbox" name="requireTerms" value="1" {% if collection.requireTerms %}checked{% endif %}><label class="form-check-label">{{ 'collect.sec.terms'|trans }}</label></div>
            <label class="form-label">{{ 'collect.sec.storageLimitMb'|trans }}</label>
            <input class="form-control mb-4" type="number" min="0" name="storageLimitMb" value="{{ collection.storageLimitBytes ? (collection.storageLimitBytes / 1024 / 1024)|round(0) : '' }}">
            <button class="button button-blue" type="submit">{{ 'collect.continue'|trans }}</button>
        </form>
    {% elseif step == 5 %}
        <form method="post" class="sign-form">
            <div class="form-check"><input class="form-check-input" type="checkbox" name="notifyOwnerOnUpload" value="1" {% if collection.notifyOwnerOnUpload %}checked{% endif %}><label class="form-check-label">{{ 'collect.notify.ownerUpload'|trans }}</label></div>
            <div class="form-check mb-4"><input class="form-check-input" type="checkbox" name="notifyBeforeExpiry" value="1" {% if collection.notifyBeforeExpiry %}checked{% endif %}><label class="form-check-label">{{ 'collect.notify.beforeExpiry'|trans }}</label></div>
            <button class="button button-blue" type="submit">{{ 'collect.continue'|trans }}</button>
        </form>
    {% else %}
        <ul class="sign-help">
            <li>{{ 'collect.field.title'|trans }}: {{ collection.title }}</li>
            <li>{{ 'collect.field.type'|trans }}: {{ ('collect.type.' ~ collection.type)|trans }}</li>
            <li>{{ 'collect.field.expiresAt'|trans }}: {{ collection.expiresAt ? collection.expiresAt|date('d.m.Y H:i') : '—' }}</li>
            <li>{{ 'collect.col.files'|trans }}: {{ availableFiles|length }}</li>
        </ul>
        <form method="post" class="d-flex gap-2">
            <button class="button" type="submit" name="action" value="draft">{{ 'collect.saveDraft'|trans }}</button>
            <button class="button button-blue" type="submit" name="action" value="activate">{{ 'collect.activate'|trans }}</button>
        </form>
    {% endif %}
</div></div>
{% endblock %}
{% block javascripts %}{{ parent() }}{{ encore_entry_script_tags('collect') }}{% endblock %}