{% import '_includes/forms' as forms %}

<div id="neo-configurator" class="neo-configurator">
    {{ forms.field({
        label: "Configuration"|t('neo'),
        instructions: "Define the types of blocks that can be created within this Neo field, as well as the fields each block type is made up of."|t('neo'),
        name: 'config',
    }) }}
</div>

{% if craft.app.getIsMultiSite() %}
    {{ forms.selectField({
        label: 'Propagation Method' | t('neo'),
        instructions: 'Which sites should blocks be saved to?' | t('neo'),
        id: 'propagationMethod',
        name: 'propagationMethod',
        options: [
            { value: 'none', label: 'Only save blocks to the site they were created in' | t('neo') },
            { value: 'siteGroup', label: 'Save blocks to other sites in the same site group' | t('neo') },
            { value: 'language', label: 'Save blocks to other sites with the same language' | t('neo') },
            { value: 'all', label: 'Save blocks to all sites the owner element is saved in' | t('neo') },
        ],
        value: neoField.propagationMethod
    }) }}

    {% if neoField.id and neoField.propagationMethod != 'none' %}
        {% js %}
            (function() {
                var showingWarning = false;
                $("#{{ 'propagationMethod'|namespaceInputId }}").on('change', function() {
                    if ($(this).val() !== '{{ neoField.propagationMethod }}') {
                        if (!showingWarning) {
                            $('<p/>', {'class': 'warning', text: "{{ 'Applying this change to existing blocks can take some time.'|t('app')|e('js') }}"})
                                .appendTo($("#{{ 'propagationMethod-field'|namespaceInputId }}"));
                            showingWarning = true;
                        }
                    } else if (showingWarning) {
                        $("#{{ 'propagationMethod-field'|namespaceInputId }} .warning").remove();
                        showingWarning = false;
                    }
                });
            })();
        {% endjs %}
    {% endif %}
{% endif %}

{{ forms.textField({
    label: "Min Blocks"|t('neo'),
    instructions: "The minimum number of blocks the field must have."|t('neo'),
    id: 'minBlocks',
    name: 'minBlocks',
    value: neoField.minBlocks,
    size: 3,
    errors: neoField.getErrors('minBlocks'),
}) }}

{{ forms.textField({
    label: "Max Blocks"|t('neo'),
    instructions: "The maximum number of blocks the field is allowed to have."|t('neo'),
    id: 'maxBlocks',
    name: 'maxBlocks',
    value: neoField.maxBlocks,
    size: 3,
    errors: neoField.getErrors('maxBlocks'),
}) }}

{{ forms.textField({
    label: "Max Top-Level Blocks"|t('neo'),
    instructions: "The maximum number of top-level blocks the field is allowed to have."|t('neo'),
    id: 'maxTopBlocks',
    name: 'maxTopBlocks',
    value: neoField.maxTopBlocks,
    size: 3,
    errors: neoField.getErrors('maxTopBlocks'),
}) }}

{{ forms.textField({
    label: "Max Levels"|t('app'),
    instructions: "The maximum number of levels that blocks in this field can be nested."|t('neo'),
    id: 'maxLevels',
    name: 'maxLevels',
    value: neoField.maxLevels,
    size: 3,
    errors: neoField.getErrors('maxLevels'),
}) }}