@extends('admin.layouts.app')

@section('title', 'Media')

@section('content')
<div class="admin-header-row">
    <h1 class="admin-title">Media kitabxanası</h1>
</div>

<div class="admin-card">
    <form method="POST" action="{{ route('admin.media.store') }}" enctype="multipart/form-data" style="margin-bottom: 20px;">
        @csrf
        <div class="admin-form-group">
            <label for="files">Fayl yüklə (çoxlu seçmək olar)</label>
            <input type="file" id="files" name="files[]" class="admin-form-control" multiple required>
        </div>
        <button type="submit" class="admin-btn admin-btn-primary">Yüklə</button>
    </form>

    <form method="GET" action="{{ route('admin.media.index') }}" class="admin-form-grid" style="margin-bottom: 20px;">
        <div class="admin-form-group">
            <select name="type" class="admin-form-control" onchange="this.form.submit()">
                <option value="">Bütün tiplər</option>
                <option value="images" {{ request('type') === 'images' ? 'selected' : '' }}>Şəkillər</option>
                <option value="videos" {{ request('type') === 'videos' ? 'selected' : '' }}>Videolar</option>
                <option value="documents" {{ request('type') === 'documents' ? 'selected' : '' }}>Sənədlər</option>
            </select>
        </div>
        <div class="admin-form-group">
            <input type="text" name="search" class="admin-form-control" placeholder="Axtar..." value="{{ request('search') }}">
        </div>
        <div class="admin-form-group">
            <button type="submit" class="admin-btn admin-btn-secondary">Axtar</button>
        </div>
    </form>
</div>

<div class="admin-card">
    <div class="admin-grid">
        @foreach($files as $file)
            <div class="admin-card" style="position: relative;">
                @if($file->folder === 'images')
                    <img src="{{ $file->url }}" alt="{{ $file->original_name }}" style="width: 100%; height: 150px; object-fit: cover; border-radius: 8px;">
                @elseif($file->folder === 'videos')
                    <video src="{{ $file->url }}" style="width: 100%; height: 150px; object-fit: cover; border-radius: 8px;" controls></video>
                @else
                    <div style="height: 150px; display: flex; align-items: center; justify-content: center; background: #1a1a1a; border-radius: 8px;">📄</div>
                @endif
                <p style="margin-top: 8px; font-size: 12px; color: #aaa; word-break: break-all;">{{ $file->original_name }}</p>
                <p style="font-size: 11px; color: #666;">{{ $file->folder }} · {{ number_format($file->file_size / 1024, 1) }} KB</p>
                <input type="text" class="admin-form-control" value="{{ $file->url }}" readonly onclick="this.select()">
                <form method="POST" action="{{ route('admin.media.destroy', $file) }}" style="margin-top: 8px;" onsubmit="return confirm('Silmək istədiyinizə əminsiniz?')">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="admin-btn admin-btn-danger" style="width: 100%;">Sil</button>
                </form>
            </div>
        @endforeach
    </div>

    {{ $files->links() }}
</div>
@endsection