@extends('layouts.app')
@section('title', __('ui.my_world_title').' — Coaster World')
@section('content')
<section class="my-world-hero">
    <div class="container my-world-hero-grid">
        <div>
            <span class="eyebrow">{{ __('ui.my_world_kicker') }}</span>
            <h1>{{ __('ui.my_world_title') }}</h1>
            <p>{{ __('ui.my_world_intro') }}</p>
            <div class="my-world-hero-actions">
                <a class="button button-primary" href="{{ route('search', ['type' => 'park']) }}">{{ __('ui.my_world_find_parks') }}</a>
                <a class="button button-ghost" href="{{ route('collection') }}">{{ __('ui.my_world_open_collection') }}</a>
            </div>
        </div>
        <div class="my-world-summary" aria-label="{{ __('ui.my_world_summary') }}">
            <div><strong>{{ $summary['followed_parks'] }}</strong><span>{{ __('ui.my_world_followed_parks') }}</span></div>
            <div><strong>{{ $summary['ridden_coasters'] }}</strong><span>{{ __('ui.my_world_ridden_coasters') }}</span></div>
            <div><strong>{{ $summary['visited_parks'] }}</strong><span>{{ __('ui.my_world_visited_parks') }}</span></div>
            <div><strong>{{ $summary['wishlist_items'] }}</strong><span>{{ __('ui.my_world_wishlist_items') }}</span></div>
            <div><strong>{{ $summary['upcoming_plans'] }}</strong><span>{{ __('ui.my_world_upcoming_plans') }}</span></div>
        </div>
    </div>
</section>

@if($opportunities->isNotEmpty())
<section class="section my-world-opportunities-section">
    <div class="container">
        <div class="section-heading split-heading">
            <div>
                <span class="eyebrow">{{ __('ui.my_world_live_kicker') }}</span>
                <h2>{{ __('ui.my_world_live_title') }}</h2>
                <p>{{ __('ui.my_world_live_help') }}</p>
            </div>
            <span class="my-world-live-pill"><i></i>{{ __('ui.my_world_live_now') }}</span>
        </div>
        <div class="my-world-opportunity-grid">
            @foreach($opportunities as $opportunity)
                @php($opportunityAttraction = $opportunity['attraction'])
                <a class="my-world-opportunity-card" data-cw-live-attraction="{{ $opportunityAttraction->id }}" href="{{ $opportunity['is_coaster'] ? route('coasters.show', $opportunityAttraction->coaster) : route('attractions.show', $opportunityAttraction) }}">
                    <span class="my-world-opportunity-wait" data-cw-live-wait><span data-cw-live-wait-value>{{ $opportunity['wait_minutes'] }}</span><small data-cw-live-wait-unit>min</small></span>
                    <span class="my-world-opportunity-copy">
                        <small>{{ $opportunity['park']->official_name }}</small>
                        <strong>{{ $opportunityAttraction->official_name }}</strong>
                        <x-ride-queue-badges :attraction="$opportunityAttraction" size="compact" class="my-world-queue-badges" />
                        <em>{{ __('ui.my_world_wishlist_opportunity') }}</em>
                    </span>
                    <span class="my-world-opportunity-arrow">↗</span>
                </a>
            @endforeach
        </div>
    </div>
</section>
@endif

