@extends('V2.layouts.onBoarding')

@section('content')
    <div class="content_wrapper">

        @if (
            !empty($vQuitDecision) &&
                ($vQuitDecision === 'I have decided to quit smoking' ||
                    $vQuitDecision === 'I have decided to reduce my smoking'))
            <div class="text_wrapper">
                <h1 class="light_orange"> ¡Felicidades! </h1>
                <p> Has dado el paso más importante hacia el <em class="blue bg_yellow"> éxito</em>. </p>
                <p>Al comprometerte con tus objetivos, ya <em class="blue bg_yellow">has ganado la mitad de la batalla</em>.
                </p>
            </div>
            <div class="button_wrap">
                <button type="button" class="button" name="btnSubmit" id="btnSubmit">“Soy increíble”</button>
            </div>
        @elseif (!empty($vQuitDecision) && $vQuitDecision === 'I will quit later')
            <div class="text_wrapper">
                <h1 class="light_orange">No estás solo/a.</h1>
                <p> Dejar de fumar es complicado. Es un <em class="blue bg_yellow">juego mental</em>. ¿Por qué crees que la
                    gente acaba fumando durante 30-40 años, a menudo incluso después de enfermarse? ¡Es una trampa!</p>
                <p>Como aprenderemos durante el programa, fumar/vapear nos hace pensar de cierta manera. Conlleva un montón
                    de pensamientos como:</p>
                <div class="image_wrap">
                    <img src="https://quitsure.s3.ap-south-1.amazonaws.com/others/day-1-quit-later.jpg" alt="Quit Later">
                </div>
                <p>Por supuesto, todos <em class="blue bg_yellow"> siempre</em> caemos en una de estas dos situaciones.</p>
                <p> O estamos pasando por momentos estresantes</p>
                <p>o no lo estamos.</p>
                <p class="bg_orange border_radius">En ambos casos, nuestra psicología nos hace posponer el intento de dejar
                    de fumar y nos mantiene atrapados.</p>
                <p> ¡Pero oye! No necesitas dejar de fumar aún. Puedes seguir fumando hasta que estés listo.</p>
                <p><b>Todo lo que tienes que hacer por ahora es pasar al siguiente paso.</b></p>
            </div>
            <div class="button_wrap">
                <button type="button" class="button" name="btnSubmit" id="btnSubmit">¡Puedo hacer eso!</button>
            </div>
        @else
            <div class="text_wrapper">
                <h1 class="light_orange">No estás solo/a.</h1>
                <p>Los fumadores creemos que <em class="blue">disfrutamos fumar</em>. Que hace los tiempos estresantes más
                    fáciles y los buenos tiempos aún mejores.</p>
                <p>También nos han enseñado que dejar de fumar es difícil. Y requiere mucha <strong
                        class="light_red"><i>fuerza de voluntad</i></strong>. </p>
                <p class="bg_orange border_radius">Es por eso que puedes seguir fumando durante el programa QuitSure y solo
                    decidir al final qué vas a hacer.</p>
                <p><b>Todo lo que tienes que hacer por ahora es pasar al siguiente paso.</b></p>
            </div>
            <div class="button_wrap">
                <button type="button" class="button" name="btnSubmit" id="btnSubmit">Ok. Puedo hacerlo.</button>
            </div>
        @endif
    </div>
@endsection

@push('scripts')
    <script type="module">
        $(function() {
            $("#btnBack").on("click", function() {
                window.location =
                    "{{ isset($backUrl) && $backUrl != '' ? $backUrl : url($onBoardUrlPrefix . 'current-status/3-3') }}";
            });

            $("#btnSubmit").on("click", function() {
                var url = "{{ url($onBoardUrlPrefix . 'current-status/3-4/Submit') }}";
                ApiService.post(url)
                    .then(response => {
                        const obj = response.data;
                        if (obj.status === true) {
                            window.location.href = obj.url;
                        } else {
                            document.querySelector(".error_msg").innerHTML = '<p>' + obj.message +
                                '</p>';
                        }
                    })
                    .catch(error => {
                        const isOnline = navigator.onLine;
                        document.querySelector(".error_msg").innerHTML = isOnline ?
                            "{{ __('messages.error_while_request') }}" :
                            "{{ __('messages.network_error_please_try_again') }}";
                    });
            });
        });
    </script>
@endpush