<!-- Header Details -->
{% from "macros.html" import orcid_url, image %}
<header>
  {% block header %}
    <div class="lead banner"
         style="background-image:url({{url_for('static', filename='images/banner.svg')}}); background-position: right top; background-size: auto 127px; background-repeat: no-repeat; height: 127px; background-color: #000;">
    </div>
  {% endblock %}

  <nav class="navbar navbar-default">
    <div class="container-fluid">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                                                              data-target="#navbar-collapse-1" aria-expanded="false">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
      </div>
      <div class="collapse navbar-collapse" id="navbar-collapse-1">
        <ul class="nav navbar-nav">
          <li id="login"><a href="{{ url_for('index') }}">
              <span data-toggle="tooltip"
                    data-placement="bottom"
                    title="Home" class="fa fa-home glyphicon glyphicon-home"
                                 style="font-size: large;" aria-hidden="true"></span></a></li>
          <li id="about"><a href="{{ url_for('about') }}">
              <span data-toggle="tooltip"
                    data-placement="bottom" title="About Hub">About</span>
            </a></li>
            <li id="faq"><a href="{{ url_for('faq') }}">
                <span data-toggle="tooltip"
                      data-placement="bottom" title="Hub Frequently Asked Questions">FAQ</span>
              </a></li>
              {% if current_user.confirmed %}
                {% if current_user.organisations.count() > 1 %}
                  <li>
                    <p class="navbar-btn">
                    <select class="selectpicker"
                            data-style="btn-primary" id="select-org"
                                                     title="Current Organisation"
                                                     onchange='location.href="/select/user_org/"+this.value'>
                      {% for uo in current_user.userorg_set %}
                        <option data-tokens="{{uo.id}}" value="{{uo.id}}" {{"selected" if current_user.organisation.id == uo.org_id else ''}}>{{uo.org.name}}</option>
                      {% endfor %}
                    </select>
                    </p>
                  </li>
                {% endif %}
                {% if current_user.organisation.confirmed %}
                  <li id="profile"><a href="{{ url_for('link') }}">
                      <span
                                      data-toggle="tooltip" data-placement="bottom"
                                                            title="Affiliate yourself using the NZ ORCID HUB or view your ORCID iD">Your ORCID</span></a></li>
                  {% if current_user.has_role("ADMIN") %}
                    <li class="dropdown">
                      <a class="dropdown-toggle" data-toggle="dropdown" href="#">Affiliations<span class="caret"></span></a>
                      <ul class="dropdown-menu">
                        <li id="invite_user"><a href="{{ url_for('invite_user') }}" data-toggle="tooltip"
                                                                                    title="Invite a new researcher">Invite Researcher</a></li>
                        <li class="divider"></li>
                        <li id="load_researcher_affiliations"><a href="{{ url_for('load_researcher_affiliations')}}" data-toggle="tooltip"
                                                                                                                     title="Import a file of affiliation data as a new task">Upload Affiliations</a></li>
                        <li id="load_researcher_funding"><a href="{{ url_for('load_researcher_funding')}}" data-toggle="tooltip"
                                                                                                           title="Import a file of funding data">Upload Funding</a></li>
                        <li id="load_researcher_works"><a href="{{ url_for('load_researcher_work')}}" data-toggle="tooltip"
                                                                                                           title="Import a file of Researcher Work">Upload Work</a></li>
                        <li id="load_peer_review"><a href="{{ url_for('load_researcher_peer_review')}}"  data-toggle="tooltip"
                                                                                            title="Import a file of peer review record">Upload Peer Review</a></li>
                        <li class="divider"></li>
                        <li id="task.index_view"><a href="{{ url_for('task.index_view')}}"  data-toggle="tooltip"
                                                                                            title="Review the progress and results of your current affiliation tasks">Uploaded Tasks</a></li>
                      </ul>
                    </li>
                    <li id="viewmembers.index_view"><a href="{{ url_for('viewmembers.index_view')}}">
                        <span data-toggle="tooltip" data-placement="bottom" title="ORCID iDs of researchers at your institution">
                          Researchers
                        </span> </a></li>
                      {% endif %}
                    {% endif %}
                    {% if current_user.is_tech_contact_of() or current_user.is_admin_of() %}
                      <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Settings
                          <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                          {% if current_user.is_tech_contact_of() %}
                            <li id="onboard_org"><a href="{{ url_for('onboard_org')}}">
                                <span data-toggle="tooltip" data-placement="left" title="View your organisation's ORCID information">Your Organisation</span></a></li>


                            {% if current_user.organisation.can_use_api %}
                              <li id="applicatin"><a data-toggle="tooltip" data-placement="left" title="Register a client application or manage application credentials" href="{{ url_for('application')}}">Application Registration</a></li>
                            {% endif %}
                          {% endif %}
                          <li id="logo"><a href="{{ url_for('logo')}}">
                              <span data-toggle="tooltip" data-placement="left" title="Upload your organisation logo">Logo</span></a></li>
                          <li id="manage_email_template"><a href="{{ url_for('manage_email_template')}}">
                              <span data-toggle="tooltip" data-placement="left" title="Customize your organization email template">Email Template</span></a></li>
                          <li id="groupidrecord.index_view"><a href="{{ url_for('groupidrecord.index_view')}}"  data-toggle="tooltip"
                                                                                            title="Create or Update group id record">GroupId Record</a></li>
                          <li id="org_webhook"><a href="{{ url_for('org_webhook')}}">
                              <span data-toggle="tooltip" data-placement="left" title="Activate the Organisation Webhook">Webhook</span></a></li>
                        </ul>
                      </li>
                    {% endif %}
                    {% if current_user.has_role("SUPERUSER") %}
                      <li id="registerOrganisation"><a href="{{ url_for('invite_organisation') }}">Register
                          Organisation</a>
                      </li>
                    {% endif %}
                    {% if current_user.is_superuser %}
                      <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Admin
                          <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                          <li id="user.index_view"><a data-toggle="tooltip" data-placement="left" title="Registered users" href="{{ url_for('user.index_view')}}">Users</a></li>
                          <li id="organisation.index_view"><a data-toggle="tooltip" data-placement="left" title="Registered Organisations" href="{{ url_for('organisation.index_view')}}">Organisations</a>
                          </li>
                          <li id="orcidtoken.index_view"><a data-toggle="tooltip" data-placement="left" title="Registered user ORCID access tokens" href="{{ url_for('orcidtoken.index_view')}}">ORCID Tokens</a></li>
                          <li class="divider"></li>
                          <li id="load_org"><a data-toggle="tooltip" data-placement="left" title="Pre-load Organisation Meta-information" href="{{ url_for('load_org')}}">Upload Organisation Info</a></li>
                          <li id="orginfo.index_view"><a data-toggle="tooltip" data-placement="left" title="Pre-loaded Organisation Meta-information" href="{{ url_for('orginfo.index_view')}}">View Organisation
                              Info</a></li>
                          <li class="divider"></li>
                          <li class="dropdown-submenu">
                            <a class="dropdown-toggle" tabindex="-1" href="#">Reports<!-- span class="caret"></span --></a>
                            <ul class="dropdown-menu">
                              <li id="user_summary"><a data-toggle="tooltip" data-placement="left" title="User Summary" href="{{ url_for('user_summary')}}">Users</a></li>
                              <li id="org_invitation_summary"><a data-toggle="tooltip" data-placement="left" title="Organisation Invitation Summary" href="{{ url_for('org_invitation_summary')}}">Organisation Invitations</a></li>
                              <li id="user_invitation_summary"><a data-toggle="tooltip" data-placement="left" title="User Invitation Summary" href="{{ url_for('user_invitation_summary')}}">User Invitations</a></li>
                            </ul>
                          </li>
                          {%- if config.REDIS_URL %}
                            <li class="divider"></li>
                            <li id="rq_dashboard.overview"><a data-toggle="tooltip" data-placement="left" title="Message Queues" href="{{ url_for('rq_dashboard.overview', url=request.url)}}">Message Queues</a></li>
                            <li id="schedude.index_view"><a data-toggle="tooltip" data-placement="left" title="Scheduled Jobs" href="{{ url_for('schedude.index_view') }}">Scheduled Jobs</a></li>
                          {% endif -%}
                        </ul>
                      </li>
                    {% endif %}
                  {% endif %}
        </ul>
        <ul class="nav navbar-nav navbar-right">
          {% if current_user.confirmed %}
            <li>{{orcid_url(current_user)}}</li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                <img alt="GRAVATAR" src="{{ current_user.avatar(20) }}">
                <strong>{{ current_user.name }}</strong>
                <span class="glyphicon glyphicon-chevron-down"></span>
              </a>
              <ul class="dropdown-menu">
                <li>
                  <div class="navbar-login">
                    <div class="row">
                      <div class="col-lg-4">
                        <p class="text-center">
                        <!-- span class="glyphicon glyphicon-user icon-size"></span -->
                        <a href={{current_user.gravatar_profile_url}}>
                          <img alt="GRAVATAR100" src="{{ current_user.avatar(100) }}">
                        </a>
                        </p>
                      </div>
                      <div class="col-lg-8">
                        <p class="text-left"><strong>{{ current_user.name }}</strong></p>
                        <p class="text-left small">{{ current_user.email }}</p>
                        <p class="text-left small">Edu Person Affiliation:
                        {{ current_user.affiliations }}</p>
                        <p class="text-left">
                        {% if current_user.organisation.confirmed %}
                          <a href="{{url_for('profile')}}"
                             class="btn btn-primary btn-block btn-sm">Profile</a>
                        {% endif %}
                        </p>
                      </div>
                    </div>
                  </div>
                </li>
              </ul>
            </li>
            <li><a href="{{url_for('logout')}}"><span class="glyphicon glyphicon-log-out"></span> log out</a>
            </li>
          {% else %}
            <li>
              {% if config.SHIBBOLETH_DISABLED %}
                <a href="{{orcid_login_url()|safe}}">
                  <span class="glyphicon glyphicon-log-in"></span> <b>log in</b>
                </a>
              {% else %}
              <a href="#login-modal" data-toggle="modal">
                <span class="glyphicon glyphicon-log-in"></span> <b>log in</b>
              </a>
              <div class="modal fade" id="login-modal" role="dialog">
                <div class="modal-dialog">
                  <div class="modal-content">
                    <div class="modal-header">
                      <span id="modal-title" class="modal-title"><b>Log in using your:</b></span>
                      <span class="pull-right">
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                      </span>
                    </div>
                    <div class="modal-body" style="padding: 0px 30px 0px 30px;">
                      <div class="row">
                        <div class="col-md-6" style="border-right: 1px solid #ddd">
                          <h3 class="text-center">Institutional credentials</h3>
                        </div>
                        <div class="col-md-6 center-block">
                          <h3 class="text-center">ORCID record</h3>
                        </div>
                      </div>
                      <div class="row">
                        <div class="col-md-6" style="border-right: 1px solid #ddd">
                          <img class="center-block" alt="Login via Tuakiri" src="{{image('REANNZ_Tuakiri_service.png')}}" style="width:50%">
                          <br/>
                        </div>
                        <div class="col-md-6">
                          <img class="center-block" alt="Login via Orcid" src="{{image('orcid-logo.png')}}" style="width:50%">
                          <br/>
                        </div>
                      </div>
                      <div class="row">
                        <div class="col-md-6" style="border-right: 1px solid #ddd">
                          <p>I'm currently employed by, or studying, with a <a href="#" data-toggle="tooltip"
                                                                                        title="Tuakiri-members include: all Universities; all Crown Research Institutes (except GNS); and ARA Institute of Canterbury">
                            Tuakiri-member organisation</a></p>
                        </div>
                        <div class="col-md-6">
                          <p>I'm the Tech Contact or Administrator for a Non-Tuakiri member organsation</p>
                        </div>
                      </div>
                      <div class="row">
                        <div class="col-md-6" style="border-right: 1px solid #ddd">
                          <a href="{{tuakiri_login_url()|safe}}">
                            <div class="tuakiri">
                              <div class="btn btn-primary center-block">Login&nbsp;via&nbsp;Tuakiri</div>
                            </div>
                          </a>
                          <p></p>
                        </div>

                        <div class="col-md-6">
                          <a href="{{orcid_login_url()|safe}}">
                            <div class="orcid">
                              <div class="btn btn-primary center-block">Login&nbsp;via&nbsp;ORCID</div>
                            </div>
                          </a>
                          <p></p>
                        </div>
                      </div>
                      <div class="row">
                        <div class="col-md-6" style="border-right: 1px solid #ddd">
                          <p><small>This log in takes you to the Tuakiri Directory Service where you can select your Home Organisation.
                            Once returned to the Hub, you'll be able to give your organisation permission to write your affiliation to your ORCID record</small></p>
                        </div>
                        <div class="col-md-6">
                          <p><small>This log in takes you to ORCID to let the Hub retrieve your ORCID iD.<br/>
                            Once you've linked your ORCID iD to an organisation using the Hub, you can use this ORCID record to log in.</small></p>
                        </div>
                      </div>
                    </div>
                    <div class="modal-footer">
                      <p>You can <b>only</b> log in with your ORCID record if you've already linked your iD via the Hub</p>
                    </div>
                  </div>
                </div>
              </div>
              {% endif %}
            </li>
          {% endif %}
        </ul>
        <!-- button class="btn btn-danger navbar-btn">Button</button -->
      </div>
    </div>
  </nav>
</header>
{% with messages = get_flashed_messages(with_categories=true) %}
  <!-- Categories: success (green), info (blue), warning (yellow), danger (red) -->
  {% if messages %}
    {% for category, message in messages %}
      <div class="alert alert-{{ category if category != "message" else "info" }} alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <strong>{{category.capitalize()}}!</strong> {{ message | safe }}
      </div>
    {% endfor %}
  {% endif %}
{% endwith %}
