@extends('admin.layouts.app')

@section('title', $wisata->exists ? 'Edit Wisata' : 'Tambah Wisata')
@section('page_title', $wisata->exists ? 'Edit Wisata' : 'Tambah Wisata')
@section('page_subtitle', 'Lengkapi informasi destinasi dan aset AR')

@section('content')
<form method="POST" enctype="multipart/form-data" action="{{ $wisata->exists ? route('admin.wisata.update', $wisata) : route('admin.wisata.store') }}">
    @csrf
    @if($wisata->exists) @method('PUT') @endif
    <div class="row g-3">
        <div class="col-lg-8">
            <div class="card soft-card mb-3">
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-md-8">
                            <label class="form-label">Title</label>
                            <input class="form-control @error('title') is-invalid @enderror" name="title" value="{{ old('title', $wisata->title) }}" required>
                            @error('title')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Category</label>
                            <select class="form-select @error('kategori_id') is-invalid @enderror" name="kategori_id" required>
                                <option value="">Pilih</option>
                                @foreach($kategoris as $kategori)
                                    <option value="{{ $kategori->id }}" @selected(old('kategori_id', $wisata->kategori_id) == $kategori->id)>{{ $kategori->nama }}</option>
                                @endforeach
                            </select>
                            @error('kategori_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                        <div class="col-md-8">
                            <label class="form-label">Location</label>
                            <input class="form-control @error('location') is-invalid @enderror" name="location" value="{{ old('location', $wisata->location) }}" required>
                            @error('location')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Rating</label>
                            <input class="form-control @error('rating') is-invalid @enderror" name="rating" type="number" min="0" max="5" step="0.1" value="{{ old('rating', $wisata->rating ?? 0) }}" required>
                            @error('rating')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                        <div class="col-md-4"><label class="form-label">Distance</label><input class="form-control" name="distance" value="{{ old('distance', $wisata->distance) }}"></div>
                        <div class="col-md-4"><label class="form-label">Elevation</label><input class="form-control" name="elevation" value="{{ old('elevation', $wisata->elevation) }}"></div>
                        <div class="col-md-4"><label class="form-label">Tiket Parkir</label><input class="form-control" name="tiket_parkir" value="{{ old('tiket_parkir', $wisata->tiket_parkir) }}"></div>
                        <div class="col-md-6"><label class="form-label">Jam Operasional</label><input class="form-control" name="jam_operasional" value="{{ old('jam_operasional', $wisata->jam_operasional) }}"></div>
                        <div class="col-md-3"><label class="form-label">Latitude</label><input class="form-control" name="latitude" value="{{ old('latitude', $wisata->latitude) }}"></div>
                        <div class="col-md-3"><label class="form-label">Longitude</label><input class="form-control" name="longitude" value="{{ old('longitude', $wisata->longitude) }}"></div>
                        <div class="col-12">
                            <label class="form-label">Short Description</label>
                            <textarea class="form-control" name="short_description" rows="3">{{ old('short_description', $wisata->short_description) }}</textarea>
                        </div>
                        <div class="col-12">
                            <label class="form-label">Overview</label>
                            <textarea class="form-control" name="overview" rows="7">{{ old('overview', $wisata->overview) }}</textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-4">
            <div class="card soft-card mb-3">
                <div class="card-body">
                    <h2 class="h6 mb-3">Media Wisata</h2>
                    <div class="mb-3">
                        <label class="form-label">Image</label>
                        <input class="form-control @error('image') is-invalid @enderror" type="file" name="image" accept="image/*" data-preview="imagePreview" {{ $wisata->exists ? '' : 'required' }}>
                        @error('image')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        <img id="imagePreview" class="img-fluid rounded border mt-3 w-100" src="{{ $wisata->image_url }}" alt="Preview gambar">
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Model GLB / GLTF</label>
                        <input class="form-control @error('model_path') is-invalid @enderror" type="file" name="model_path" accept=".glb,.gltf">
                        <div class="form-text">Upload file model 3D berformat .glb atau .gltf, maksimal 50MB.</div>
                        @error('model_path')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        @if($wisata->model_path)
                            <model-viewer class="w-100 mt-3 border rounded" style="height:260px" src="{{ $wisata->fileUrl($wisata->model_path) }}" camera-controls auto-rotate></model-viewer>
                        @endif
                    </div>
                    <div class="form-check form-switch mb-3">
                        <input class="form-check-input" type="checkbox" role="switch" name="is_video" value="1" id="is_video" @checked(old('is_video', $wisata->is_video))>
                        <label class="form-check-label" for="is_video">Wisata video</label>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Video Path</label>
                        <input class="form-control @error('video_path') is-invalid @enderror" type="file" name="video_path" accept="video/mp4,video/webm,video/quicktime">
                        @error('video_path')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        @if($wisata->video_path)
                            <video class="w-100 mt-3 rounded border" src="{{ $wisata->fileUrl($wisata->video_path) }}" controls></video>
                        @endif
                    </div>
                    <div class="d-grid gap-2">
                        <button class="btn btn-nature" type="submit"><i class="bi bi-check2 me-1"></i>Simpan Wisata</button>
                        <a class="btn btn-outline-secondary" href="{{ route('admin.wisata.index') }}">Batal</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
@endsection

@push('scripts')
<script type="module" src="https://ajax.googleapis.com/ajax/libs/model-viewer/3.5.0/model-viewer.min.js"></script>
<script>
document.querySelectorAll('input[type=file][data-preview]').forEach((input) => {
    input.addEventListener('change', () => {
        const file = input.files?.[0];
        const target = document.getElementById(input.dataset.preview);
        if (file && target) target.src = URL.createObjectURL(file);
    });
});
</script>
@endpush
