@extends('layouts.app')

@section('content')
    <div class="container-xxl flex-grow-1 container-p-y">
        <div class="card">
            <div class="card-header">
                <div class="row align-items-center">
                    <div class="col-6">
                        <h5 class="card-title mb-0">Edit Proof Media</h5>
                    </div>
                    <div class="col-6 text-end">
                        <a href="{{ route('proof-media.index') }}" class="btn btn-secondary">
                            <i class="fas fa-arrow-left"></i> Back
                        </a>
                    </div>
                </div>
                <hr />
            </div>

            <div class="card-body">
               
                    <form action="{{ route('proof-media.update', ['proofMedia' => $proofMedia->id]) }}"
                          method="POST" enctype="multipart/form-data">
                        @csrf
                        @method('PUT')

                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label for="checklist_item_id" class="form-label">Checklist Item *</label>
                                <select class="form-control @error('checklist_item_id') is-invalid @enderror"
                                        id="checklist_item_id" name="checklist_item_id" required>
                                    <option value="">Select Checklist Item</option>
                                    @foreach($checklistItems as $item)
                                        <option value="{{ $item->id }}"
                                            {{ old('checklist_item_id', $proofMedia->checklist_item_id) == $item->id ? 'selected' : '' }}>
                                            {{ $item->task_title }} - {{ $item->checklist->mosque->name }} 
                                        </option>
                                    @endforeach
                                </select>
                                @error('checklist_item_id')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-md-6 mb-3">
                                <label for="source" class="form-label">Source *</label>
                                <select class="form-control @error('source') is-invalid @enderror"
                                        id="source" name="source" required>
                                    <option value="">Select Source</option>
                                    @foreach($sources as $key => $label)
                                        <option value="{{ $key }}"
                                            {{ old('source', $proofMedia->source) == $key ? 'selected' : '' }}>
                                            {{ $label }}
                                        </option>
                                    @endforeach
                                </select>
                                @error('source')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-md-6 mb-3">
                                <label for="uploaded_by" class="form-label">Uploaded By</label>
                                <select class="form-control @error('uploaded_by') is-invalid @enderror"
                                        id="uploaded_by" name="uploaded_by">
                                    <!--<option value="">Select User</option>-->
                                    @foreach($users as $user)
                                        <option value="{{ $user->id }}"
                                            {{ old('uploaded_by', $proofMedia->uploaded_by) == $user->id ? 'selected' : '' }}>
                                            {{ $user->name }}
                                        </option>
                                    @endforeach
                                </select>
                                @error('uploaded_by')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-md-6 mb-3">
                                <label for="file" class="form-label">New File (Optional)</label>
                                <input type="file" class="form-control @error('file') is-invalid @enderror"
                                       id="file" name="file" accept=".jpg,.jpeg,.png,.gif,.mp4,.mov,.avi,.pdf,.doc,.docx">
                                <small class="text-muted">Leave empty to keep current file</small>
                                @error('file')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-md-12 mb-3">
                                <label class="form-label">Current File</label>
                                <div class="border p-3 rounded">
                                    @php
                                        $extension = pathinfo($proofMedia->file_url, PATHINFO_EXTENSION);
                                        $imageExtensions = ['jpg', 'jpeg', 'png', 'gif'];
                                        $videoExtensions = ['mp4', 'mov', 'avi'];
                                    @endphp

                                    @if(in_array(strtolower($extension), $imageExtensions))
                                        <img src="{{ asset($proofMedia->file_url) }}"
                                             class="img-thumbnail"
                                             alt="Current file"
                                             style="max-width: 200px;">
                                    @elseif(in_array(strtolower($extension), $videoExtensions))
                                        <div class="text-center">
                                            <i class="fas fa-video fa-3x text-primary"></i>
                                            <p class="mt-2 mb-0">Video File</p>
                                            <small class="text-muted">({{ strtoupper($extension) }})</small>
                                        </div>
                                    @else
                                        <div class="text-center">
                                            <i class="fas fa-file fa-3x text-secondary"></i>
                                            <p class="mt-2 mb-0">Document File</p>
                                            <small class="text-muted">({{ strtoupper($extension) }})</small>
                                        </div>
                                    @endif

                                    <div class="mt-2">
                                        <a href="{{ asset($proofMedia->file_url) }}" target="_blank" class="btn btn-sm btn-info">
                                            <i class="fas fa-external-link-alt"></i> View Original
                                        </a>
                                        <a href="{{ route('proof-media.download', ['proofMedia' => $proofMedia->id]) }}" class="btn btn-sm btn-success">
                                            <i class="fas fa-download"></i> Download
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="mt-4">
                            <button type="submit" class="btn btn-primary">
                                <i class="fas fa-save"></i> Update Media
                            </button>
                            <a href="{{ route('proof-media.index') }}" class="btn btn-secondary">Cancel</a>
                        </div>
                    </form>
{{--               
                    <div class="alert alert-danger">
                        <i class="fas fa-ban"></i> You don't have permission to update proof media.
                    </div> --}}
            
            </div>
        </div>
    </div>
@endsection