{% extends 'Default/parameters.html.twig' %}
{% import "Default/macros.html.twig" as macros %}

{% block html %}
{% apply spaceless %}
{% set menus = [] %}

{% set submenus = [] %}
{% set submenus = submenus|merge([{label:"Nos agences", href: url("agencies") }]) %}
{% set submenus = submenus|merge([{label:"Nos distributeurs automatiques", href: url("agencies") }]) %}
{% set submenus = submenus|merge([{label:"Vision et mission", href: url("about") }]) %}
{% set submenus = submenus|merge([{label:"Nos Valeurs", href: "#" }]) %}
{% set submenus = submenus|merge([{label:"Historique", href: path("history") }]) %}
{% set submenus = submenus|merge([{label:"Organisation", href: path("organisation") }]) %}
{% set submenus = submenus|merge([{label:"Succursales", href: path("branchs") }]) %}
{% set menus = menus|merge({'about':{label:"Nous découvrir", submenus: submenus, id:'about'}}) %}

{% set submenus = [] %}
{% set menus = menus|merge({'accounts':{label:"Nos comptes", submenus: submenus, id:'accounts'}}) %}

{% set submenus = [] %}
{% for o in credits %}
{% set submenus = submenus|merge([{label:o.label, href: path("credit",{slug:o.slug}) }]) %}
{% endfor %}
{% set menus = menus|merge({'credits':{label:"Nos prêts", href:path('credits'), submenus: submenus, id:'credits'}}) %}

{% set submenus = [] %}
{% for o in insurances %}
{% set submenus = submenus|merge([{label:o.label, href: path("insurance",{slug:o.slug}) }]) %}
{% endfor %}
{% set menus = menus|merge({'insurances':{label:"Nos assurances", href:path('insurances'), submenus: submenus, id:'insurances'}}) %}

