@extends('layouts.portal')
@php
  $maxVideo = min($limits['video'], $limits['server']);
  $maxFile = min($limits['file'], $limits['server']);
  $kindIcons = ['video' => 'video', 'pdf' => 'file-text', 'file' => 'paperclip', 'link' => 'link'];
  $kindLabels = ['video' => 'Video', 'pdf' => 'PDF', 'file' => 'Other file', 'link' => 'Web link'];
  $hasFilters = ! empty(array_filter($filters));
  $bytes = collect($stats)->sum('bytes');
  $humanBytes = function ($b) {
      if ($b <= 0) { return '0 MB'; }
      $u = ['B', 'KB', 'MB', 'GB', 'TB']; $i = min((int) floor(log($b, 1024)), 4);
      return round($b / (1024 ** $i), $i > 1 ? 1 : 0).' '.$u[$i];
  };
  $openUpload = $errors->any() && old('_from') === 'upload';
@endphp
@section('title', 'Learning materials')
@section('subtitle', 'Lecture recordings, PDFs, lab guides and links for every course and batch.')
@section('actions')
  <button class="btn btn-primary" type="button" data-open-details="#upload"><x-icon name="upload" :size="16"/> Upload material</button>
@endsection

@section('content')
@if($limits['server'] < max($limits['video'], $limits['file']))
  <div class="callout warn mb-3"><x-icon name="alert" :size="20"/><div class="small"><b>Server upload limit: {{ $limits['server'] }} MB.</b> INFOTICS is configured for videos up to {{ $limits['video'] }} MB and documents up to {{ $limits['file'] }} MB, but this server currently accepts files up to {{ $limits['server'] }} MB only, so larger files will be rejected. Compress the file, paste a YouTube or Vimeo link for long videos, or raise <span class="mono">upload_max_filesize</span> and <span class="mono">post_max_size</span> in <span class="mono">php.ini</span> (and <span class="mono">client_max_body_size</span> in nginx) to at least {{ max($limits['video'], $limits['file']) }} MB.</div></div>
@endif

<div class="kpis">
  <div class="card kpi violet"><span class="ico"><x-icon name="video" :size="22"/></span><span>Videos</span><b>{{ number_format($stats['video']->c ?? 0) }}</b><small>Uploaded or embedded</small></div>
  <div class="card kpi red"><span class="ico"><x-icon name="file-text" :size="22"/></span><span>PDFs</span><b>{{ number_format($stats['pdf']->c ?? 0) }}</b><small>Slides, notes, cheat sheets</small></div>
  <div class="card kpi"><span class="ico"><x-icon name="paperclip" :size="22"/></span><span>Files and links</span><b>{{ number_format(($stats['file']->c ?? 0) + ($stats['link']->c ?? 0)) }}</b><small>{{ number_format($stats['file']->c ?? 0) }} files · {{ number_format($stats['link']->c ?? 0) }} links</small></div>
  <div class="card kpi green"><span class="ico"><x-icon name="database" :size="22"/></span><span>Storage used</span><b>{{ $humanBytes($bytes) }}</b><small>Uploaded files only</small></div>
</div>

