{{-- Extends layout --}}
@extends('front.layouts.app')

{{-- Content --}}
@section('content')
    <div class="entry clearfix content row">
        <nav class="navbar navbar-expand-lg navbar-light p-0">
            <h4 class="mb-0 pr-2 ls1  font-weight-bold">{{ __('Gözlem Haritası') }}


            </h4>
        </nav>

        <div class="line line-xs line-dark"></div>

        <form method="POST" action="{{ route('det.map.multi') }}">
            @csrf
            <p>{{ __('Lütfen gözlemlemek istediğiniz kategoriyi seçiniz') }}</p>
            <p>
                @foreach ($all_categories as $cat)
                    <label>  <input name="category_id[]" type="checkbox" @if ($categories->where('id', $cat->id)->count() > 0)
                        {{ 'CHECKED' }}
                        @endif value="{{ $cat->id }}"> <img style="height:20px" src="{{ $cat->pin_icon }}" /> {{ $cat->title }}  </label>
                @endforeach
            </p>
            <p>
            <button type="submit" class="btn btn-success">{{ __('Göster') }}</button></p>
        </form>

        <div id="map" style="height:500px; width:1000px"></div>


    @endsection

    {{-- Styles Section --}}
    @section('styles')

    @endsection

    @section('scripts')
        @component('front.components.google_map', ['coordinates' => $coordinates ?? null, 'title' => __('Harita')])
        @endcomponent

    @endsection