@extends('layouts.app')
@section('content')
@php
$map = [
    'hot' => ['icon' => 'icon-hot', 'label' => 'Hot'],
    'exclusive' => ['icon' => 'icon-exclusive', 'label' => 'Exclusive'],
    'new' => ['icon' => 'icon-new', 'label' => 'New'],
];

$type = strtolower($type ?? '');

if (!empty($type) && isset($map[$type])) {

    $current = $map[$type];

} elseif (!empty($currentProvider)) {

    $slug = strtolower($currentProvider->provider_slug ?? '');

    $icon = 'icon-' . preg_replace('/[^a-z0-9]/', '', $slug);

    $current = [
        'icon' => $icon,
        'label' => ucwords(strtolower($currentProvider->provider_name ?? $slug))
    ];

} else {
    $current = [
        'icon' => 'icon-hot',
        'label' => ucfirst($type ?: 'SL')
    ];
}
@endphp
    <div class="container">
        @include('desktop.partials.runningtext')
        @include('desktop.partials.breadcrumb')
        <section class="slot slot--d">
            @include('desktop.partials.pages.slot-carousel')
            <div class="slot__container">
                <header class="slot-content__header">
                    <div class="slot-content__active">
                        <i class="{{ $current['icon'] }} icon--2x" data-v-0e010622=""></i>
                        <span> {{ $current['label'] }} </span>
                    </div>
                    <div class="slot-game-search">
                        <form>
                            <div class="input--search input__container">
                                <div class="input__root">
                                    <input type="text" placeholder="Cari permainan" class="input" data-skip-validation>
                                    <i class="input__icon input__icon--search icon-search icon--md"></i>
                                    <button type="button" class="input-search--clear btn btn--flex btn--sm-round" style="display:none;"><i data-v-0e010622="" class="icon-times-circle icon--md"></i></button>
                                </div>
                            </div>
                            <button type="submit" class="btn btn--brand">Cari</button>
                        </form>
                    </div>
                </header>
              <div data-v-455b314a="" class="slot-content" style="">
                 <ul class="games-grid" id="game-container" data-search-container>
                        @foreach ($games as $g)
                            @php
                            $isLoggedIn = !auth()->check();
                                $providerKey = strtoupper($g->game_provider);
                                $providerIcon = $providerIconMap[$providerKey] ?? null;
                            @endphp
                            <li title="{{ $g->game_name }}" class="game-item__wrapper {{ $g->game_flag }} game-item--normal-view">
                                @auth
							    <a href="{{ route('launchgame', [
							        'game_code' => $g->game_code,
							        'game_type' => $g->game_type,
							        'game_provider' => $g->game_provider
							    ]) }}">
							@else
							    <a href="javascript:void(0)" data-modal="loginModal">
							@endauth
                                    <div class="game-item game-item--slot">
                                    	<div class="game-item__skeleton"></div>
                                        <img loading="lazy" src="{{ $g->game_image }}" alt="{{ $g->game_name }}" class="game-item__img"
                                            style="opacity:0;">
                                            <div class="game-item__placeholder">
                                            	<div class="game-item__skeleton"></div>
											    <img src="https://cdn-proxy.globalcontentcloud.com/456/logo/game-placeholder.png" alt="{{ $g->game_name }}">
											</div>
                                        @if($providerIcon)
                                        <div class="game-item__provider" style="opacity:1;">
                                            <div>
                                                <img src="{{ $providerIcon }}" alt="{{ $g->game_provider }}">
                                            </div>
                                        </div>
                                        @endif
                                    </div>
                                    <span class="game-item__name">
                                        {{ $g->game_name }}
                                    </span>
                                </a>
                            </li>
                        @endforeach
                    	<li class="loading-observer" id="loadingObserver">
                        <i class="spin icon-sync icon--lg"></i>
                    </li>
                    </ul>
                <div class="no-results" id="noResults" style="display:none;">
                        Maaf, hasil pencarian tidak ditemukan.
                </div>
            </div>
        </div>
        </section>
    </div>
@endsection