@extends('layouts.app')

@section('title', 'Edit · ' . $document->title . ' · ' . config('app.name'))
@section('page-title', 'Edit Document')

@section('content')
    <div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
        <div>
            <h2 class="h5 fw-semibold mb-1">{{ $document->title }}</h2>
            <span class="text-secondary small">Editing content &middot; saving creates a new version</span>
        </div>
        <div class="d-flex gap-2">
            <a href="{{ route('documents.show', $document) }}" class="btn btn-outline-secondary btn-sm"><i class="bi bi-arrow-left"></i> Back to Document</a>
            <button id="editor-save-btn" type="button" class="btn btn-primary btn-sm" disabled><i class="bi bi-save"></i> Save New Version</button>
        </div>
    </div>

    <div id="editor-status" class="text-secondary small mb-2">Loading document&hellip;</div>
    <div id="collab-presence" class="d-flex align-items-center gap-2 mb-2"></div>
    <div id="editor-toolbar" class="border rounded bg-white mb-2"></div>
    <div id="editor-root"
        class="border rounded bg-white"
        style="height: 75vh; overflow: auto;"
        data-document-url="{{ route('documents.download', [$document, $document->latestVersion()->version_number]) }}"
        data-save-url="{{ route('documents.versions.store', $document) }}"
        data-redirect-url="{{ route('documents.show', $document) }}"
        data-file-name="{{ \Illuminate\Support\Str::slug($document->title) }}.docx"
        data-user-id="{{ Auth::id() }}"
        data-user-name="{{ Auth::user()->name }}"
        data-user-email="{{ Auth::user()->email }}"
        data-collab-token-url="{{ route('documents.collab-token', $document) }}"
    ></div>

    <div id="manual-upload-fallback" class="card mt-3 d-none border-warning">
        <div class="card-header bg-white fw-semibold">Upload Edited File Instead</div>
        <div class="card-body">
            <p class="small text-secondary mb-2">
                Download the original, edit it in Word, then upload the edited file here to save it as a new version.
            </p>
            <form method="POST" action="{{ route('documents.versions.store', $document) }}" enctype="multipart/form-data" class="d-flex flex-wrap gap-2 align-items-start">
                @csrf
                <div>
                    <input type="file" name="file" accept=".doc,.docx,.pdf" required class="form-control form-control-sm @error('file') is-invalid @enderror">
                    @error('file')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
                <button type="submit" class="btn btn-sm btn-primary"><i class="bi bi-upload"></i> Upload New Version</button>
                <a href="{{ route('documents.download', $document) }}" class="btn btn-sm btn-outline-secondary"><i class="bi bi-download"></i> Download Original</a>
            </form>
        </div>
    </div>

    @push('scripts')
        @vite(['resources/js/document-editor.js'])
    @endpush
@endsection