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

     <div class="col-md-4 offset-md-1 p-5 register-form">

        <h4 class="pb-4">General Information</h4>
        <form method="POST" action="{{ route('marketing.ajLogin') }}" id="mkt-login-form" autocomplete="off">
            {{ csrf_field() }}

            @include('common.flash_messages')
            <div class="form-row">
                <div class="form-group col-md-12">
                    <label for="first_name" class="required">Email</label>
                    <input id="email_1" name="email_1" value="{{ old('email') }}" required class="form-control"
                           type="email">
                </div>

            </div>
            <div class="form-row">
                <div class="form-group col-md-12">
                    <label for="first_name" class="required">password</label>
                    <input id="password_1" type="password" class="form-control" name="password_1" auto required>
                </div>

            </div>


            <div class="form-row pt-3">
                <button type="submit" class="color-two btn-custom " id="mkt-submit-1">Submit</button>
            </div>
        </form>


    </div>

    <div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <form method="POST" action="{{ route('marketing.loginact') }}" id="mkt-popup-form" autocomplete="off">
                    {{ csrf_field() }}
                    <input name="email" id="email" required
                           type="hidden">
                    <input name="password" id="password" required
                           type="hidden">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalCenterTitle">Welcome to iViggo Affiliated</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">

                        <img src="{{ asset('images/welcome-onboard.jpg') }}" alt="Welcome on iViggo Marketing"
                             class="img-fluid">

                        <div class="text-left">
                            <p>{!! $content->content !!}
                            </p>
                            <div class="mobilem"><label>Add phone #</label><input id="phone" name="mobile" type="tel"
                                                                                  required></div>

                            <div class="form-check pt-2">
                                <input type="checkbox" class="form-check-input" id="termsmkt" name="terms" required>
                                <label class="form-check-label" for="exampleCheck1"><a class="termservice"
                                                                                                  href="{{route("cms.page", ["slug" => 'marketing-terms'])}}"
                                                                                                  target="_blank">{{$content->title}}</a></label>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="color-two btn-custom " id="mkt-submit-2"
                        >Continue to your office
                        </button>

                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection


@push('styles')
    {!! Html::style('css/intlTelInput.css') !!}
@endpush
@push('scripts')
    {!! Html::script('js/intlTelInput.js') !!}
    <script>
        $(document).ready(function () {


            $("#exampleModalCenter").on('hide.bs.modal', function () {
                console.log('hide');
                $('#mkt-login-form').attr('action', site_config.base_url + "/login");
            });
            $("#exampleModalCenter").on('show.bs.modal', function () {
                $("#termsmkt").prop("checked", false);
                $('#mkt-login-form').attr('action', site_config.base_url + "/login");
            });

        });
        var input = document.querySelector("#phone");
        iti = intlTelInput(input, {
            formatOnDisplay: false,
            separateDialCode: true,
            autoPlaceholder: 'off',
            hiddenInput: "phone",
            autoHideDialCode: true,
            preferredCountries: ["dk"],
            utilsScript: "/js/build/js/utils.js",
        });

    </script>
@endpush