{% extends 'base.html.twig' %}

{% set countryUrl = app.request.attributes.get('_country') %}

{% block body %}
<section class="header-news">
    <div class="container">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ absolute_url(customPath('main_home')) }}">{{'home'|trans}}</a></li>
                <li class="breadcrumb-item active" aria-current="page">{{'menu.news'|trans}}</li>
            </ol>
        </nav>
        <div class="header-news-wrapper">
            <div class="row">
                <div class="col-md-12">
                    {{'opinion.less_than_3'|trans|raw}}
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <form method="GET" action="{{ customPath('find_worker_search') }}" id="form-search" class="home-form-architect">
                        <div class="row">
                            <div class="col-md-3">
                                <select class="form-control countries" name="site-country" id="countries">
                                    {% set webSite = webSiteFooter() %}
                                    {% for site in webSite %}
                                    {% if site.defaultLanguage %}
                                    <option value="{{ site.defaultLanguage.locale }}"
                                    data-lang="{{ site.defaultLanguage.locale }}" data-action="{{ site.url }}" {% if site.isoCode == countryUrl %}selected{% endif %}>
                                        {{ site.currentTranslation.country }}
                                    </option>
                                    {% endif %}
                                    {% endfor %}
                                </select>
                            </div>
                            <div class="col-md-6">
                                    <input type="text" class="form-control" placeholder="{% trans %}form_search{% endtrans %}" id="autocomplete-workerplace"
                                    name="search[lieu]" {% if session.lieu is defined %} value="{{session['lieu']}}" {% endif %}>
                                    <input type="hidden" name="city" id="search-city" />
                                    <input type="hidden" name="zip-code" id="search-zip-code" />
                                    <input type="hidden" name="department" id="search-department" />
                                    <input type="hidden" name="region" id="search-region" />
                                    <input type="hidden" name="country" id="search-country" />
                            </div>
                            <div class="col-md-3"><button type="submit" class="btn btn-block btn-archi-blue">{% trans %}pageHome.find{% endtrans %}</button></div>
                            <div class="col-md-3" id="frenchOnly">
                                <select class="form-control" name="site-country-in-france" id="countries-for-france">
                                    {% for island in islands %}
                                        <option value="{{island.isoCode}}" >{{island.currentTranslation.name}}</option>
                                    {% endfor %}
                            </select>
                        </div>
                        <div class="offset-md-6 col-md-3"><p class="free-no-contract"> {% trans %}pageHome.no_contract{% endtrans %}</p></div>
                        </div>
                    </form>
                    <a href="{{ absolute_url(customPath('find_worker_results_all')) }}" class="advanced-search"><i class="fa fa-plus blue"></i> {{'research.advanced_search'|trans}}</a>
                </div>
            </div>
        </div>
        
    </div>
</section>

<form method="POST" action="{{ absolute_url(customPath('news_all')) }}" class="">
<section class="menu-categories">
    <div class="container">
        <div class="row">
            <div class="col-md-8 offset-md-2">
                <h1 class="title-categories">{{'menu.news'|trans}}</h1>
            </div>
            <div class="col-md-12">
                <div class="content-categories">
                    <button type="submit" value="All" name="categorie" {% if filters['categorie'] == null or filters['categorie'] == 'All' %} class="item-categorie checkedCategorie" {% else %} class="item-categorie" {% endif %}>{{'pageNews.tous'|trans}}</button>
                    {% for cate in categories %}
                    <button type="submit" value="{{cate.id}}" name="categorie" {% if filters['categorie'] == cate.id %} class="item-categorie checkedCategorie" {% else %} class="item-categorie" {% endif %} >{{cate.currentTranslation.title}}</button>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
</section>
</form>

