@extends('admin.layouts.master')

@section('title', 'Edit Memorial')

@section('content')
    @php
        $image = $funeral->f_image
            ? url('uploads/funeral/'.$funeral->f_id.'/'.$funeral->f_image)
            : url('uploads/noimage.png');
    @endphp

    @include('admin.partials.page-header', [
        'title' => 'Edit Memorial',
        'crumbs' => [
            ['label' => 'Memorials', 'url' => route('admin.funeral.index')],
            ['label' => 'Edit'],
        ],
    ])

    <div class="card mt-3">
        <div class="card-body">
            <form method="POST" action="{{ route('admin.funeral.update') }}" enctype="multipart/form-data" id="funeralEditForm">
                @csrf
                <input type="hidden" name="f_id" value="{{ $funeral->f_id }}">
                <div class="row">
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Name <span class="text-danger">*</span></label>
                        <input type="text" name="f_name" class="form-control" value="{{ old('f_name', $funeral->f_name) }}">
                    </div>
                    <div class="col-md-6 mb-3">
                        <label class="form-label">QR Code</label>
                        <input type="text" class="form-control" value="{{ $funeral->f_qr_code }}" disabled>
                    </div>
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Born Date <span class="text-danger">*</span></label>
                        <input type="text" name="f_dob" class="form-control" data-provider="flatpickr" data-date-format="Y-m-d" placeholder="Select date" value="{{ old('f_dob', $funeral->f_dob) }}">
                    </div>
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Funeral Date <span class="text-danger">*</span></label>
                        <input type="text" name="f_funeral_date" class="form-control" data-provider="flatpickr" data-date-format="Y-m-d" placeholder="Select date" value="{{ old('f_funeral_date', $funeral->f_funeral_date) }}">
                    </div>
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Contact Email <span class="text-danger">*</span></label>
                        <input type="email" name="c_email" class="form-control" value="{{ old('c_email', $funeral->f_email) }}">
                    </div>
                    <div class="col-md-6 mb-3">
                        <label class="form-label">Photo</label>
                        <input type="file" name="f_image" class="form-control" accept=".jpg,.jpeg,.png,.gif,image/*">
                        <img src="{{ $image }}" alt="" class="img-thumbnail mt-2" style="max-width:120px;">
                    </div>
                    <div class="col-12 mb-3">
                        <label class="form-label">Obituary <span class="text-danger">*</span></label>
                        <textarea name="f_biography" class="form-control" rows="5">{{ old('f_biography', $funeral->f_biography) }}</textarea>
                    </div>
                    <div class="col-12 mb-3">
                        <div id="track-container">
                            <div class="text-muted small py-3">Loading background music options…</div>
                        </div>
                    </div>
                </div>
                <button type="submit" class="btn btn-primary">Update</button>
            </form>
        </div>
    </div>
@endsection

@push('scripts')
<script>
(function () {
    var uid = {{ (int) $funeral->user_id }};
    var trackIds = @json($funeral->f_track_id ?? '');
    $.post(@json(route('admin.funeral.get-track-update')), {
        u_id: uid,
        a_id: trackIds,
        _token: @json(csrf_token())
    }).done(function (html) {
        $('#track-container').html(html || '<div class="alert alert-warning mb-0">Unable to load tracks. Open <a href="{{ route('admin.playlist.index') }}">Playlist</a> and add music first.</div>');
    }).fail(function () {
        $('#track-container').html('<div class="alert alert-danger mb-0">Failed to load background music options.</div>');
    });

    $('#funeralEditForm').validate({
        rules: {
            f_name: { required: true },
            f_dob: { required: true },
            f_funeral_date: { required: true },
            c_email: { required: true, email: true },
            f_image: { extension: 'jpg,jpeg,png,gif' },
            f_biography: { required: true }
        },
        messages: {
            f_image: { extension: 'Only jpg, jpeg, png, gif allowed' }
        }
    });
})();
</script>
@endpush