{% extends 'bootstrap/base.html' %}

{% block head %}
{{super()}}
<link rel="shortcut icon" href="/static/favicon.ico">
{% endblock %}

{%block scripts%}
{{super()}}
    <script src="https://unpkg.com/popper.js/dist/umd/popper.min.js"></script>
{% endblock %}

{% block styles %}
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/bootstrap.min.css') }}">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
{% endblock %}

{% block title %}
{% if title %}
{{ title }} - CodeRx
{% else %}
Welcome to CodeRx
{% endif %}
{% endblock %}

{% block navbar %}
<nav class="navbar navbar-expand-md navbar-light bg-light">
    <a class="navbar-brand" href="{{ url_for('homepage') }}">
        <img src="/static/logo.svg" width="30" height="30" class="d-inline-block align-top" alt="">
        CodeRx
    </a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor03" aria-controls="navbarColor03"
        aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="navbarColor03">
        <ul class="navbar-nav mr-auto">
            <li class="nav-item active">
                <a class="nav-link" href="{{ url_for('homepage') }}">Home <span class="sr-only">(current)</span></a>
            </li>
            {%- if request.path == "/editor" %}}
            <button onclick="displayProblems()">Problems
            </button>
            {% else %}
            <li class="nav-item">
                <a class="nav-link" href="{{ url_for('editor') }}">Editor</a>
            </li>
            {% endif %}
            <li class="nav-item">
                <a class="nav-link" href="{{ url_for('join_class') }}">Join A Class</a>
            </li>
            {% if current_user.has_role("admin") %}
            <li class="nav-item">
                <a class="nav-link" href="{{ url_for('admin') }}">Admin</a>
            </li>
            {% endif %}

            {% if current_user.has_role("professor") %}
            <li class="nav-item">
                <a class="nav-link" href="{{ url_for('create_new_problem') }}">Create A Problem</a>
            </li>
            {% endif %}
            <!-- <li class="nav-item">
              <a class="nav-link" href="#">Pricing</a>
            </li>
            --> 

        </ul>
        <ul class="nav navbar-nav navbar-right">
            {% if request.path == "/editor" %}}
            <button onclick="displayResults()">Results
            </button>
            {% endif %}
            <li>
                <a href="/logout" class="nav-link"><i class="fas fa-sign-out-alt"></i> Logout</a>
            </li>
        </ul>
            
    </div>
</nav>
{% endblock %}

{% block content %}
<div class="container-fluid">
    {% with messages = get_flashed_messages() %}
    {% if messages %}
    {% for message in messages %}
    <div class="alert alert-info" role="alert">{{ message }}</div>
    {% endfor %}
    {% endif %}
    {% endwith %}

    {# application content needs to be provided in the app_content block #}
    {% block app_content %}{% endblock %}
</div>
{% endblock %}