{% extends "./layout/default.twig" %}
{% block content %}
    {{ Breadcrumbs.renderIfExists(Route.getCurrentRoute.getName, what) }}
    {{ Form.open({'class' : 'form-horizontal','id' : 'store','url' : route('transactions.store',what)}) }}
    <input type="hidden" name="reminder_id" value="{{ Input.get('reminder_id') }}" />
    <input type="hidden" name="what" value="{{ what }}" />
    <div class="row">
        <div class="col-lg-6 col-md-12 col-sm-12">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <i class="fa fa-exclamation-circle"></i> {{ 'mandatoryFields'|_ }}
                </div>
                <div class="panel-body">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">Quickswitch</label>
                            <div class="col-sm-8">
                                <div class="btn-group btn-group-justified">
                                    <a href="#" data-what="withdrawal" class="switch btn btn-default"> {{ 'withdrawal'|_ }}</a>
                                    <a href="#" data-what="deposit" class="switch btn btn-default"> {{ 'deposit'|_ }}</a>
                                    <a href="#" data-what="transfer" class="switch btn btn-default">{{ 'transfer'|_ }}</a>
                                </div>
                            </div>
                    </div>


                    <!-- DESCRIPTION ALWAYS AVAILABLE -->
                    {{ ExpandedForm.text('description') }}

                    <!-- ACCOUNT ONLY FOR DEPOSITS AND WITHDRAWALS -->
                    {{ ExpandedForm.select('account_id',accounts) }}


                    <!-- SHOW EXPENSE ACCOUNT ONLY FOR WITHDRAWALS -->
                    {{ ExpandedForm.text('expense_account') }}

                    <!-- SHOW REVENUE ACCOUNT ONLY FOR DEPOSITS -->
                    {{ ExpandedForm.text('revenue_account') }}


                    <!-- ONLY SHOW FROM/TO ACCOUNT WHEN CREATING TRANSFER -->
                    {{ ExpandedForm.select('account_from_id',accounts) }}
                    {{ ExpandedForm.select('account_to_id',accounts) }}


                    <!-- ALWAYS SHOW AMOUNT -->
                    {{ ExpandedForm.amount('amount') }}

                    <!-- ALWAYS SHOW DATE -->
                    {{ ExpandedForm.date('date', phpdate('Y-m-d')) }}
                </div>
            </div>
        </div>
        <div class="col-lg-6 col-md-12 col-sm-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <i class="fa fa-smile-o"></i> {{ 'optionalFields'|_ }}
                </div>
                <div class="panel-body">
                    <!-- BUDGET ONLY WHEN CREATING A WITHDRAWAL -->
                    {{ ExpandedForm.select('budget_id',budgets,0) }}
                    <!-- CATEGORY ALWAYS -->
                    {{ ExpandedForm.text('category') }}

                    <!-- TAGS -->
                    {{ ExpandedForm.text('tags') }}


                    <!-- RELATE THIS TRANSFER TO A PIGGY BANK -->
                    {{ ExpandedForm.select('piggy_bank_id',piggies) }}
                </div>
            </div>

            <!-- panel for options -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <i class="fa fa-bolt"></i> {{ 'options'|_ }}
                </div>
                <div class="panel-body">
                    {{ ExpandedForm.optionsList('create','transaction') }}
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <p>
                <button type="submit" id="transaction-btn" class="btn btn-lg btn-success">
                    <i class="fa fa-plus-circle"></i> {{ trans('form.store_new_'~what) }}
                </button>
            </p>
        </div>
    </div>
</form>

{% endblock %}
{% block scripts %}
    <script type="text/javascript">
        var what = "{{ what }}";
        var piggiesLength = {{ piggies|length }};
        var doSwitch = true;

        // some titles and names:
        var txt = [];
        var title = [];
        var breadcrumbs = [];
        var middleCrumbName = [];
        var middleCrumbUrl = [];
        var button = [];
        {% for type in {0:'withdrawal',1:'deposit',2:'transfer'} %}

        txt['{{ type }}'] = '{{ type|_ }}';
        title['{{ type }}'] = '{{ trans('form.add_new_' ~ type) }}';
        breadcrumbs['{{ type }}'] = '{{ trans('breadcrumbs.create_' ~ type) }}';
        middleCrumbName['{{ type }}'] = '{{ trans('breadcrumbs.' ~ type ~ '_list') }}';
        middleCrumbUrl['{{ type }}'] = '{{ route('transactions.index', type) }}';
        button['{{ type }}'] = '{{ trans('form.store_new_' ~ type) }}';
        {% endfor %}

    </script>
    <script type="text/javascript" src="js/bootstrap3-typeahead.min.js"></script>
    <script type="text/javascript" src="js/bootstrap-tagsinput.min.js"></script>
    <script type="text/javascript" src="js/transactions.js"></script>
{% endblock %}

{% block styles %}
    <link href="css/bootstrap-tagsinput.css" type="text/css" rel="stylesheet" media="all">
{% endblock %}