{#
/**
 * Copyright © 2003-2024 The Galette Team
 *
 * This file is part of Galette (https://galette.eu).
 *
 * Galette is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * Galette is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *  GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with Galette. If not, see <http://www.gnu.org/licenses/>.
 */
#}
{% if object.getDynamicFields() is not empty %}
    {% set fields = object.getDynamicFields().getFields() %}
    {% set masschange = masschange ?? false %}

    {% if fields is not empty %}

        {% macro draw_field(field, field_data, disabled, loop, object, masschange) %}
            {% set valuedata = field_data.field_val|escape %}
            {% if get_class(field) == 'Galette\\DynamicFields\\File' %}
                <label>{{ field.getName()|escape }}</label>
            {% else %}
                <label for="info_field_{{ field.getId() }}_{{ loop }}">
                    {% if masschange %}
                        {# Add a checkbox for fields to change on mass edition #}
                        <input type="checkbox" name="mass_info_field_{{ field.getId() }}" class="mass_checkbox"/>
                    {% endif %}
                    {{ field.getName()|escape }}
                </label>
            {% endif %}
            {% if field.getInformation() and field.hasInformationAbove() %}
                <div class="exemple">{{ field.getInformation()|raw }}</div>
            {% endif %}
            {% if get_class(field) == 'Galette\\DynamicFields\\Text' %}
                <textarea name="info_field_{{ field.getId() }}_{{ loop }}" id="info_field_{{ field.getId() }}_{{ loop }}"
                    cols="{% if field.getWidth() > 0 %}{{ field.getWidth() }}{% else %}61{% endif %}"
                    rows="{% if field.getHeight() > 0 %}{{ field.getHeight() }}{% else %}6{% endif %}"
                    {% if field.isRepeatable() %} data-maxrepeat="{{ field.getRepeat() }}"{% endif %}
                {% if not masschange %}
                    {% if field.isRequired() %} required="required"{% endif %}
                {% endif %}
                    {% if disabled %} disabled="disabled"{% endif %}>{{ valuedata|raw }}</textarea>
            {% elseif get_class(field) == 'Galette\\DynamicFields\\Line' %}
                <input type="text" name="info_field_{{ field.getId() }}_{{ loop }}" id="info_field_{{ field.getId() }}_{{ loop }}"
                    {% if field.getWidth() > 0 %}size="{{ field.getWidth() }}"{% endif %}
                    {% if field.getSize() > 0 %}maxlength="{{ field.getSize() }}"{% endif %}
                    {% if field.getMinSize() > 0 %}minlength="{{ field.getMinSize() }}"{% endif %}
                    value="{{ valuedata|raw }}"
                {% if not masschange %}
                    {% if field.isRequired() %} required="required"{% endif %}
                {% endif %}
                    {% if field.isRepeatable() or field.getRepeat() == 0 %}data-maxrepeat="{{ field.getRepeat() }}"{% endif %}
                    {% if disabled %} disabled="disabled"{% endif %}
                />
            {% elseif get_class(field) == 'Galette\\DynamicFields\\Choice' %}
                <select name="info_field_{{ field.getId() }}_{{ loop }}" id="info_field_{{ field.getId() }}_{{ loop }}"
                {% if not masschange %}
                    {% if field.isRequired() %} required="required"{% endif %}
                {% endif %}
                    {% if field.isRepeatable() %} data-maxrepeat="{{ field.getRepeat() }}"{% endif %}
                    {% if disabled %} disabled="disabled"{% endif %}
                    >
                    <!-- If no option is present, page is not XHTML compliant -->
                    <option value="">{{ _T("Select an option") }}</option>
                    {% for key, value in field.getValues() %}
                        <option value="{{ key }}"{% if key == valuedata %} selected="selected"{% endif %}>{{ value }}</option>
                    {% endfor %}
                </select>
            {% elseif get_class(field) == 'Galette\\DynamicFields\\Date' %}
                <div id="dynamic_date_{{ field.getId() }}_rangestart" class="ui calendar">
                    <div class="ui fluid input left icon">
                        <i class="calendar icon" aria-hidden="true"></i>
                        <input type="text" name="info_field_{{ field.getId() }}_{{ loop }}" id="info_field_{{ field.getId() }}_{{ loop }}" maxlength="10"
                            value="{{ valuedata }}" class="dynamic_date modif_date" placeholder="{{ _T("yyyy-mm-dd format") }}"
                            {% if field.isRepeatable() %} data-maxrepeat="{field.getRepeat()}"{% endif %}
                        {% if not masschange %}
                            {% if field.isRequired() %} required="required"{% endif %}
                        {% endif %}
                            {% if disabled %} disabled="disabled"{% endif %}
                        />
                    </div>
                </div>
            {% elseif get_class(field) == 'Galette\\DynamicFields\\Boolean' %}
                <div class="ui toggle checkbox">
                    <input type="checkbox" name="info_field_{{ field.getId() }}_{{ loop }}" id="info_field_{{ field.getId() }}_{{ loop }}" value="1"
                        {% if valuedata == 1%} checked="checked"{% endif %}
                        {% if field.isRepeatable() %} data-maxrepeat="{{ field.getRepeat() }}"{% endif %}
                    {% if not masschange %}
                        {% if field.isRequired() %} required="required"{% endif %}
                    {% endif %}
                        {% if disabled %} disabled="disabled"{% endif %}
                    />
                </div>
            {% elseif get_class(field) == 'Galette\\DynamicFields\\File' %}
                {% if object.id and valuedata %}
                <a href="{{ url_for("getDynamicFile", {"form_name": object.getFormName(), "id": object.id, "fid": field.getId(), "pos": loop, "name": valuedata}) }}">
                    {{ valuedata }}
                    <i class="external alternate icon" aria-hidden="true"></i>
                </a>
                {% endif %}
                <div class="extra ui basic fitted segment">
                    <div class="ui file action input">
                        <input
                            type="file"
                            name="info_field_{{ field.getId() }}_{{ loop }}"
                            id="info_field_{{ field.getId() }}_{{ loop }}_new"
                            {% if field.isRequired() and valuedata == '' %} required="required"{% endif %}
                            {% if disabled %} disabled="disabled"{% endif %}
                        />
                        <label for="info_field_{{ field.getId() }}_{{ loop }}_new" class="ui button">
                            <i class="blue upload icon" aria-hidden="true"></i>
                            {% if object.id and valuedata %}{{ _T("Choose another file") }}{% else %}{{ _T("Choose a file") }}{% endif %}
                        </label>
                    </div>
                </div>
                {% if object.id and valuedata %}
                <div class="extra ui basic fitted segment">
                    <div class="ui toggle checkbox">
                        <input
                            type="checkbox"
                            name="info_field_{{ field.getId() }}_{{ loop }}"
                            id="info_field_{{ field.getId() }}_{{ loop }}_delete"
                            onclick="this.form.info_field_{{ field.getId() }}_{{ loop }}_new.disabled = this.checked;"
                        />
                        <label class="labelalign" for="info_field_{{ field.getId() }}_{{ loop }}_delete">
                            {{ _T("delete") }}
                        </label>
                    </div>
                </div>
                {% endif %}
            {% endif %}
            {% if field.getInformation() and not field.hasInformationAbove() %}
                <div class="exemple">{{ field.getInformation()|raw }}</div>
            {% endif %}
        {% endmacro %}

        <div class="ui styled fluid accordion field">
            <div class="active title">
                <i class="jsonly displaynone icon dropdown" aria-hidden="true"></i>
                {{ _T("Additionnal fields:") }}
            </div>
            <div class="active content field">
                <div class="ui{% if preferences.pref_member_form_grid is defined %} {{ preferences.pref_member_form_grid }}{% endif %} column stackable grid">
                {% set access_level = login.getAccessLevel() %}
                {% for field in fields %}
                    {% set perm = field.getPermission() %}
                    {% if get_class(field) == 'Galette\\DynamicFields\\Separator' %}
                    <div class="sixteen wide column">
                        <div class="ui horizontal divider">{{ field.getName()|escape }}</div>
                    </div>
                    {% elseif (get_class(field) == 'Galette\\DynamicFields\\File' or field.isRepeatable()) and masschange %}
                        <!-- File and repeatable fields not shown in mass changes form -->
                    {% else %}
                        {% set disabled = false %}
                        {% if perm == constant('Galette\\Entity\\FieldsConfig::USER_READ') and access_level == constant('Galette\\Core\\Authentication::ACCESS_USER') %}
                            {% set disabled = true %}
                        {% endif %}
                        {% set values = object.getDynamicFields().getValues(field.getId()) %}
                        {# set can_add = false %}
                        {% if field.getRepeat() == 0 or values is not iterable or values|length < field.getRepeat() or values|length == 0 %}
                            {% set can_add = true %}
                        {% endif #}
                        {% if get_class(field) == 'Galette\\DynamicFields\\File' or (field.isRepeatable() and field.getRepeat() > 1) or (field.isMultiValued() and field.getRepeat() == 0) %}
                          {% set columns = 'sixteen wide ' %}
                        {% elseif field.getWidthInForms() == 1 or (preferences.pref_member_form_grid == 'two' and field.getWidthInForms() == 3) %}
                          {% set columns = '' %}
                        {% else %}
                          {% set columns = (field.getWidthInForms() == 3) ? 'eight wide ' : 'sixteen wide ' %}
                        {% endif %}
                        <div class="
                            {% if get_class(field) == 'Galette\\DynamicFields\\File' or (field.isRepeatable() and field.getRepeat() > 1) or (field.isMultiValued() and field.getRepeat() == 0) %}
                               repetable {% endif %}{{ columns }}column">
                            {% for field_data in values %}
                                <div class="field{% if field.isRequired() %} required{% endif %}{% if get_class(field) == 'Galette\\DynamicFields\\File' %} wide{% endif %}">
                                    {{ _self.draw_field(field, field_data, disabled, loop.index, object, masschange) }}
                                </div>
                            {% endfor %}
                            {% if values is not iterable or values|length == 0 %}
                                {% set field_data = {'field_val': ''} %}
                                {% if values is iterable %}
                                    {% set current_count = values|length %}
                                {% else %}
                                    {% set current_count = 0 %}
                                {% endif %}
                                {{ _self.draw_field(field, field_data, disabled, current_count + 1, object, masschange) }}
                            {% endif %}
                            {% if field.isRepeatable() %}
                                {% if field.getRepeat() == 0 %}
                                    <p class="exemple" id="repeat_msg">{{ _T("Enter as many occurrences you want.") }}</p>
                                {% elseif values is not iterable or values|length < field.getRepeat() or values|length == 0 %}
                                    {% if values is iterable %}
                                        {% set current_count = values|length %}
                                    {% else %}
                                        {% set current_count = 1 %}
                                    {% endif %}
                                    {% set remaining = field.getRepeat() - current_count %}
                                    <p class="exemple" id="repeat_msg">{{ _T("Enter up to %count more occurrences.")|replace({"%count": remaining}) }}</p>
                                {% endif %}
                            {% endif %}
                        </div>
                    {% endif %}
                {% endfor %}
                </div>
            </div>
        </div>
        {% if not masschange %}
            <script type="text/javascript">
                var _addLnk = function(){
                    return $('<a class="ui tiny green labeled icon button" href="#"><i class="plus icon" aria-hidden="true"></i> {{ _T("Add") }}</a>');
                };

                var _lnkEvent = function(_a, _input, _parent) {
                    var _vals = _input[0].id.split(/_/);
                    var _total = $(_input[0]).data('maxrepeat'); //max number of occurrences
                    var _current = _vals[_vals.length-1]; //current occurrence

                   _a.click(function(e) {
                        var _new = _input.clone();

                        var _id = '';

                        for ( var i = 0 ; i < _vals.length -1 ; i++ ) {
                            _id += _vals[i] + '_';
                        }

                        _current = Number(_current) + 1;
                        _new.attr('id', _id + _current);
                        _new.attr('name', _id + _current);
                        _new.val('');
                        _a.remove();
                        _parent.append(_new);
                        _parent.append('<br/><br/>');
                        _new.focus();
                        if( _total == '0' || _current < _total ) {
                            var _b = _addLnk();
                            _lnkEvent(_b, _new, _parent);
                            _parent.append(_b);
                            if (_current < _total) {
                                $('#repeat_msg').html('{{ _T("Enter up to %count more occurrences.")|replace({"%count": "COUNT"})|e('js') }}'.replace(/COUNT/, _total - _current));
                            }
                        } else if (_current == _total) {
                            $('#repeat_msg').remove();
                        }
                        return false;
                    });
                }

                $(function(){
                    $('.repetable').each(function(){
                        var _total;
                        var _current;
                        var _parent = $(this);

                        var _input = $(this).find('.field:last input');
                        if ( _input.length > 0 ) {
                            while ( $(this).find('.field').length > 1 && _input.val() == '' ) {
                                _input.remove();
                                _input = $(this).find('.field:last input')
                            }
                            var _vals = _input[0].id.split(/_/);
                            var _total = $(_input[0]).data('maxrepeat'); //max number of occurrences
                            var _current = _vals[_vals.length-1]; //current occurrence

                            if ( _total == '0' || _current < _total ) {
                                var _a = _addLnk();
                                $(this).append(_a);
                                _lnkEvent(_a, _input, _parent);
                            }
                        }
                    });
                });
            </script>
        {% endif %}
    {% endif %}
{% endif %}
