{% extends 'base.html.twig' %}

{% block title %}
    OceanExpert - A Directory of Marine and Freshwater Professionals
{% endblock %}

{% block stylesheets %}
    <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/viewProfile.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/select2.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/select2-bootstrap.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap-print.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/font-awesome.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/navbar-login.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/social-buttons.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/style.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/search.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/google-fonts.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/AdminLTE.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap.vertical-tabs.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap-datepicker.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/tipped.css') }}">
{% endblock %}

{% block body %}
    <style>
        .form-inline > * {
            margin: 15px 10px !important;
        }

        .tipso {
            cursor: pointer;
            font-size: 20px;
        }
    </style>

    {% include('navbarlogin.html.twig') %}

    {% if OIHData is defined %}
        <!-- JSON-LD will be used for SEO and OIH -->
        <script type="application/ld+json">
            {{ OIHData | raw }}
        </script>
    {% endif %}

    <div class="container-fluid">
        <!-- Content Wrapper. Contains page content -->
        <div class="">
            <!-- Main content -->
            <section class="content">
                {% if is_granted('ROLE_ADMIN')
                    and is_granted('ROLE_PREVIOUS_ADMIN') == false
                    and (expert.username is defined) %}
                    <a
                            id=""
                            class="btn btn-primary pull-right"
                            href="?_switch_user={{ expert.username }}"
                            role="button">
                        Login as this user
                    </a>
                {% endif %}

                <img
                        src="{{ asset('img/oceanexpert-print.png') }}"
                        alt="print logo"
                        class="print-logo"/>

                {% if expert.expertInfo.idInd is not defined %}
                    <div class="alert alert-error">
                        <h4>
                            <strong>
                                <i class="fa fa-exclamation-triangle fa-fw" aria-hidden="true"></i>
                                The profile you are looking for was not found.
                            </strong>
                        </h4>
                        <span>
                            <a
                                    href="{{ path('frontend_homepage') }}"
                                    title="">
                                click here
                            </a> to got to the Home Page.
                        </span>
                    </div>
                {% elseif expert.expertInfo.idInd is defined and expert.error is defined %}
                    <div class="alert alert-error">
                        {% if expert.expertInfo.idInd is defined %}
                            {% if is_granted('ROLE_GLOBAL_EDITOR') %}
                                <h4>
                                    <strong>
                                        <i class="fa fa-exclamation-triangle fa-fw" aria-hidden="true"> </i>
                                        Sorry we cannot display this profile yet as this profile is incomplete.
                                    </strong>
                                </h4>
                                <span>
                                    <a
                                            href="{{ path('fos_admin_profile_edit',{'userId': expert.expertInfo.idInd}) }}"
                                            title="">
                                        click here
                                    </a> to enter the necessary information.
                                </span>
                            {% else %}
                                <h4>
                                    <strong>
                                        <i class="fa fa-exclamation-triangle fa-fw" aria-hidden="true"></i>
                                        Sorry we cannot display your profile yet as your profile is incomplete.
                                    </strong>
                                </h4>
                                <span>
                                    <a
                                            href="{{ path('fos_admin_profile_edit',{'userId': expert.expertInfo.idInd}) }}"
                                            title="">
                                        click here
                                    </a> to enter the necessary information.
                                </span>
                            {% endif %}
                        {% else %}
                            <h4>
                                <strong>
                                    <i class="fa fa-exclamation-triangle fa-fw" aria-hidden="true"></i>
                                    The profile you are looking for was not found.
                                </strong>
                            </h4>
                            <span>
                                <a
                                        href="{{ path('frontend_homepage') }}"
                                        title="">
                                    click here
                                </a> to got to the Home Page.
                            </span>
                        {% endif %}

                    </div>
                {% else %}
                    <div class="row">
                        <div class="col-md-3 col-p-5">
                            <!-- Profile Image -->
                            <div class="box box-primary">
                                <div class="box-body box-profile">
                                    {% if expert.expertInfo.idInd is defined and expert.expertInfo.idInd | trim != "" %}

                                        <h4 class="text-center">
                                            OceanExpert ID : <strong>{{ expert.expertInfo.idInd}}</strong>
                                        </h4>
                                    {% endif %}
                                    <img
                                            class="profile-user-img img-responsive lazy"
                                            data-original="{% if file_exists(web_path~asset('uploads/profile/profile_'~expert.expertInfo.idInd~'.png')) %}
                                                        {{ asset('uploads/profile/profile_'~expert.expertInfo.idInd~'.png') }}
                                                    {% else %}
                                                        {{ asset('assets/uploads/default.png') }}
                                                    {% endif %}"
                                            alt="User profile picture"
                                            onError="this.src='{{ asset('assets/uploads/default.png') }}';" />

                                    {% if expert.expertInfo.fname is defined %}
                                        <h2 class="expert-name">
                                            {% if expert.expertInfo.title is defined %}
                                                {{ expert.expertInfo.title | raw }}
                                            {% endif %}
                                            {% if expert.expertInfo.fname is defined %}
                                                {{ expert.expertInfo.fname | raw }}
                                            {% endif %}
                                            {% if expert.expertInfo.mname is defined %}
                                                {{ expert.expertInfo.mname | raw }}
                                            {% endif %}
                                            {% if expert.expertInfo.sname is defined %}
                                                {{ expert.expertInfo.sname | raw | upper }}
                                            {% endif %}
                                            {% if expert.expertInfo.qualityChecked == 1 %}
                                                <i class="tipso green fa fa-check-circle" title="User has been verified."></i>
                                            {% endif %}
                                        </h2>
                                    {% endif %}

                                    {% if expert.expertInfo.retired is defined and expert.expertInfo.retired == 1 %}
                                        <p class="text-center">
                                            <span class="label label-success">
                                                Retired {% if expert.expertInfo.retiredDate is not null and expert.expertInfo.retiredDate|date("d/m/Y") !="30/11/-0001" %}
                                                    on {{ expert.expertInfo.retiredDate | date("d/m/Y") }}
                                                {% endif %}
                                            </span>
                                        </p>
                                    {% endif %}

                                    {% if expert.expertInfo.deceased is defined and expert.expertInfo.deceased == 1 %}
                                        <p class="text-center">
                                            <span class="label label-danger">
                                                Deceased {% if expert.expertInfo.deceasedDate is not null and expert.expertInfo.deceasedDate|date("d/m/Y") !="30/11/-0001" %}
                                                    on {{ expert.expertInfo.deceasedDate | date("d/m/Y") }}
                                                {% endif %}
                                            </span>
                                        </p>
                                    {% endif %}

                                    {% if expert.expertInfo.jobtitle is defined and expert.expertInfo.deceased == 0 %}
                                        <p class="text-center">
                                            {{ expert.expertInfo.jobtitle | raw }}
                                        </p>
                                    {% endif %}

                                    {% if expert.expertInfo.dept is defined %}
                                        <p class="text-center">
                                            {{ expert.expertInfo.dept | raw }}
                                        </p>
                                    {% endif %}

                                    {% if expert.instName is defined %}
                                        <p class="lead text-center">
                                            {% if expert.expertInfo.deceased == 1 %}
                                                <small>Last Associated with:</small><br/>
                                            {% endif %}
                                            {% if expert.idInst is defined
                                                and expert.idInst != ""
                                            %}
                                                <a
                                                        href="{{ path('view_institution',{'instId': expert.idInst}) }}"
                                                        title="">
                                                    {{ expert.instName }}
                                                </a>
                                            {% endif %}
                                        </p>
                                    {% endif %}

                                    <p class="lead text-center print">
                                        {% if app.user.id is defined and expert.expertInfo.idInd is not defined %}
                                            <a
                                                    href="{{ path('fos_admin_profile_edit',{'userId': app.user.id}) }}"
                                                    class="btn btn-primary">
                                                <i class="fa fa-user" aria-hidden="true"></i> Edit Profile
                                            </a>
                                        {% endif %}

                                        {% if expert.expertInfo.idInd is defined %}
                                        {% if (app.user is not null and expert.expertInfo.idInd == app.user.id) or is_granted('ROLE_GLOBAL_EDITOR') %}
                                            {% if is_granted('ROLE_GLOBAL_EDITOR') %}
                                                {% if expert.expertInfo.status is defined and (expert.expertInfo.status  == 0 or expert.expertInfo.status  == 3 ) %}
                                                    <span class="statusBtn">
                                                            <button class="btn btn-success activate">
                                                                <i class="fa fa-check" aria-hidden="true"></i>
                                                                Activate
                                                            </button>
                                                        </span>
                                                {% elseif expert.expertInfo.status is defined and expert.expertInfo.status == 1 %}
                                                    <span class="statusBtn">
                                                            <button
                                                                    class="btn btn-danger ban">
                                                                <i class="fa fa-ban" aria-hidden="true"> </i>
                                                                Deactivate
                                                            </button>
                                                        </span>
                                                {% elseif expert.expertInfo.status is defined and expert.expertInfo.status == 2 %}
                                                    <span class="statusBtn">
                                                            <button class="btn btn-warning undelete">
                                                                <i class="fa fa-check" aria-hidden="true"></i>
                                                                Un-Delete
                                                            </button>
                                                        </span>
                                                {% elseif expert.expertInfo.status is defined and expert.expertInfo.status == 3 %}
                                                    <span class="statusBtn">
                                                            <button class="btn btn-aqua activate">
                                                                <i class="fa fa-check" aria-hidden="true"></i>
                                                                Activate
                                                            </button>
                                                        </span>
                                                {% endif %}
                                            {% endif %}

                                            {% if app.user.id == expert.expertInfo.idInd %}
                                                <a
                                                        href="{{ path('fos_admin_profile_edit',{'userId': expert.expertInfo.idInd}) }}"
                                                        class="btn btn-primary">
                                                    <i class="fa fa-user" aria-hidden="true"></i>
                                                    Edit Profile
                                                </a>
                                            {% else %}
                                                <a
                                                        href="{{ path('fos_admin_profile_edit',{'userId': expert.expertInfo.idInd}) }}"
                                                        class="btn btn-primary">
                                                    <i class="fa fa-user" aria-hidden="true"></i>
                                                    Edit Profile
                                                </a>
                                            {% endif %}
                                        {% endif %}
                                    </p>
                                    {% endif %}
                                </div>
                                <!-- /.box-body -->
                            </div>
                            <!-- /.box -->

                            <!-- About Me Box -->
                            {% if expert.expertInfo is defined %}
                                <div class="box box-primary">
                                    <!-- /.box-header -->
                                    <div class="box-body">
                                        <strong>
                                            <i class="fa icon-profile fa-map-marker margin-r-5" aria-hidden="true"></i>
                                            Work Location
                                        </strong>
                                        <div class="data">
                                            {{ expert.workLocation | raw }}
                                        </div>

                                        {% if expert.nationality is defined and expert.nationality !="" %}
                                            <hr>
                                            <strong>
                                                <i class="fa icon-profile fa-flag margin-r-5" aria-hidden="true"></i>
                                                Nationality
                                            </strong>
                                            <p class="data">
                                                {{ expert.nationality|replace({',':"\n"})|nl2br }}
                                            </p>
                                        {% endif %}

                                        <hr>
                                        {% if expert.expertInfo.deceased == 0 %}

                                            <strong>
                                                <i class="fa icon-profile fa-envelope margin-r-5"></i>
                                                Email(s)
                                            </strong>
                                            {% if expert.expertInfo.email1 is defined %}
                                                {% if app.user.id is defined %}
                                                    <p class="data">
                                                        <u>Primary Email:</u><br/>
                                                        <a
                                                                href="mailto:{{ expert.expertInfo.email1 }}">
                                                            {{ expert.expertInfo.email1 | raw }}
                                                        </a>
                                                    </p>
                                                    {% if expert.expertInfo.email2 is defined and expert.expertInfo.email2!="" %}
                                                        <p class="data">
                                                            <u>Notification Email:</u><br/>
                                                            <a
                                                                    href="mailto:{{ expert.expertInfo.email2 }}">
                                                                {{ expert.expertInfo.email2 | raw }}
                                                            </a>
                                                        </p>
                                                    {% else %}
                                                        <p class="data">
                                                            <u>Notification Email:</u><br/>
                                                            Same as Primary.
                                                        </p>
                                                    {% endif %}
                                                {% else %}
                                                    <p class="data">
                                                        Please login to see the email.
                                                    </p>
                                                {% endif %}
                                            {% endif %}

                                            {% if expert.expertInfo.tel is defined and expert.expertInfo.tel !="" %}
                                                <hr>
                                                <strong>
                                                    <i class="fa icon-profile fa-phone-square margin-r-5"></i>
                                                    Telephone
                                                </strong>
                                                <p class="data">
                                                    {{ expert.expertInfo.tel }}
                                                </p>
                                            {% endif %}

                                            {% if expert.expertInfo.fax is defined and expert.expertInfo.fax != "" %}
                                                <hr>
                                                <strong>
                                                    <i class="fa icon-profile fa-fax margin-r-5"></i>
                                                    Fax
                                                </strong>
                                                <p class="data">
                                                    {{ expert.expertInfo.fax }}
                                                </p>
                                            {% endif %}
                                        {% endif %}
                                        {% if is_granted('ROLE_GLOBAL_EDITOR') or (app.user.id is defined and expert.expertInfo.idInd == app.user.id ) %}
                                            {% if expert.expertInfo.gender is defined %}
                                                <hr>
                                                <strong>
                                                    <i class="fa icon-profile fa-venus-mars margin-r-5" aria-hidden="true"></i>
                                                    Gender
                                                </strong>
                                                <p class="data">
                                                    {{ expert.expertInfo.gender|capitalize }}
                                                </p>
                                                <hr/>
                                            {% endif %}
                                        {% endif %}
                                    </div>
                                    <!-- /.box-body -->
                                </div>
                                <!-- /.box -->
                            {% endif %}
                        </div>
                        <div class="col-md-9 col-p-7">
                            <div class="nav-tabs-custom">
                                <ul class="nav nav-tabs print ">
                                    {% if app.user.id is defined %}
                                        <li class="active">
                                            <a
                                                    href="#profile"
                                                    data-toggle="tab">
                                                Profile
                                            </a>
                                        </li>
                                        {% if is_granted('ROLE_GLOBAL_EDITOR') == false %}
                                            {% if app.user.id is defined and app.user.id == expert.expertInfo.idInd %}
                                                <li>
                                                    <a
                                                            href="#settings"
                                                            data-toggle="tab">
                                                        Settings
                                                    </a>
                                                </li>
                                            {% endif %}
                                        {% endif %}

                                        {% if is_granted('ROLE_GLOBAL_EDITOR') %}
                                            <li>
                                                <a
                                                        href="#adminOptions"
                                                        data-toggle="tab">
                                                    Admin Options
                                                </a>
                                            </li>
                                        {% endif %}
                                    {% endif %}
                                </ul>
                                <div class="tab-content">
                                    <div class="active tab-pane" id="profile">
                                        <div class="btn edit">
                                            <button
                                                    type="button"
                                                    class="btn btn-primary"
                                                    onclick="window.print()">
                                                <i class="fa fa-print" aria-hidden="true"></i>
                                                Print
                                            </button>
                                        </div>
                                        {% if expert.profileUrl is defined %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-link margin-r-5"></i>
                                                    Profile URL
                                                </strong>
                                                <p class="data">
                                                    <a
                                                            href="{{ expert.profileUrl }}">
                                                        {{ expert.profileUrl }}
                                                    </a>
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if  (attribute(metadata, 'orcid') is defined and attribute(metadata, 'orcid')!="") or (attribute(metadata, 'researcherid') is defined and attribute(metadata, 'researcherid') !="") %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-external-link margin-r-5" aria-hidden="true"></i>
                                                    Persistent Digital Identifiers (UIDs)
                                                </strong>
                                                <p class="data">
                                                    {% if attribute(metadata, 'orcid') is defined and attribute(metadata, 'orcid') != "" %}
                                                        {% if '/' in attribute(metadata, 'orcid') %}
                                                            {% set foo = attribute(metadata, 'orcid') |split('/') %}
                                                            {% set orcid = foo | last %}
                                                            ORCID : <a
                                                                href="https://orcid.org/{{ orcid }}"
                                                                target="_blank">
                                                            {{ attribute(metadata, 'orcid') }}
                                                        </a> <br/>
                                                        {% else %}
                                                            ORCID : <a
                                                                href="https://orcid.org/{{ attribute(metadata, 'orcid') }}"
                                                                target="_blank">
                                                            {{ attribute(metadata, 'orcid') }}
                                                        </a><br/>
                                                        {% endif %}
                                                    {% endif %}

                                                    {% if  attribute(metadata, 'researcherid') is defined and   attribute(metadata, 'researcherid') != "" %}
                                                        ResearcherID : <a
                                                            href="https://www.researcherid.com/rid/{{ attribute(metadata, 'researcherid') }}"
                                                            target="_blank">
                                                        {{ attribute(metadata, 'researcherid') }}
                                                    </a> <br/>
                                                    {% endif %}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if expert.expertInfo.degree is defined and expert.expertInfo.degree != "" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-graduation-cap margin-r-5" aria-hidden="true"></i>
                                                    Highest Degree
                                                </strong>
                                                <p class="data">
                                                    {{ expert.expertInfo.degree }}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if expert.jobType is defined and expert.jobType != "" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-briefcase margin-r-5" aria-hidden="true"></i>
                                                    Job Type
                                                </strong>
                                                <p class="data">
                                                    {{ expert.jobType|replace({'\\r':"\n"})|nl2br }}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if metadata.researcharea is defined and metadata.researcharea !="" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-book margin-r-5" aria-hidden="true"></i>
                                                    Subject Area
                                                </strong>
                                                <p class="data">
                                                    {{ metadata.researcharea|replace({'\\r':"\n"})|nl2br }}
                                                </p>
                                            </div>
                                        {% elseif expert.subjectArea is defined and expert.subjectArea != "" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-book margin-r-5" aria-hidden="true"></i>
                                                    Subject Area
                                                </strong>
                                                <p class="data">
                                                    {{ expert.subjectArea|replace({',':"\n"})|nl2br }}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if expert.expertInfo.activeng is defined and expert.expertInfo.activeng !="" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-flask margin-r-5" aria-hidden="true"></i>
                                                    Activities
                                                </strong>
                                                <p class="data">
                                                    {{ expert.expertInfo.activeng|raw }}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if expert.studyregion is defined and expert.studyregion !="" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-globe margin-r-5" aria-hidden="true"></i>
                                                    Sea regions of study
                                                </strong>
                                                <p class="data">
                                                    {{ expert.studyregion|replace({',':"\n"})|nl2br }}
                                                </p>
                                            </div>
                                        {% elseif expert.expertInfo.studyregion is defined and expert.expertInfo.studyregion !="" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-book margin-r-5" aria-hidden="true"></i>
                                                    Region of Study
                                                </strong>
                                                <p class="data">
                                                    {% if expert.expertInfo.studyregion is defined %}
                                                        {{ expert.expertInfo.studyregion|replace({'\\r':"\n"})|nl2br|title }}
                                                    {% endif %}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if expert.expertInfo.skills is defined and expert.expertInfo.skills !="" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-puzzle-piece margin-r-5" aria-hidden="true"></i>
                                                    Skills
                                                </strong>
                                                <p class="data">
                                                    {{ expert.expertInfo.skills | raw }}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if expert.expertInfo.languages is defined and expert.expertInfo.languages !="" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-language margin-r-5" aria-hidden="true"></i>
                                                    Working language(s)
                                                </strong>
                                                <p class="data">
                                                    {{ expert.expertInfo.languages|replace({",":"<br />"})|raw }}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if  (attribute(metadata, 'google-scholar') is defined and attribute(metadata, 'google-scholar') !="") or (attribute(metadata, 'other-citation') is defined and attribute(metadata, 'other-citation') !="") or (attribute(metadata, 'researchgate') is defined and attribute(metadata, 'researchgate') !="") %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-book margin-r-5" aria-hidden="true"></i>
                                                    Citation(s)
                                                </strong>
                                                <p class="data">
                                                    {% if attribute(metadata, 'google-scholar') is defined and attribute(metadata, 'google-scholar') != "" %}
                                                        <a href="{{ attribute(metadata, 'google-scholar') }}"
                                                           target="_blank">Google Scholar</a><br/>
                                                    {% endif %}

                                                    {% if attribute(metadata, 'researchgate') is defined and attribute(metadata, 'researchgate') != "" %}
                                                        <a href="{{ attribute(metadata, 'researchgate') }}"
                                                           target="_blank">ResearchGate</a>
                                                        <br/>
                                                    {% endif %}

                                                    {% if  attribute(metadata, 'other-citation') is defined and   attribute(metadata, 'other-citation') != "" %}
                                                        <a href="{{ attribute(metadata, 'other-citation') }}"
                                                           target="_blank">Other</a><br/>
                                                    {% endif %}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if ((expert.expertInfo.linkedin is defined and expert.expertInfo.linkedin !='' ) or (expert.expertInfo.facebook is defined and expert.expertInfo.facebook !='' ) or (expert.expertInfo.linkedin is defined and expert.expertInfo.twitter !='' ) or (expert.expertInfo.other is defined and expert.expertInfo.other !='' )) and expert.expertInfo.deceased == 0 %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-hashtag margin-r-5" aria-hidden="true"></i>
                                                    Social
                                                </strong>
                                                <p>
                                                    {% if expert.expertInfo.linkedin is defined and expert.expertInfo.linkedin !="" %}
                                                        <a
                                                                href="{{ expert.expertInfo.linkedin }}"
                                                                target="_blank">
                                                            <img
                                                                    class="social-icon lazy"
                                                                    alt="linkedin img"
                                                                    data-original="{{ asset('img/linkedin-logo.png') }}" />
                                                        </a>
                                                    {% endif %}

                                                    {% if expert.expertInfo.facebook is defined and expert.expertInfo.facebook !="" %}
                                                        <a
                                                                href="{{ expert.expertInfo.facebook }}"
                                                                target="_blank">
                                                            <img
                                                                    class="social-icon lazy"
                                                                    alt="facebook img"
                                                                    data-original="{{ asset('img/facebook-logo.png') }}" />
                                                        </a>
                                                    {% endif %}

                                                    {% if expert.twitter and expert.twitter !="" %}
                                                        <a
                                                                href="{{ expert.twitter }}"
                                                                target="_blank">
                                                            <img
                                                                    class="social-icon lazy img-fluid"
                                                                    alt="X img"
                                                                    data-original="{{ asset('img/x-logo.png') }}" />
                                                        </a>
                                                    {% endif %}

                                                    {% if expert.expertInfo.other %}
                                                        <a
                                                                href="{{ expert.expertInfo.other }}"
                                                                target="_blank">
                                                            <img
                                                                    class="social-icon lazy"
                                                                    alt="other img"
                                                                    data-original="{{ asset('img/other.png') }}" />
                                                        </a>
                                                    {% endif %}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if ((expert.expertInfo.url1 is defined or expert.expertInfo.url2 is defined ) and (expert.expertInfo.url1 != "" or expert.expertInfo.url2 != "" )) and  expert.expertInfo.deceased == 0 %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-globe margin-r-5" aria-hidden="true"></i>
                                                    Website(s)
                                                </strong>
                                                {% if expert.expertInfo.url1 %}
                                                    <p class="data">
                                                        <a
                                                                href="{{ expert.expertInfo.url1 }}"
                                                                title="Website"
                                                                target="_blank">
                                                            {{ expert.expertInfo.url1 }}
                                                        </a>
                                                    </p>
                                                {% endif %}

                                                {% if expert.expertInfo.url2 %}
                                                    <p class="data">
                                                        <a
                                                                href="{{ expert.expertInfo.url2 }}"
                                                                title="Website"
                                                                target="_blank">
                                                            {{ expert.expertInfo.url2 }}
                                                        </a>
                                                    </p>
                                                {% endif %}
                                            </div>
                                        {% endif %}

                                        {% if expert.expertInfo.comments is defined and expert.expertInfo.comments !="" %}
                                            <div class="box-body">
                                                <strong>
                                                    <i class="fa icon-profile fa-comments" aria-hidden="true"></i>
                                                    Comment(s)
                                                </strong>
                                                <p class="data">
                                                    {{ expert.expertInfo.comments | raw }}
                                                </p>
                                            </div>
                                        {% endif %}

                                        {% if app.user and eventData.getTotalItemCount > 0 %}
                                            <div class="box box-primary eventParticipation">
                                                <!-- /.box-header -->
                                                <div class="box-body">
                                                    <div>
                                                        <strong>
                                                            <i class="fa fa-calendar margin-r-5" aria-hidden="true"></i>
                                                            EVENTS IN WHICH {% if expert.expertInfo.fname is defined %}
                                                                {% if expert.expertInfo.title is defined %}
                                                                    {{ expert.expertInfo.title | raw }}
                                                                {% endif %}
                                                                {% if expert.expertInfo.fname is defined %}
                                                                    {{ expert.expertInfo.fname | raw }}
                                                                {% endif %}
                                                                {% if expert.expertInfo.sname is defined %}
                                                                    {{ expert.expertInfo.sname | raw | upper }}
                                                                {% endif %}
                                                            {% endif %} IS/HAS BEEN INVOLVED. ({{ eventData.getTotalItemCount }})
                                                        </strong>
                                                    </div>
                                                    <span class="col-md-6 search-display">
                                                        Displaying {{ eventData.getPaginationData.firstItemNumber }} – {{ eventData.getPaginationData.lastItemNumber }} results of {{ eventData.getTotalItemCount }}.
                                                    </span>
                                                    <span class="col-md-6">
                                                        <div class=" pagination-sm pull-right">
                                                            {{ knp_pagination_render(eventData) }}
                                                        </div>
                                                    </span>
                                                    <div class="col-md-12">
                                                        <table class="table table-striped table-hover">
                                                            <tbody>
                                                            {% for item in eventData %}
                                                                <tr>
                                                                    <td>
                                                                        <i class="fa fa-calendar fa-4x" aria-hidden="true"></i>
                                                                    </td>
                                                                    <td>
                                                                        <strong>
                                                                            <a
                                                                                    href="{{ path('view_event', {'event': item.idEvent}) }}"
                                                                                    class="profile-url">{{ item.title }}
                                                                            </a>
                                                                        </strong><br />
                                                                        {{ item.startOn|date('d/m/Y') }} - {{ item.endOn | date('d/m/y') }}<br />

                                                                        {% if item.address is defined and item.address!="" %}
                                                                            {{ item.address | raw }}<br />
                                                                        {% endif %}

                                                                        {% if item.city is defined and item.city!="" %}
                                                                            {{ item.city | raw }}
                                                                        {% endif %}

                                                                        {% if item.state is defined and item.state!="" %}
                                                                            {{ item.state | raw }}<br />
                                                                        {% endif %}

                                                                        {% if item.country is defined and item.country!="" %}
                                                                            {{ item.country | raw | upper }}
                                                                        {% endif %}
                                                                    </td>
                                                                </tr>
                                                            {% endfor %}
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                    <span class="col-md-12">
                                                        <div class=" pagination-sm pull-right">
                                                            {{ knp_pagination_render(eventData) }}
                                                        </div>
                                                    </span>
                                                </div>
                                            </div>
                                        {% endif %}
                                    </div>

                                    <!-- /.tab-pane -->
                                    {% if is_granted('ROLE_GLOBAL_EDITOR') == false %}
                                        {% if app.user.id is defined and app.user.id == expert.expertInfo.idInd %}

                                            <div
                                                    class="tab-pane"
                                                    id="settings">
                                                <div class="row">
                                                    <div class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
                                                        <!-- Nav tabs -->
                                                        <ul class="nav nav-tabs tabs-left sideways">
                                                            {#<li class="active"><a href="#general"#}
                                                            {#data-toggle="tab">General</a>#}
                                                            {#</li>#}
                                                            <li>
                                                                <a
                                                                        href="#status"
                                                                        data-toggle="tab">
                                                                    Change Status
                                                                </a>
                                                            </li>
                                                            <!--
                                                            <li>
                                                                <a
                                                                        href="#changeUsername"
                                                                        data-toggle="tab">
                                                                    Change Username
                                                                </a>
                                                            </li>
                                                            -->
                                                            <li>
                                                                <a
                                                                        href="#email"
                                                                        data-toggle="tab">
                                                                    Change Email
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a
                                                                        href="#subscription"
                                                                        data-toggle="tab">
                                                                    Email Subscription
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a
                                                                        href="#delete"
                                                                        data-toggle="tab">
                                                                    Deactivate Account
                                                                </a>
                                                            </li>
                                                        </ul>
                                                    </div>

                                                    <div class="col-xs-9 col-sm-9 col-md-9 col-lg-9">
                                                        <!-- Tab panes -->
                                                        <div class="tab-content">
                                                            <div class="tab-pane active" id="general">
                                                                <legend class="panel-content">
                                                                    User settings
                                                                </legend>
                                                            </div>
                                                            <div class="tab-pane" id="status">
                                                                <legend class="panel-content">
                                                                    Change your status (Retirement)
                                                                </legend>
                                                                Have you retired recently?
                                                                Please use the options below to change your profile status to <em>retired</em>
                                                                and to add the date of your retirement.
                                                                <form class="form-inline col-xs-12 col-sm-8 col-md-offset-3 col-sm-offset-2">
                                                                    <div class="form-group">
                                                                        <div class="onoffswitch">
                                                                            <input
                                                                                    type="checkbox"
                                                                                    name="userRetired"
                                                                                    class="onoffswitch-checkbox"
                                                                                    {% if expert.expertInfo.retired is defined and expert.expertInfo.retired == 1 %}
                                                                                        checked=""
                                                                                    {% endif %}
                                                                                    id="userRetired"
                                                                                    value="{% if expert.expertInfo.retired is defined %}{{ expert.expertInfo.retired }}{% endif %}">
                                                                            <label
                                                                                    class="onoffswitch-label"
                                                                                    for="userRetired">
                                                                                <span class="onoffswitch-inner"></span>
                                                                                <span class="onoffswitch-switch"></span>
                                                                            </label>
                                                                        </div>
                                                                    </div>

                                                                    <div class="form-group">
                                                                        <input
                                                                                type="text"
                                                                                id="userRetiredDate"
                                                                                class="form-control datepicker"
                                                                                {% if expert.expertInfo.retired is defined and expert.expertInfo.retired == 1 %}
                                                                                    {% if expert.expertInfo.retiredDate is not null and expert.expertInfo.retiredDate|date("d/m/Y") !="30/11/-0001" %}
                                                                                        value="{{ expert.expertInfo.retiredDate|date('Y-m-d') }}"
                                                                                    {% endif %}
                                                                                {% else %}
                                                                                    value=""
                                                                                    disabled=""
                                                                                {% endif %}
                                                                                id="userRetiredDate"
                                                                                placeholder="Retired date" />
                                                                    </div>
                                                                    <button
                                                                            type="button"
                                                                            class="btn btn-success "
                                                                            id="userBtnRetired">
                                                                        Save
                                                                    </button>
                                                                </form>
                                                            </div>
                                                            <!--
                                                            <div class="tab-pane" id="changeUsername">
                                                                <legend class="panel-content">
                                                                    Change your Username
                                                                </legend>
                                                                <form class="form-horizontal">
                                                                    <span class="text-danger col-sm-offset-2 errorUsername"></span>
                                                                    <div class="form-group">
                                                                        <label for="currentUsername"
                                                                               class="col-sm-2 control-label">Your
                                                                            Username</label>
                                                                        <div class="col-sm-10">
                                                                            <input type="text"
                                                                                   class="form-control currentUsername"
                                                                                   id="currentUsername" readonly=""
                                                                                   value="{% if expert.username is defined %}{{ expert.username | raw }}{% endif %}">
                                                                        </div>
                                                                    </div>
                                                                    <div class="form-group">
                                                                        <label for="newUsername"
                                                                               class="col-sm-2 control-label">New
                                                                            Username</label>
                                                                        <div class="col-sm-10">
                                                                            <input type="text"
                                                                                   class="form-control newUsername"
                                                                                   id="newUsername"
                                                                                   placeholder="Enter new username."
                                                                                   required="">
                                                                        </div>
                                                                    </div>
                                                                    <div class="form-group">
                                                                        <div class="col-sm-offset-2 col-sm-10">
                                                                            <button type="button"
                                                                                    class="btn btn-success changeUsername">
                                                                                Change Username
                                                                            </button>
                                                                        </div>
                                                                    </div>
                                                                </form>
                                                            </div>
                                                            -->
                                                            <div class="tab-pane" id="email">
                                                                <legend class="panel-content">
                                                                    Change your primary email address
                                                                </legend>
                                                                <form class="form-horizontal">
                                                                    <div class="text-danger col-sm-offset-2 errorEmail"></div>
                                                                    <div class="form-group">
                                                                        <label for="currentEmail"
                                                                               class="col-sm-2 control-label">Your Primary
                                                                            Email</label>
                                                                        <div class="col-sm-10">
                                                                            <input type="email"
                                                                                   class="form-control currentEmail"
                                                                                   id="currentEmail" readonly=""
                                                                                   value="{% if expert.email is defined %}{{ expert.email | raw }}{% endif %}">
                                                                        </div>
                                                                    </div>
                                                                    <div class="form-group">
                                                                        <label for="newEmail"
                                                                               class="col-sm-2 control-label">New
                                                                            Email</label>
                                                                        <div class="col-sm-10">
                                                                            <input type="email"
                                                                                   class="form-control newEmail"
                                                                                   id="newEmail"
                                                                                   placeholder="Enter new Email."
                                                                                   required="">
                                                                        </div>
                                                                    </div>
                                                                    <div class="form-group">
                                                                        <div class="col-sm-offset-2 col-sm-10">
                                                                            <button type="button"
                                                                                    class="btn btn-success confirmEmail">
                                                                                Confirm
                                                                                Email
                                                                            </button>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-sm-offset-2 col-sm-10 errorConfirmCode text-danger"></div>
                                                                    <div class="form-group" style="display:none;">
                                                                        <label for="confirmCode"
                                                                               class="col-sm-2 control-label">Confirmation
                                                                            Code</label>
                                                                        <div class="col-sm-10">
                                                                            <input type="text"
                                                                                   class="form-control confirmCode"
                                                                                   id="confirmCode"
                                                                                   placeholder="Enter confirmation code."
                                                                                   required="">
                                                                        </div>
                                                                    </div>
                                                                </form>
                                                            </div>
                                                            <div class="tab-pane" id="subscription">
                                                                <legend class="panel-content">
                                                                    Change your subscription settings
                                                                </legend>
                                                                <div class="col-xs-12 col-sm-8">
                                                                    Do you want to receive emails from OceanExpert/IODE?
                                                                </div>
                                                                <form class="form-inline col-xs-12 col-sm-8 col-md-offset-3 col-sm-offset-2">
                                                                    <div class="form-group">
                                                                        <div class="onoffswitch">
                                                                            <input type="checkbox" name="userDoNotInvite"
                                                                                   class="onoffswitch-checkbox"
                                                                                    {% if expert.expertInfo.doNotInvite is defined and expert.expertInfo.doNotInvite == 0 %}
                                                                                        checked=""
                                                                                    {% endif %}
                                                                                   id="userDoNotInvite"
                                                                                   value="1">
                                                                            <label class="onoffswitch-label"
                                                                                   for="userDoNotInvite">
                                                                                <span class="onoffswitch-inner"></span>
                                                                                <span class="onoffswitch-switch"></span>
                                                                            </label>
                                                                        </div>
                                                                    </div>
                                                                    <button type="button" class="btn btn-success "
                                                                            id="usrBtnSubscription">
                                                                        Save
                                                                    </button>
                                                                </form>
                                                            </div>
                                                            <div class="tab-pane" id="delete">
                                                                <legend class="panel-content">
                                                                    Deactivate your OceanExpert account
                                                                </legend>
                                                                We are sorry to see you go.<br />
                                                                Once your account has been deactivated,
                                                                you will no longer be able to login to OceanExpert (and partner sites like
                                                                <a
                                                                        href="https://oceanteacher.org"
                                                                        target="_blank">
                                                                    OTGA
                                                                </a>, <a
                                                                        href="https://catalogue.odis.org"
                                                                        target="_blank">
                                                                    ODISCat
                                                                </a>, etc... ) and
                                                                your profile will no longer be available for other experts to view.<br />
                                                                In case you choose to change you decision after the account is deactivated,
                                                                please contact us at <a href="mailto:info@oceanexpert.org">info@oceanexpert.org</a>.
                                                                <div class="top-buffer50">
                                                                    <button type="button"
                                                                            class="btn btn-danger deactivateAccount col-sm-offset-2 ">
                                                                        Deactivate your Account
                                                                    </button>
                                                                    <div class="text-danger deleteError"></div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        {% endif %}
                                    {% endif %}

                                    <!-- /.tab-pane -->
                                    {% if is_granted('ROLE_GLOBAL_EDITOR') %}
                                        <div class="tab-pane" id="adminOptions">
                                            <div class="helptext">
                                                <i class="fa fa-fw fa-info-circle"></i>
                                                Use the following options to change settings for
                                                <strong>
                                                    {% if expert.expertInfo.fname is defined %}
                                                        {% if expert.expertInfo.title is defined %}{{ expert.expertInfo.title | raw }} {% endif %}
                                                        {% if expert.expertInfo.fname is defined %}{{ expert.expertInfo.fname | raw }} {% endif %}
                                                        {% if expert.expertInfo.mname is defined %}{{ expert.expertInfo.mname | raw }} {% endif %}
                                                        {% if expert.expertInfo.sname is defined %}{{ expert.expertInfo.sname | raw | upper }} {% endif %}
                                                    {% endif %}
                                                </strong>
                                            </div>

                                            <div class="panel-group" id="accordion">
                                                <div class="panel panel-default" id="panel1">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#cusername">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a class="javascript:void(0)">
                                                                Change Username
                                                            </a>
                                                        </h4>
                                                    </div>
                                                    <div id="cusername" class="panel-collapse collapse">
                                                        <div class="panel-body">
                                                            <div class="tab-pane" id="changeUsername">
                                                                <legend class="panel-content">Change your Username
                                                                </legend>
                                                                <form class="form-horizontal">
                                                                    <span class="text-danger col-sm-offset-2 errorUsername"></span>
                                                                    <div class="form-group">
                                                                        <label for="admCurUsername"
                                                                               class="col-sm-2 control-label">Your
                                                                            Username</label>
                                                                        <div class="col-sm-10">
                                                                            <input type="text"
                                                                                   class="form-control currentUsername"
                                                                                   id="admCurUsername" readonly=""
                                                                                   value="{% if expert.username is defined %}{{ expert.username | raw }}{% endif %}">
                                                                        </div>
                                                                    </div>
                                                                    <div class="form-group">
                                                                        <label for="adnNewUsername"
                                                                               class="col-sm-2 control-label">New
                                                                            Username</label>
                                                                        <div class="col-sm-10">
                                                                            <input type="text"
                                                                                   class="form-control newUsername"
                                                                                   id="adnNewUsername"
                                                                                   placeholder="Enter new username."
                                                                                   required="">
                                                                        </div>
                                                                    </div>
                                                                    <div class="form-group">
                                                                        <div class="col-sm-offset-2 col-sm-10">
                                                                            <button type="button"
                                                                                    class="btn btn-success changeUsername">
                                                                                Change Username
                                                                            </button>
                                                                        </div>
                                                                    </div>
                                                                </form>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="panel panel-default" id="panel2">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#changeEmail">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a class="javascript:void(0)">
                                                                Change Email
                                                            </a>
                                                        </h4>
                                                    </div>
                                                    <div id="changeEmail" class="panel-collapse collapse">
                                                        <div class="panel-body">

                                                            <legend class="panel-content">
                                                                Change your primary email address
                                                            </legend>
                                                            <form class="form-horizontal">
                                                                <div class="text-danger col-sm-offset-2 errorEmail"></div>
                                                                <div class="form-group">
                                                                    <label for="admCurrentEmail"
                                                                           class="col-sm-2 control-label">Your Primary
                                                                        Email</label>
                                                                    <div class="col-sm-10">
                                                                        <input type="email"
                                                                               class="form-control currentEmail"
                                                                               id="admCurrentEmail" readonly=""
                                                                               value="{% if expert.email is defined %}{{ expert.email | raw }}{% endif %}">
                                                                    </div>
                                                                </div>
                                                                <div class="form-group">
                                                                    <label for="admNewEmail"
                                                                           class="col-sm-2 control-label">New
                                                                        Email</label>
                                                                    <div class="col-sm-10">
                                                                        <input type="email"
                                                                               class="form-control newEmail"
                                                                               id="admNewEmail"
                                                                               placeholder="Enter new Email."
                                                                               required="">
                                                                    </div>
                                                                </div>
                                                                <div class="form-group">
                                                                    <div class="col-sm-offset-2 col-sm-10">
                                                                        <button type="button"
                                                                                class="btn btn-success confirmEmail">
                                                                            Change Email
                                                                        </button>
                                                                    </div>
                                                                </div>
                                                                <div class="col-sm-offset-2 col-sm-10 errorConfirmCode text-danger"></div>
                                                                <div class="form-group" style="display:none;">
                                                                    <label for="admConfirmCode"
                                                                           class="col-sm-2 control-label">Confirmation
                                                                        Code</label>
                                                                    <div class="col-sm-10">
                                                                        <input
                                                                                type="text"
                                                                                class="form-control confirmCode"
                                                                                id="admConfirmCode"
                                                                                placeholder="Enter confirmation code."
                                                                                required=""
                                                                                onkeypress="return event.charCode >= 48 && event.charCode <= 57"
                                                                                maxlength="6" />
                                                                    </div>
                                                                </div>
                                                            </form>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="panel panel-default" id="panel4">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#qualitycontrol">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a href="javascript:void(0)">Quality Control</a>
                                                        </h4>
                                                    </div>
                                                    <div id="qualitycontrol" class="panel-collapse collapse">
                                                        <div class="panel-body">
                                                            <legend class="panel-content" id="qclabel">
                                                                {% if expert.expertInfo.qualityChecked is defined and expert.expertInfo.qualityChecked == true %}
                                                                    This record has been marked as quality controlled
                                                                    {% if expert.expertInfo.qualityCheckedDate is not null and expert.expertInfo.qualityCheckedDate|date("d/m/Y") !="30/11/-0001" %}
                                                                        on <strong>{{ expert.expertInfo.qualityCheckedDate | date("F j, Y ") }}</strong>
                                                                    {% endif %}
                                                                    by <strong>{{ expert.qcby }}</strong>
                                                                {% else %}
                                                                    This record has not been quality controlled
                                                                {% endif %}
                                                            </legend>
                                                            <form class="form-inline col-xs-12 col-sm-8 col-md-offset-3 col-sm-offset-2">
                                                                <div class="form-group">
                                                                    <div class="onoffswitch">
                                                                        <input
                                                                                type="checkbox"
                                                                                name="verify"
                                                                                class="onoffswitch-checkbox"
                                                                                {% if expert.expertInfo.qualityChecked is defined and expert.expertInfo.qualityChecked == true %}
                                                                                    checked=""
                                                                                {% endif %}
                                                                                id="verify"
                                                                                value="{% if expert.expertInfo.qualityChecked is defined and expert.expertInfo.qualityChecked == true %}1{% else %}0{% endif %}" />
                                                                        <label class="onoffswitch-label" for="verify">
                                                                            <span class="onoffswitch-inner"></span>
                                                                            <span class="onoffswitch-switch"></span>
                                                                        </label>
                                                                    </div>
                                                                </div>
                                                                <div class="form-group">
                                                                    <button type="button" class="btn btn-success verify"
                                                                            data-value="1">Save
                                                                    </button>
                                                                </div>
                                                            </form>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="panel panel-default" id="panel5">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#memberstatus">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a href="javascript:void(0)">
                                                                Member Status
                                                            </a>
                                                        </h4>
                                                    </div>
                                                    <div id="memberstatus" class="panel-collapse collapse">
                                                        <div class="panel-body">
                                                            <form class="form-inline col-xs-12 col-sm-8 col-md-offset-3 col-sm-offset-2">
                                                                <legend class="panel-content">Retired</legend>
                                                                <div class="form-group">
                                                                    <div class="onoffswitch">
                                                                        <input
                                                                                type="checkbox"
                                                                                name="retired"
                                                                                class="onoffswitch-checkbox"
                                                                                {% if expert.expertInfo.retired is defined and expert.expertInfo.retired == 1 %}
                                                                                    checked=""
                                                                                {% endif %}
                                                                                id="retired"
                                                                                value="{% if expert.expertInfo.retired is defined %}{{ expert.expertInfo.retired }}{% endif %}">
                                                                        <label class="onoffswitch-label" for="retired">
                                                                            <span class="onoffswitch-inner"></span>
                                                                            <span class="onoffswitch-switch"></span>
                                                                        </label>
                                                                    </div>
                                                                </div>

                                                                <div class="form-group">
                                                                    <input
                                                                            type="text"
                                                                            id="retiredDate"
                                                                            class="form-control datepicker"
                                                                            {% if expert.expertInfo.retired is defined and expert.expertInfo.retired == 1 %}
                                                                                {% if expert.expertInfo.retiredDate is not null and expert.expertInfo.retiredDate|date("d/m/Y") !="30/11/-0001" %}
                                                                                    value="{{ expert.expertInfo.retiredDate|date('Y-m-d') }}"
                                                                                {% endif %}
                                                                            {% else %}
                                                                                value=""
                                                                                disabled=""
                                                                            {% endif %}
                                                                            id="retiredDate"
                                                                            placeholder="Retired date" />
                                                                </div>
                                                                <button type="button" class="btn btn-success "
                                                                        id="btnRetired">
                                                                    Save
                                                                </button>
                                                            </form>
                                                            <form class="form-inline col-xs-12 col-sm-8 col-md-offset-3 col-sm-offset-2">
                                                                <legend class="panel-content">Deceased</legend>
                                                                <div class="form-group">
                                                                    <div class="onoffswitch">
                                                                        <input type="checkbox" name="deceased"
                                                                               class="onoffswitch-checkbox"
                                                                                {% if expert.expertInfo.deceased is defined and expert.expertInfo.deceased == 1 %}
                                                                                    checked=""
                                                                                {% endif %}
                                                                               id="deceased"
                                                                               value="{% if expert.expertInfo.deceased is defined %}{{ expert.expertInfo.deceased }}{% endif %}">
                                                                        <label class="onoffswitch-label" for="deceased">
                                                                            <span class="onoffswitch-inner"></span>
                                                                            <span class="onoffswitch-switch"></span>
                                                                        </label>
                                                                    </div>
                                                                </div>
                                                                <div class="form-group">
                                                                    <input
                                                                            type="text"
                                                                            id="deceasedDate"
                                                                            class="form-control datepicker"
                                                                            id="deceasedDate"
                                                                            {% if expert.expertInfo.deceased is defined and expert.expertInfo.deceased == 1 %}
                                                                                {% if expert.expertInfo.retiredDate is not null and expert.expertInfo.deceasedDate|date("d/m/Y") !="30/11/-0001" %}
                                                                                    value="{{ expert.expertInfo.deceasedDate|date('Y-m-d') }}"
                                                                                {% endif %}
                                                                            {% else %}
                                                                                value=""
                                                                                disabled
                                                                            {% endif %}
                                                                            placeholder="Deceased date">
                                                                </div>
                                                                <button type="button" class="btn btn-success"
                                                                        id="btnDeceased">
                                                                    Save
                                                                </button>
                                                            </form>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="panel panel-default" id="panel6">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#donotinvite">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a href="javascript:void(0)">
                                                                Do Not Invite
                                                            </a>
                                                        </h4>
                                                    </div>
                                                    <div id="donotinvite" class="panel-collapse collapse">
                                                        <div class="panel-body">
                                                            <legend class="panel-content">
                                                                {% if expert.expertInfo.doNoInviteBy is defined and expert.expertInfo.doNotInvite!="" %}
                                                                    This record has been set as do not invite on <strong>{{ expert.expertInfo.doNoInviteOn | date('Y-m-d') }}</strong> by <strong>{{ expert.doNoInviteBy }}</strong>
                                                                {% else %}
                                                                    Please select "Yes" to add this member to the do not invite list.
                                                                {% endif %}
                                                            </legend>
                                                            <form class="form-inline col-xs-12 col-sm-8 col-md-offset-3 col-sm-offset-2">
                                                                <div class="form-group">
                                                                    <div class="onoffswitch">
                                                                        <input type="checkbox" name="noinvite"
                                                                               class="onoffswitch-checkbox"{% if expert.expertInfo.doNotInvite is defined and expert.expertInfo.doNotInvite == 1 %} checked="" {% endif %}
                                                                               id="noinvite"
                                                                               value="{% if expert.expertInfo.doNotInvite is defined %}{{ expert.expertInfo.doNotInvite }}{% endif %}">
                                                                        <label class="onoffswitch-label" for="noinvite">
                                                                            <span class="onoffswitch-inner"></span>
                                                                            <span class="onoffswitch-switch"></span>
                                                                        </label>
                                                                    </div>
                                                                </div>
                                                                <button type="button" class="btn btn-success"
                                                                        id="btnDonotinvite">Save
                                                                </button>
                                                            </form>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="panel panel-default" id="panel7">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#comments">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a href="javascript:void(0)">
                                                                Comments
                                                            </a>
                                                        </h4>
                                                    </div>
                                                    <div id="comments" class="panel-collapse collapse">
                                                        <div class="panel-body">
                                                            <form class="form-horizontal col-md-8">
                                                                <div class="form-group">
                                                                    <label for="admincomment" class="col-sm-4 control-label panel-content">Add admin comment:</label>
                                                                    <div class="col-sm-8">
                                                                        <div id="newAdmComment">{% if expert.expertInfo.adminComments is defined %}{{ expert.expertInfo.adminComments | raw}}{% endif %}</div>
                                                                        <textarea class="form-control" id="admincomment" placeholder="Add admin comment:"></textarea>
                                                                    </div>
                                                                </div>
                                                                <div class="form-group">
                                                                    <div class="col-sm-offset-4 col-sm-8">
                                                                        <button type="button" class="btn btn-success"
                                                                                id="btnAdminComments">Save
                                                                        </button>
                                                                    </div>
                                                                </div>
                                                            </form>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="panel panel-default" id="panel8">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#groups">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a href="javascript:void(0)">
                                                                Manage Groups
                                                            </a>
                                                        </h4>
                                                    </div>

                                                    <div id="groups" class="panel-collapse collapse">
                                                        <div class="panel-body">
                                                            <form class="form-horizontal col-md-6">
                                                                <div class="form-group">
                                                                    <label for="groups" class="col-sm-4 control-label panel-content">Add Groups</label>
                                                                    <div class="col-sm-8">
                                                                        <select class="form-control select2 noSearch" style="width: 100%;" id="groups" name="groups[]" data-placeholder="e.g. IOC" multiple="multiple">
                                                                            {% if adminOption.userGroups is defined %}
                                                                                {% for groups in adminOption.userGroups %}
                                                                                    {% if groups.idGroup in expert.groupids %}
                                                                                        <option label="{{ groups.idGroup }}"
                                                                                                value="{{ groups.idGroup }}"
                                                                                                selected="">{{ groups.groupname }}</option>
                                                                                    {% else %}
                                                                                        <option label="{{ groups.idGroup }}"
                                                                                                value="{{ groups.idGroup }}">{{ groups.groupname }}</option>
                                                                                    {% endif %}
                                                                                {% endfor %}
                                                                            {% endif %}
                                                                        </select>
                                                                    </div>
                                                                </div>
                                                                <div class="form-group">
                                                                    <div class="col-sm-offset-4 col-sm-8">
                                                                        <button type="button" class="btn btn-success"
                                                                                id="btnAddGroups">Save
                                                                        </button>
                                                                    </div>
                                                                </div>
                                                            </form>
                                                            {#<form class="form-horizontal col-md-6">#}
                                                            {#<div class="panel-content">Add Group Roles</div>#}
                                                            {#{% if adminOption.userGroups is defined %}#}
                                                            {#{% for groups in adminOption.userGroups %}#}
                                                            {#{% if groups.idGroup in expert.groupids %}#}
                                                            {#<div class="form-group">#}
                                                            {#<div class="col-sm-8">#}
                                                            {#<div class="form-group">#}
                                                            {#<label for="inputEmail3" class="col-sm-6 control-label">{{ groups.groupname }}</label>#}
                                                            {#<div class="col-sm-6">#}
                                                            {#<input type="email" class="form-control" id="inputEmail3" placeholder="Group role">#}
                                                            {#</div>#}
                                                            {#</div>#}
                                                            {#</div>#}
                                                            {#</div>#}
                                                            {#{% endif %}#}
                                                            {#{% endfor %}#}
                                                            {#{% endif %}#}
                                                            {##}
                                                            {##}
                                                            {#<div class="form-group">#}
                                                            {#<div class="col-sm-offset-4 col-sm-8">#}
                                                            {#<button type="button" class="btn btn-success" id="btnAddGroupsRoles">Save#}
                                                            {#</button>#}
                                                            {#</div>#}
                                                            {#</div>#}
                                                            {#</form>#}
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="panel panel-default" id="panel9">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#privileges">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a href="javascript:void(0)">
                                                                Assign Privileges
                                                            </a>
                                                        </h4>

                                                    </div>
                                                    <div id="privileges" class="panel-collapse collapse">
                                                        <div class="panel-body">
                                                            <legend class="col-lg-12 panel-content">Editing</legend>
                                                            <div class="row">
                                                                <form class="form-horizontal col-lg-12">
                                                                    {% if expert.instName is defined %}
                                                                        <div class="form-group">
                                                                            <label for="groups"
                                                                                   class="col-xs-6 control-label panel-content">
                                                                                Allow to edit own institution
                                                                            </label>
                                                                            <div class="col-xs-4">
                                                                                <div class="onoffswitch">
                                                                                    <input type="checkbox"
                                                                                           name="ownInstitute"
                                                                                           class="onoffswitch-checkbox"
                                                                                           id="ownInstitute"
                                                                                           value="{{ expert.canEditOwnInst }}"
                                                                                            {% if expert.canEditOwnInst == 1 %}
                                                                                                checked="checked"
                                                                                            {% endif %}
                                                                                            {% if expert[2]['idInst'] is not defined %}
                                                                                        disabled="disabled"
                                                                                            {% endif %}>
                                                                                    <label class="onoffswitch-label"
                                                                                           for="ownInstitute">
                                                                                        <span class="onoffswitch-inner"></span>
                                                                                        <span class="onoffswitch-switch"></span>
                                                                                    </label>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    {% endif %}
                                                                    <div class="form-group">
                                                                        <label
                                                                                for="groups"
                                                                                class="col-xs-6 control-label panel-content">
                                                                            Allow to edit all records from the following countries institution
                                                                        </label>
                                                                        <div class="col-xs-4">
                                                                            <div class="onoffswitch">
                                                                                <input type="checkbox"
                                                                                       name="countryList"
                                                                                       class="onoffswitch-checkbox"
                                                                                       {% if expert.countries| length >0 %}checked{% endif %}
                                                                                       id="countryList"
                                                                                       value="{% if expert.countries| length >0 %}1{% else %}0{% endif %}">
                                                                                <label class="onoffswitch-label"
                                                                                       for="countryList">
                                                                                    <span class="onoffswitch-inner"></span>
                                                                                    <span class="onoffswitch-switch"></span>
                                                                                </label>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="form-group">
                                                                        <label for="groups"
                                                                               class="col-xs-2 control-label panel-content">Add
                                                                            Countries</label>
                                                                        <div class="col-xs-4">
                                                                            <select
                                                                                    class="form-control select2 noSearch"
                                                                                    style="width: 100%;"
                                                                                    id="countries"
                                                                                    name="countries[]"
                                                                                    data-placeholder="e.g. Belgium"
                                                                                    multiple="multiple"
                                                                                    {% if expert.countries| length == 0 %}disabled{% else %}0{% endif %}>
                                                                                {% for countries in adminOption.countries %}
                                                                                    {% if countries.idCountry in expert.countries %}
                                                                                        <option
                                                                                                label="{{ countries.idCountry }}"
                                                                                                value="{{ countries.idCountry }}"
                                                                                                selected="">{{ countries.country }}
                                                                                        </option>
                                                                                    {% else %}
                                                                                        <option
                                                                                                label="{{ countries.idCountry }}"
                                                                                                value="{{ countries.idCountry }}">
                                                                                            {{ countries.country }}
                                                                                        </option>
                                                                                    {% endif %}
                                                                                {% endfor %}
                                                                            </select>
                                                                        </div>
                                                                    </div>
                                                                    {% if is_granted('ROLE_ADMIN') and expert.roles is defined %}
                                                                        <div
                                                                                class="form-group">
                                                                            <label
                                                                                    for="groups"
                                                                                    class="col-xs-6 control-label panel-content">
                                                                                Allow to edit all records in OceanExpert
                                                                            </label>
                                                                            <div
                                                                                    class="col-xs-4">
                                                                                <div
                                                                                        class="onoffswitch">
                                                                                    <input
                                                                                            type="checkbox"
                                                                                            name="editor"
                                                                                            {% if "ROLE_GLOBAL_EDITOR" in expert.roles %}checked{% endif %}
                                                                                            class="onoffswitch-checkbox"
                                                                                            id="editor"
                                                                                            value="{% if "ROLE_GLOBAL_EDITOR" in expert.roles %}1{% else %}0{% endif %}">
                                                                                    <label
                                                                                            class="onoffswitch-label"
                                                                                            for="editor">
                                                                                        <span class="onoffswitch-inner"></span>
                                                                                        <span class="onoffswitch-switch"></span>
                                                                                    </label>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    {% elseif is_granted('ROLE_GLOBAL_EDITOR') %}
                                                                        <input
                                                                                type="hidden"
                                                                                name="editor"
                                                                                checked="checked"
                                                                                class="onoffswitch-checkbox"
                                                                                id="editor"
                                                                                value="1" />
                                                                    {% endif %}
                                                                    <div class="form-group">
                                                                        <div class="col-sm-offset-6 col-sm-8">
                                                                            <button
                                                                                    type="button"
                                                                                    class="btn btn-success"
                                                                                    id="addPrivileges">
                                                                                Save
                                                                            </button>
                                                                        </div>
                                                                    </div>
                                                                </form>
                                                            </div>
                                                            {% if is_granted('ROLE_ADMIN') and expert.roles is defined %}
                                                                <legend
                                                                        class="col-lg-12 panel-content">
                                                                    Administrative rights
                                                                </legend>
                                                                <div class="row">
                                                                    <form class="form-horizontal col-lg-12">
                                                                        {% if is_granted('ROLE_LME') %}
                                                                            <div class="form-group">
                                                                                <label
                                                                                        for="lme"
                                                                                        class="col-xs-6 control-label panel-content">
                                                                                    LME Editor
                                                                                </label>
                                                                                <div class="col-xs-4">
                                                                                    <div class="onoffswitch">
                                                                                        <input
                                                                                                type="checkbox"
                                                                                                name="lme"
                                                                                                class="onoffswitch-checkbox"
                                                                                                id="lme"
                                                                                                {% if "ROLE_LME" in expert.roles %}checked{% endif %}
                                                                                                value="{% if "ROLE_LME" in expert.roles %}1{% else %}0{% endif %}" />
                                                                                        <label
                                                                                                class="onoffswitch-label"
                                                                                                for="lme">
                                                                                            <span class="onoffswitch-inner"></span>
                                                                                            <span class="onoffswitch-switch"></span>
                                                                                        </label>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        {% endif %}

                                                                        <div class="form-group">
                                                                            <label for="manager"
                                                                                   class="col-xs-6 control-label panel-content">Manager</label>
                                                                            <div class="col-xs-4">
                                                                                <div class="onoffswitch">
                                                                                    <input type="checkbox"
                                                                                           name="manager"
                                                                                           class="onoffswitch-checkbox"
                                                                                           {% if "ROLE_MANAGER" in expert.roles %}checked{% endif %}
                                                                                           id="manager"
                                                                                           value="{% if "ROLE_MANAGER" in expert.roles %}1{% else %}0{% endif %}">
                                                                                    <label class="onoffswitch-label"
                                                                                           for="manager">
                                                                                        <span class="onoffswitch-inner"></span>
                                                                                        <span class="onoffswitch-switch"></span>
                                                                                    </label>
                                                                                </div>
                                                                            </div>
                                                                        </div>

                                                                        {% if is_granted('ROLE_SUPERADMIN') %}
                                                                            <div class="form-group">
                                                                                <label for="administrator"
                                                                                       class="col-xs-6 control-label panel-content">
                                                                                    Administrator
                                                                                </label>
                                                                                <div class="col-xs-4">
                                                                                    <div class="onoffswitch">
                                                                                        <input
                                                                                                type="checkbox"
                                                                                                name="administrator"
                                                                                                class="onoffswitch-checkbox"
                                                                                                id="administrator"
                                                                                                {% if "ROLE_ADMIN" in expert.roles %}
                                                                                                    checked
                                                                                                {% endif %}
                                                                                               value="{% if "ROLE_ADMIN" in expert.roles %}1{% else %}0{% endif %}">
                                                                                        <label
                                                                                                class="onoffswitch-label"
                                                                                                for="administrator">
                                                                                            <span class="onoffswitch-inner"></span>
                                                                                            <span class="onoffswitch-switch"></span>
                                                                                        </label>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        {% endif %}
                                                                        {% if is_granted('ROLE_SUPERADMIN') %}
                                                                            <div class="form-group">
                                                                                <label
                                                                                        for="superadmin"
                                                                                        class="col-xs-6 control-label panel-content">
                                                                                    Super Administrator
                                                                                </label>
                                                                                <div class="col-xs-4">
                                                                                    <div class="onoffswitch">
                                                                                        <input
                                                                                                type="checkbox"
                                                                                                {% if "ROLE_SUPERADMIN" in expert.roles %}
                                                                                                    checked
                                                                                                {% endif %}
                                                                                                name="superadmin"
                                                                                                class="onoffswitch-checkbox"
                                                                                                id="superadmin"
                                                                                                value="{% if "ROLE_SUPERADMIN" in expert.roles %}1{% else %}0{% endif %}" />
                                                                                        <label class="onoffswitch-label"
                                                                                               for="superadmin">
                                                                                            <span class="onoffswitch-inner"></span>
                                                                                            <span class="onoffswitch-switch"></span>
                                                                                        </label>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                            <div class="form-group">
                                                                                <label
                                                                                        for="odiscatadmin"
                                                                                        class="col-xs-6 control-label panel-content">
                                                                                    ODISCat Administrator
                                                                                </label>
                                                                                <div class="col-xs-4">
                                                                                    <div class="onoffswitch">
                                                                                        <input
                                                                                                type="checkbox"
                                                                                                {% if "ROLE_ODISCATADMIN" in expert.roles %}
                                                                                                    checked
                                                                                                {% endif %}
                                                                                                name="odiscatadmin"
                                                                                                class="onoffswitch-checkbox"
                                                                                                id="odiscatadmin"
                                                                                                value="{% if "ROLE_ODISCATADMIN" in expert.roles %}1{% else %}0{% endif %}" />
                                                                                        <label class="onoffswitch-label"
                                                                                               for="odiscatadmin">
                                                                                            <span class="onoffswitch-inner"></span>
                                                                                            <span class="onoffswitch-switch"></span>
                                                                                        </label>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                            <div class="form-group">
                                                                                <label
                                                                                        for="oceancdadmin"
                                                                                        class="col-xs-6 control-label panel-content">
                                                                                    OceanCD Administrator
                                                                                </label>
                                                                                <div class="col-xs-4">
                                                                                    <div class="onoffswitch">
                                                                                        <input
                                                                                                type="checkbox"
                                                                                                {% if "ROLE_OCEANCD" in expert.roles %}
                                                                                                    checked
                                                                                                {% endif %}
                                                                                                name="oceancdadmin"
                                                                                                class="onoffswitch-checkbox"
                                                                                                id="oceancdadmin"
                                                                                                value="{% if "ROLE_OCEANCD" in expert.roles %}1{% else %}0{% endif %}" />
                                                                                        <label class="onoffswitch-label"
                                                                                               for="oceancdadmin">
                                                                                            <span class="onoffswitch-inner"></span>
                                                                                            <span class="onoffswitch-switch"></span>
                                                                                        </label>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        {% endif %}
                                                                        <div class="form-group">
                                                                            <div class="col-sm-offset-6 col-sm-8">
                                                                                <button type="button"
                                                                                        class="btn btn-success"
                                                                                        id="addRoles">Save
                                                                                </button>
                                                                            </div>
                                                                        </div>
                                                                    </form>
                                                                </div>
                                                            {% endif %}
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="panel panel-default" id="panel10">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#password">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a class="javascript:void(0)">
                                                                Send Password
                                                            </a>
                                                        </h4>
                                                    </div>
                                                    <div id="password" class="panel-collapse collapse">
                                                        <div class="panel-body">
                                                            <form class="form-horizontal col-lg-12">
                                                                <div class="form-group">
                                                                    <label for="groups"
                                                                           class="col-xs-6 control-label panel-content">Send password reset link to user</label>
                                                                    <div class="col-xs-4">
                                                                        {% if expert.expertInfo.status is defined and expert.expertInfo.status == 1 %}
                                                                            <button type="button" class="btn btn-success" id="resetLink">Send Password reset link</button>
                                                                        {% else %}
                                                                            <button type="button" class="btn btn-success disabled" disabled>Send Password reset link</button>
                                                                        {% endif %}
                                                                    </div>
                                                                </div>
                                                            </form>
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="panel panel-default" id="panel3">
                                                    <div class="panel-heading collapsed" data-toggle="collapse"
                                                         data-target="#deactivateAccount">
                                                        <h4 class="panel-title"><i class="fa fa-plus pull-right"></i>
                                                            <a class="javascript:void(0)">
                                                                Deactivate Account
                                                            </a>
                                                        </h4>
                                                    </div>
                                                    <div id="deactivateAccount" class="panel-collapse collapse">
                                                        <div class="panel-body">

                                                            <legend class="panel-content">
                                                                Deactivate OceanExpert account
                                                            </legend>
                                                            <div class="top-buffer50">
                                                                {% if expert.expertInfo.status is defined and expert.expertInfo.status == 1 %}
                                                                    <button type="button" class="btn btn-danger deactivateAccount col-sm-offset-2">
                                                                        <i class="fa fa-ban" aria-hidden="true"></i>
                                                                        Deactivate Account
                                                                    </button>
                                                                {% else %}
                                                                    <button type="button" class="btn btn-danger disabled col-sm-offset-2" disabled>
                                                                        <i class="fa fa-ban" aria-hidden="true"></i>
                                                                        Deactivate
                                                                    </button>
                                                                {% endif %}

                                                                <div class="text-danger deleteError"></div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    {% endif %}
                                    <!-- /.tab-pane -->
                                </div>
                                <!-- /.tab-content -->
                            </div>
                            <div
                                    id="edited-by"
                                    class="pull-right italics">
                                {% if expert.expertInfo.fDateEnt is defined and expert.expertInfo.fDateEnt != "" %}
                                    Created: {{ expert.expertInfo.fDateEnt|date('Y-m-d') }}
                                    {% if expert.createdBy is defined and  expert.createdBy != "" %}
                                        by {{ expert.createdBy }}
                                    {% endif %}  |
                                {% endif %}
                                {% if expert.expertInfo.lDateUpd is defined and expert.expertInfo.lDateUpd != "" %}
                                    Last Updated: {{ expert.expertInfo.lDateUpd|date('Y-m-d') }}
                                    {% if expert.lastEditBy is defined and  expert.lastEditBy != "" %}
                                        by {{ expert.lastEditBy }}
                                    {% endif %}
                                {% endif %}
                            </div>
                            <br/><br/>
                            <div
                                    id="groups-by"
                                    class="pull-right italics">
                                {% if expert.groups is defined and expert.groups | length > 0 %}
                                    Group(s):
                                    {% for groups in expert.groups %}
                                        <a href="{{ path('view_group', {groupId: groups.idGroup}) }}">{{ groups.groupname }}</a>
                                        {% if not loop.last %},{% endif %}
                                    {% endfor %}
                                {% endif %}
                            </div>
                            <!-- /.nav-tabs-custom -->
                        </div>
                        <!-- /.col -->
                    </div>
                    <!-- /.row -->
                {% endif %}

            </section>
            <!-- /.content -->
        </div>
        <!-- /.content-wrapper -->
    </div>

    <div
            class="modal fade"
            id="modal-refresh"
            tabindex="-1"
            role="dialog"
            aria-labelledby="myModalLabel"
            aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">
                        <i class="fa fa-fw fa-thumbs-up"></i><span class="modal-heading"></span>
                    </h4>
                </div>
                <div class="modal-body">
                    <p><span class="modal-message"></span></p>
                    <p>Page will refresh in <span class="timer"></span>...</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success" data-dismiss="modal">Refresh</button>
                </div>
            </div>
        </div>
    </div>
    {% include('footer.html.twig') %}
    <script src="{{ asset('js/app.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/oejs.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/bootstrap-datepicker.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/tipped.js') }}" type="text/javascript"></script>
    <script type="text/javascript">
        {% if expert.expertInfo.idInd is defined %}
        $(function () {
            Tipped.create('.tipso', {maxWidth: 250});
            $("#update-profile").click(function (event) {
                $.ajax({
                    url: "{{ path('update_profile_time') }}",
                    data: {userId: {{ expert.expertInfo.idInd }}},
                    method: "POST"
                }).done(function (data) {
                    if (data == "updated successfully") {
                        $("#update-profile").removeClass("btn-primary").addClass("btn-success");
                        $("#update-profile").html('<i class="fa fa-thumbs-up" aria-hidden="true"></i> Thanks for the heads-up');
                        $("#update-profile").prop('disabled', true);
                        $("#updated-on").html("Last Updated on {{ 'now'|date('Y-m-d') }}");
                    } else {

                    }
                })
                    .fail(function (data) {
                    });
            });

            {% if is_granted('ROLE_GLOBAL_EDITOR') %}
            $(document).delegate(".activate", "click", function () {
                $(this).html('<i class="fa fa-cog fa-spin" aria-hidden="true"></i> Activate');
                $.ajax({
                    url: "{{ path('approve_users') }}",
                    type: 'POST',
                    data: {'id': {{ expert.expertInfo.idInd}}},
                }).done(function (response) {
                    if (response[0].status == 1) {
                        $(".statusBtn").html('<button class="btn btn-danger ban" id="ban"><i class="fa fa-ban" aria-hidden="true"></i> Deactivate</button>');
                    }
                });
            });
            $(document).delegate(".ban", "click", function () {
                $(this).html('<i class="fa fa-cog fa-spin" aria-hidden="true"></i> Deactivate');
                $.ajax({
                    url: "{{ path('deactivate_user',{'userId': expert.expertInfo.idInd}) }}",
                    type: 'POST',
                }).done(function (response) {
                    console.log(response);
                    if (response[0].status === true) {
                        $(".statusBtn").html('<button class="btn btn-success activate" id="activate"><i class="fa fa-check" aria-hidden="true"></i> Activate</button>');
                    }
                });
            });
            {% endif %}
        });
        {% endif %}
    </script>

    {% if expert.expertInfo.idInd is defined %}
        <script>
            $(function () {
                $(".changeUsername").click(function (e) {
                    e.preventDefault();
                    var $form = $(this).parents("form");
                    var $newUsername = $form.find(".newUsername");
                    var $currentUsername = $form.find(".currentUsername");
                    var $errorUsername = $form.find(".errorUsername");
                    var currentUsername = $form.find(".currentUsername").val();
                    var newUsername = $form.find(".newUsername").val();
                    if ($.trim(newUsername) == "") {
                        $newUsername.parents(".form-group").addClass('has-error');
                        $(this).parents("form").children('.text-danger').text("Please enter new username.");
                        return false;
                    } else {
                        var $this = $(this);
                        $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Changing username');
                        $(this).attr('disabled', true);
                        $newUsername.parents(".form-group").removeClass('has-error');
                        $(this).parents("form").children('.text-danger').text();
                        $.ajax({
                            url: "{{ path('change_username') }}",
                            type: 'POST',
                            data: {username: currentUsername, newusername: newUsername},
                        })
                            .done(function (response) {
                                if (response == "success") {
                                    $errorUsername.removeClass('text-danger').addClass('text-success').html("<i class='fa fa-thumbs-up'></i> Username changed successfully.");
                                    {% if is_granted('ROLE_GLOBAL_EDITOR') and app.user.id != expert.expertInfo.idInd %}
                                    $currentUsername.val(newUsername);
                                    $newUsername.val("");
                                    $this.html("Change Username");
                                    $this.attr('disabled', false);
                                    window.history.pushState(history.state, "Title", newUsername);
                                    {% else %}
                                    $this.html("Username changed successfully").delay(1000).queue(function (n) {
                                        $(this).html("<i class='fa fa-cog fa-spin fa-fw'></i> Refreshing page");
                                        n();
                                    });
                                    $("#modal-refresh").modal("show");
                                    $(".modal-heading").text('Username changed.');
                                    $(".modal-message").text("Username changed successfully. This page will now refresh to reflect change in the username.");
                                    countdown(10);
                                    $('#modal-refresh').on('hidden.bs.modal', function (e) {
                                        window.location.href = "{{ path('view_profile',{'user': expert.expertInfo.idInd}) }}";
                                    });
                                    {% endif %}

                                } else {
                                    $newUsername.parents(".form-group").addClass('has-error');
                                    $(this).parents("form").addClass('has-error');
                                    $errorUsername.text(response);
                                    $this.html("Change Username");
                                    $this.attr('disabled', false);
                                }
                            });
                    }
                });

                // $(".confirmEmail").click(function(e) {
                $("form").delegate(".confirmEmail", "click", function (e) {
                    e.preventDefault();
                    var $form = $(this).parents("form");
                    var $currentEmail = $form.find(".currentEmail");
                    var currentEmail = $form.find(".currentEmail").val();
                    var $newEmail = $form.find(".newEmail");
                    var newEmail = $form.find(".newEmail").val();
                    var $errorEmail = $form.find(".errorEmail");
                    var $confirmCode = $form.find(".confirmCode");
                    var $errorConfirmCode = $form.find(".errorConfirmCode");
                    var $confirmbtn = $form.find(".confirmEmail");
                    var email = $.trim(newEmail);

                    //var pattern = new RegExp(/^([\w-\.]+@([\w-]+\.)+[\w-]+)?$/);
                    const pattern = new RegExp(/^[\w._%+-]+@[\w.-]+\.[a-zA-Z]{2,}$/);
                    if ((email == "") || (pattern.test(email) == false)) {
                        $newEmail.parents(".form-group").addClass('has-error');
                        $errorEmail.html("<i class='fa fa-exclamation-triangle'></i> Please enter valid new email.");
                        return false;
                    } else {
                        var $this = $(this);
                        $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Changing ...');
                        $(this).attr('disabled', true);
                        $newEmail.parents(".form-group").removeClass('has-error');
                        $(this).parents("form").children('.text-danger').text();
                        $.ajax({
                            url: "{{ path('fos_email_check') }}",
                            type: 'GET',
                            data: {email: email}
                        }).done(function (response) {
                            if (response.status == 1) {
                                //email seems to be available
                                $newEmail.parents(".form-group").removeClass('has-error');
                                $this.parents("form").children('.text-danger').text("");
                                {% if is_granted('ROLE_GLOBAL_EDITOR') and app.user.id != expert.expertInfo.idInd %}
                                $.ajax({
                                    url: "{{ path('change_email') }}",
                                    type: 'POST',
                                    data: {
                                        currentEmail: currentEmail,
                                        newEmail: email
                                    },
                                }).done(function (response) {
                                    if (response.status == 1) {
                                        $errorEmail.removeClass('text-danger').addClass('text-success');
                                        $errorEmail.html("<i class='fa fa-thumbs-up'></i> Email has been changed.");
                                        $confirmbtn.attr("disabled", false);
                                        $confirmbtn.html("Change Email");
                                        $currentEmail.val(email);
                                        $newEmail.val("");
                                    }
                                });

                                {% else %}
                                $.ajax({
                                    url: "{{ path('send_email_verification') }}",
                                    type: 'POST',
                                    data: {oldEmail: currentEmail, newEmail: email},
                                }).done(function (response) {
                                    if (response.status == 1) {
                                        $confirmCode.parents(".form-group").css('display', 'block');
                                        $errorConfirmCode.html('<i class="fa fa-info-circle" aria-hidden="true"></i> An email containing a 6 digit confirmation code is sent to your new email address: <strong>' + email + '</strong>. Enter it in the box below to confirm your change.');

                                        var html = '<div class="form-group">';
                                        html += '<div class="col-sm-offset-2 col-sm-10">';
                                        html += '<button type="button" class="btn btn-success changeEmail margin-r-5">Change Email</button>';
                                        html += '<button type="button" class="btn btn-success confirmEmail">Resend Email</button>';
                                        html += '</div>';
                                        html += '</div>';
                                        $this.parents("form").append(html);
                                        $this.parents(".form-group").remove();
                                        $this.attr('disabled', false);
                                    } else {
                                        $errorEmail.addClass('text-danger');
                                        $errorEmail.html("<i class='fa fa-thumbs-down'></i> " + response.message);
                                        $this.parents(".form-group").remove();
                                        $this.attr('disabled', false);
                                    }
                                });
                                {% endif %}
                            } else {

                                $newEmail.parents(".form-group").addClass('has-error');
                                $errorEmail.removeClass('text-success').addClass('text-danger');
                                $errorEmail.html("<i class='fa fa-exclamation-triangle'></i> " + response.message);
                                $this.html('Confirm Email');
                                $this.attr('disabled', false);
                            }
                        });
                    }
                });

                $("form").delegate(".changeEmail", "click", function (e) {
                    e.preventDefault();
                    var $form = $(this).parents("form");
                    var $currentEmail = $form.find(".currentEmail");
                    var currentEmail = $form.find(".currentEmail").val();
                    var $newEmail = $form.find(".newEmail");
                    var newEmail = $form.find(".newEmail").val();
                    var $errorEmail = $form.find(".errorEmail");
                    var $confirmCode = $form.find(".confirmCode");
                    var $errorConfirmCode = $form.find(".errorConfirmCode");
                    var $modelRefresh = $("#modal-refresh");
                    var $changeEmailbtn = $(".changeEmail");
                    var email = $.trim(newEmail);
                    var confirmCode = $.trim($confirmCode.val());

                    if (confirmCode == "") {
                        $confirmCode.parents(".form-group").addClass('has-error');
                        $errorEmail.removeClass('text-success').addClass('text-danger');
                        $errorEmail.html("<i class='fa fa-exclamation-triangle'></i> Please enter confirmation code.");
                        return false;
                    }

                    //var pattern = new RegExp(/^([\w-\.]+@([\w-]+\.)+[\w-]+)?$/);
                    const pattern = new RegExp(/^[\w._%+-]+@[\w.-]+\.[a-zA-Z]{2,}$/);
                    if ((email == "") || (pattern.test(email) == false)) {
                        $newEmail.html(".form-group").addClass('has-error');
                        $errorEmail.html("<i class='fa fa-exclamation-triangle'></i> Please enter valid new email.");
                        return false;
                    } else {
                        var $this = $(this);
                        $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Checking email');
                        $(this).attr('disabled', true);
                        $newEmail.parents(".form-group").removeClass('has-error');
                        $(this).parents("form").children('.text-danger').text();
                        $.ajax({
                            url: "{{ path('change_email') }}",
                            type: 'POST',
                            data: {
                                currentEmail: currentEmail,
                                newEmail: newEmail,
                                confirmCode: confirmCode
                            },
                        }).done(function (response) {
                            if (response.status == 1) {
                                $this.html("Email changed.").delay(1000).queue(function (n) {
                                    $(this).html("Refreshing page");
                                    n();
                                });
                                $modelRefresh.modal("show");
                                $(".modal-heading").text('Email address Changed.');
                                $(".modal-message").text("Email address changed successfully. This page will now refresh to reflect change in the Email address");
                                countdown(11);
                                $modelRefresh.on('hidden.bs.modal', function (e) {
                                    window.location.href = "{{ path('view_profile',{'user': expert.expertInfo.idInd}) }}";
                                });
                            } else {
                                $errorConfirmCode.removeClass('text-success').addClass('text-danger');
                                $errorConfirmCode.html("<i class='fa fa-exclamation-triangle' aria-hidden='true'></i> Your confirmation code is invalid. Please check the code in your email and try again or resend the email using Resend Email button below.");
                                $changeEmailbtn.html('Change Email');
                                $changeEmailbtn.attr('disabled', false);
                            }
                        });
                    }
                });

                $(".deactivateAccount").click(function () {
                    if (confirm("Are you sure you want to deactivate this OceanExpert account?") == true) {
                        var $this = $(this);
                        $this.html('<i class="fa fa-cog fa-spin fa-fw"></i> Deactivating account');
                        $this.attr('disabled', true);
                        $.ajax({
                            url: "{{ path('deactivate_user',{'userId': expert.expertInfo.idInd}) }}",
                            type: 'POST'
                        }).done(function (response) {
                            if (response[0].status == 1) {
                                {% if is_granted('ROLE_GLOBAL_EDITOR') and app.user.id != expert.expertInfo.idInd %}
                                $this.html("<i class='fa fa-ban' aria-hidden='true'></i> User deactivated successfully.");
                                $this.attr('disabled', true);
                                {% else %}
                                $this.html("<i class='fa fa-ban' aria-hidden='true'></i> Account deactivated successfully.")
                                    .delay(1000)
                                    .queue(function (n) {
                                        $(this).html("<i class='fa fa-cog fa-spin fa-fw'></i> Refreshing page");
                                        n();
                                    }
                                );
                                $("#modal-refresh").modal("show");
                                $(".modal-heading").text('Account deactivated.');
                                $(".modal-message").text(response.message);
                                countdown(3);
                                $('#modal-refresh').on('hidden.bs.modal', function (e) {
                                    location.reload();
                                });
                                {% endif %}
                            } else {
                                $this.siblings(".deleteError").html(response.message);
                                $this.attr('disabled', false);
                                $this.html("Deactivate your Account");
                            }
                        });
                    } else {
                        return false;
                    }
                });

                $(".panel-heading").on('click', function (e) {
                    e.preventDefault();
                    if ($(this).hasClass('collapsed')) {
                        $(this).find('.fa').removeClass('fa-plus').addClass('fa-minus');
                    } else {
                        $(this).find('.fa').removeClass('fa-minus').addClass('fa-plus');
                    }
                });
                $('.datepicker').datepicker({
                    format: "yyyy-mm-dd",
                    autoclose: true,
                    todayHighlight: true
                });
                $(".onoffswitch-checkbox").click(function (e) {
                    if ($(this).is(":checked")) {
                        $(this).parents().siblings('.form-group').find('.datepicker').prop('disabled', false);
                        $(this).parents().siblings('.form-group').find('.datepicker').val("");
                        $(this).val(1);
                    } else {
                        $(this).parents().siblings('.form-group').find('.datepicker').prop('disabled', true);
                        $(this).parents().siblings('.form-group').find('.datepicker').val("");
                        $(this).val(0);
                    }
                });

                // Ajax Functionalities

                $(".verify").click(function () {
                    var text = $(this).html();
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('profile_verified') }}",
                        type: 'POST',
                        data: {userId: {{ expert.expertInfo.idInd }}, action: $("#verify").val()},
                    }).done(function (response) {
                        $("#qclabel").html(response);
                        $this.html(text);
                        $this.attr('disabled', false);
                        if ($this.data('value') == 0) {
                            $this.hide();
                        } else {
                            $(".verify").show();
                            $(".verify").removeClass('hidden');
                        }
                    });
                });

                $("#btnRetired").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('set_retired') }}",
                        type: 'POST',
                        data: {
                            userId: {{ expert.expertInfo.idInd }},
                            retiredDate: $("#retiredDate").val(),
                            retiredStatus: $("#retired").val(),
                        },
                    }).done(function (response) {
                        $this.html("Saved").delay(2000).queue(function (n) {
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                $("#userBtnRetired").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('set_retired') }}",
                        type: 'POST',
                        data: {
                            userId: {{ expert.expertInfo.idInd }},
                            retiredDate: $("#userRetiredDate").val(),
                            retiredStatus: $("#userRetired").val(),
                        },
                    }).done(function (response) {
                        $this.html("Saved").delay(2000).queue(function (n) {
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                $("#usrBtnSubscription").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    if ($("#userDoNotInvite").val() == 1){
                        var status = 0;
                    }else if($("#userDoNotInvite").val() == 0){
                        var status = 1;
                    }
                    $.ajax({
                        url: "{{ path('set_donotinvite') }}",
                        type: 'POST',
                        data: {
                            userId: {{ expert.expertInfo.idInd }},
                            status: status,
                        },
                    }).done(function (response) {
                        $this.html("Saved").delay(2000).queue(function (n) {
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                $("#btnDeceased").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('set_deceased') }}",
                        type: 'POST',
                        data: {
                            userId: {{ expert.expertInfo.idInd }},
                            deceasedDate: $("#deceasedDate").val(),
                            deceasedStatus: $("#deceased").val(),
                        },
                    }).done(function (response) {
                        $this.html("Saved").delay(2000).queue(function (n) {
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                $("#btnDonotinvite").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('set_donotinvite') }}",
                        type: 'POST',
                        data: {
                            userId: {{ expert.expertInfo.idInd }},
                            status: $("#noinvite").val(),
                        },
                    }).done(function (response) {
                        $this.html("Saved").delay(2000).queue(function (n) {
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                        $this.parents().closest(".panel-body").find(".panel-content").html(response);
                    });
                });

                $("#btnAdminComments").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('set_admincomments') }}",
                        type: 'POST',
                        data: {
                            userId: {{ expert.expertInfo.idInd }},
                            comments: $("#admincomment").val(),
                        },
                    }).done(function (response) {
                        $this.html("Saved").delay(2000).queue(function (n) {
                            $("#newAdmComment").html(response);
                            $("#admincomment").val("");
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                $("#btnAddGroups").click(function () {
                    var groupsArr = [];
                    $.each($("#groups option:selected"), function (index, val) {
                        groupsArr.push(this.value);
                    });
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('set_groups') }}",
                        type: 'POST',
                        data: {
                            userId: {{ expert.expertInfo.idInd }},
                            groups: groupsArr
                        },
                    }).done(function (response) {
                        $this.html("Saved").delay(2000).queue(function (n) {
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                $("#countryList").change(function () {
                    if (this.checked) {
                        $("#countries").attr('disabled', false);
                    } else {
                        $("#countries").attr('disabled', true);
                        // $("#countries").select2("val", "");
                    }
                });

                $("#editor").change(function (e) {
                    if (this.checked) {
                        $("#countryList").siblings(".onoffswitch-label").addClass("onoffswitch-disabled");
                        $("#ownInstitute").siblings(".onoffswitch-label").addClass("onoffswitch-disabled");
                        $("#countryList").attr('disabled', true);
                        $("#ownInstitute").attr('disabled', true);
                        $("#countries").attr('disabled', true);
                    } else {
                        $("#countryList").siblings(".onoffswitch-label").removeClass("onoffswitch-disabled");
                        $("#ownInstitute").siblings(".onoffswitch-label").removeClass("onoffswitch-disabled");
                        $("#countryList").change();
                        $("#countryList").attr('disabled', false);
                        $("#ownInstitute").attr('disabled', false);
                    }
                });

                $("#addPrivileges").click(function () {
                    var countryArr = [];
                    $.each($("#countries option:selected"), function (index, val) {
                        countryArr.push(this.value);
                    });
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('set_privileges') }}",
                        type: 'POST',
                        data: {
                            userId: {{ expert.expertInfo.idInd }},
                            countries: countryArr,
                            ownInstitute: $("#ownInstitute").val(),
                            countryList: $("#countryList").val(),
                            editor: $("#editor").val(),
                        },
                    }).done(function (response) {
                        $this.html("Saved").delay(2000).queue(function (n) {
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                {% if expert.username is defined %}
                $("#resetLink").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Sending Email');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('reset_password_link') }}",
                        type: 'POST',
                        data: {
                            username: '{{ expert.username }}',
                        },
                    }).done(function (response) {
                        $this.html(response).delay(2000).queue(function (n) {
                            $(this).html("Send Password Reset link");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });
                {% endif %}

                $("#addRoles").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Saving');
                    $(this).attr('disabled', true);
                    {% if expert.username is defined %}
                    {% set username = expert.username %}
                    {% elseif expert.expertInfo.username is defined %}
                    {% set username = expert.expertInfo.username %}
                    {% else %}
                    {% set username = '' %}
                    {% endif %}
                    $.ajax({
                        url: "{{ path('assign_roles') }}",
                        type: 'POST',
                        data: {
                            username: '{% if expert.username is defined %}{{ expert.username | raw }}{% endif %}',
                            manager: $("#manager").val(),
                            lme: $("#lme").val(),
                            administrator: $("#administrator").val(),
                            oceancdadmin: $("#oceancdadmin").val(),
                            odiscatadmin: $("#odiscatadmin").val(),
                            superadmin: $("#superadmin").val()
                        },
                    }).done(function (response) {
                        $this.html(response.message).delay(2000).queue(function (n) {
                            $(this).html("Save");
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                $(".undelete").click(function () {
                    var $this = $(this);
                    $(this).html('<i class="fa fa-cog fa-spin fa-fw"></i> Recovering');
                    $(this).attr('disabled', true);
                    $.ajax({
                        url: "{{ path('recover_account') }}",
                        type: 'POST',
                        data: {userId: "{{ expert.expertInfo.idInd }}"},
                    }).done(function (response) {
                        $this.html(response.message).delay(2000).queue(function (n) {
                            $this.parent().html('<button class="btn btn-danger ban"><i class="fa fa-ban" aria-hidden="true"></i> Deactivate</button>');
                            n();
                        });
                        $this.attr('disabled', false);
                    });
                });

                function countdown(remaining) {
                    if (remaining <= 0) {
                        $(".timer").text("Refreshing ");
                        window.location.href = "{{ path('view_profile',{'user': expert.expertInfo.idInd}) }}";
                    }
                    $(".timer").text(remaining);
                    setTimeout(function () {
                        countdown(remaining - 1);
                    }, 1000);
                }

                if ( document.location.href.indexOf('?page') > -1 ) {
                    $('html, body').animate({
                        scrollTop: $(".eventParticipation").offset().top-50
                    }, 500);
                }
            });
        </script>
    {% endif %}
{% endblock %}