{% extends "base.html" %}
{% block title %}
{% if mode == 'space_new' %}Новое пространство
{% elif mode == 'space_edit' %}Настройки пространства
{% elif mode == 'file_edit' %}Редактирование файла
{% elif mode == 'file_move' %}Переместить файл
{% endif %} — Morozovka Portal
{% endblock %}
{% block main_class %}container container-narrow{% endblock %}

{% block content %}

{% if mode == 'space_new' %}
<div class="files-hero">
    <div class="files-hero-left">
        <h1>📂 Новое пространство</h1>
        <p class="subtitle">Пространство — это верхний уровень: по проекту, направлению или тематике</p>
    </div>
</div>
<form method="POST" class="form-card">
    {% if error %}<div style="color:#f85149;margin-bottom:12px;padding:8px 12px;background:rgba(248,81,73,0.1);border-radius:6px;">{{ error }}</div>{% endif %}
    <div class="form-group">
        <label>Название <span class="req">*</span></label>
        <input type="text" name="name" value="{{ form.get('name', '') }}" required maxlength="200" autofocus>
    </div>
    <div class="form-group">
        <label>Описание</label>
        <textarea name="description" style="min-height:80px;">{{ form.get('description', '') }}</textarea>
    </div>
    <div class="form-row">
        <div class="form-group">
            <label>Видимость</label>
            <select name="visibility">
                <option value="internal" {% if form.get('visibility') == 'internal' or not form.get('visibility') %}selected{% endif %}>Внутреннее (все залогиненные)</option>
                <option value="public" {% if form.get('visibility') == 'public' %}selected{% endif %}>Публичное (видят все)</option>
                <option value="private" {% if form.get('visibility') == 'private' %}selected{% endif %}>Приватное (только по ACL)</option>
            </select>
        </div>
        {% if projects %}
        <div class="form-group">
            <label>Привязать к проекту (опционально)</label>
            <select name="project_id">
                <option value="">— не привязано —</option>
                {% for proj, member in projects %}
                <option value="{{ proj.id }}" {% if form.get('project_id') == proj.id|string %}selected{% endif %}>{{ proj.title }}</option>
                {% endfor %}
            </select>
        </div>
        {% endif %}
    </div>
    <div class="form-actions">
        <button type="submit" class="btn btn-primary">Создать</button>
        <a href="/files" class="btn btn-default">Отмена</a>
    </div>
</form>

{% elif mode == 'space_edit' %}
<div class="files-hero">
    <div class="files-hero-left">
        <h1>⚙ Настройки — {{ space.name }}</h1>
        <p class="subtitle">Изменение названия, описания и видимости</p>
    </div>
    <div class="files-hero-actions">
        <a href="/files/space/{{ space.id }}" class="btn btn-default">← Назад</a>
    </div>
</div>
<form method="POST" class="form-card">
    <div class="form-group">
        <label>Название</label>
        <input type="text" name="name" value="{{ space.name }}" required maxlength="200">
    </div>
    <div class="form-group">
        <label>Описание</label>
        <textarea name="description" style="min-height:80px;">{{ space.description or '' }}</textarea>
    </div>
    <div class="form-group">
        <label>Видимость</label>
        <select name="visibility">
            <option value="internal" {% if space.visibility == 'internal' %}selected{% endif %}>Внутреннее (все залогиненные)</option>
            <option value="public" {% if space.visibility == 'public' %}selected{% endif %}>Публичное (видят все)</option>
            <option value="private" {% if space.visibility == 'private' %}selected{% endif %}>Приватное (только по ACL)</option>
        </select>
    </div>
    <div class="form-actions">
        <button type="submit" class="btn btn-primary">Сохранить</button>
        <a href="/files/space/{{ space.id }}" class="btn btn-default">Отмена</a>
    </div>
</form>

{% if perms.is_owner or session.get('role') == 'admin' %}
<div class="form-card" style="margin-top:16px;border-color:rgba(248,81,73,0.4);background:rgba(248,81,73,0.03);">
    <h3 style="margin-top:0;color:#f85149;font-size:15px;">⚠ Опасная зона</h3>
    <p style="color:var(--text-muted);font-size:13px;line-height:1.5;">
        Удаление пространства удалит <strong style="color:#f85149;">все папки, файлы и историю версий</strong> внутри. Необратимо.
    </p>
    <form action="/files/space/{{ space.id }}/delete" method="POST" onsubmit="return confirm('Удалить пространство и ВСЕ файлы в нём? Это действие необратимо.');">
        <button type="submit" class="btn btn-danger">Удалить пространство</button>
    </form>
</div>
{% endif %}

{% elif mode == 'file_edit' %}
<div class="files-hero">
    <div class="files-hero-left">
        <h1>✎ Редактирование файла</h1>
        <p class="subtitle">{{ db_file.original_name }} · {{ db_file.size_bytes|format_size }} · v{{ db_file.version }}</p>
    </div>
    <div class="files-hero-actions">
        <a href="/files/download/{{ db_file.id }}" class="btn btn-primary">⬇ Скачать</a>
        {% if db_file.space_id %}
        <a href="/files/{{ db_file.id }}/history" class="btn btn-default">🕘 История</a>
        {% endif %}
    </div>
