{% extends '@Installer/installer/base.html.twig' %}

{% block base_content %}
    <div class="card__title">
        <h2>{{ "shopware.installer.configuration_header"|trans }}</h2>
    </div>

    <form id="shop-configuration" action="{{ url('installer.configuration') }}" method="post">
        <div class="card__body">
            {% if error %}
                <div class="alert alert-error">
                    <pre>{{ error }}</pre>
                </div>
            {% endif %}

            <p>{{ "shopware.installer.configuration_sconfig_text"|trans }}</p>

            <p>
                <label for="config_shopName">{{ "shopware.installer.configuration_sconfig_name"|trans }}</label>
                <input type="text"
                       value="{{ parameters.config_shopName ?? '' }}"
                       name="config_shopName"
                       id="config_shopName"
                       required="required"
                       autofocus/>
            </p>

            <p>
                <label for="config_mail">
                    {{ "shopware.installer.configuration_sconfig_mail"|trans }}
                    <a class="help-badge"
                       href="#"
                       data-tooltip="{{ "shopware.installer.configuration_email_help_text"|trans }}">
                        <i class="icon-help"></i>
                    </a>
                </label>
                <input type="email"
                       value="{{ parameters.config_mail ?? '' }}"
                       name="config_mail"
                       id="config_mail"
                       required="required"/>
            </p>

            <div class="form-group form-group--50">
                <div class="input-group">
                    <label for="config_shop_language">{{ "shopware.installer.configuration_sconfig_language"|trans }}</label>
                    <div class="select-wrapper">
                        <select name="config_shop_language" id="config_shop_language">
                            {% for iso, iso3 in languageIsos %}
                                <option value="{{ iso3 }}" {% if parameters.config_shop_language == iso3 %}selected{% endif %}>
                                    {{ ("shopware.installer.select_language_" ~ iso) |trans }}
                                </option>
                            {% endfor %}
                        </select>
                    </div>
                </div>

                <div class="input-group">
                    <label for="config_shop_currency">{{ "shopware.installer.configuration_sconfig_currency"|trans }}</label>
                    <div class="select-wrapper">
                        <select name="config_shop_currency"
                                id="config_shop_currency"
                                onchange="toggleDefaultCurrency()">
                            {% for iso in currencyIsos %}
                                <option value="{{ iso }}" {% if parameters.config_shop_currency ?? '' == iso %}selected{% endif %}>
                                    {{ ("shopware.installer.configuration_admin_currency_" ~ (iso|lower)) |trans }}
                                </option>
                            {% endfor %}
                        </select>
                    </div>
                    <span class="help-block" style="display: none">
                        {{ "shopware.installer.configuration_sconfig_currency_info"|trans }}
                    </span>
                </div>

                <div class="input-group">
                    <label for="config_shop_country">{{ "shopware.installer.configuration_sconfig_country"|trans }}</label>
                    <div class="select-wrapper">
                        <select name="config_shop_country" id="config_shop_country">
                            {% for country in countryIsos %}
                                <option value="{{ country.iso3 }}" {% if country.default %}selected{% endif %}>
                                    {{ country.translated }}
                                </option>
                            {% endfor %}
                        </select>
                    </div>
                </div>
            </div>

            <div class="alert alert-warning">
                <span class="icon-warning"></span>
                {{ "shopware.installer.configuration_defaults_warning"|trans }}
            </div>

            <p class="available-currencies__headline">{{ "shopware.installer.configuration_admin_currency_headline"|trans }}</p>
            <p class="available-currencies__text">{{ "shopware.installer.configuration_admin_currency_text"|trans }}</p>

            <div class="available-currencies__container">
                {% for iso in currencyIsos %}
                    <div class="custom-checkbox">
                        <input type="checkbox"
                               class="currency-toggle"
                               id="{{ iso|lower }}"
                               name="available_currencies[]"
                               value="{{ iso }}"
                               onclick="event.target.classList.add('toggled')"
                        />
                        <label for="{{ iso|lower }}">{{ ("shopware.installer.configuration_admin_currency_" ~ (iso|lower)) |trans }}</label>
                    </div>
                {% endfor %}
            </div>

            <hr>

            <p>
                <label for="config_admin_email">{{ "shopware.installer.configuration_admin_mail"|trans }}</label>
                <input type="email"
                       value="{{ parameters.config_admin_email ?? '' }}"
                       name="config_admin_email"
                       id="config_admin_email"
                       required="required"/>
            </p>

            <div class="form-group form-group--50">
                <p>
                    <label for="config_admin_firstName">{{ "shopware.installer.configuration_admin_firstName"|trans }}</label>
                    <input type="text"
                           value="{{ parameters.config_admin_firstName ?? '' }}"
                           name="config_admin_firstName"
                           id="config_admin_firstName"
                           required="required"/>
                </p>

                <p>
                    <label for="config_admin_lastName">{{ "shopware.installer.configuration_admin_lastName"|trans }}</label>
                    <input type="text"
                           value="{{ parameters.config_admin_lastName ?? '' }}"
                           name="config_admin_lastName"
                           id="config_admin_lastName"
                           required="required"/>
                </p>
            </div>

            <div class="form-group form-group--50">
                <p>
                    <label for="config_admin_username">{{ "shopware.installer.configuration_admin_username"|trans }}</label>
                    <input type="text"
                           value="{{ parameters.config_admin_username ?? '' }}"
                           name="config_admin_username"
                           id="config_admin_username"
                           required="required"/>
                </p>

                <p>
                    <label for="config_admin_password">{{ "shopware.installer.configuration_admin_password"|trans }}</label>
                    <input type="password"
                           value="{{ parameters.config_admin_password ?? '' }}"
                           name="config_admin_password"
                           id="config_admin_password"
                           required="required"/>
                </p>
            </div>
        </div>


        <div class="card__footer flex-container">
            <a href="{{ url('installer.database-import') }}" class="btn btn-default flex-item">{{ "shopware.installer.back"|trans }}</a>
            <button type="submit"
                    class="btn btn-primary flex-item flex-right"
                    onclick="document.getElementById('shop-configuration').classList.add('is--submitted'); setLastActivity();">
            {{ "shopware.installer.forward"|trans }}
            </button>
        </div>
    </form>


    <script>
        toggleDefaultCurrency();
        function toggleDefaultCurrency() {
            const toggles = document.getElementsByClassName('currency-toggle');
            for (let toggle of toggles) {
                if (toggle.getAttribute('disabled') === null) {
                    // skip all toggles that were previously not the default
                    continue;
                }

                toggle.removeAttribute('disabled');
                toggle.classList.remove('is--selected');
                if (!toggle.classList.contains('toggled')) {
                    // only uncheck if it was not manually toggled
                    toggle.removeAttribute('checked');
                }
            }

            const newDefaultToggle = document.getElementById(
                document.getElementById('config_shop_currency').value.toLowerCase()
            );
            newDefaultToggle.setAttribute('checked', '');
            newDefaultToggle.setAttribute('disabled', '');
            newDefaultToggle.classList.add('is--selected');
        }

        function setLastActivity() {
            document.cookie = 'lastActivity='+Math.round(Date.now() / 1000)+';path=/admin';
        }
    </script>
{% endblock %}