{% extends "MopaBootstrapSandboxBundle::layout.html.twig" %}
{% from 'MopaBootstrapBundle::flash.html.twig' import session_flash %}
{% form_theme form _self %}

{% block example_date_widget %}
{# block to create the example_date_widget from ExamleDateType #}
    <div>
    {{ form_widget(form.startAt) }} - {{ form_widget(form.endAt) }}
    </div>
    <div>
    {{ form_widget(form.special) }} {{ form_rest(form) }}
    </div>
{% endblock %}

{% block date_widget %}
    {% if widget == 'single_text' %}
        {{ block('field_widget') }}
    {% else %}
          {% set attr = attr|merge({'class': attr.class|default('')}) %}
            {{ date_pattern|replace({
                '{{ year }}':  form_widget(form.year, {'attr': {'class': attr.widget_class|default('') ~ ' input-mini'}}),
                '{{ month }}': form_widget(form.month, {'attr': {'class': attr.widget_class|default('') ~ ' input-small'}}),
                '{{ day }}':   form_widget(form.day, {'attr': {'class': attr.widget_class|default('') ~ ' input-mini'}}),
            })|raw }}
          {{ block('help') }}
    {% endif %}
{% endblock date_widget %}

{% block headline %}Collection Forms{% endblock headline %}

{% block content %}
<div class="span6">
    <form class="form-horizontal" id="your_form_name" method="post">
        {{ form_widget(form) }}
        <div class="form-actions">
            <button type="submit" class="btn btn-primary">Save changes</button>
            <button type="reset" class="btn">Cancel</button>
        </div>
    </form>
    <div class="row-fluid">
        <div class="span6">
         <h3>Button Icons</h3>
             <p>To make use of the button icons you can either apply them in the FormType:</p>

              <pre class="prettyprint">
$builder
    ->add('nice_email_collection','collection', array(
        'widget_add_btn' => array(
            'icon' => 'plus-sign',
            'label' => 'add email'
         ),
    ))
    ;
             </pre>
        </div>
        <div class="span6">
             <p>Or configure them globally:</p>

              <pre class="prettyprint">
mopa_bootstrap:
    form:
        collection:
            widget_remove_btn:
                icon: trash
                icon_color: white
            widget_add_btn:
                icon: plus-sign
             </pre>
             <p>And if configured globally you can override them again in the FormType!</p>
        </div>
    </div>
</div>
<div class="span6">
      <h3>Easy use of collections</h3>
      <p>We often saw probs when using collection, so we added some code to ease the use</p>
      <p>Please review your javascript includes, we provide a new mopabotstrap-collection.js<p>
      <p>Include it in your layout, or per page, as you like.<p>
      <p>For an easy collection with e.g. just a bunch of mail adresses just add the collection to your form</p>

      <p>An example: to generate nice inputs with icons you dont write one line of html:</p>
      <pre class="prettyprint">
$builder
    ->add('nice_email_collection','collection', array(
        'type' => 'email',
        'allow_add' => true,
        'allow_delete' => true,
        'prototype' => true,
        'widget_add_btn' => array('label' => 'add email', 'attr' => array('class' => 'btn btn-primary')),
        'options' => array( // options for collection fields
            'widget_remove_btn' => array('label' => 'remove', 'attr' => array('class' => 'btn btn-primary')),
            'attr' => array('class' => 'span3'),
            'widget_addon' => array(
                'type' => 'prepend',
                'text' => '@',
            ),
            'widget_control_group' => false,
        )
    ))
    ;
</pre>
<p>And in your markup you just need one line: </p>
<pre class="prettyprint">
{% raw %}
      &lt;form class=&quot;form-horizontal&quot;&gt;
        {{ form_widget(form) }}
      &lt;/form&gt;
{% endraw %}
</pre>
</div>
{% endblock content %}

{% set showTemplate = _self %}{% set showForm = formType %}