@extends('frontend.mediknode.layout.mainlayout')
@section('content')
    @component('frontend.mediknode.components.breadcrumb')
        @slot('title')
            Déposer Abstract
        @endslot
        @slot('li_1')
            Déposer Abstract
        @endslot
    @endcomponent
    <div class="about-content">
        <div class="container">
            @component('frontend.mediknode.components.buttons', ['event' => $event])
            @endcomponent
            <div class="dashboard-details mt-4 mb-4">
                <div class="row dashboard-info">
                    <div class="col-lg-12">
                        <div class="card dash-cards">
                            <div class="card-body">
                                <div class="profile-form">
                                    <div class="row">
                                        <div class="col-lg-12 col-md-12 pt-2">
                                            @if (session('created'))
                                                <div class="alert alert-success">
                                                    Votre Abstract a été bien soumis. Merci
                                                </div>
                                                <div class="row">
                                                    @if (auth()->user()->abstractsByEvents($event->id)->count() < $event->abstract_submission_limit)
                                                        <div class="col-lg-6 col-md-6 text-center">
                                                            <a href="{{ URL::to('/event/' . $slug . '/abstract') }}"
                                                                class="m-1 btn btn-pink">Déposer
                                                                un autre Abstract</a>
                                                        </div>
                                                    @endif
                                                    <div class="col-lg-6 col-md-6 text-center">
                                                        <a href="{{ URL::to('/abstracts') }}"
                                                            class="m-1 btn btn-primary">Consulter
                                                            vos Abstracts soumis</a>
                                                    </div>
                                                </div>
                                                <br>
                                            @else
                                                {!! $text_after_abstract_submission !!}
                                                @if (
                                                    !$event->is_closed_abstract_submission &&
                                                        auth()->user()->abstractsByEvents($event->id)->count() < $event->abstract_submission_limit)
                                                    <br />
                                                    <div class="row">
                                                        <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                                                            <form method="POST"
                                                                action="{{ url('/event/' . $slug . '/abstract') }}"
                                                                class="needs-validation" novalidate>
                                                                @csrf
                                                                <input type="hidden" name="user_id"
                                                                    value="{{ $user->id }}">
                                                                <input type="hidden" name="event_id"
                                                                    value="{{ $eventId }}">
                                                                <input type="hidden" name="email"
                                                                    value="{{ $user->email }}" />
                                                                <input type="hidden" name="phone"
                                                                    value="{{ $user->phone }}" />
                                                                <div class="form-check">
                                                                    <input class="form-check-input" type="checkbox"
                                                                        value="" id="flexCheckDefault" required>
                                                                    <label class="form-check-label" for="flexCheckDefault">
                                                                        J'accepte les conditions de participation <span
                                                                            class="asterisk">*</span>
                                                                    </label>
                                                                </div>
                                                                @if ($event->has_abstract_type)
                                                                    <div class="form-group">
                                                                        <label class="col-form-label">Type de communications
                                                                            :</label>
                                                                        <div class="form-check">
                                                                            <input value="ePosters" class="form-check-input"
                                                                                type="radio" name="type" id="eposters"
                                                                                required>
                                                                            <label class="form-check-label" for="eposters">
                                                                                ePosters
                                                                            </label>
                                                                        </div>
                                                                        <div class="form-check">
                                                                            <input value="Communication Orale"
                                                                                class="form-check-input" type="radio"
                                                                                name="type" id="communicationOrale"
                                                                                required>
                                                                            <label class="form-check-label"
                                                                                for="communicationOrale">
                                                                                Communication Orale
                                                                            </label>
                                                                        </div>
                                                                        @if ($event->has_abstract_video_type)
                                                                            <div class="form-check">
                                                                                <input value="Vidéo-Film"
                                                                                    class="form-check-input" type="radio"
                                                                                    name="type" id="video-film" required>
                                                                                <label class="form-check-label"
                                                                                    for="video-film">
                                                                                    Vidéo-Film
                                                                                </label>
                                                                            </div>
                                                                        @endif
                                                                    </div>
                                                                @else
                                                                    <input type="hidden" value="ePosters" name="type" />
                                                                @endif
                                                                @if ($event->has_abstract_speciality)
                                                                    <div class="form-group">
                                                                        <label class="col-form-label">Spécialité de la
                                                                            Communication
                                                                            :</label>
                                                                        <div class="form-check">
                                                                            <input value="Médicale" class="form-check-input"
                                                                                type="radio" name="speciality"
                                                                                id="medicale" required>
                                                                            <label class="form-check-label" for="medicale">
                                                                                Médicale
                                                                            </label>
                                                                        </div>
                                                                        <div class="form-check">
                                                                            <input value="Chirurgicale"
                                                                                class="form-check-input" type="radio"
                                                                                name="speciality" id="chirurgicale"
                                                                                required>
                                                                            <label class="form-check-label"
                                                                                for="chirurgicale">
                                                                                Chirurgicale
                                                                            </label>
                                                                        </div>
                                                                    </div>
                                                                @endif
                                                                <div class="form-group">
                                                                    <label class="col-form-label">Titre : <span
                                                                            class="asterisk">*</span></label>
                                                                    <input type="text" value="{{ old('title') }}"
                                                                        class="form-control @error('title') is-invalid @enderror"
                                                                        name="title" id="title" autocomplete="off"
                                                                        required>
                                                                    <div class="text-information text-info">Seule la
                                                                        première
                                                                        lettre doit
                                                                        être en
                                                                        majuscule</div>
                                                                    <div class="invalid-feedback">Le champ titre est
                                                                        obligatoire
                                                                    </div>
                                                                    @error('title')
                                                                        <span class="text-danger">{{ $message }}</span>
                                                                    @enderror
                                                                </div>
                                                                <div class="row">
                                                                    <div class="col-12 col-md-6 col-lg-3">
                                                                        <div class="form-group">
                                                                            <label class="col-form-label">Premier Auteur :
                                                                            </label>
                                                                            <input type="text" readonly
                                                                                class="form-control-plaintext"
                                                                                value="{{ $user->firstname }} {{ $user->name }}">
                                                                            <input type="hidden" name="first_author"
                                                                                value="{{ $user->firstname }} {{ $user->name }}" />
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-12 col-md-6 col-lg-3">
                                                                        <div class="form-group">
                                                                            <label class="col-form-label">Service / Hôpital
                                                                                :
                                                                                <span class="asterisk">*</span>
                                                                            </label>
                                                                            <input type="text"
                                                                                name="service_firstauthor"
                                                                                class="form-control" value=""
                                                                                required>
                                                                            <div class="invalid-feedback">Le service est
                                                                                obligatoire
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-12 col-md-6 col-lg-3">
                                                                        <div class="form-group">
                                                                            <label class="col-form-label">Ville : <span
                                                                                    class="asterisk">*</span>
                                                                            </label>
                                                                            <input type="text" name="city_firstauthor"
                                                                                class="form-control" value=""
                                                                                required>
                                                                            <div class="invalid-feedback">La ville est
                                                                                obligatoire
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-12 col-md-6 col-lg-3">
                                                                        <div class="form-group">
                                                                            <label class="col-form-label">Pays : <span
                                                                                    class="asterisk">*</span></label>
                                                                            <div class="search-input line">
                                                                                <div class="form-group">
                                                                                    <select
                                                                                        class="form-control form-select select country-select"
                                                                                        name="country_firstauthor"
                                                                                        id="country" required>
                                                                                        <option value="">Non spécifié
                                                                                        </option>
                                                                                        @foreach ($countries as $country)
                                                                                            <option
                                                                                                value="{{ $country }}"
                                                                                                {{ old('country_firstauthor') == $country ? 'selected' : '' }}>
                                                                                                {{ $country }}
                                                                                            </option>
                                                                                        @endforeach
                                                                                    </select>
                                                                                    <div class="invalid-feedback">Le pays
                                                                                        est
                                                                                        obligatoire
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                {{-- <div class="form-group">
                                                                <label class="col-form-label">Spécialité de la Communication
                                                                    :</label>
                                                                <div class="form-check">
                                                                    <input value="Médicale" class="form-check-input"
                                                                        type="radio" name="speciality" id="medicale"
                                                                        checked>
                                                                    <label class="form-check-label" for="medicale">
                                                                        Médicale
                                                                    </label>
                                                                </div>
                                                                <div class="form-check">
                                                                    <input value="Chirurgicale" class="form-check-input"
                                                                        type="radio" name="speciality" id="chirurgicale">
                                                                    <label class="form-check-label" for="chirurgicale">
                                                                        Chirurgicale
                                                                    </label>
                                                                </div>
                                                            </div> --}}
                                                                <div class="form-group">
                                                                    <label class="col-form-label">Co-auteurs :
                                                                        <span class="asterisk">*</span></label>
                                                                    <input type="text"
                                                                        value="{{ old('collaborators') }}"
                                                                        class="form-control @error('collaborators') is-invalid @enderror"
                                                                        name="collaborators" id="collaborators"
                                                                        autocomplete="off" required>
                                                                    <div class="text-information text-info">exemple: A. Ben
                                                                        Brahim, S.
                                                                        Abdallah,
                                                                        L. Tounsi</div>
                                                                    <div class="invalid-feedback">Le champ co-auteurs
                                                                        est
                                                                        obligatoire
                                                                    </div>
                                                                    @error('collaborators')
                                                                        <span class="text-danger">{{ $message }}</span>
                                                                    @enderror
                                                                </div>
                                                                <div class="form-group">
                                                                    <label class="col-form-label">Service :
                                                                        <span class="asterisk">*</span></label>
                                                                    <input type="text" value="{{ old('service') }}"
                                                                        class="form-control @error('service') is-invalid @enderror"
                                                                        name="service" id="service" autocomplete="off"
                                                                        required>
                                                                    <div class="invalid-feedback">Le champ service est
                                                                        obligatoire
                                                                    </div>
                                                                    @error('service')
                                                                        <span class="text-danger">{{ $message }}</span>
                                                                    @enderror
                                                                </div>
                                                                <div class="form-group">
                                                                    <label
                                                                        class="col-form-label">{{ $event->id == 47 ? 'Introduction et Objectif' : 'Introduction' }}
                                                                        :
                                                                        <span class="asterisk">*</span></label>
                                                                    <textarea class="form-control limited-textarea @error('abstract_introduction') is-invalid @enderror"
                                                                        name="abstract_introduction" rows="4" id="abstract-introduction" required>{{ old('abstract_introduction') }}</textarea>
                                                                    <div class="word-limit-message"></div>
                                                                    </p>
                                                                    <div class="invalid-feedback">L'introduction est
                                                                        obligatoire
                                                                    </div>
                                                                    @error('abstract_introduction')
                                                                        <span class="text-danger">{{ $message }}</span>
                                                                    @enderror
                                                                </div>
                                                                <div class="form-group">
                                                                    <label class="col-form-label">Matériel & Méthode :
                                                                        <span class="asterisk">*</span></label>
                                                                    <textarea class="form-control limited-textarea @error('abstract_method') is-invalid @enderror" name="abstract_method"
                                                                        rows="4" required>{{ old('abstract_method') }}</textarea>
                                                                    <div class="word-limit-message"></div>
                                                                    <div class="invalid-feedback">Le matériel & la méthode
                                                                        sont
                                                                        obligatoires
                                                                    </div>
                                                                    @error('abstract_method')
                                                                        <span class="text-danger">{{ $message }}</span>
                                                                    @enderror
                                                                </div>
                                                                <div class="form-group">
                                                                    <label class="col-form-label">
                                                                        {{ $event->id == 47 ? 'Résultats / Observations' : 'Résultats' }}
                                                                        :
                                                                        <span class="asterisk">*</span></label>
                                                                    <textarea class="form-control limited-textarea @error('abstract_result') is-invalid @enderror" name="abstract_result"
                                                                        rows="6" required>{{ old('abstract_result') }}</textarea>
                                                                    <div class="word-limit-message"></div>
                                                                    <div class="invalid-feedback">Les résultats sont
                                                                        obligatoires
                                                                    </div>
                                                                    @error('abstract_result')
                                                                        <span class="text-danger">{{ $message }}</span>
                                                                    @enderror
                                                                </div>
                                                                @if ($event->id != 47)
                                                                    <div class="form-group">
                                                                        <label
                                                                            class="col-form-label">{{ $event->id == 43 ? 'Discussion et principales conclusions' : 'Discussion' }}
                                                                            :
                                                                            <span class="asterisk">*</span></label>
                                                                        <textarea class="form-control limited-textarea @error('abstract_discussion') is-invalid @enderror"
                                                                            name="abstract_discussion" rows="6" required>{{ old('abstract_discussion') }}</textarea>
                                                                        <div class="word-limit-message"></div>
                                                                        <div class="invalid-feedback">La discussion est
                                                                            obligatoire
                                                                        </div>
                                                                        @error('abstract_discussion')
                                                                            <span
                                                                                class="text-danger">{{ $message }}</span>
                                                                        @enderror
                                                                    </div>
                                                                @endif

                                                                @if ($event->id != 43)
                                                                    <div class="form-group">
                                                                        <label class="col-form-label">Conclusion :
                                                                            <span class="asterisk">*</span></label>
                                                                        <textarea class="form-control limited-textarea @error('abstract_conclusion') is-invalid @enderror"
                                                                            name="abstract_conclusion" rows="4" required>{{ old('abstract_conclusion') }}</textarea>
                                                                        <div class="word-limit-message"></div>
                                                                        <div class="invalid-feedback">La conclusion est
                                                                            obligatoire
                                                                        </div>
                                                                        @error('abstract_conclusion')
                                                                            <span
                                                                                class="text-danger">{{ $message }}</span>
                                                                        @enderror
                                                                    </div>
                                                                @endif

                                                                {{-- <div class="form-group">
                                                                <label class="col-form-label">Résumé :
                                                                    <span class="asterisk">*</span></label>
                                                                <div class="text-information text-info">100-300 mots - 2000
                                                                    caractères
                                                                    maximum. (Espaces inclus, titre exclus)
                                                                </div>
                                                                <textarea class="form-control @error('summary') is-invalid @enderror" name="summary" rows="4" required>{{ old('summary') }}</textarea>
                                                                <div class="invalid-feedback">Le résumé est obligatoire
                                                                </div>
                                                                @error('summary')
                                                                    <span class="text-danger">{{ $message }}</span>
                                                                @enderror
                                                            </div> --}}
                                                                <div class="row justify-content-md-center">
                                                                    <div class="col-lg-3 col-md-4 col-md-auto">
                                                                        <button class="btn btn-success w-100 login-btn"
                                                                            type="submit">Envoyer</button>
                                                                    </div>
                                                                </div>
                                                            </form>
                                                        </div>
                                                    </div>
                                                @endif
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <style>
        .word-limit-message {
            color: #7D3C98;
            font-size: 0.9em;
            margin: 5px 0;
        }
    </style>
    <script>
        // Paramètres globaux
        const maxWords = 300;

        // Récupérer tous les textareas avec la classe 'limited-textarea'
        const textareas = document.querySelectorAll('.limited-textarea');

        textareas.forEach(textarea => {
            const wordLimitMessage = textarea.nextElementSibling; // Message sous le textarea

            textarea.addEventListener('input', () => {
                const words = textarea.value.trim().split(/\s+/); // Divise le texte en mots
                const wordCount = words.filter(word => word !== "").length; // Compte les mots non vides

                if (wordCount > maxWords) {
                    textarea.value = words.slice(0, maxWords).join(" "); // Coupe le texte à 300 mots
                    wordLimitMessage.textContent = `Limite de ${maxWords} mots atteinte.`;
                } else {
                    wordLimitMessage.textContent = `Nombre de mots : ${wordCount}/${maxWords}`;
                }
            });
        });
    </script>
    @component('frontend.mediknode.components.scrolltotop')
    @endcomponent
@endsection