{% extends 'base.html.twig' %}
{% import 'User/Collectivity/_form.html.twig' as formMacros %}

{% set bodyClass = 'user_collectivity user_profile_collectivity form edit' %}
{% set menuItem = 'user_profile_collectivity' %}
{% set submitValue = submitValue|default('user.organization.action.my_organization_submit'|trans) %}

{% block title %}{{ 'user.organization.title.my_organization_edit'|trans }} - {{ parent() }}{% endblock %}

{% block body_head %}
    <h1>
        {{ 'user.organization.title.my_organization_edit'|trans }}
        <small>{{ form.vars.value }}</small>
    </h1>
{% endblock %}

{% block breadcrumb %}
    {% set breadcrumb = [
        { 'name': 'user.organization.breadcrumb.my_organization_show'|trans, 'link': path('user_profile_collectivity_show') },
        { 'name': 'user.organization.breadcrumb.my_organization_edit'|trans }

    ] %}
    {% include '_breadcrumb.html.twig' with {'breadcrumb': breadcrumb} %}
{% endblock %}

{% block body %}
<div class="row">
    {{ form_start(form) }}

    {# LEFT #}
    <div class="col-md-6">
        {# GENERAL #}
        <div class="box box-solid">
            <div class="box-header with-border"><h3 class="box-title">{{ 'global.tab.general'|trans }}</h3></div>
            <div class="box-body">
                {% if is_granted('ROLE_ADMIN') %}
                    {{ form_row(form.name) }}
                    {{ form_row(form.shortName) }}
                    {{ form_row(form.type) }}
                    {{ form_row(form.siren) }}
                    {{ form_row(form.finessGeo) }}
                    <!-- L'option du statut ne derait pas être présente dans sa structure, car ça bloquerait l'utilisateur, cependant, l'option s'affiche à la fin du formulaire si le champ n'est pas présent. -->
                    {{ form_row(form.active) }}
                {% endif %}
                {{ form_row(form.website) }}
                {{ form_row(form.nbrAgents) }}
                {{ form_row(form.population) }}
                {% if is_granted('ROLE_ADMIN') %}
                    {{ form_row(form.informationsComplementaires) }}
                {% endif %}
            </div>
        </div>
            {# ADDRESS #}
            <div class="box box-solid">
                <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.tab.address'|trans }}</h3></div>
                <div class="box-body">
                    {{ form_widget(form.address) }}
                </div>
            </div>

            {% if is_granted('ROLE_ADMIN') %}

            {# MODULES #}
            <div class="box box-solid">
                <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.tab.modules'|trans }}</h3></div>
                <div class="box-body">
                    {{ form_row(form.hasModuleTools) }}
                    {{ form_row(form.hasModuleConformiteTraitement) }}
                    {{ form_row(form.hasModuleConformiteOrganisation) }}
                    {{ form_row(form.isServicesEnabled) }}
                </div>
            </div>

            {# SERVICES TODO #}
            {% do form.services.setRendered() %}
            <div class="box box-solid" id="box-services">
                <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.label.has_module_services'|trans }}</h3></div>
                <div class="box-body">
                    <div class="js-collection-wrapper"
                        data-prototype="{{ formMacros.printService(form.services.vars.prototype)|e('html_attr') }}"
                        data-index="{{ form.services|length }}">
                            {% for service in form.services %}
                                {{ formMacros.printService(service) }}
                            {% endfor %}
                        <button id="add-services" class="js-collection-add btn btn-default">
                            <i aria-hidden="true" class="fa fa-plus"></i> {{ 'user.organization.label.service_add'|trans }}
                        </button>
                    </div>
                </div>
            </div>
        {% endif %}

        {# BILAN #}
        <div class="box box-solid">
            <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.tab.bilan'|trans }}</h3></div>
            <div class="box-body">
                {{ form_widget(form.reviewData) }}
                {# REPORTING MANAGEMENT COMMITMENT #}
                {{ form_row(form.reportingBlockManagementCommitment) }}
                {# REPORTING CONTINUOUS IMPROVEMENT #}
                {{ form_row(form.reportingBlockContinuousImprovement) }}
            </div>
        </div>
    </div>

    {# RIGHT #}
    <div class="col-md-6">
        {# LEGAL MANAGER #}
        <div class="box box-solid">
            <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.tab.legal_manager'|trans }}</h3></div>
            <div class="box-body">
                {{ form_widget(form.legalManager) }}
            </div>
        </div>

        {# DPO #}
        <div id="box-dpo" class="box box-solid">
            <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.tab.dpo'|trans }}</h3></div>
            <div class="box-body">
                {{ form_row(form.nbrCnil) }}
                {{ form_row(form.differentDpo) }}
                {{ form_widget(form.dpo) }}
            </div>
        </div>

        {# REFERENT #}
        <div class="box box-solid">
            <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.tab.referent'|trans }}</h3></div>
            <div class="box-body">
                {{ form_widget(form.referent) }}
            </div>
        </div>

        {# IT MANAGER #}
        <div id="box-it-manager" class="box box-solid">
            <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.tab.it_manager'|trans }}</h3></div>
            <div class="box-body">
                {{ form_row(form.differentItManager) }}
                {{ form_widget(form.itManager) }}
            </div>
        </div>

        {# COMITE IL CONTACT #}
        {% do form.comiteIlContacts.setRendered() %}
        <div class="box box-solid">
            <div class="box-header with-border"><h3 class="box-title">{{ 'user.organization.tab.comite_il'|trans }}</h3></div>
            <div class="box-body">
                <div class="js-collection-wrapper"
                     data-prototype="{{ formMacros.printComiteIlContact(form.comiteIlContacts.vars.prototype)|e('html_attr') }}"
                     data-index="{{ form.comiteIlContacts|length }}"
                >
                    {% for contact in form.comiteIlContacts %}
                        {{ formMacros.printComiteIlContact(contact) }}
                    {% endfor %}
                    <button class="js-collection-add btn btn-default">
                        <i aria-hidden="true" class="fa fa-plus"></i> {{ 'user.organization.label.comite_il_add'|trans }}
                    </button>
                </div>
            </div>
        </div>

        {# prevents weird label from showing up in new #}
        {# {{ form_widget(form.comiteIlContacts) }}#}
    </div>

    <div class="col-md-12">
        <div class="box box-solid">
            <div class="box-body text-center">
                <a href="{{ path('user_collectivity_list') }}" class="btn btn-default">
                    {{ 'user.organization.action.back_to_show'|trans }}
                </a>
                <input type="submit" class="btn btn-primary" value="{{ submitValue }}">
            </div>
        </div>
    </div>

    {{ form_end(form) }}
</div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}

    {{ encore_entry_script_tags('js/collectionManager') }}

    <script>
        $(document).ready(function(){
            if ($('#collectivity_differentDpo').is(':checked')){
                $("#collectivity_dpo_civility").attr("required", "true");
                $("#collectivity_dpo_firstName").attr("required", "true");
                $("#collectivity_dpo_lastName").attr("required", "true");
                $("#collectivity_dpo_job").attr("required", "true");
                $("#collectivity_dpo_mail").attr("required", "true");
                $("#collectivity_dpo_phoneNumber").attr("required", "true");
            }
            {% if object.reviewData and object.reviewData.logo %}
            $("#collectivity_reviewData_logo").after('<div style="margin-top:1em"><img height="80" src="{{ object.reviewData.logo }}" /><button id="setDeleteLogo" class="btn btn-link"><i aria-hidden="true" class="fa fa-trash"></i> Supprimer le logo</button></div>')
            $("body").on('click', '#setDeleteLogo', function(ev) {
                ev.preventDefault()
                $(ev.target).parent().remove()
                $('#collectivity_reviewData_deleteLogo').val(1);
            })
            {% endif %}

            $("#collectivity_reviewData_logo").after('<p aria-describedby="collectivity_reviewData_logo" class="callout callout-default text-muted" style="margin-top: 1em">{{ 'documentation.document.form.help.thumbnail' | trans({'max_size': app_max_upload_size}) }}</p>')


            $('#collectivity_differentDpo').on('change', function(){
                if ($('#collectivity_differentDpo').is(':checked')){
                    $("#collectivity_dpo_civility").prop("required", "true");
                    $("#collectivity_dpo_firstName").prop("required", "true");
                    $("#collectivity_dpo_lastName").prop("required", "true");
                    $("#collectivity_dpo_job").prop("required", "true");
                    $("#collectivity_dpo_mail").prop("required", "true");
                    $("#collectivity_dpo_phoneNumber").prop("required", "true");
                }
                else {
                    $("#collectivity_dpo_civility").prop("required", false);
                    $("#collectivity_dpo_firstName").prop("required", false);
                    $("#collectivity_dpo_lastName").prop("required", false);
                    $("#collectivity_dpo_job").prop("required", false);
                    $("#collectivity_dpo_mail").prop("required", false);
                    $("#collectivity_dpo_phoneNumber").prop("required", false);
                }
            })
        })
    </script>
{% endblock %}