| Current Path : /home/zieirix/www/templates/it_medical/particles/ |
| Current File : /home/zieirix/www/templates/it_medical/particles/onepage-menu.html.twig |
{% extends '@nucleus/partials/particle.html.twig' %}
{% set attr_extra = '' %}
{% if particle.extra %}
{% for attributes in particle.extra %}
{% for key, value in attributes %}
{% set attr_extra = attr_extra ~ ' ' ~ key|e ~ '="' ~ value|e('html_attr') ~ '"' %}
{% endfor %}
{% endfor %}
{% endif %}
{% block particle %}
<div class="g-onepage-menu{% if particle.css.class %} {{ particle.css.class|e }}{% endif %}" {% if particle.extra %}{{ attr_extra|raw }}{% endif %}>
<ul data-uk-scrollspy-nav="{closest:'li', smoothscroll: {offset: {{ particle.smoothscrolloffset|e }}}}" data-uk-sticky="{media:768, top:{{ particle.stickyoffset|e }}, boundary: '{{ particle.boundary|e }}'}">
{% for item in particle.items %}
{% set attr_extra_item = '' %}
{% for extra in item.extra %}
{% set attr_extra_item = attr_extra_item ~ ' ' ~ extra|keys|first|e ~ '="' ~ extra|values|first|e('html_attr') ~ '"' %}
{% endfor %}
<li class="g-onepage-menu-item{% if item.class %} {{ item.class|e }}{% endif %}" {% if item.extra %}{{ attr_extra_item|raw }}{% endif %}>
<a href="{% if item.link %}#{{ item.link|e }}{% endif %}">
{%- if item.icon -%}
<i class="{{ item.icon|e }}"></i>
{%- endif -%}
{{- item.title|raw -}}
</a>
{% if item.subtitle1 or item.subtitle2 or item.subtitle3 or item.subtitle4 or item.subtitle5 %}
<ul class="submenu">
{% if item.subtitle1 %}
<li>
<a href="{% if item.sublink1 %}#{{ item.sublink1|e }}{% endif %}">
{%- if item.subicon1 -%}
<i class="{{ item.subicon1|e }}"></i>
{%- endif -%}
{{- item.subtitle1|raw -}}
</a>
</li>
{% endif %}
{% if item.subtitle2 %}
<li>
<a href="{% if item.sublink2 %}#{{ item.sublink2|e }}{% endif %}">
{%- if item.subicon2 -%}
<i class="{{ item.subicon2|e }}"></i>
{%- endif -%}
{{- item.subtitle2|raw -}}
</a>
</li>
{% endif %}
{% if item.subtitle3 %}
<li>
<a href="{% if item.sublink3 %}#{{ item.sublink3|e }}{% endif %}">
{%- if item.subicon3 -%}
<i class="{{ item.subicon3|e }}"></i>
{%- endif -%}
{{- item.subtitle3|raw -}}
</a>
</li>
{% endif %}
{% if item.subtitle4 %}
<li>
<a href="{% if item.sublink4 %}#{{ item.sublink4|e }}{% endif %}">
{%- if item.subicon4 -%}
<i class="{{ item.subicon4|e }}"></i>
{%- endif -%}
{{- item.subtitle4|raw -}}
</a>
</li>
{% endif %}
{% if item.subtitle5 %}
<li>
<a href="{% if item.sublink5 %}#{{ item.sublink5|e }}{% endif %}">
{%- if item.subicon5 -%}
<i class="{{ item.subicon5|e }}"></i>
{%- endif -%}
{{- item.subtitle5|raw -}}
</a>
</li>
{% endif %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
</div>
{% endblock %}
{% block javascript_footer %}
{{ parent() }}
<script type="text/javascript">
(function($) {
$(document).ready(function() {
if( $('.g-onepage-menu .submenu').length ) {
// select the target node
var onepageMenu = document.querySelector('.g-onepage-menu');
// create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
$('.g-onepage-menu .submenu li').each(function() {
if( $(this).hasClass('uk-active') ) {
$(this).parent('.submenu').addClass('uk-active');
}
});
$('.g-onepage-menu .submenu').each(function() {
if( !$(this).children().hasClass('uk-active') ) {
$(this).removeClass('uk-active');
}
});
});
});
// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true, subtree: true }
// pass in the target node, as well as the observer options
observer.observe(onepageMenu, config);
}
});
})(jQuery);
</script>
{% endblock %}