Skip to content

Commit

Permalink
web - added nested dropdown to navigation bar
Browse files Browse the repository at this point in the history
  • Loading branch information
@superstes
superstes committed May 2, 2021
1 parent 1a9f329 commit 0f71b2a
Show file tree
Hide file tree
Showing 4 changed files with 213 additions and 109 deletions.
20 changes: 11 additions & 9 deletions code/web/base/ga/config/nav.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,17 +19,19 @@
'Service': '/system/service/', # status and restart of service(s)
'Logs': '/system/log/', # read various log files
'Scripts': '/system/script/', # upload or delete scripts
'Config Export': '/system/export/config/', # download db dump of config
'Data Export': '/system/export/data/', # download db dump of data
'Full Export': '/system/export/full/', # download db dump of all ga tables
'Export': {
'Config': '/system/export/config/', # download db dump of config
'Data': '/system/export/data/', # download db dump of data
'Full': '/system/export/full/', # download db dump of all ga tables
},
},
},
'right': {
'<i class="fab fa-youtube fa-2x ga-icon-nav" title="YouTube"></i>': 'https://www.youtube.com/channel/UCLJyDlo3Z6eP_X2Pw0-Z8Pw',
'<i class="fab fa-github-square fa-2x ga-icon-nav" title="GitHub"></i>': 'https://github.com/superstes/growautomation',
'<i class="fas fa-coins fa-2x ga-icon-nav" title="Donate"></i>': 'https://www.patreon.com/growautomation/membership',
'<i class="fas fa-bug fa-2x ga-icon-nav" title="Report bugs"></i>': 'https://docs.growautomation.eu/en/latest/basic/bugs.html',
'<i class="fas fa-book fa-2x ga-icon-nav" title="Documentation"></i>': 'https://docs.growautomation.eu',
'<i class="fas fa-sign-out-alt fa-2x ga-icon-nav ga-icon-logout" title="Logout"></i>': '/logout/',
'<i class="fab fa-youtube fa-2x ga-nav-right-icon" title="YouTube"></i>': 'https://www.youtube.com/channel/UCLJyDlo3Z6eP_X2Pw0-Z8Pw',
'<i class="fab fa-github-square fa-2x ga-nav-right-icon" title="GitHub"></i>': 'https://github.com/superstes/growautomation',
'<i class="fas fa-coins fa-2x ga-nav-right-icon" title="Donate"></i>': 'https://www.patreon.com/growautomation/membership',
'<i class="fas fa-bug fa-2x ga-nav-right-icon" title="Report bugs"></i>': 'https://docs.growautomation.eu/en/latest/basic/bugs.html',
'<i class="fas fa-book fa-2x ga-nav-right-icon" title="Documentation"></i>': 'https://docs.growautomation.eu',
'<i class="fas fa-sign-out-alt fa-2x ga-nav-right-icon ga-nav-right-icon-logout" title="Logout"></i>': '/logout/',
}
}
67 changes: 50 additions & 17 deletions code/web/base/ga/templates/nav.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,23 +24,41 @@
</li>
<!-- END basic link -->
{% elif nav_config|get_type == 'dict' %}
{% set_var nav_config|get_dict_depth as navi_depth %}
{% if navi_depth == 1 %}
<!-- START dropdown link -->
<li class="nav-item dropdown ga-nav-main">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown{{ nav_key }}" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{ nav_key }}
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown{{ nav_key }}">
{% for key, value in nav_config.items %}
<a class="dropdown-item ga-nav-main-a" href="{{ value }}">
{{ key | safe }}
</a>
{% endfor %}
</div>
</li>
<!-- END dropdown link -->
{% endif %}
<!-- START dropdown link -->
<li class="nav-item dropdown ga-nav-main">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown{{ nav_key }}" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{ nav_key }}
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown{{ nav_key }}">
{% for dd_key, dd_config in nav_config.items %}
{% if dd_config|get_type == 'dict' %}
<!-- START nested dropdown link -->
<li class="dropdown-submenu">
<a class="dropdown-toggle dropdown-item ga-nav-main-a" onClick="display_submenu('{{ nav_key }}{{ dd_key }}')" href="#" id="navbarDropdown{{ nav_key }}{{ dd_key }}" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{ dd_key }}
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown{{ nav_key }}{{ dd_key }}">
{% for key, value in dd_config.items %}
<li>
<a class="dropdown-item ga-nav-main-a-sub" href="{{ value }}">
{{ key | safe }}
</a>
</li>
{% endfor %}
</ul>
</li>
<!-- END nested dropdown link -->
{% else %}
<li>
<a class="dropdown-item ga-nav-main-a" href="{{ dd_config }}">
{{ dd_key | safe }}
</a>
</li>
{% endif %}
{% endfor %}
</ul>
</li>
<!-- END dropdown link -->
{% endif %}
{% endfor %}
</ul>
Expand All @@ -58,3 +76,18 @@
{% endif %}
</nav>
</div>
<script type="text/javascript">
$('.dropdown-menu a.dropdown-toggle').on('click', function(e) {
if (!$(this).next().hasClass('show')) {
$(this).parents('.dropdown-menu').first().find('.show').removeClass("show");
}
var $subMenu = $(this).next(".dropdown-menu");
$subMenu.toggleClass('show');

$(this).parents('li.nav-item.dropdown.show').on('hidden.bs.dropdown', function(e) {
$('.dropdown-submenu .show').removeClass("show");
});

return false;
});
</script>

0 comments on commit 0f71b2a

Please sign in to comment.