{% extends '::baseAjax.html.twig' %}
{% block ajax_body %}
	{% macro recursiveMenu(item, languageId, level, ob_project_base_url, mediaLocation) %}
		{% set liClass = 'dropdown' %}
		{% set ulClass = 'dropdown-menu' %}
		{% set hasMoreChild = 0 %}
		{% if item.children is defined and item.children|length %}
			{% set hasMoreChild = 1 %}
		{% endif %}
	
		{% if level == 2 %}
			{% set liClass = liClass~'-submenu' %}
		{% endif %}
	 
		<li {% if hasMoreChild %} class="{{ liClass ~ ' ' ~ item.cssClasse }}" {% else %} class="{{ item.cssClasse }}" {% endif %}>
			{% for itemLanguage in item.languageMapping %}
				{% if itemLanguage.languageId == languageId %}
					{% if level==1 %}
						{% set productAddClass='product-add' %}
					{% else %}
						{% set productAddClass="" %}
					{% endif %}
					
					<a href="{{ (itemLanguage.url=="#")?'javascript:void();':itemLanguage.url }}" {% if itemLanguage.urlTarget == 'new-tab' %}target="_blank"{% endif %} {% if hasMoreChild %} class="dropdown-toggle {{ productAddClass }}" data-id={{ item.id }} {% endif %} title="{{ itemLanguage.title }}">{% if item.cssIcon != '' %} <i class="{{ item.cssIcon }}"></i> {% endif %}{% if app.user.id is defined and app.user.id > 0 and (itemLanguage.itemLabel == "Flyers" or itemLanguage.itemLabel == "Order Catalog") %}{{ itemLanguage.itemLabel }}{% elseif(itemLanguage.itemLabel != "Flyers" and itemLanguage.itemLabel != "Order Catalog") %}{{ itemLanguage.itemLabel }}{% endif %}</a>
				{% endif %}
			{% endfor %}
	
	        {% if hasMoreChild %}
	        	{% set level = level + 1  %}
	        	<b class="menu-caret1" data-toggle="dropdown"></b>
	
	        	{% if level == 3 %}
	        		<div class="dropdown-menu">
					{% set ulClass = '' %}
	        	{% endif %}
	
				{% if level == 3 %}
					<div class="col-lg-6 col-md-12 col-sm-12 col-xs-12">
				{% endif %}
		        	<ul class="{{ ulClass }}">
		                {% for child in item.children %}
		                	{{ _self.recursiveMenu(child, languageId, level, ob_project_base_url, mediaLocation) }}
		                {% endfor %}
		            </ul>
		        {% if level == 3 %}
					</div>
				{% endif %}
				
	            {% if level == 3 %}
	        			<div class="col-lg-2 hidden-xs hidden-md hidden-sm">
	        				{% if item.backgroundImage != '' %}
	        					<a href="javascript:void(0)"><img src="{{ ob_project_base_url~asset(mediaLocation~item.backgroundImage)  }}" class="menu-pro-img" alt=""></a>
		                    {% endif %}
	        			</div>
					</div>
	        	{% endif %}
	        {% endif %}
	    </li>
	{% endmacro %}
	
	{% if menu %}
		<!-- <li><a href="#"><img src="{{ asset('bundles/officebraincustombundletheme/IdmeTheme/images/home-icon.png') }}" /></a></li> -->

	    {% for item in menu %}
	    	{{ _self.recursiveMenu(item, languageId, 1, ob_project_base_url, mediaLocation) }}
		{% endfor %}
	{% endif %}
<style>

@media screen and (max-width: 767px) {
	#mainmenu-nav #mainmenu .navbar-nav .dropdown-menu li>a {border-bottom: 0px;  display: inline-block; width:auto;}
	.menu-box .navbar-nav li.dropdown > ul.dropdown-menu > li {border-bottom: 1px dotted #69717e;}
}
</style>
	{% endblock ajax_body %}