<form method="POST" action="{{ absolute_url(customPath('news_all')) }}" id="form-search-news" role="form">
    <section class="all-articles">
        <div class="container">
            <div class="row row-all-articles" >
                <div class="col-md-4">
                    {% if filters['categorie'] == null or filters['categorie'] == 'All' %} 
                        <p class="title-recent-article">{{'pageNews.all_articles_bis'|trans}} </p>
                    {% else %}
                        {% for cate in categories %}
                            {% if filters['categorie'] == cate.id %}
                                <p class="title-recent-article">{{cate.currentTranslation.title}}</p>
                            {% endif %}
                        {% endfor %}
                    {% endif %}
                </div>
                <div class="col-md-4 offset-md-4 research-article">
                    <input class="col-md-8 form-control" type="text" name="searchKeys" id="searchKeys" placeholder="{{'pageNews.keyword'|trans}}" {% if filters['title'] is defined %} value="{{filters['title']}}" {% endif %}>
                    <button type="submit" class="btn btn-archi-blue form-control">{{'pageHome.find'|trans}}</button>
                </div>
                <br><hr>
                {% for news in newsAll %}
                <div class="col-md-4 responsive-news-item">
                    {% if news.picture %}
                    <a class="" href="{{ customPath('news_see',{ slug : news.currentTranslation.slug })}}">
                        {# <div style="background: url({{news.picture | imagine_filter('remote_news_thumb_multiple')}}) center no-repeat; background-size: auto 100%; height: 230px" lang="fr"> #}
                        {# </div> #}
                            {% if news.logo %}
                                <div style="background: url({{news.picture | imagine_filter('remote_news_thumb_multiple_' ~ logoFilter)}}) center no-repeat; background-size: auto 100%; height: 230px" lang="fr">
                                </div>
                            {% else %}
                                <div style="background: url({{news.picture | imagine_filter('remote_news_thumb_multiple')}}) center no-repeat; background-size: auto 100%; height: 230px" lang="fr">
                                </div>
                            {% endif %}
                    </a>
                    {% endif %}
                    <div class="content-article">
                        <a class="s" href="{{ customPath('news_see',{ slug : news.currentTranslation.slug })}}">
                            <div><p class="description-article">{{news.currentTranslation.title}}</p></div>
                        </a>
                        <div class="see-article"> 
                            <a class="link-article" href="{{ customPath('news_see',{ slug : news.currentTranslation.slug })}}">{{'pageNews.lire_suite'|trans}}</a>
                            <a class="" href="{{ customPath('news_see',{ slug : news.currentTranslation.slug })}}">
                            <div>
                                <p class="categorie-article">{{news.newsCategory.currentTranslation.title}}</p>
                            </div>
                            </a>
                        </div>
                    </div>
                </div>
                {% endfor %}
            </div>

            <div class="navigation">
                {{ knp_pagination_render(newsAll) }}
            </div>
        </div>
    </section>
</form>
<section class="home-you-architect">
    <div class="container">
        <h3>{{'pageHome.blue_architect'|trans|raw}}</h3>
        <p>{{'pageHome.you_wish'|trans}}</p>
        {% if currentCountry2 == 'es' and currentLocal == 'es' %}
            <a href="{{ absolute_url(customPath('main_worker_inscription')) }}">{% trans %}menu.contact_us_bis{% endtrans %} </a>
        {% else %}
            <a href="{{ absolute_url(customPath('main_worker_inscription')) }}">{% trans %}menu.contact_us{% endtrans %} ! </a>
        {% endif %}
    </div>
</section>
{% endblock %}

{% block javascripts %}
<script>
    $( document ).ready(function() {
        $("select.countries").change(function(){
            var selectedCountry = $(this).children("option:selected");
            document.location = selectedCountry.data('action')
        });

        if( $( "#countries option:selected" ).data('text') == 'France'){
            $("#frenchOnly").css("display", "");
        }
        else{
            $("#frenchOnly").css("display", "none");
        }
        $("select#countries-for-france").change(function(){
            var selectedCountry = $(this).children("option:selected");
            countryAutoComp = selectedCountry.val();
            init();
        });
  
    });
    var countryAutoComp = {{currentCountry|raw}}; 
    var currentWebsite = {{currentWebsite}};
    function init() {
        activatePlacesSearch();
    }
</script>
<script>
    {# var country = {{country|raw}} #}
</script>
{% if currentWebsite == 1 %}
    
<script SameSite="None; Secure" src="https://static.landbot.io/landbot-widget/landbot-widget-1.0.0.js"></script>

{% endif %}
<script src="{{ asset('lib/js/home.js')}}"></script>
<script src="{{ asset('lib/js/google-autocomplete.js')}}"></script>

<script type="text/javascript"
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDNkil3rKocVoPtfM-_-NuoApPY24yR4RU&libraries=places&callback=init&language={{ app.request.locale }}">
</script>
{% endblock %}