<details class="panel b1-upload" id="upload" @if($openUpload) open @endif>
  <summary class="panel-head"><h2>Upload new material</h2><span class="xs muted">Videos up to {{ $maxVideo }} MB · documents up to {{ $maxFile }} MB</span><x-icon name="chevron-down" :size="18"/></summary>
  <form class="panel-body" method="post" action="{{ route('admin.materials.store') }}" enctype="multipart/form-data" data-upload data-material-form data-limits='@json(['video' => $maxVideo, 'file' => $maxFile])'>
    @csrf
    <input type="hidden" name="_from" value="upload">
    <fieldset class="b1-kinds">
      <legend class="label">Type</legend>
      @foreach(['video' => ['Video', 'MP4, WEBM, MOV or a YouTube / Vimeo link'], 'pdf' => ['PDF', 'Slides, notes, cheat sheets'], 'file' => ['Other file', 'DOCX, PPTX, XLSX, ZIP, TXT'], 'link' => ['Web link', 'External article or lab']] as $k => [$lab, $hint])
        <label class="b1-kind"><input type="radio" name="kind" value="{{ $k }}" @checked(old('kind', 'video') === $k)><span><x-icon :name="$kindIcons[$k]" :size="22"/><b>{{ $lab }}</b><small>{{ $hint }}</small></span></label>
      @endforeach
    </fieldset>

    <div class="form-grid mt-2">
      <div class="field">
        <label class="label" for="m-course">Course <span class="req">*</span></label>
        <select class="select" id="m-course" name="course_id" required><option value="">Choose a course</option>@foreach($courses as $c)<option value="{{ $c->id }}" @selected((string) old('course_id', $filters['course'] ?? '') === (string) $c->id)>{{ $c->title }}</option>@endforeach</select>
        @error('course_id')<div class="field-error">{{ $message }}</div>@enderror
      </div>
      <div class="field">
        <label class="label" for="m-batch">Who can see it?</label>
        <select class="select" id="m-batch" name="batch_id"><option value="">All learners of the course</option>@foreach($batches as $b)<option value="{{ $b->id }}" data-course="{{ $b->course_id }}" @selected((string) old('batch_id') === (string) $b->id)>Only batch {{ $b->batch_code }}</option>@endforeach</select>
        @error('batch_id')<div class="field-error">{{ $message }}</div>@enderror
      </div>
      <div class="field full">
        <label class="label" for="m-lesson">Attach to a lesson <span class="muted">(optional)</span></label>
        <select class="select" id="m-lesson" name="lesson_id"><option value="">Not linked to a lesson</option>@foreach($lessons as $cid => $list)@foreach($list as $l)<option value="{{ $l->id }}" data-course="{{ $cid }}" @selected((string) old('lesson_id') === (string) $l->id)>{{ $l->module->title }} › {{ $l->title }}</option>@endforeach @endforeach</select>
        @error('lesson_id')<div class="field-error">{{ $message }}</div>@enderror
      </div>
      <x-field name="title" label="Title" required full placeholder="e.g. Week 3: Virtual networks, lecture recording" help="Learners see the title, not the file name."/>
      <x-field name="description" type="textarea" label="Description" rows="3" full placeholder="What will learners get from this? (optional)"/>
    </div>

    <div class="field" data-file-wrap>
      <span class="label">File <span class="req" data-file-req>*</span></span>
      <div class="dropzone"><x-icon name="upload" :size="30"/><div class="bold" data-dz-label>Choose a file or drag it here</div><div class="xs muted" data-kind-hint>MP4, WEBM, MOV, M4V · up to {{ $maxVideo }} MB</div><input type="file" name="file" data-max-mb="{{ $maxVideo }}" accept=".mp4,.webm,.mov,.m4v" aria-label="File to upload"></div>
      @error('file')<div class="field-error">{{ $message }}</div>@enderror
    </div>
    <div class="field" data-url-wrap>
      <label class="label" for="m-url"><span data-url-label>Or paste a YouTube / Vimeo link</span></label>
      <input class="input" type="url" id="m-url" name="external_url" value="{{ old('external_url') }}" placeholder="https://">
      @error('external_url')<div class="field-error">{{ $message }}</div>@enderror
    </div>

    <div class="b1-checks">
      <label class="check"><input type="hidden" name="downloadable" value="0"><input type="checkbox" name="downloadable" value="1" checked> <span>Allow learners to download</span></label>
      <label class="check"><input type="hidden" name="notify" value="0"><input type="checkbox" name="notify" value="1" checked> <span>Notify enrolled learners by email</span></label>
    </div>

    <div class="upload-progress hidden"><i></i></div>
    <div class="small muted" data-upload-status role="status"></div>
    <button class="btn btn-primary mt-1" type="submit"><x-icon name="upload" :size="17"/> Upload material</button>
  </form>
</details>

<form method="get" class="filters b1-filters" role="search" aria-label="Filter materials">
  <div class="searchbox"><x-icon name="search" :size="18"/><input class="input" type="search" name="q" value="{{ $filters['q'] ?? '' }}" placeholder="Search by title" aria-label="Search materials by title"></div>
  <select class="select" name="course" data-autosubmit aria-label="Course">
    <option value="">Any course</option>
    @foreach($courses as $c)<option value="{{ $c->id }}" @selected((string) ($filters['course'] ?? '') === (string) $c->id)>{{ \Illuminate\Support\Str::limit($c->title, 44) }}</option>@endforeach
  </select>
  <select class="select" name="batch" data-autosubmit aria-label="Batch">
    <option value="">Any batch</option>
    @foreach($batches as $b)<option value="{{ $b->id }}" @selected((string) ($filters['batch'] ?? '') === (string) $b->id)>{{ $b->batch_code }}</option>@endforeach
  </select>
  <select class="select" name="kind" data-autosubmit aria-label="Type">
    <option value="">Any type</option>
    @foreach($kindLabels as $v => $l)<option value="{{ $v }}" @selected(($filters['kind'] ?? '') === $v)>{{ $l }}</option>@endforeach
  </select>
  <button class="btn btn-secondary btn-sm" type="submit">Search</button>
  @if($hasFilters)<a class="btn btn-ghost btn-sm" href="{{ route('admin.materials.index') }}">Clear</a>@endif
</form>

@if($resources->isEmpty())
  <div class="panel"><x-empty icon="folder" :title="$hasFilters ? 'No materials match these filters' : 'No materials yet'" :text="$hasFilters ? 'Try a different course, batch or type, or clear the filters.' : 'Upload a lecture recording, PDF or lab guide and learners see it in their course page straight away.'"><button class="btn btn-primary btn-sm" type="button" data-open-details="#upload">Upload material</button></x-empty></div>
