{% extends 'AdminBundle::layout.html.twig' %}
{% block body %}
    <h2>Administration d'un projet</h2>
    <form action="{{ path('admin_project_create') }}" method="post" enctype="multipart/form-data">
        <div class="row">
            <div class="col-lg-20">
                {{ form_row(form.slug) }}
            </div>
        </div>
        <div class="row">
            <div class="col-lg-15">
                {{ form_row(form.company) }}
            </div>
            <div class="col-lg-5">
                {{ form_row(form.year) }}
            </div>
        </div>
        <div class="row">
            <div class="col-lg-10">
                {{ form_row(form.picture) }}
            </div>
            <div class="col-lg-10">
                {{ form_row(form.animation) }}
            </div>
        </div>
        <div class="row">
            <div class="col-lg-20">
                {{ form_row(form.video) }}
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                {{ form_row(form.categories) }}
            </div>
            <div class="col-lg-8">
                {{ form_label(form.color) }}
                <div class="input-group">
                    <span class="input-group-addon">#</span>
                    {{ form_widget(form.color) }}
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-8">
                {{ form_row(form.siblings) }}
            </div>
        </div>
        <h4>Traductions</h4>
        <div id="translations" class="row">
            <div class="col-lg-1"></div>
            <div class="col-lg-19">
                {% for translation in form.translations %}
                    <div class="row">
                        <div class="col-lg-20">
                            <div class="row">
                                <div class="col-lg-8">
                                    {{ form_row(translation.language) }}
                                </div>
                                <div class="col-lg-12">
                                    {{ form_row(translation.title) }}
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-20">
                                    {{ form_label(translation.description) }}
                                    {{ form_widget(translation.description, {'attr':{'class':'tinymce'}}) }}
                                </div>
                            </div>
                            <h4>Crédits</h4>
                            <div class="row">
                                <div class="col-lg-1"></div>
                                <div
                                        id="credits-{{ loop.index }}"
                                        class="col-lg-19 credits"
                                        data-index="{{ loop.index }}"
                                        data-prototype="{% filter escape %}{{ include('AdminBundle:Project:credit-form.html.twig', {'credit': translation.credits.vars.prototype} ) }}{% endfilter %}"
                                        >
                                    {% for credit in translation.credits %}
                                        {% include 'AdminBundle:Project:credit-form.html.twig' with {'credit': credit} %}
                                    {% endfor %}
                                    <a class="add-credit btn btn-success" style="margin: 5px 0;">
                                        <span class="glyphicon glyphicon-plus-sign"></span>
                                        crédit
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                    {% if not loop.last %}
                        <hr/>
                    {% endif %}
                {% endfor %}
            </div>
        </div>
        <div class="row">
            <div class="col-lg-15">
                {{ form_row(form._token) }}
            </div>
            <div class="col-lg-5">
                <button class="btn btn-info" type="submit">
                    Créer
                </button>
            </div>
        </div>
    </form>
{% endblock %}
{% block javascripts %}
    {{ tinymce_init() }}
    <script type="text/javascript">
        $(document).ready(function() {

            $('.add-credit').bind('click', function(e) {
                e.preventDefault();

                var parent = $(this).parent();
                addForm($('#' + parent.attr('id')), parent.data('index'));
            });


            function addForm($collectionHolder, transIndex) {
                // Get the data-prototype explained earlier
                var prototype = $collectionHolder.data('prototype');

                // get the new index
                var crIndex = $collectionHolder.find('.credit').length;

                // Replace '__name__' in the prototype's HTML to
                // instead be a number based on how many items we have
                var newForm = prototype.replace(/__translation_name__/g, transIndex);
                newForm = prototype.replace(/__credit_name__/g, crIndex);


                // Display the form in the page in an li, before the "Add a tag" link li
                $collectionHolder.append(newForm);
            }

        });
    </script>
{% endblock %}
