@extends('layouts.app')
@section('title','Lobby / Fila - GIGAX ARENA')
@section('page_title','Lobby / Fila')
@section('content')
@php
    use Illuminate\Support\Facades\Route;
    $queueTotal = isset($queuePlayers) && is_countable($queuePlayers) ? count($queuePlayers) : ($queuePlayersCount ?? $players_count ?? 156);
    $position = $position ?? ($userQueue->user_position ?? 12);
    $inQueue = $inQueue ?? !empty($userQueue);
@endphp
<div class="grid lobby-grid">
    <section class="panel pad">
        <h3 class="panel-title">Selecione o Jogo</h3>
        <div class="game-cards">
            <div class="game-card active" data-game="crossfire">CROSSFIRE</div><div class="game-card" data-game="cs2">CS 2</div><div class="game-card" data-game="valorant">VALORANT</div><div class="game-card" data-game="freefire">FREE FIRE</div><div class="game-card" data-game="lol">LEAGUE OF LEGENDS</div>
        </div>
        <h3 class="panel-title" style="margin-top:22px">Selecione o Modo</h3>
        <div class="mode-grid" data-group="mode"><div class="mode-card active" data-mode="profissional">RANKED</div><div class="mode-card" data-mode="casual">CASUAL</div><div class="mode-card" data-mode="mix">MIX</div><div class="mode-card" data-mode="treino">TREINO</div></div>
        <h3 class="panel-title" style="margin-top:22px">Selecione a Fila</h3>
        <div class="mode-grid" data-group="size"><div class="mode-card active" data-size="solo">SOLO<br><small class="muted">1 jogador</small></div><div class="mode-card" data-size="duo">DUO<br><small class="muted">2 jogadores</small></div><div class="mode-card" data-size="squad">SQUAD<br><small class="muted">4 jogadores</small></div><div class="mode-card" data-size="5v5">5V5<br><small class="muted">5 jogadores</small></div></div>
        <div class="grid two-grid" style="margin-top:18px">
            <form method="POST" action="{{ Route::has('queue.enter') ? route('queue.enter') : url('/queue/enter') }}">@csrf<button class="btn full" type="submit">ENTRAR NA FILA</button></form>
            <form method="POST" action="{{ Route::has('queue.leave') ? route('queue.leave') : url('/queue/leave') }}">@csrf<button class="btn red full" type="submit">SAIR DA FILA</button></form>
        </div>
    </section>
    <section class="panel pad" style="text-align:center">
        <p class="green"><b>SUA FILA ATUAL</b></p><h2>RANKED SOLO<br><span class="muted">CROSSFIRE</span></h2>
        <div class="queue-circle"><div><span>POSIÇÃO NA FILA</span><strong id="queue-position">{{ $position }}</strong></div></div>
        <p class="muted">TEMPO ESTIMADO</p><h2 id="queue-time">02:45</h2>
        <form method="POST" action="{{ Route::has('queue.leave') ? route('queue.leave') : url('/queue/leave') }}">@csrf<button class="btn red full" type="submit">CANCELAR FILA</button></form>
    </section>
    <section class="grid">
        <div class="panel pad"><h3 class="panel-title">Status da Fila</h3><div class="row"><span>Jogadores na fila</span><strong id="queue-total">{{ $queueTotal }}</strong></div><div class="row"><span>Partidas em andamento</span><strong>{{ $activeMatches ?? 48 }}</strong></div><div class="row"><span>Tempo médio de espera</span><strong>02:30</strong></div></div>
        <div class="panel pad"><h3 class="panel-title">Distribuição por Modo</h3>@foreach([['Ranked Solo',56,70],['Ranked Duo',34,55],['Ranked Squad',42,62],['Casual',24,35]] as $r)<div class="row"><span>{{ $r[0] }}</span><div class="progress-line"><span style="width:{{ $r[2] }}%"></span></div><b>{{ $r[1] }}</b></div>@endforeach</div>
    </section>
    <section class="panel pad"><h3 class="panel-title">Amigos Online (8)</h3>@foreach(['KruxDestroyer','KruxMVP','KruxSniper','KruxRusher','KruxLegend','KruxGhost','KruxKing','KruxBeast'] as $n)<div class="friend"><div class="avatar">{{ substr($n,4,1) }}</div><div><b>{{ $n }}</b><div class="green">Online</div></div><button class="icon-btn" type="button">+</button></div>@endforeach</section>
</div>
@endsection