@else
<div class="table-wrap">
  <table class="table b1-tbl">
    <thead><tr><th>Material</th><th>Course and audience</th><th class="num">Size</th><th>Uploaded</th><th>Status</th><th class="actions">Actions</th></tr></thead>
    <tbody>
    @foreach($resources as $r)
      <tr>
        <td class="b1-wide b1-mat"><div class="person"><span class="res-ico {{ $r->kind === 'pdf' ? 'pdf' : ($r->kind === 'video' ? 'video' : '') }} b1-ico"><x-icon :name="$kindIcons[$r->kind] ?? 'file-text'" :size="18"/></span><div class="b1-min"><b>{{ $r->title }}</b><div class="xs muted">{{ $kindLabels[$r->kind] ?? strtoupper($r->kind) }}@if($r->lesson) · {{ \Illuminate\Support\Str::limit($r->lesson->title, 34) }}@endif</div></div></div></td>
        <td class="b1-min b1-course">{{ \Illuminate\Support\Str::limit($r->course?->title ?? '—', 44) }}<span class="b1-sub">{{ $r->batch?->batch_code ? 'Only batch '.$r->batch->batch_code : 'All course learners' }}</span></td>
        <td class="num nowrap">{{ $r->humanSize() ?: '—' }}</td>
        <td><span class="nowrap">{{ $r->created_at->format('d M Y') }}</span><span class="b1-sub">{{ $r->uploader?->name ?? 'Unknown' }}</span></td>
        <td class="nowrap"><x-pill :status="$r->published ? 'published' : 'draft'"/>@if($r->path && ! $r->downloadable)<span class="b1-sub">View only</span>@endif</td>
        <td class="actions">
          <div class="ad-actions b1-acts">
            @if($r->path || $r->external_url)
              <a class="icon-btn" href="{{ $r->path ? route('lms.resource.download', $r) : $r->external_url }}" target="_blank" rel="noopener" aria-label="Open {{ $r->title }}" title="Open"><x-icon :name="$r->path ? 'download' : 'external-link'" :size="16"/></a>
            @endif
            <button class="icon-btn" type="button" data-modal-open="#mat-modal" data-mat-edit data-action="{{ route('admin.materials.update', $r) }}" data-title="{{ $r->title }}" data-description="{{ $r->description }}" data-published="{{ $r->published ? 1 : 0 }}" data-downloadable="{{ $r->downloadable ? 1 : 0 }}" data-file="{{ $r->path ? 1 : 0 }}" aria-label="Edit {{ $r->title }}" title="Edit title and visibility"><x-icon name="edit" :size="16"/></button>
            <form method="post" action="{{ route('admin.materials.destroy', $r) }}" data-confirm="Delete “{{ $r->title }}”? The file is removed and learners lose access.">@csrf @method('DELETE')<button class="icon-btn b1-danger" type="submit" aria-label="Delete {{ $r->title }}" title="Delete"><x-icon name="trash" :size="16"/></button></form>
          </div>
        </td>
      </tr>
    @endforeach
    </tbody>
  </table>
</div>
{{ $resources->links() }}
@endif

<div class="modal" id="mat-modal" role="dialog" aria-modal="true" aria-labelledby="mat-modal-h">
  <div class="modal-box b1-modal">
    <div class="between b1-modal-head"><div><h2 id="mat-modal-h">Edit material</h2><p class="small muted">Change the title or hide it from learners. To replace the file, delete it and upload again.</p></div><button class="icon-btn" type="button" data-modal-close aria-label="Close"><x-icon name="x" :size="18"/></button></div>
    <form method="post" action="#" data-mat-form>
      @csrf @method('PUT')
      <div class="field"><label class="label" for="me-title">Title <span class="req">*</span></label><input class="input" id="me-title" name="title" maxlength="160" required></div>
      <div class="field"><label class="label" for="me-desc">Description</label><textarea class="textarea" id="me-desc" name="description" rows="3" maxlength="1000"></textarea></div>
      <div class="b1-checks">
        <label class="check"><input type="hidden" name="published" value="0"><input type="checkbox" name="published" value="1" data-mat-published> <span>Visible to learners</span></label>
        <label class="check" data-mat-dl-wrap><input type="hidden" name="downloadable" value="0"><input type="checkbox" name="downloadable" value="1" data-mat-downloadable> <span>Allow download</span></label>
      </div>
      <div class="row b1-modal-foot"><button class="btn btn-secondary" type="button" data-modal-close>Cancel</button><button class="btn btn-primary" type="submit"><x-icon name="check" :size="16"/> Save changes</button></div>
    </form>
  </div>
</div>

@push('scripts')
<script src="{{ asset_v('assets/js/portals.js') }}" defer nonce="{{ csp_nonce() }}"></script>
<script src="{{ asset_v('assets/js/admin-b1.js') }}" defer nonce="{{ csp_nonce() }}"></script>
@endpush
@endsection