templates/base/topnav.html.twig line 1

  1. <nav class="navbar">
  2.     <div class="container">
  3.         <div class="navbar-brand">
  4.             <a class="navbar-item" href="{{ path('app_home') }}">
  5.                 <img id="topnavlogo" src="{{ asset('Logo.jpg', 'images') }}" alt="Logo">  Diapersoft API
  6.             </a>
  7.             <span class="navbar-burger burger" data-target="navbarMenu">
  8.                 <span></span>
  9.                 <span></span>
  10.                 <span></span>
  11.             </span>
  12.         </div>
  13.         <div id="navbarMenu" class="navbar-menu">
  14.             <div class="navbar">            
  15.                 <a class="navbar-item {% if app.request.get('_route') == 'app_board_new' %}is-active{% endif %}" href="{{ path('app_board_new') }}">neues Board erstellen.</a>
  16.                 {% if is_granted('ROLE_ADMIN') %} <a class="navbar-item {% if app.request.get('_route') == 'app_board_index' %}is-active{% endif %}" href="{{ path('app_board_index') }}">Board Verwaltung</a> {% endif %}
  17.                 {% if is_granted('ROLE_ADMIN') %} <a class="navbar-item {% if app.request.get('_route') == 'app_user_index' %}is-active{% endif %}" href="{{ path('app_user_index') }}">user Verwaltung</a> {% endif %}
  18.                 
  19.                    
  20.                 {% if is_granted('ROLE_ADMIN') %}
  21.                 <div class="navbar-item has-dropdown is-hoverable">
  22.                     <a class="navbar-link">
  23.                     More
  24.                     </a>
  26.                     <div class="navbar-dropdown">
  27.                             <a class="navbar-item {% if app.request.get('_route') == 'app_search' %}is-active{% endif %}" href="{{ path('app_search') }}">Datenbank füllen</a>
  28.                             <a class="navbar-item {% if app.request.get('_route') == 'app_tmdb_movie' %}is-active{% endif %}" href="{{ path('app_tmdb_movie') }}">TMDB Eintäge anzeigen</a>
  29.                             
  30.                             <a class="navbar-item {% if app.request.get('_route') == 'app_letterboxd' %}is-active{% endif %}" href="{{ path('app_letterboxd') }}">Letterboxd get Updates</a>
  31.                             <a class="navbar-item {% if app.request.get('_route') == 'app_movie_diary_index' %}is-active{% endif %}" href="{{ path('app_movie_diary_index') }}">MovieDiary Verwaltung</a> 
  32.                     </div>
  33.                 </div>
  34.                 
  35.                         {% endif %}
  36.             </div>
  37.             <div class="navbar-end">
  38.                 <span class="navbar-item">
  39.                     {% if app.user %}
  40.                             Du bist als {{ app.user.userIdentifier }} eingeloggt.  <a href="{{ path('app_logout') }}">Logout</a>
  41.                     {% else %}        
  42.                         <a href="{{ path('app_login') }}">Login</a>
  43.                 {% endif %}
  44.                 </span>
  45.             </div>
  46.         </div>
  47.     </div>
  48. </nav>
  49. <script>
  50. document.addEventListener('DOMContentLoaded', () => {
  52.   // Get all "navbar-burger" elements
  53.   const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
  55.   // Add a click event on each of them
  56.   $navbarBurgers.forEach( el => {
  57.     el.addEventListener('click', () => {
  59.       // Get the target from the "data-target" attribute
  60.       const target = el.dataset.target;
  61.       const $target = document.getElementById(target);
  63.       // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
  64.       el.classList.toggle('is-active');
  65.       $target.classList.toggle('is-active');
  67.     });
  68.   });
  70. });
  71. </script>