{% extends 'base.html.twig' %}
{% set displayFooter = true %}
{% set currentLocal = app.request.locale %}
{% set countryUrl = app.request.attributes.get('_country') %}

{% block body %}
<section class="page-avis">
    <div class="container">
        <div class="header-avis">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item green"><a href="{{ absolute_url(customPath('main_home')) }}">{{'home'|trans}}</a></li>
                    <li class="breadcrumb-item" aria-current="page" >{{'opinion.avis_bread'|trans}}</li>
                </ol>
            </nav>
            <h1>{{'opinion.avis'|trans}} <small>{{'opinion.avis_valide'|trans}}</small></h1>
            <div class="d-flex justify-content-start">
                <a class="avis-item" href="{{ absolute_url(customPath('main_particular_partner_opinion')) }}"> {{'opinion.avis_archi_partenaires'|trans}} </a>
                <a class="avis-item active-color" href="{{ absolute_url(customPath('main_leader_opinion')) }}"> {{'opinion.avis_archi_porteur'|trans}} </a>
                <a class="avis-item" href="{{ absolute_url(customPath('main_write_opinion')) }}"> {{'opinion.avis_write'|trans}} </a>
            </div>
        </div>
    </div>
</section>
<section class="section-avis">
    <div class="container">
        <div class="avis-part1 row request_content">
            {% for opinion in opinions %}
            <div class="col-md-4">
                <div class="avis">
                    <div class="d-flex justify-content-end stars" >
                        {% for i in 1..opinion.stars %}
                            <i class="fa fa-star checked" aria-hidden="true"></i>
                        {% endfor %}
                        {% if opinion.stars != 5 %}
                            {% for i in 1..5-opinion.stars %}
                                <i class="fa fa-star checked unchecked" aria-hidden="true"></i>
                            {% endfor %}
                        {% endif %}
                    </div>
                    <div class="content-avis">
                        {{opinion.currentTranslation.description|raw}}
                    </div>
                    <div class="d-flex justify-content-end avis-name">
                        {{opinion.name}}
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
        <div class="navigation">
                {{ knp_pagination_render(opinions) }}
        </div>

    </div>
</section>
<section class="avis-part2 porteur">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                {{'opinion.less_than_3'|trans|raw}}
            </div>
            <div class="col-md-8 offset-md-2">
                <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.defaultLanguage.locale == 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>
                    <div class="row">
                        <div class="offset-md-8 col-md-4"><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>
</section>
{% endblock %}

{% block javascripts %}
<script>
    $( document ).ready(function() {
        $("select.countries").change(function(){
            var selectedCountry = $(this).children("option:selected");
            document.location = selectedCountry.data('action')
        });
    }); 
    var countryAutoComp = {{currentCountry|raw}};
    function init() {
        activatePlacesSearch();
    }
</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 %}