@extends('layouts.app')

@section('content')
    <div class="container mt-5">
        @if(session('error'))
            <div class="alert alert-danger">{{ session('error') }}</div>
        @endif
        <h2>📄 Document Generator</h2>
        <a href="{{ route('dashboard') }}" class="btn btn-warning mb-3">⬅️ Back to Dashboard</a>
        <p class="text-muted">Generate legal templates like NDAs, leases, etc.</p>

        <form action="{{ route('generator.generate') }}" method="POST" onsubmit="showLoader()">
        @csrf

            <div class="mb-3">
                <label class="form-label">Document Type</label>
                <select name="type" class="form-select" required>
                    <option value="nda" {{ old('type') == 'nda' ? 'selected' : '' }}>Non-Disclosure Agreement (NDA)</option>
                    <option value="lease" {{ old('type') == 'lease' ? 'selected' : '' }}>Lease Agreement</option>
                </select>
            </div>

            <div class="mb-3">
                <label class="form-label">Party A (e.g. Company or Landlord)</label>
                <input type="text" name="party_a" class="form-control" required value="{{ old('party_a') }}">
            </div>

            <div class="mb-3">
                <label class="form-label">Party B (e.g. Employee or Tenant)</label>
                <input type="text" name="party_b" class="form-control" required value="{{ old('party_b') }}">
            </div>

            <div class="mb-3">
                <label class="form-label">Agreement Date</label>
                <input type="date" name="date" class="form-control" required value="{{ old('date') }}">
            </div>

            <button class="btn btn-success">Generate Document</button>
        </form>

        @isset($generated)
            <hr>
            <h4 class="mt-4">📝 Generated Document</h4>
            <div class="bg-light p-3 rounded border">
                <pre>{{ $generated }}</pre>
            </div>
            <button class="btn btn-outline-secondary mt-2" onclick="copyToClipboard()">📋 Copy to Clipboard</button>
            <form action="{{ route('generator.download.pdf') }}" method="POST" target="_blank">
                @csrf
                <input type="hidden" name="document_text" value="{{ $generated }}">
                <input type="hidden" name="type" value="{{ $inputs['type'] ?? 'document' }}">
                <button type="submit" class="btn btn-outline-dark mt-2">⬇️ Download as PDF</button>
            </form>
        @endisset
        <script>
            function copyToClipboard() {
                const text = document.getElementById("generatedText").innerText;
                navigator.clipboard.writeText(text).then(function () {
                    alert("Copied to clipboard!");
                }, function (err) {
                    alert("Failed to copy.");
                });
            }
        </script>

    </div>
    <!-- Loading Overlay -->
    <div id="loadingOverlay"
         class="position-fixed top-0 start-0 w-100 h-100 bg-white bg-opacity-75 d-none d-flex justify-content-center align-items-center"
         style="z-index: 9999;">
        <div class="text-center">
            <div class="spinner-border text-success mb-3" role="status" style="width: 3rem; height: 3rem;"></div>
            <p class="fw-bold text-success fs-5">Generating your document, please wait...</p>
        </div>
    </div>

    <script>
        function showLoader() {
            document.getElementById('loadingOverlay').classList.remove('d-none');
        }

        window.addEventListener('DOMContentLoaded', () => {
            document.getElementById('loadingOverlay').classList.add('d-none');
        });
    </script>

@endsection