@extends("layouts.app")
@section("title")
Profile
@endsection
@section("content")
<style type="text/css">
    .login-content
    {
        height: auto !important;
    }
    .login-content .login-form {
    max-width: 100% !important;
    text-align: left;
    }
    .bg-signup
    {
        background-color: #efefef;
        border-radius: 4px;
        padding: 16px 15px;
        margin-bottom: 20px;
    }
    span.required {
    color: red;
}
.g-recaptcha div {
    width: auto !important;
}
button#kt_login_signin_submit {
    width: auto;
    margin: auto;
}
.login-form img 
{
        height: 60px;
    width: auto;
        margin-bottom: 10px;
}
</style>
    <div class="kt-container  kt-grid__item kt-grid__item--fluid">
        <div class="row">
            <div class="col-md-12 ">
                <div class="kt-portlet">
                    <div class="kt-portlet__head">
                        <div class="kt-portlet__head-label">
                            <h3 class="kt-portlet__head-title">Update My Profile</h3>
                        </div>
                    </div>
                    <div class="col-md-12 p-0">
                        <div class="login-content">
                    <div class="d-table">

                        <div class="login-form">

                            <form class="login__form m-form" id="signup_form" method="POST"
                                  action="{{ url('profile') }}">
                                @include('partials.researcher-form', [
                                    'countries' => $countries,
                                    'institutions ' => $institutions,
                                    'area_of_interest' => $area_of_interest,
                                    'topics_of_interest' => $topics_of_interest,
                                    'currentUser' => $currentUser,
                                    'type' => "Researcher"

                                    ])     
                            </form>
                            <div class="kt-login__center text-center" style="width: 100%;margin-bottom: 20px">
                                <button type="button" id="kt_login_signin_submit"
                                        class="btn btn-brand btn-pill btn-elevate">Save
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
                </div>
            </div>


        </div>
    </div>
@endsection
<!-- end:: Page -->
<!--begin::Global Theme Bundle -->
{{--         <script src="{{url('')}}/assets/vendors/base/vendors.bundle.js" type="text/javascript"></script>
 --}}
@section('script')
    <script src="{{url("")}}/assets/demo/base/scripts.bundle.js" type="text/javascript"></script>

    <!--end::Global Theme Bundle -->
    <!--begin::Page Scripts -->
    <script src="{{url('')}}/assets/snippets/custom/pages/user/login.js" type="text/javascript"></script>
    <script src="{{url('')}}/assets/vendors/general/jquery_chained-2.x/jquery.chained.min.js"
            type="text/javascript"></script>
    <script src="{{url('')}}/assets/vendors/general/select2/dist/js/select2.full.js" type="text/javascript"></script>
    <script src="{{url("")}}/assets/vendors/general/toastr/toastr.js" type="text/javascript"></script>

    <script type="text/javascript">


        $("#country_id").select2();
        $("#speciality_id").select2();
        $("#sub_speciality_ids").select2();
        $("#sub_speciality_ids").chained("#speciality_id");

        $("#kt_login_signin_submit").on("click", function () {
            $("#signup_form").ajaxSubmit({
                beforeSubmit: function (arr, $form, options) {
                    toastr.warning('Please wait!');
                },
                success: function () {
                    toastr.success('Success');

                    window.location.href = "{{url("/?view=dashboard")}}";

                },
                error: function (e) {
                    error = $.parseJSON(e.responseText);
                    var errors = "";
                    $.each(error, function (index, value) {

                        errors += value + "<br>";
                    });

                    toastr.error(errors, "Invalid data!");

                }

            });

        })
        $("#area_of_interest").select2();
        $("#topics_of_interest").select2();
        $("#institutions").select2();

        $("#describe_yourself").on("change",function(){
            describe_yourself  = $(this).val();

            if(describe_yourself == "Other"){
                $("#describe_yourself_other").show();
            }else{
                $("#describe_yourself_other").hide();
            }
        })
        $("#describe_yourself").trigger("change");

    </script>
@endsection