{% set submenus = [] %}
{# {% for o in formations %}
{% set submenus = submenus|merge([{label:o.label, href: path("formation",{id:o.id,slug:o.slug}) }]) %}
{% endfor %} #}
{% set menus = menus|merge({'digital':{label:"La banque digitale", href:path('digital'), submenus: submenus, id:'digital'}}) %}

{% set submenus = [] %}
{% for o in articlesCats %}
{% set submenus = submenus|merge([{label:o.name, href: path("articles-cat",{cat:o.slug}) }]) %}
{% endfor %}
{% set submenus = submenus|merge([{label:"Supports de communication", href: path("resources") }]) %}
{% set menus = menus|merge({'articles':{label:"Nos publications", href:url("articles"), submenus: submenus, id:'articles'}}) %}

{% block content %}
{% if isMobile() %}
<div class=''>
    <ul class='list h4 upper flex col lspacing vt-15-in gpadding white'>
        {% for o in menus %}
        <li class='vt-3-in'>
			{% if o.href is defined and o.href and o.submenus is not defined %}
            <a href='{{o.href}}' class='vt-8-in nowrap flex col middle relative pointer medium'>{{o.label}}</a>
            {% else %}
            <span class='vt-8-in nowrap flex row space middle relative pointer medium os-click' data-target='next'>
				<span>{{o.label}}</span>
				<i class='fa fa-chevron-down'></i>
			</span>
            {% endif %}
            {% if o.submenus is defined %}
            <ul class='absolute shadow transition-1s p-alt text-left success medium vt-10-in hz-40-in hoverflow ytop-100'>
                <i class="absolute fill top left bg-white"></i>
                {% for k in o.submenus %}
                <li class='relative'>
                    <a href='{{k.href}}' class='iflex col middle relative pointer vt-5-in vt-7'>{{k.label}}</a>
                </li>
                {% endfor %}
            </ul>
            {% endif %}
        </li>
        {% endfor %}
    </ul>
</div>
{% else %}
<div class='fill top'>
    <ul class='list flex row center h6 black fill text-center'>
        {% for o in menus %}
        <li class='relative h100 menu transition {{activeMenu == o.id ? "active"}}'>
            {% if o.href is defined and o.href %}
            <a href='{{o.href}}' class='nowrap transition relative pointer iflex row middle h100'>
                <span class='vt-5-in hz-20-in'>{{o.label}}</span>
            </a>
            {% else %}
            <span class='os-click transition relative pointer iflex row middle h100' data-target='next'>
                <span class='vt-5-in hz-20-in'>{{o.label}}</span>
            </span>
            {% endif %}

            {% if o.id == 'accounts' %}
            <div class='special absolute shadow transition-1s text-left success medium vt-30-in hz-30-in hoverflow ytop-100'>
                <i class="absolute fill top left bg-white"></i>
                <div class="w100 flex row wrap space relative">
                    <div class="half-20 flex col">
                        <h4 class="h6 black bottom-10"><a href="{{path('currentaccounts')}}">Comptes courants</a></h4>
                        {% for k in currentAccounts %}
                        <a class="flex row p middle" href="{{path('currentaccount',{slug:k.slug})}}">
                            <i class="bg-warning padding-2 circle transition right-10"></i>
                            <span>{{k.label}}</span>
                        </a>
                        {% endfor %}
                        <a class="flex row p middle" href="{{path('currentaccounts')}}">
                            <i class="bg-warning padding-2 circle transition right-10"></i>
                            <span>Tous nos comptes courants</span>
                        </a>
                    </div>
                    <div class="half-20 flex col">
                        <h4 class="h6 black bottom-10"><a href="{{path('savingaccounts')}}">Comptes épargnes</a></h4>
                        {% for k in savingAccounts %}
                        <a class="flex row p middle" href="{{path('savingaccount',{slug:k.slug})}}">
                            <i class="bg-warning padding-2 circle transition right-10"></i>
                            <span>{{k.label}}</span>
                        </a>
                        {% endfor %}
                        <a class="flex row p middle" href="{{path('savingaccounts')}}">
                            <i class="bg-warning padding-2 circle transition right-10"></i>
                            <span>Tous nos comptes épargnes</span>
                        </a>
                    </div>
                    <div class="half-20 flex col top-40">
                        <h4 class="h6 black bottom-10"><a href="{{path('savingaccounts')}}">Fonds communs de placement</a></h4>
                        {% for k in mutualFunds %}
                        <a class="flex row p middle" href="{{path('mutualfund',{slug:k.slug})}}">
                            <i class="bg-warning padding-2 circle transition right-10"></i>
                            <span>{{k.label}}</span>
                        </a>
                        {% endfor %}
                        <a class="flex row p middle" href="{{path('mutualfunds')}}">
                            <i class="bg-warning padding-2 circle transition right-10"></i>
                            <span>Tous nos FCP</span>
                        </a>
                    </div>
                    <div class="half-20 flex col top-40">
                        <h4 class="h6 black bottom-10"><a href="#">Déptôts à terme</a></h4>
                        {# {% for k in mutualFunds %}
                        <a class="flex row p middle" href="{{path('mutualfund',{slug:k.slug})}}">
                            <i class="bg-warning padding-2 circle transition right-10"></i>
                            <span>{{k.label}}</span>
                        </a>
                        {% endfor %} #}
                    </div>
                </div>
            </div>
            {% elseif o.submenus is defined %}
            <ul class='absolute shadow transition-1s p text-left success vt-20-in hz-40-in hoverflow ytop-100'>
                <i class="absolute fill top left bg-white"></i>
                {% for k in o.submenus %}
                <li class='relative'>
                    <a href='{{k.href}}' class='flex col middle relative pointer vt-5-in'>{{k.label}}</a>
                </li>
                {% endfor %}
            </ul>
            {% endif %}
        </li>
        {% endfor %}
    </ul>
</div>
{% endif %}

{% endblock %}

{% endapply %}
{% endblock %}