{% extends "freeform/_layouts/settings" %}

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

{% set title = "Form Builder"|t("freeform") %}

{% block content %}

    <input type="hidden" name="action" value="freeform/settings/save-settings">
    {{ redirectInput('freeform/settings/form-builder') }}
    {{ csrfInput() }}

    <div class="field smart-switch first">
        <div>
            {{ forms.lightswitch({
                name: "settings[defaults][previewHtml]",
                on: settings.defaults.previewHtml,
            }) }}
        </div>
        <div>
            {{ forms.field({
                label: "Live Render HTML Markup"|t('freeform'),
                instructions: "Live rendering HTML markup in field labels, option labels and HTML blocks inside the Form Builder interface can sometimes conflict with Freeform's display of the form preview inside the control panel. In cases like these, you'll need to disable this setting to prevent HTML from rendering automatically."|t('freeform'),
            }) }}
        </div>
    </div>

    <div class="field smart-switch">
        <div>
            {{ forms.lightswitch({
                name: "settings[defaults][twigInHtml]",
                on: settings.defaults.twigInHtml,
            }) }}
        </div>
        <div>
            {{ forms.field({
                label: "Allow Twig to be enabled in HTML blocks"|t('freeform'),
                instructions: "A toggle will appear for each HTML block field inside the form builder, allowing the use of Twig code."|t('freeform'),
            }) }}
        </div>
    </div>

    <div class="field smart-switch">
        <div>
            {{ forms.lightswitch({
                name: "settings[defaults][twigIsolation]",
                on: settings.defaults.twigIsolation,
            }) }}
        </div>
        <div>
            {{ forms.field({
                label: "Render HTML block Twig in Isolated Mode"|t('freeform'),
                instructions: "When enabled, only the Freeform 'form' and 'fields' variables will be available. If disabled, Craft's variables will be included as well."|t('freeform'),
            }) }}
        </div>
    </div>

    <div class="field smart-switch">
        <div>
            {{ forms.lightswitch({
                name: "settings[defaults][includeSampleTemplates]",
                on: settings.defaults.includeSampleTemplates,
            }) }}
        </div>
        <div>
            {{ forms.field({
                label: "Include Freeform's Sample Formatting Templates",
                instructions: "Allow users to select a sample formatting template included with Freeform for the form's Formatting Template setting."|t('freeform'),
            }) }}
        </div>
    </div>

    {% for catName, category in settings.defaults %}
        <hr>

        <h2>{{ category.label }}</h2>
        <ul class="categories">
            {% for subName, subCategory in category %}
                <li>
                    <ul class="category-item-list">
                        {% for itemName, item in subCategory %}
                            {% set path = "settings[defaults]["~catName~"]["~subName~"]["~itemName~"]" %}

                            <li>
                                <label>
                                    {{ subCategory.label }}

                                    {{ include('freeform/settings/arrow-icon.svg') }}

                                    {{ item.label }}
                                </label>

                                <div>
                                    {% if item|implementsClass('Solspace\\Freeform\\Library\\DataObjects\\Form\\Defaults\\ConfigItems\\SelectItem') %}
                                        {{ forms.select({
                                            name: path~"[value]",
                                            value: item.value,
                                            options: item.options.toTwigArray(),
                                            class: 'fullwidth',
                                        }) }}
                                    {% elseif item|implementsClass('Solspace\\Freeform\\Library\\DataObjects\\Form\\Defaults\\ConfigItems\\BoolItem') %}
                                        {{ forms.lightswitch({
                                            name: path~"[value]",
                                            on: item.value,
                                        }) }}
                                    {% else %}
                                        {{ forms.text({
                                            name: path~"[value]",
                                            value: item.value,
                                        }) }}
                                    {% endif %}
                                </div>

                                <button type="button" tabindex="-1" class="lock-button {{ item.locked ? "locked" }}">
                                    <input
                                            type="hidden"
                                            class="{{ item.locked ? "locked" }}"
                                            name="{{ path }}[locked]"
                                            value="{{ item.locked ? '1' : '0' }}"
                                    />
                                    <span class="locked">
                                        {{ include("freeform/settings/locked-icon.svg") }}
                                    </span>
                                    <span class="unlocked">
                                        {{ include("freeform/settings/unlocked-icon.svg") }}
                                    </span>
                                </button>
                            </li>
                        {% endfor %}
                    </ul>
                </li>
            {% endfor %}
        </ul>
    {% endfor %}

{% endblock %}