@extends('admin.layout')
@section('title', 'Media library')
@section('content')
<div class="toolbar">
    <form class="search" method="get">
        <input type="search" name="q" value="{{ request('q') }}" placeholder="Search file name, title or alt text">
        <select name="kind" data-autosubmit>
            <option value="">All files</option>
            <option value="image" @selected(request('kind') === 'image')>Images</option>
            <option value="document" @selected(request('kind') === 'document')>Documents &amp; video</option>
        </select>
        <button class="btn" type="submit">Search</button>
    </form>
    <form method="post" action="{{ route('admin.media.store') }}" enctype="multipart/form-data" class="upload-form">
        @csrf
        <label class="btn btn-primary" data-tip="Or drag files anywhere onto this page">@include('admin._icon', ['i' => 'upload'])Upload files<input type="file" name="files[]" multiple hidden data-autosubmit accept=".{{ str_replace(',', ',.', config('anan.upload_mimes')) }}"></label>
    </form>
</div>
<p class="small muted">Allowed: {{ str_replace(',', ', ', config('anan.upload_mimes')) }} · max {{ (int) (config('anan.upload_max_kb') / 1024) }} MB each. {{ number_format($media->total()) }} files.</p>

<div class="media-grid">
@foreach ($media as $m)
    <div class="media-card">
        <a class="media-thumb" href="{{ $m->url() }}" target="_blank" rel="noopener">
            @if ($m->isImage())<img src="{{ $m->thumbUrl() }}" alt="" loading="lazy">@else<span class="file-ext">{{ strtoupper(pathinfo($m->path, PATHINFO_EXTENSION)) }}</span>@endif
        </a>
        <details>
            <summary title="{{ $m->path }}">{{ \Illuminate\Support\Str::limit($m->title ?: basename($m->path), 28) }}</summary>
            <form method="post" action="{{ route('admin.media.update', $m) }}" class="stack">
                @csrf @method('PUT')
                <input type="text" name="title" value="{{ $m->title }}" placeholder="Title">
                <input type="text" name="alt" value="{{ $m->alt }}" placeholder="Alt text">
                <input type="text" readonly value="{{ $m->url() }}" data-select-on-focus>
                <div class="small muted">{{ $m->width ? $m->width.'×'.$m->height.' · ' : '' }}{{ number_format($m->size / 1024) }} KB</div>
                <button class="btn btn-sm" type="submit">Save</button>
            </form>
            <form method="post" action="{{ route('admin.media.destroy', $m) }}" data-confirm="Delete this file?">
                @csrf @method('DELETE')
                @if (session('force_delete') === $m->id)<input type="hidden" name="force" value="1">@endif
                <button class="btn btn-sm btn-danger" type="submit">{{ session('force_delete') === $m->id ? 'Delete anyway' : 'Delete' }}</button>
            </form>
        </details>
    </div>
@endforeach
</div>
{{ $media->links() }}
@endsection