<section class="section my-world-followed-section">
    <div class="container">
        <div class="section-heading split-heading">
            <div>
                <span class="eyebrow">{{ __('ui.my_world_followed_kicker') }}</span>
                <h2>{{ __('ui.my_world_followed_title') }}</h2>
                <p>{{ __('ui.my_world_followed_help') }}</p>
            </div>
            <a class="text-link" href="{{ route('search', ['type' => 'park']) }}">{{ __('ui.my_world_add_park') }} →</a>
        </div>

        @forelse($followedParks as $item)
            @if($loop->first)
                <div class="my-world-park-grid">
            @endif
            @php($followedPark = $item['park'])
            <article class="my-world-park-card">
                <div class="my-world-park-card-head">
                    <div>
                        <small>
                            @if($followedPark->city){{ $followedPark->city }}@if($followedPark->country?->official_name) · @endif @endif
                            @if($followedPark->country?->official_name)<x-country-label :code="$followedPark->country?->iso2" :name="$followedPark->country?->official_name" size="small" />@endif
                        </small>
                        <h3><a href="{{ route('parks.show', $followedPark) }}">{{ $followedPark->official_name }}</a></h3>
                    </div>
                    <span class="my-world-completion">{{ $item['completion_percent'] }}%</span>
                </div>

                <div class="my-world-progress" aria-label="{{ __('ui.my_world_coaster_progress') }}">
                    <span style="width: {{ $item['completion_percent'] }}%"></span>
                </div>

                <div class="my-world-park-stats">
                    <div><strong>{{ $item['ridden_coasters'] }}/{{ $item['total_coasters'] }}</strong><span>{{ __('ui.my_world_credits') }}</span></div>
                    <div><strong>{{ $item['missing_coasters'] }}</strong><span>{{ __('ui.my_world_missing') }}</span></div>
                    <div><strong>{{ $item['wishlist_remaining'] }}</strong><span>{{ __('ui.my_world_wishlist_left') }}</span></div>
                </div>

                <div class="my-world-park-live">
                    @if($item['live_available'])
                        <span class="is-live"><i></i>{{ __('ui.my_world_open_attractions', ['count' => $item['open_count']]) }}</span>
                        <span>{{ $item['average_wait'] !== null ? __('ui.my_world_average_wait', ['minutes' => $item['average_wait']]) : __('ui.my_world_live_available') }}</span>
                    @else
                        <span>{{ __('ui.my_world_live_unavailable') }}</span>
                    @endif
                    @if($item['weather']?->temperature_c !== null)
                        <span>☁ {{ rtrim(rtrim(number_format((float) $item['weather']->temperature_c, 1, ',', ''), '0'), ',') }}°C</span>
                    @endif
                </div>

                <div class="my-world-park-actions">
                    <a class="button button-ghost" href="{{ route('parks.show', $followedPark) }}">{{ __('ui.my_world_open_park') }}</a>
                    <form method="post" action="{{ route('favorites.toggle', ['type' => 'park', 'id' => $followedPark->id]) }}">
                        @csrf
                        <button class="my-world-unfollow" type="submit">{{ __('ui.my_world_unfollow_park') }}</button>
                    </form>
                </div>
            </article>
            @if($loop->last)
                </div>
            @endif
        @empty
            <div class="my-world-empty">
                <span>◎</span>
                <div>
                    <strong>{{ __('ui.my_world_empty_followed_title') }}</strong>
                    <p>{{ __('ui.my_world_empty_followed_text') }}</p>
                </div>
                <a class="button button-primary" href="{{ route('search', ['type' => 'park']) }}">{{ __('ui.my_world_find_parks') }}</a>
            </div>
        @endforelse

        @if($hasMoreFollowedParks)
            <p class="my-world-more-note">{{ __('ui.my_world_more_followed', ['count' => $followedParkCount - $followedParks->count()]) }}</p>
        @endif
    </div>
</section>

<section class="section section-soft my-world-plans-section">
    <div class="container">
        <div class="section-heading">
            <div>
                <span class="eyebrow">{{ __('ui.my_world_plans_kicker') }}</span>
                <h2>{{ __('ui.my_world_plans_title') }}</h2>
                <p>{{ __('ui.my_world_plans_help') }}</p>
            </div>
        </div>
        <div class="my-world-plans-grid">
            <section class="my-world-plan-panel">
                <div class="my-world-plan-panel-head">
                    <h3>{{ __('ui.my_world_visits_title') }}</h3>
                    <a href="{{ route('collection') }}">{{ __('ui.my_world_collection_short') }} →</a>
                </div>
                @forelse($upcomingVisits as $visit)
                    <a class="my-world-plan-row" href="{{ $visit->status === 'active' ? route('visit.show', $visit) : route('parks.show', $visit->park) }}">
                        <span class="my-world-plan-date">
                            @if($visit->starts_on)
                                <strong>{{ $visit->starts_on->format('d') }}</strong>
                                <small>{{ mb_strtoupper($visit->starts_on->locale(app()->getLocale())->translatedFormat('M')) }}</small>
                            @else
                                <strong>—</strong><small>{{ __('ui.my_world_date_tbd') }}</small>
                            @endif
                        </span>
                        <span><strong>{{ $visit->park?->official_name }}</strong><small>{{ $visit->status === 'active' ? __('ui.my_world_visit_active') : __('ui.my_world_visit_planned') }}</small></span>
                        <b>↗</b>
                    </a>
                @empty
                    <div class="my-world-panel-empty">{{ __('ui.my_world_no_visits') }}</div>
                @endforelse
            </section>

            <section class="my-world-plan-panel">
                <div class="my-world-plan-panel-head">
                    <h3>{{ __('ui.my_world_road_trips_title') }}</h3>
                    <a href="{{ route('road-trips.index') }}">{{ __('ui.road_trips_nav') }} →</a>
                </div>
                @forelse($upcomingRoadTrips as $roadTrip)
                    <a class="my-world-plan-row" href="{{ route('road-trips.show', $roadTrip) }}">
                        <span class="my-world-plan-date">
                            @if($roadTrip->starts_on)
                                <strong>{{ $roadTrip->starts_on->format('d') }}</strong>
                                <small>{{ mb_strtoupper($roadTrip->starts_on->locale(app()->getLocale())->translatedFormat('M')) }}</small>
                            @else
                                <strong>—</strong><small>{{ __('ui.my_world_date_tbd') }}</small>
                            @endif
                        </span>
                        <span><strong>{{ $roadTrip->title }}</strong><small>{{ __('ui.my_world_road_trip_parks', ['count' => $roadTrip->stops->pluck('park_id')->unique()->count()]) }}</small></span>
                        <b>↗</b>
                    </a>
                @empty
                    <div class="my-world-panel-empty">{{ __('ui.my_world_no_road_trips') }}</div>
                @endforelse
            </section>
        </div>
    </div>
</section>
@endsection