{% extends mode == 'user' ? "user.twig" : "admin.twig" %}

{% block content %}

<div id="pluginsSettings">
    {% import 'macros.twig' as piwik %}
    {% import 'ajaxMacros.twig' as ajax %}

    {% if mode == 'user' %}
        <h2 piwik-enriched-headline>{{ 'CoreAdminHome_PersonalPluginSettings'|translate }}</h2>
    {% else %}
        <h2 piwik-enriched-headline>{{ 'CoreAdminHome_SystemPluginSettings'|translate }}</h2>
    {% endif %}

    <p>
        {{ 'CoreAdminHome_PluginSettingsIntro'|translate }}
        {% for pluginName, settings in pluginsSettings %}
            <a href="#{{ pluginName|e('html_attr') }}">{{ pluginName }}</a>{% if not loop.last %}, {% endif %}
        {% endfor %}
    </p>

    <input type="hidden" name="setpluginsettingsnonce" value="{{ nonce }}">

    {% for pluginName, pluginSettings in pluginsSettings %}

        <h2 id="{{ pluginName|e('html_attr') }}">{{ pluginName }}</h2>

        {% if pluginSettings.introduction %}
            <p class="pluginIntroduction">
                {{ pluginSettings.introduction }}
            </p>
        {% endif %}

        <table class="adminTable" id="pluginSettings" data-pluginname="{{ pluginName|e('html_attr') }}">

        {% for name, setting in pluginSettings.settings %}
            {% set settingValue = setting.getValue %}

            {% if setting.introduction %}
                <tr>
                    <td colspan="3">
                        <p class="settingIntroduction">
                            {{ setting.introduction }}
                        </p>
                    </td>
                </tr>
            {% endif %}

            <tr>
                <td class="columnTitle">
                    <span class="title">{{ setting.title }}</span>
                    <br />
                    <span class='form-description'>
                        {{ setting.description }}
                    </span>

                </td>
                <td class="columnField">
                    <fieldset>
                        <label>
                            {% if setting.uiControlType == 'select' or setting.uiControlType == 'multiselect' %}
                                <select
                                    {% for attr, val in setting.uiControlAttributes %}
                                        {{ attr|e('html_attr') }}="{{ val|e('html_attr') }}"
                                    {% endfor %}
                                    name="{{ setting.getKey|e('html_attr') }}"
                                    {% if setting.uiControlType == 'multiselect' %}multiple{% endif %}>

                                    {% for key, value in setting.availableValues %}
                                        <option value='{{ key }}'
                                                {% if settingValue is iterable and key in settingValue %}
                                                    selected='selected'
                                                {% elseif settingValue==key %}
                                                    selected='selected'
                                                {% endif %}>
                                            {{ value }}
                                        </option>
                                    {% endfor %}

                                </select>
                            {% elseif setting.uiControlType == 'textarea' %}
                                <textarea style="width: 376px; height: 250px;"
                                    {% for attr, val in setting.uiControlAttributes %}
                                        {{ attr|e('html_attr') }}="{{ val|e('html_attr') }}"
                                    {% endfor %}
                                    name="{{ setting.getKey|e('html_attr') }}"
                                    >
                                    {{- settingValue -}}
                                </textarea>
                            {% elseif setting.uiControlType == 'radio' %}

                                {% for key, value in setting.availableValues %}

                                    <input
                                        id="name-value-{{ loop.index }}"
                                        {% for attr, val in setting.uiControlAttributes %}
                                            {{ attr|e('html_attr') }}="{{ val|e('html_attr') }}"
                                        {% endfor %}
                                        {% if settingValue is sameas(key) %}
                                            checked="checked"
                                        {% endif %}
                                        type="radio"
                                        value="{{ key|e('html_attr') }}"
                                        name="{{ setting.getKey|e('html_attr') }}" />

                                    <label for="name-value-{{ loop.index }}">{{ value }}</label>

                                    <br />

                                {% endfor %}

                            {% else %}

                                <input
                                    {% for attr, val in setting.uiControlAttributes %}
                                        {{ attr|e('html_attr') }}="{{ val|e('html_attr') }}"
                                    {% endfor %}
                                    {% if setting.uiControlType == 'checkbox' %}
                                        value="1"
                                    {% endif %}
                                    {% if setting.uiControlType == 'checkbox' and settingValue %}
                                        checked="checked"
                                    {% endif %}
                                    class="control_{{ setting.uiControlType|e('html_attr') }}"
                                    type="{{ setting.uiControlType|e('html_attr') }}"
                                    name="{{ setting.getKey|e('html_attr') }}"
                                    value="{{ settingValue|e('html_attr') }}"
                                >

                            {% endif %}

                            {% if setting.defaultValue and setting.uiControlType != 'checkbox' and setting.uiControlType != 'radio' %}
                                <br/>
                                <span class='form-description'>
                                    {{ 'General_Default'|translate }}
                                    {% if setting.defaultValue is iterable %}
                                        {{ setting.defaultValue|join(', ')|truncate(50) }}
                                    {% else %}
                                        {{ setting.defaultValue|truncate(50) }}
                                    {% endif %}
                                </span>
                            {% endif %}

                        </label>
                    </fieldset>
                </td>
                <td class="columnHelp">
                    {% if setting.inlineHelp %}
                        <div class="ui-widget">
                            <div class="ui-inline-help">
                                {{ setting.inlineHelp }}
                            </div>
                        </div>
                    {% endif %}
                </td>
            </tr>

        {% endfor %}

        </table>

    {% endfor %}

    <hr class="submitSeparator"/>

    {{ ajax.errorDiv('ajaxErrorPluginSettings') }}
    {{ ajax.loadingDiv('ajaxLoadingPluginSettings') }}

    <input type="submit" value="{{ 'General_Save'|translate }}" class="pluginsSettingsSubmit submit"/>

</div>
{% endblock %}