@extends('layouts.app')
@section('content')

    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>Events Detail</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="#">Events</a></li>
                        <li class="breadcrumb-item active">Events Detail</li>
                    </ol>
                </div>
            </div>
        </div>
    </section>

    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    @if(session('success') || session('error'))
                        <div class="alert {{ session('success') ? 'alert-success' : 'alert-danger' }}">
                            {{ session('success') ?? session('error') }}
                        </div>
                    @endif
                        @if($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif
                    <div class="card card-primary">
                        <form method="post" action="{{ route('admin.events.store' ) }}" enctype="multipart/form-data">
                            @csrf
                            <div class="card-body">
                                <div class="form-group">
                                    <label for="vibe">Vibe</label>
                                    <select name="vibe[]" class="form-control" id="vibeSelect" required multiple>
{{--                                        <option value="">Choose Vibe</option>--}}
                                        @foreach($vibe as $vibes)
                                            <option value="{{ $vibes->id }}">{{ $vibes->name }}</option>
                                        @endforeach
                                    </select>

                                </div>
                                <div class="form-group">
                                    <label for="preferred_contact">Preferred Contact</label>
                                    <input type="number" class="form-control" id="preferred_contact" name="preferred_contact" value="{{ old('preferred_contact') }}">
                                </div>
                                <div class="form-group">
                                    <label for="email_or_cellphone">Email</label>
                                    <input type="text" class="form-control" id="email_or_cellphone" name="email_or_cellphone" value="{{ old('email_or_cellphone') }}">
                                </div>
                                <div class="form-group">
                                    <label for="event_name">Event Name</label>
                                    <input type="text" class="form-control" id="event_name" name="event_name" value="{{ old('event_name') }}">
                                </div>

                                <div class="form-group">
                                    <label for="organizer_name">Organizer Name</label>
                                    <input type="text" class="form-control" name="organizer_name" value="{{ old('organizer_name') }}">
                                </div>
                                <div class="form-group">
                                    <label for="venue_listing">Venue Listing</label>
                                    <input type="text" class="form-control" name="venue_listing" id="venue_listing" value="{{ old('venue_listing') }}">
                                </div>
                                <div class="form-group">
                                    <label for="address1">Address1</label>
                                    <input type="text" class="form-control" name="address1" id="address1" value="{{ old('address1') }}">
                                </div>
                                <div class="form-group">
                                    <label for="address2">Address2</label>
                                    <input type="text" class="form-control" name="address2" id="address2" value="{{ old('address2') }}">
                                </div>
                                <div class="form-group">
                                    <label for="address3">Address3</label>
                                    <input type="text" class="form-control" name="address3" id="address3" value="{{ old('address3') }}">
                                </div>
                                <div class="form-group">
                                    <label for="city">City</label>
                                    <input type="text" class="form-control" name="city" id="city" value="{{ old('city') }}">
                                </div>
                                <div class="form-group">
                                    <label for="state">State</label>
                                    <input type="text" class="form-control" name="state" id="state" value="{{ old('state') }}">
                                </div>
                                <div class="form-group">
                                    <label for="zip">Zip</label>
                                    <input type="text" class="form-control" name="zip" id="zip" value="{{ old('zip') }}">
                                </div>
                                <div class="form-group">
                                    <label for="location">Location</label>
                                    <input type="text" class="form-control" name="location" id="location" value="{{ old('location') }}">
                                </div>

                                <div class="form-group">
                                    <label for="map_location">Map Location</label>
                                    <input type="text" class="form-control" name="map_location" id="map_location" value="{{ old('map_location') }}">
                                </div>
{{--                                <div class="form-group">--}}
{{--                                    <label for="start_date">Start Date</label>--}}
{{--                                    <input type="date" class="form-control" name="start_date" id="start_date" value="{{ old('start_date') }}">--}}
{{--                                </div>--}}
                                <div class="form-group">
                                    <label for="time">Doors</label>
                                    <input type="time" class="form-control" name="time" id="time" value="{{ old('time') }}">
                                </div>
                                <div class="form-group">
                                    <label for="start_time">Start Time</label>
                                    <input type="time" class="form-control" name="start_time" id="start_time" value="{{ old('start_time') }}">
                                </div>
{{--                                <div class="form-group">--}}
{{--                                    <label for="end_date">End Date</label>--}}
{{--                                    <input type="date" class="form-control" name="end_date" id="end_date" value="{{ old('end_date') }}">--}}
{{--                                </div>--}}
                                <div class="form-group">
                                    <label for="price">Price Per Ticket</label>
                                    <input type="text" class="form-control" name="price" id="price" value="{{ old('price') }}">
                                </div>

                                <div class="form-group">
                                    <label for="third_party_link">Ticket Link</label>
                                    <input type="text" class="form-control" name="third_party_link" id="third_party_link" value="{{ old('third_party_link') }}">
                                </div>
                                <div class="form-group">
                                    <label for="profile_img">Profile Photo</label>
                                    <input type="file" name="image">
                                </div>
                            </div>
                            <div class="card-footer">
                                <button type="submit" class="btn btn-primary">Submit</button>
                            </div>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection
@push('page_scripts')
    <script>
        $(document).ready(function() {
            $('#vibeSelect').select2({
                maximumSelectionLength: 3 // Limit the maximum number of selections to 3
            });
        });
    </script>



    <script>
        $(document).ready(function(){
            var today = new Date().toISOString().split('T')[0];

            $('#start_date, #end_date').attr('min', today);

            $('#start_date').change(function() {
                var startDate = $(this).val();
                var endDate = $('#end_date').val();

                if (endDate && endDate < startDate) {
                    $('#end_date').val(startDate);
                }

                $('#end_date').attr('min', startDate);
            });

            $('#end_date').change(function() {
                var endDate = $(this).val();
                var startDate = $('#start_date').val();

                if (startDate && startDate > endDate) {
                    $('#start_date').val(endDate);
                }

                $('#start_date').attr('min', endDate);
            });
        });
    </script>

@endpush