</div>
<form method="POST" class="form-card">
    <div class="form-group">
        <label>Файл</label>
        <div style="padding:10px 14px;background:var(--bg);border:1px solid var(--border);border-radius:6px;display:flex;align-items:center;gap:10px;">
            <span style="font-size:22px;">{{ db_file.original_name|file_icon }}</span>
            <span style="color:var(--text);font-family:ui-monospace,monospace;font-size:13px;">{{ db_file.original_name }}</span>
        </div>
    </div>
    <div class="form-group">
        <label>Описание</label>
        <textarea name="description" style="min-height:80px;" placeholder="Что это за файл, для чего, кому пригодится...">{{ db_file.description or '' }}</textarea>
    </div>
    <div class="form-group">
        <label>Теги</label>
        <input type="text" name="tags" value="{{ db_file.tags or '' }}" placeholder="через, запятую">
        <span class="hint">Помогают искать файл через /files/search</span>
    </div>
    {% if db_file.space_id and folders %}
    <div class="form-group">
        <label>Папка</label>
        <select name="folder_id">
            <option value="">— корень пространства —</option>
            {% for fd in folders %}
            <option value="{{ fd.id }}" {% if db_file.folder_id == fd.id %}selected{% endif %}>{{ fd.name }}</option>
            {% endfor %}
        </select>
    </div>
    {% endif %}
    <div class="form-actions">
        <button type="submit" class="btn btn-primary">Сохранить</button>
        <a href="{% if db_file.folder_id %}/files/folder/{{ db_file.folder_id }}{% elif db_file.space_id %}/files/space/{{ db_file.space_id }}{% else %}/files{% endif %}" class="btn btn-default">Отмена</a>
    </div>
</form>

{% elif mode == 'file_move' %}
<div class="files-hero">
    <div class="files-hero-left">
        <h1>↔ Переместить файл</h1>
        <p class="subtitle">{{ db_file.original_name }}</p>
    </div>
</div>
<form method="POST" class="form-card">
    <div class="form-group">
        <label>Файл</label>
        <div style="padding:10px 14px;background:var(--bg);border:1px solid var(--border);border-radius:6px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;">
            <span style="font-size:22px;">{{ db_file.original_name|file_icon }}</span>
            <span style="color:var(--text);font-family:ui-monospace,monospace;font-size:13px;">{{ db_file.original_name }}</span>
            <span style="color:var(--text-muted);font-size:12px;margin-left:auto;">
                {% if db_file.space_id %}в пространстве{% else %}без пространства{% endif %}
                {% if db_file.folder_id %} · папка #{{ db_file.folder_id }}{% endif %}
                · v{{ db_file.version }}
            </span>
        </div>
    </div>

    <div class="form-group">
        <label>Куда переместить?</label>
        <select name="space_id" id="move-space-select" onchange="updateFolderOptions()">
            <option value="">— Без пространства (личное) —</option>
            {% for sp in available_spaces %}
            <option value="{{ sp.id }}" {% if db_file.space_id == sp.id %}selected{% endif %}>{{ sp.name }}</option>
            {% endfor %}
        </select>
        {% if db_file.space_id %}
        <span class="hint">⚠ При перемещении «Без пространства» версии будут сброшены. Блоб текущей версии сохранится.</span>
        {% endif %}
    </div>

    <div class="form-group" id="move-folder-group">
        <label>Папка (опционально)</label>
        <select name="folder_id" id="move-folder-select">
            <option value="">— корень пространства —</option>
        </select>
    </div>

    <div class="form-actions">
        <button type="submit" class="btn btn-primary">Переместить</button>
        <a href="{% if db_file.folder_id %}/files/folder/{{ db_file.folder_id }}{% elif db_file.space_id %}/files/space/{{ db_file.space_id }}{% else %}/files{% endif %}" class="btn btn-default">Отмена</a>
    </div>
</form>

<script>
const FOLDERS_BY_SPACE = {{ (folders_by_space or {})|tojson }};
const CURRENT_FOLDER_ID = {{ db_file.folder_id or 'null' }};

function updateFolderOptions() {
    const spaceSelect = document.getElementById('move-space-select');
    const folderSelect = document.getElementById('move-folder-select');
    const folderGroup = document.getElementById('move-folder-group');
    const spaceId = spaceSelect.value;
    folderSelect.innerHTML = '<option value="">— корень пространства —</option>';
    if (!spaceId) {
        folderGroup.style.display = 'none';
        return;
    }
    folderGroup.style.display = '';
    const folders = FOLDERS_BY_SPACE[spaceId] || [];
    folders.forEach(function(f) {
        const opt = document.createElement('option');
        opt.value = f.id;
        opt.textContent = f.name;
        if (String(f.id) === String(CURRENT_FOLDER_ID)) opt.selected = true;
        folderSelect.appendChild(opt);
    });
}

document.addEventListener('DOMContentLoaded', updateFolderOptions);
</script>
{% endif %}

{% endblock %}