@extends('layouts.admin')

@section('title', 'Game Edukasi')
@section('page_title', 'Game Edukasi')

@section('content')
    <section class="admin-page-header">
        <div>
            <h3>Game Edukasi</h3>
            <p>Kelola game edukasi yang dapat dimainkan oleh siswa.</p>
            <p style="margin-top: 6px; font-size: 13px; color: var(--text-gray, #64748b); max-width: 800px; line-height: 1.4;">
                <i class="fa-solid fa-circle-info"></i> Disarankan memakai game HTML lokal berbentuk ZIP agar konten lebih aman, bebas iklan, dan tetap berjalan di dalam SIPENA.
            </p>
        </div>

        <a href="#tambah-game" class="btn-add" style="text-decoration: none;">
            <i class="fa-solid fa-plus"></i> Tambah Game
        </a>
    </section>

    <div class="table-card">
        <table>
            <thead>
                <tr>
                    <th style="width: 70px;">No</th>
                    <th>Judul Game</th>
                    <th>Deskripsi</th>
                    <th>URL Game</th>
                    <th>Tipe URL</th>
                    <th>Status</th>
                    <th style="width: 250px;">Aksi</th>
                </tr>
            </thead>
            <tbody>
                @forelse ($games as $game)
                    <tr>
                        <td>{{ $loop->iteration }}</td>
                        <td>
                            <span class="table-title">{{ $game->judul }}</span>
                            @if ($game->kelas || $game->mataPelajaran)
                                <span class="table-subtext">
                                    {{ $game->kelas?->nama_kelas ?? 'Semua kelas' }}
                                    @if ($game->mataPelajaran)
                                        · {{ $game->mataPelajaran->nama_mapel }}
                                    @endif
                                </span>
                            @endif
                        </td>
                        <td><span class="table-muted">{{ $game->deskripsi ?: '-' }}</span></td>
                        <td>
                            <a class="url-link" href="{{ $game->game_url }}" target="_blank" rel="noopener noreferrer">
                                {{ $game->game_url }}
                            </a>
                        </td>
                        <td>
                            @php
                                $tipeUrl = 'Lainnya';
                                $badgeClass = 'inactive';
                                if (\Illuminate\Support\Str::contains($game->game_url, 'games.cdn.famobi.com')) {
                                    $tipeUrl = 'URL final';
                                    $badgeClass = 'siswa';
                                } elseif (\Illuminate\Support\Str::contains($game->game_url, 'play.famobi.com')) {
                                    $tipeUrl = 'Link awal';
                                    $badgeClass = 'guru';
                                } elseif (\Illuminate\Support\Str::startsWith($game->game_url, '/games/') || !\Illuminate\Support\Str::startsWith($game->game_url, ['http://', 'https://'])) {
                                    $tipeUrl = 'Lokal';
                                    $badgeClass = 'admin';
                                }
                            @endphp
                            <span class="badge {{ $badgeClass }}">
                                {{ $tipeUrl }}
                            </span>
                        </td>
                        <td>
                            <span class="status-pill {{ $game->status === 'aktif' ? 'status-active' : 'status-inactive' }}">
                                {{ ucfirst($game->status) }}
                            </span>
                        </td>
                        <td>
                            <div class="table-actions">
                                <a class="btn-small btn-small-preview" href="{{ route('admin.game.preview', $game) }}">
                                    <i class="fa-solid fa-eye"></i> Preview
                                </a>
                                <a class="btn-small btn-small-edit" href="#edit-game-{{ $game->id }}">
                                    <i class="fa-solid fa-pen"></i> Edit
                                </a>
                                <form class="delete-form" action="{{ route('admin.game.destroy', $game) }}" method="POST" onsubmit="return confirm('Hapus game ini?')">
                                    @csrf
                                    @method('DELETE')
                                    <button class="btn-small btn-small-danger" type="submit">
                                        <i class="fa-solid fa-trash"></i> Hapus
                                    </button>
                                </form>
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="7" class="empty-state">Belum ada data game edukasi.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="modal-overlay" id="tambah-game">
        <div class="modal-content modal-content-wide">
            <div class="modal-header">
                <h3>Tambah Game</h3>
                <a class="close-btn" href="{{ route('admin.game.index') }}"><i class="fa-solid fa-xmark"></i></a>
            </div>

            <form action="{{ route('admin.game.store') }}" method="POST" enctype="multipart/form-data">
                @csrf
                @include('admin.partials.game-form', [
                    'game' => null,
                    'kelas' => $kelas,
                    'mataPelajaran' => $mataPelajaran,
                    'submitLabel' => 'Simpan',
                ])
            </form>
        </div>
    </div>

    @foreach ($games as $game)
        <div class="modal-overlay" id="edit-game-{{ $game->id }}">
            <div class="modal-content modal-content-wide">
                <div class="modal-header">
                    <h3>Edit Game</h3>
                    <a class="close-btn" href="{{ route('admin.game.index') }}"><i class="fa-solid fa-xmark"></i></a>
                </div>

                <form action="{{ route('admin.game.update', $game) }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    @method('PUT')
                    @include('admin.partials.game-form', [
                        'game' => $game,
                        'kelas' => $kelas,
                        'mataPelajaran' => $mataPelajaran,
                        'submitLabel' => 'Simpan Perubahan',
                    ])
                </form>
            </div>
        </div>
    @endforeach
@endsection
