{% load static %}
{% load guardian_tags %}
{% load get_version %}

<div class="wrapper">
    {% comment %} Sidebar {% endcomment %}
    <nav id="sidebar">
        <div class="sidebar-header">
            <h3><a href="{% url 'core:home' %}"><i class="fa fa-link fa-1x"></i> OpenLink</a></h3>
            <a href="{% url 'core:home' %}"><strong><i class="fa fa-link fa-1x"></i></strong></a>
        </div>

        <ul class="list-unstyled components">
            <li class="active">
                <a href="{% url 'core:home' %}">
                    <i class="fas fa-home"></i>
                    Home
                </a>
            </li>
            <li>
                <a href="{% url 'core:projects' %}">
                    <i class="fas fa-desktop"></i>
                    Projects
                </a>
            </li>
            <li>
                <a href="{% url 'core:contact' %}">
                    <i class="fas fa-envelope-open"></i>
                    Contact
                </a>
            </li>
        </ul>

        <ul class="list-unstyled components">
            {% if user.is_authenticated %}
                <li>
                    <a href="{% url 'logout' %}"><i class="fas fa-sign-out-alt"></i> Logout</a>
                </li>
                <li>
                    <a href="{% url 'core:user-profile' user.username %}"><i class="fas fa-user"></i> {{ user.get_username }}</a>
                </li>
                <li>
                    <a href="{% url 'admin:index' %}"><i class="fas fa-unlock-alt"></i> Admin</a>
                </li>
            {% else %}
                <li>
                    <a href="{% url 'login' %}"><i class="fas fa-sign-in-alt"></i> Login</a>
                </li>
                <li>
                    <a href="{% url 'admin:index' %}"><i class="fas fa-unlock-alt"></i> Admin</a>
                </li>
            {% endif %}

        </ul>
        <a href="https://www.france-bioinformatique.fr/" target="_blank"> <img src="{% static 'images/logo-ifb-blanc.svg' %}" alt="IFB"
                width="90" style="margin-left: 10%;"></a>
        <br>
        <br>
        <a href="http://www.igbmc.fr/" target="_blank"> <img src="{% static 'images/IGBMC_2012_logo.png' %}" alt="IGBMC"
                width="60" style="margin-left: 10%;"></a>
        <br>
        <ul>
            <a href="https://gitlab.com/igbmc/openlink/-/tree/dev"><span class='version'>{{"Version "|get_version}}</span></a>
        </ul>
    </nav>
    <div id="content">

        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <div style="padding-right: 0px; margin-right: 0px;" class="row col-sm-12">
                <div class="col-xs-1">
                    <button type="button" id="sidebarCollapse" class="btn btn-primary">
                        <i class="fas fa-align-left"></i>
                        <span></span>
                    </button>
                </div>
                <div class="col-sm-7 text-left">
                    {% block messages %}
                        {% if project %}
                            <h4 class="display-titre"><a
                                href="{% url 'core:projects-details' project.id %}"><i
                                    class="fas fa-desktop fa-xs"></i> {{ project.name }}</a>&nbsp;<a
                                class="btn btn-outline-secondary btn-sm "
                                href="{% url 'core:edit-project' project_id=project.id %}">Edit</a>&nbsp;
                                {% get_obj_perms request.user for project as "project_perms" %}
                                {% if "manage_user" in project_perms %}
                                    <a class="btn btn-outline-secondary btn-sm "
                                        href="{% url 'core:mapping_project_user' project_id=project.id %}">Manage Users</a>
                                    <a class="btn btn-outline-secondary btn-sm"
                                        href="{% url 'core:tools-project' project.id %}">Manage Tools</a>
                                {% else %}
                                    <div class="disabled-button-wrapper" data-toggle="popover" data-trigger="hover"
                                        data-placement="right" title="Action not available" data-container="body" data-html="true"
                                        data-content="You don't have sufficient permissions to  <br/> <strong>manage users</strong>.">
                                        <button class="btn btn-outline-secondary btn-sm" type="button" disabled>Manage User</button>
                                    </div>
                                    <div class="disabled-button-wrapper" data-toggle="popover" data-trigger="hover"
                                        data-placement="right" title="Action not available" data-container="body" data-html="true"
                                        data-content="You don't have sufficient permissions to  <br/> <strong>manage tools</strong>.">
                                        <button class="btn btn-outline-secondary btn-sm" type="button" disabled>Tools</button>
                                    </div>
                                {% endif %}
                            </h4>
                        {% endif %}
                    {% endblock %}
                </div>
                <div style="padding-right: 0px; margin-right: 0px;" class="col-sm-4 text-right">

                    {% if project %}
                        {% get_obj_perms request.user for project as "project_perms" %}
                        {% if "change_project" in project_perms %}
        
                            <a class="btn btn-outline-primary btn-sm"
                                href="{% url 'core:add-investigation' project.id %}">Add investigation</a>
                        {% else %}
                            <div class="disabled-button-wrapper" data-toggle="popover" data-trigger="hover"
                                data-placement="right" title="Action not available" data-container="body" data-html="true"
                                data-content="You don't have sufficient permissions to  <br/> <strong>add investigation</strong>.">
                                <button class="btn btn-outline-primary" type="button" disabled>Add investigation</button>
                            </div>
                        {% endif %}</h4>
                    {% endif %}
                </div>
            </div>

        </nav>