{% extends "freeform/_layouts/settings" %}
{% import "_includes/forms" as forms %}

{% set selectedSubnavItem = "settings" %}
{% set title = "Demo Templates"|t('freeform') %}

{% macro listFiles(file) %}
    {% import _self as dir %}

    {% set isFolder = file.isFolder %}
    <li class="{{ isFolder ? 'dir' : 'file' }}">
        <span>{{ file.name }}</span>
        {% if isFolder %}
            <ul>
                {% for childFile in file.files %}
                    {{ dir.listFiles(childFile) }}
                {% endfor %}
            </ul>
        {% endif %}
    </li>
{% endmacro %}
{% import _self as dir %}

{% block actionButton %}{% endblock %}

{% block content %}

    <form method="post">
        <input type="hidden" name="action" value="freeform/codepack/install">
        {{ redirectInput('freeform/settings/demo-templates') }}
        <input type="hidden" name="{{ craft.app.config.general.csrfTokenName }}" value="{{ craft.app.request.csrfToken }}">

        <h2 class="first">{{ "Demo Templates"|t('freeform') }}</h2>

        <table width="100%">
            <tr>
                <td width="95%">
                    {{ forms.textField({
                        label: "Install Path"|t('freeform'),
                        id: 'prefix',
                        name: 'prefix',
                        value: prefix,
                        autofocus: true
                    }) }}
                </td>
                <td>
                    <div class="buttons" style="margin: 18px 0 0 15px !important;">
                        <input type="submit" class="btn submit" value="{{ "Install"|t }}" />
                    </div>
                </td>
            </tr>
            {% if exceptionMessage is defined %}
                <tr>
                    <td colspan="2">
                        <div class="error">
                            {{ exceptionMessage|raw }}
                        </div>
                    </td>
                </tr>
            {% endif %}
        </table>
    </form>

    <div id="components-wrapper">
        {% if codePack.templates %}
            <div>
                <h3>{{ "Templates"|t('freeform') }}</h3>

                <ul class="directory-structure">
                    <li class="dir">
                        <span data-name="/">demo</span>
                    </li>
                    <ul>
                        {% for file in codePack.templates.contents %}
                            {{ dir.listFiles(file) }}
                        {% endfor %}
                    </ul>
                </ul>
            </div>
        {% endif %}

        {% if codePack.assets %}
            <div>
                <h3>{{ "Assets"|t('freeform') }}</h3>

                <ul class="directory-structure">
                    <li class="dir">
                        <span data-name="/">demo</span>
                    </li>
                    <ul>
                        {% for file in codePack.assets.contents %}
                            {{ dir.listFiles(file) }}
                        {% endfor %}
                    </ul>
                </ul>
            </div>
        {% endif %}

        {% if codePack.routes.data %}
            <div>
                <h3>{{ "Routes"|t('freeform') }}</h3>

                <ul class="directory-structure routes">
                    {% for route in codePack.routes.data %}
                        <li>
                            <span class="route" data-name="/{{ route.urlPattern }}">
                                demo/{{ route.urlPattern }}
                            </span>

                            <div class="template">
                                {{ route.template }}
                            </div>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        {% endif %}
    </div>

{% endblock %}