@php
/**
 * What a map pin says when a diner opens it.
 *
 * The pin used to carry the restaurant's name and nothing else, which asked the diner to leave the
 * map to learn anything — whether it is open, whether it is any good, what it sells, what delivery
 * costs. All four are here, so the choice can be made on the map and only the order takes them off
 * it.
 *
 * READ TOP TO BOTTOM: who it is, whether you can order now, what they sell, how to get it. Each of
 * those is its own band with the same padding, separated by the same hairline the rest of the
 * product uses, so the card has one rhythm rather than four.
 *
 * Rendered on the SERVER and handed to the map layer as a string, so prices go through money(),
 * ratings through number_format(), times through the site's own formatter and every label through
 * the translator. None of that belongs in the map script.
 *
 * @var array      $r      the restaurant row
 * @var array      $dishes up to a handful of its available items
 * @var array|null $window ['open' => bool, 'close' => 'HH:MM:SS'] for today, or null if none set
 */
$slug   = (string) ($r['slug'] ?? '');
$href   = url('/restaurant/' . $slug);
$isOpen = $window === null ? true : (bool) $window['open'];
$closes = $window['close'] ?? '';
@endphp
<div class="qm-mappop">
    <div class="qm-mappop-band qm-mappop-head">
        <a class="qm-mappop-name" href="{{ $href }}">{{ $r['name'] }}</a>
        <p class="qm-mappop-meta">
            <span class="qm-mappop-rating"><i class="fas fa-star" aria-hidden="true"></i> {{ number_format((float) ($r['rating_cache'] ?? 0), 1) }}</span>
            @if ((int) ($r['rating_count'] ?? 0) > 0)<span class="qm-mappop-dim">({{ (int) $r['rating_count'] }})</span>@endif
            @if (($r['cuisine_name'] ?? '') !== '')<span class="qm-mappop-dim">&middot;</span> {{ $r['cuisine_name'] }}@endif
        </p>
        @php /* Open or shut, and until when. "Open" alone does not tell a diner whether there is
                 still time to order, which is the only reason they are reading it. */
@endphp
        <p class="qm-mappop-hours">
            <span class="qm-pill {{ $isOpen ? 'qm-pill-green' : 'qm-pill-grey' }}">{!! $isOpen ? t('geo.open_now') : t('geo.closed_now') !!}</span>
            @if ($isOpen && $closes !== '')
            <span class="qm-mappop-dim">{!! t_raw('geo.closes_at', [':time' => fmt_clock($closes)]) !!}</span>
            @endif
        </p>
    </div>

    @if ($dishes)
    @php /* A few of its dishes, moved by the same arrow pair the cuisine and "popular this week"
             rails use. Arrows rather than a scrollbar: a scrollbar inside a 320px card is a target
             nobody can hit, and the product already has this control. */
@endphp
    <div class="qm-mappop-band qm-mappop-dishes-band qm-carousel" data-carousel>
        <div class="qm-mappop-dishes-head">
            <h4 class="qm-mappop-dishes-title">{{ t_raw('geo.popular_dishes') }}</h4>
            @partial('sections/carousel-nav', [
                'prevLabel' => t_raw('common.scroll_left_aria'),
                'nextLabel' => t_raw('common.scroll_right_aria'),
            ])
        </div>
        <div class="qm-mappop-dishes qm-carousel-track">
            @foreach ($dishes as $d)
            <a class="qm-mappop-dish" href="{{ $href }}">
                <img src="{{ media($d['image'], 'assets/client/covers/shop-1.png') }}" alt="" loading="lazy" width="104" height="76">
                <span class="qm-mappop-dish-name">{{ $d['name'] }}</span>
                <span class="qm-mappop-dish-price">{{ money($d['price']) }}</span>
            </a>
            @endforeach
        </div>
    </div>
    @endif

    @php /* The two ways to get it, each carrying its own cost. A diner choosing between kitchens is
             really choosing between these, so the price of each belongs on the choice itself. */
@endphp
    <div class="qm-mappop-band qm-mappop-modes">
        <a class="qm-mappop-mode" href="{{ $href }}?mode=delivery">
            <strong>{{ t_raw('checkout.delivery') }}</strong>
            <span>{!! (float) ($r['delivery_fee'] ?? 0) > 0 ? money($r['delivery_fee']) : t('geo.mode_free') !!}</span>
        </a>
        <a class="qm-mappop-mode" href="{{ $href }}?mode=pickup">
            <strong>{{ t_raw('checkout.pickup') }}</strong>
            <span>{{ t_raw('geo.mode_no_fee') }}</span>
        </a>
    </div>
</div>