{% set parentPageSlug = craft.app.request.getSegment(1) %}
{% set parentPageEntry = craft.entries().section('and, not navigationDesktopMain, not navigationFooter, not navigationMobileMain, not navigationTop').slug(parentPageSlug|literal).level(1).one() %}

{% if parentPageSlug == ''%}
    {# quick fix if first segemnt is empty #}
    {% set parentPageEntry = entry %}
{% endif %}

<div class="container">
    <header>
        <div class="row main-navigation-wrapper">
            <div class="col-6 col-lg-3">
                <a href="{{ url() }}"><img src="{{ general.logo.one() ? general.logo.one().url : '' }}" class="main-logo" alt="{{ 'Stichting Brandwonden'|t }}"/></a>
            </div>

            <div class="col-6 col-lg-9 d-flex flex-wrap justify-content-end">
                <div class="other-navigations">
                    <ul class="second-navigation">
                        {% nav item in craft.entries().section('navigationTop').all() %}

                            {% set classActiveTop = '' %}

                            {% if item.linkedToEntry.one() %}

                                {% set url = item.linkedToEntry.one().url %}

                                {% if parentPageEntry.id is defined  %}
                                    {% if item.linkedToEntry.one().id == parentPageEntry.id %}
                                        {% set classActiveTop = 'class="active"' %}
                                    {% endif %}
                                {% endif %}

                            {% else %}
                                {% set url = item.externalLink %}
                            {% endif %}

                            <li><a href="{{ url }}" {{ classActiveTop|raw }} {{ item.externalLink ? 'target="_blank"' : '' }}>{{ item.title }}</a></li>
                        {% endnav %}
                    </ul>

                    <ul class="language-navigation">
                        {% if category is defined %}
                            <li><a href="{{ craft.categories.id(category.id).site('siteNl').one().getUrl() }}" class="{{ craft.app.language == 'nl' ? 'active' : '' }}">{{ 'nl'|t }}</a></li>
                            <li><a href="{{ craft.categories.id(category.id).site('siteFr').one().getUrl() }}" class="{{ craft.app.language == 'fr' ? 'active' : '' }}">{{ 'fr'|t }}</a></li>
                        {% elseif entry is defined %}
                            <li><a href="{{ craft.entries().id(entry.id).site('siteNl').one().getUrl() }}" class="{{ craft.app.language == 'nl' ? 'active' : '' }}">{{ 'nl'|t }}</a></li>
                            <li><a href="{{ craft.entries().id(entry.id).site('siteFr').one().getUrl() }}" class="{{ craft.app.language == 'fr' ? 'active' : '' }}">{{ 'fr'|t }}</a></li>
                        {% endif %}
                    </ul>
                </div>
                <div class="button" style="align-items: center; margin-right: 20px;">
    <a href="{{ 'register-your-detector-link'|t }}"><button style="text-align: center; display: inline-block; border-radius: 4px; height: 38px; width: 275px; margin-top: 10px; background: #0090d7; color: white; border: none; font-size: 13px; letter-spacing: .4px; box-shadow: 0 3px 5px -1px rgba(0,0,0,.2), 0 6px 10px 0 rgba(0,0,0,.14), 0 1px 18px 0 rgba(0,0,0,.12);">{{ 'register-your-detector'|t }}</button></a>
</div>
                <div class="search">
                    <form name="searchForm" action="{{ url('search') }}">
                    {% set searchQuery = craft.app.request.getParam('q') %}
                    <input type="text" name="q" value="{{ searchQuery }}"/>
                    <i class="fal fa-search" onclick="document.searchForm.submit()"></i>
                    </form>
                </div>
            </div>
        </div>


        <div class="row main-navigation-wrapper nav-contain">
            <div id='navbar'>
                <div class="col-12">
                    <div class="main-navigation">
                        <ul>
                            <li><a href="{{ url() }}"><i class="fas fa-home-lg-alt"></i></a></li>
                            {% set activeClassSet = false %}
                            {% nav item in craft.entries().section('navigationDesktopMain').all() %}

                            {% set classActiveDesktopMain = '' %}

                            {% if entry is defined and item.linkedToEntry.one().id == entry.id %}
                                {% set classActiveDesktopMainear = 'class="active"' %}
                                {% set activeClassSet = true %}
                            {% endif %}

                            {% if item.linkedToEntry.one() %}
                                {% set url = item.linkedToEntry.one().url %}

                                {% if parentPageEntry.id is defined %}
                                    {% if item.linkedToEntry.one().id == parentPageEntry.id and not activeClassSet %}
                                        {% set classActiveDesktopMain = 'class="active"' %}
                                        {% set activeClassSet = true %}
                                    {% endif %}
                                {% endif %}

                            {% else %}
                                {% set url = url() %}
                            {% endif %}

                            <li><a href="{{ url }}" {{ classActiveDesktopMain|raw }}>{{ item.title }}</a></li>
                            {% endnav %}
                        </ul>
                        <!--<a href="{{ craft.entries().id(1642).one().url }}" class="support-us"><i class="fal fa-piggy-bank"></i> {{ 'Support us'|t }}</a>-->
                        <a href="{{ 'support-us-online'|t }}" class="support-us" target="_blank"><i class="fal fa-piggy-bank"></i> {{ 'Support us'|t }}</a>
                    </div>
                </div>
            </div>
        </div>

        <div class="row mobile-navigation-wrapper sticky-mob-contain">
            <div class="col-12">
                <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-mob">
                    <a class="navbar-brand" href="#">
                        <img src="{{ general.logo.one() ? general.logo.one().url : '' }}" class="main-logo" alt="{{ 'Stichting Brandwonden'|t }}"/>
                    </a>
                    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                        <i class="fas fa-bars"></i>
                    </button>

                    <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav mr-auto">
                            {% nav item in craft.entries().section('navigationMobileMain').all() %}

                                {% set classActiveMobileMain = '' %}

                                {% if item.linkedToEntry.one() %}
                                    {% set url = item.linkedToEntry.one().url %}

                                    {% if parentPageEntry.id is defined %}
                                        {% if item.linkedToEntry.one().id == parentPageEntry.id %}
                                            {% set classActiveMobileMain = 'class="active"' %}
                                        {% endif %}
                                    {% endif %}

                                {% else %}
                                    {% set url = url() %}
                                {% endif %}

                                <li class="nav-item">
                                    <a class="nav-link" href="{{ url }}" {{ classActiveMobileMain|raw }}>{{ item.title }}</a>
                                </li>
                            {% endnav %}
                            <li><a href="https://www.brules-brandwonden.be/index.php" class="nav-link" target="_blank">{{ 'Onze webshop'|t }}</a></li>
                        </ul>
                        <a href="{{ 'support-us-online'|t }}" class="support-us-mobile" target="_blank"><i class="fal fa-piggy-bank"></i> {{ 'Support us'|t }}</a>
                        <form class="form-inline my-2 my-lg-0 mobile-no">
                            <input class="form-control mr-sm-2" type="search" placeholder="{{ 'Search'|t }}" aria-label="Search">
                            <button class="btn btn-outline-success my-2 my-sm-0" type="submit">{{ 'Search'|t }}</button>
                        </form>
                    </div>
                </nav>
            </div>
        </div>
    </header>
</div>
