diff options
| author | Jose M. Guisado <jguisado@soleta.eu> | 2022-02-22 12:34:03 +0100 |
|---|---|---|
| committer | Jose M. Guisado <jguisado@soleta.eu> | 2022-02-22 12:34:03 +0100 |
| commit | 07b69dab9045aa7b2dd41804ecb0eafd51defdcb (patch) | |
| tree | a042a2d7792bc8c4c0a981665a40e7ea7b291b8d /ogcp | |
| parent | 5d9ad78ed3a89b4c60c179012fd7b38b22da2b96 (diff) | |
Merge nav into base template
{% block %} defined in nav template cannot be overriden by child
templates from base. This is a limitation in jinja.
Merge nav into base template so jinja blocks so no {% include %} is used
and these blocks can be overriden by child templates (commands, images,
dashboard...)
Avoid using request.endpoint to determine active nav item, decoupling
endpoint names from navigation. Instead use child templates to override
jinja blocks.
[1] https://stackoverflow.com/q/40537752
https://stackoverflow.com/a/40562662
https://github.com/pallets/jinja/issues/243
Diffstat (limited to 'ogcp')
| -rw-r--r-- | ogcp/templates/base.html | 49 | ||||
| -rw-r--r-- | ogcp/templates/commands.html | 2 | ||||
| -rw-r--r-- | ogcp/templates/dashboard.html | 2 | ||||
| -rw-r--r-- | ogcp/templates/nav.html | 47 |
4 files changed, 50 insertions, 50 deletions
diff --git a/ogcp/templates/base.html b/ogcp/templates/base.html index 68e2e64..c6c3e3b 100644 --- a/ogcp/templates/base.html +++ b/ogcp/templates/base.html @@ -15,8 +15,53 @@ </head> <body> <div class="main d-flex flex-column align-items-stretch h-100"> - {% include 'nav.html' %} - {% block nav %}{% endblock %} + <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> + <a class="navbar-brand" href="#">OpenGnsys</a> + <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> + <span class="navbar-toggler-icon"></span> + </button> + + <div class="collapse navbar-collapse" id="navbarSupportedContent"> + <ul class="navbar-nav mr-auto"> + {% if current_user.is_authenticated %} + <li class="nav-item {% block nav_dashboard%}{% endblock %}"> + <a class="nav-link" href="{{ url_for('index') }}">{{ _('Dashboard') }}<span class="sr-only">(current)</span></a> + </li> + <li class="nav-item {% block nav_scopes%}{% endblock %}"> + <a class="nav-link" href="{{ url_for('scopes') }}">{{ _('Scopes') }}</a> + </li> + <li class="nav-item {% block nav_commands%}{% endblock %}"> + <a class="nav-link" href="{{ url_for('commands') }}">{{ _('Commands') }}</a> + </li> + <li class="nav-item {% block nav_images%}{% endblock %}"> + <a class="nav-link" href="{{ url_for('images') }}">{{ _('Images') }}</a> + </li> + <li class="nav-item {% if request.endpoint == "tasks" %}active{% endif %}"> + <a class="nav-link" href="#">{{ _('Tasks') }}</a> + </li> + <li class="nav-item {% if request.endpoint == "schedule" %}active{% endif %}"> + <a class="nav-link" href="#">{{ _('Schedule') }}</a> + </li> + {% endif %} + </ul> + + <ul class="nav navbar-nav navbar-right"> + {% if current_user.is_authenticated %} + + <li class="nav-item"> + <a class="btn btn-danger" href="{{ url_for('logout') }}">{{ _('Logout') }}</a> + </li> + + {% else %} + + <li class="nav-item"> + <a class="btn btn-primary" href="{{ url_for('login') }}">{{ _('Login') }}</a> + </li> + + {% endif %} + </ul> + </div> + </nav> <div class="container-fluid flex-grow-1"> {% block container %} <div class="row h-100"> diff --git a/ogcp/templates/commands.html b/ogcp/templates/commands.html index ac41354..28ad9b0 100644 --- a/ogcp/templates/commands.html +++ b/ogcp/templates/commands.html @@ -1,7 +1,7 @@ {% extends 'base.html' %} {% import "macros.html" as macros %} -{% block nav_scopes %}active{% endblock %} +{% block nav_commands %}active{% endblock %} {% block container %} <form id="scopesForm"> diff --git a/ogcp/templates/dashboard.html b/ogcp/templates/dashboard.html index 21d1d70..75f4cb6 100644 --- a/ogcp/templates/dashboard.html +++ b/ogcp/templates/dashboard.html @@ -1,5 +1,7 @@ {% extends 'base.html' %} +{% block nav_dashboard %}active{% endblock %} + {% block content %} <div class="row"> <!-- connected clients --> diff --git a/ogcp/templates/nav.html b/ogcp/templates/nav.html deleted file mode 100644 index edf5c05..0000000 --- a/ogcp/templates/nav.html +++ /dev/null @@ -1,47 +0,0 @@ -<nav class="navbar navbar-expand-lg navbar-dark bg-dark"> - <a class="navbar-brand" href="#">OpenGnsys</a> - <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> - <span class="navbar-toggler-icon"></span> - </button> - - <div class="collapse navbar-collapse" id="navbarSupportedContent"> - <ul class="navbar-nav mr-auto"> - {% if current_user.is_authenticated %} - <li class="nav-item {% if request.endpoint == "index" %}active{% endif %}"> - <a class="nav-link" href="{{ url_for('index') }}">{{ _('Dashboard') }}<span class="sr-only">(current)</span></a> - </li> - <li class="nav-item {% if request.endpoint == "scopes" %}active{% endif %}"> - <a class="nav-link" href="{{ url_for('scopes') }}">{{ _('Scopes') }}</a> - </li> - <li class="nav-item {% if request.endpoint == "commands" %}active{% endif %}"> - <a class="nav-link" href="{{ url_for('commands') }}">{{ _('Commands') }}</a> - </li> - <li class="nav-item {% if request.endpoint == "images" %}active{% endif %}"> - <a class="nav-link" href="{{ url_for('images') }}">{{ _('Images') }}</a> - </li> - <li class="nav-item {% if request.endpoint == "tasks" %}active{% endif %}"> - <a class="nav-link" href="#">{{ _('Tasks') }}</a> - </li> - <li class="nav-item {% if request.endpoint == "schedule" %}active{% endif %}"> - <a class="nav-link" href="#">{{ _('Schedule') }}</a> - </li> - {% endif %} - </ul> - - <ul class="nav navbar-nav navbar-right"> - {% if current_user.is_authenticated %} - - <li class="nav-item"> - <a class="btn btn-danger" href="{{ url_for('logout') }}">{{ _('Logout') }}</a> - </li> - - {% else %} - - <li class="nav-item"> - <a class="btn btn-primary" href="{{ url_for('login') }}">{{ _('Login') }}</a> - </li> - - {% endif %} - </ul> - </div> -</nav> |