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

{% if oldHandle %}{{ hiddenInput('oldHandle', oldHandle) }}{% endif %}

{{ forms.textField({
    first: true,
    label: "Name"|t('app'),
    id: 'name',
    name: 'name',
    value: (filesystem is defined ? filesystem.name : null),
    errors: (filesystem is defined ? filesystem.getErrors('name') : null),
    autofocus: true,
    required: true,
}) }}

{{ forms.textField({
    first: true,
    label: "Handle"|t('app'),
    id: 'handle',
    name: 'handle',
    class: 'code',
    autocorrect: false,
    autocapitalize: false,
    value: (filesystem is defined ? filesystem.handle : null),
    errors: (filesystem is defined ? filesystem.getErrors('handle') : null),
    required: true,
}) }}

<hr>

{% if fsOptions|length %}
    {{ forms.selectField({
        label: 'Filesystem Type'|t('app'),
        instructions: "What type of filesystem is this?"|t('app'),
        id: 'type',
        name: 'type',
        options: fsOptions,
        value: className(filesystem),
        toggle: true
    }) }}
{% endif %}

{% for fsType in fsTypes %}
    {% set isCurrent = (fsType == className(filesystem)) %}

    <div id="{{ fsType|id }}"{% if not isCurrent %} class="hidden"{% endif %}>
        {% namespace 'types['~fsType~']' %}
            {% if isCurrent %}
                {{ _self.fsUrlFields(filesystem) }}
                {{ filesystem.getSettingsHtml()|raw }}
            {% else %}
                {{ _self.fsUrlFields(fsInstances[fsType]) }}
                {{ fsInstances[fsType].getSettingsHtml()|raw }}
            {% endif %}
        {% endnamespace %}
    </div>
{% endfor %}


{% if filesystem is not defined or not filesystem.handle %}
    {% js %}
        new Craft.HandleGenerator("#{{ 'name'|namespaceInputId }}", "#{{ 'handle'|namespaceInputId }}");
    {% endjs %}
{% endif %}


{% macro fsUrlFields(filesystem) %}
    {% if filesystem.getShowHasUrlSetting() %}
        {{ forms.lightswitchField({
            label: 'Files in this filesystem have public URLs'|t('app'),
            name: 'hasUrls',
            id: 'has-urls',
            on:   filesystem.hasUrls,
            toggle: filesystem.getShowUrlSetting() ? "url-field-container" : null
        }) }}
    {% endif %}

    {% if filesystem.getShowUrlSetting() %}
        <div id="url-field-container" class="{% if not filesystem.hasUrls %}hidden{% endif %}">
            {{ forms.autosuggestField({
                label: "Base URL"|t('app'),
                instructions: "The base URL to the files in this filesystem."|t('app'),
                id: 'url',
                class: ['ltr', 'fs-url'],
                name: 'url',
                suggestEnvVars: true,
                suggestAliases: true,
                value: (filesystem is defined ? filesystem.url : null),
                errors: (filesystem is defined ? filesystem.getErrors('url') : null),
                required: true,
                placeholder: "//example.com/path/to/folder"
            }) }}
        </div>
    {% endif %}

    <hr />
{% endmacro %}