{% extends 'client/base_catalog.html' %}
{% load static i18n %}

{% block bread_scrumbs %}
   <div class="bread-crumbs">
        <a href="/">{% trans 'Главная страница' %}</a>
        <a href="/profile/">{% trans 'Личный кабинет' %}</a>
        <strong>{% trans 'Настройки' %}</strong>
   </div>
{% endblock %}

{% block page_title %}
       <div class="page-title">
           <h1>{% trans 'Настройки' %}</h1>
       </div>
{% endblock %}

{% block content_list %}
       {% if user.email %}
       <div class="set-sect ch-pwd">
            <header>{% trans 'смена пароля' %}</header>
            <div class="set-sect-body">
                <form id="paswd_change" class="pw-form" method="post" action="#">{% csrf_token %}
                    <div class="mf-line">
                        <div class="mf-field">
                            {{ change_password_form.old_password }}
                        </div>
                    </div>

                    <div class="mf-line">
                        <div class="mf-field">
                            {{ change_password_form.new_password }}
                        </div>

                        <div class="mf-field">
                            {{ change_password_form.new_password_confirm }}
                        </div>

                    </div>

                    <div class="mf-line">
                        <div class="mf-success">
                            {% trans 'Пароль изменен!' %}
                        </div>

                    </div>

                    <div class="mf-buttons-line">
                        <button type="submit" class="icon-save">{% trans 'сохранить' %}</button>
                    </div>
                </form>
            </div>
        </div>
       {% endif %}

        <!--
       <div class="set-sect">
            <header>{% trans 'социализация и sharing' %}</header>
            <div class="set-sect-body">
            <form action="#">

            <div class="mf-soc-m clearfix">
                <div class="mf-soc-col">
                    <div class="mfsm-title">Подключено:</div>
                    <div class="mf-line">
                        <div class="sm-i"><img src="img/soc-medias/icon-fb.png" alt="" /> Artem Zubkevich</div>
                                                <a class="clear" href="#">очистить</a>
                    </div>
                    <div class="mf-line">
                        <div class="sm-i"><img src="img/soc-medias/icon-twit.png" alt="" /> @zubkevich</div>
                        <a class="clear" href="#">очистить</a>
                    </div>
                </div>

                <div class="mf-soc-col">
                    <div class="mfsm-title">Подключить:</div>

                    <div class="sm-body">
                        <ul>
                            <li><a href="#"><img src="{% static 'client/img/soc-medias/icon-fb.png' %}" alt="" /></a></li>
                            <li><a href="#"><img src="{% static 'client/img/soc-medias/icon-twit.png' %}" alt="" /></a></li>
                            <li><a href="#"><img src="{% static 'client/img/soc-medias/icon-goog.png' %}" alt="" /></a></li>
                            <li><a href="#"><img src="{% static 'client/img/soc-medias/icon-lin.png' %}" alt="" /></a></li>
                            <li><a href="#"><img src="{% static 'client/img/soc-medias/icon-ok.png' %}" alt="" /></a></li>
                            <li><a href="#"><img src="{% static 'client/img/soc-medias/icon-mailr.png' %}" alt="" /></a></li>
                            <li><a href="#"><img src="{% static 'client/img/soc-medias/icon-vk.png' %}" alt="" /></a></li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="mf-checks-title">Публиковать на ваши страницы:</div>
                <div class="mf-line">
                    <label class="check"><input type="checkbox" name="sType" value="exhb" />Выставки, конференции, семинары в которых я я участвую</label>
                </div>

                <div class="mf-line">
                    <label class="check"><input type="checkbox" name="sType" value="exhb" />Выставки, конференции, семинары которые я собираюсь посетить</label>
                </div>

                <div class="mf-line">
                    <label class="check"><input type="checkbox" name="sType" value="exhb" />Фотографии на которых я отмечен</label>
                </div>

                <div class="mf-buttons-line">
                    <button class="icon-save">сохранить</button>
                </div>
            </form>
        </div>
    </div>
        -->
{#    <div class="set-sect subscribe">#}
{#        <header>{% trans 'настройка подписки' %}</header>#}
{#        <a href="{% url 'accounts-mailing_settings' %}" >{% trans 'Перейти к настройке' %}</a>#}
{#        <span><img style="margin-right: -2px; margin-bottom: 4px;" src="{% static 'img/announce-letter.png' %}"></span>#}
        {% comment %}
        <div class="set-sect-body">
            <form action="." method="post">
                {% csrf_token %}

                <ul class="tabs clearfix">
                    <li class="active"><a class="icon-big-email" href="#">{% trans 'по e-mail' %}</a></li>
                </ul>
                <ul class="tabs-content">

                    <li class="active">

                        <div class="mf-announces clearfix">
                            <div class="mf-subj-checks-title">
                                <label class="check">
                                    {{ form.get_announce }}
                                    {% trans 'Получать анонсы' %}</label>
                            </div>

                            <div class="mf-announces-body">


                                <div class="mf-line mail">
                                    <div class="mf-field">{{ form.email }}</div>
                                    <div class="mf-msg">{{ form.email.errors }}</div>
                                </div>

                                <div class="mf-line country">
                                    <div class="mf-field">
                                        {{ form.country }}
                                    </div>
                                    <div class="mf-msg">{{ form.country.errors }}</div>
                                </div>

                                <div class="mf-line city">
                                    <div class="mf-field">
                                        {{ form.city }}
                                    </div>
                                    <div class="mf-msg">{{ form.city.errors }}</div>
                                </div>

                                <div class="mf-line subj">
                                    <div class="mf-field">
                                        {{ form.theme }}
                                    </div>
                                    <div class="mf-msg">{{ form.theme.errors }}</div>
                                </div>

                                <div class="mf-line period">
                                    <div class="mf-field">
                                        {{ form.periodic }}
                                    </div>
                                    <div class="mf-msg">{{ form.periodic.errors }}</div>
                                </div>
                            </div>
                        </div>

                        <hr />

                        <div class="mf-line">
                            <label class="check">{{ form.exponent_practicum }}{% trans '«Практикум экспонента»' %} <i>({% trans 'учимся эффективно участвовать в выставках и грамотно пиарить свою компанию на событиях' %})</i></label>
                        </div>

                        <div class="mf-line">
                            <label class="check">{{ form.organiser_practicum }}{% trans '«Практикум организатора событий»' %} <i>({% trans 'Создаем, наполняем и продвигаем собственные ивэнты' %})</i></label>
                        </div>

                    </li>

                </ul>

                <div class="mf-buttons-line">
                    <button type="submit" class="icon-save">{% trans 'сохранить' %}</button>
                </div>
            </form>
        </div>
        {% endcomment %}

{#    </div>#}

    {% block scripts %}
        <script>
            $(function(){
               $('#id_sub_set_country, #id_sub_set_theme')
                .select2({
                    placeholder: $(this).attr('placeholder'),
                    width: '100%'
                });

            $('#id_sub_set_city').select2({
                placeholder: $(this).attr('placeholder'),
                multiple: true,
                width: '100%',
                ajax: {

                    url: "/city/get-city/",
                    dataType: "json",
                    quietMillis: 200,

                    data: function(term, page){
                        return {term: term,
                            page: page};
                    },

                    results: function (data) {
                        var results = [];
                        $.each(data, function(index, item){
                            results.push({
                                id: item.id,
                                text: item.label
                            });
                        });
                        return {results: results};
                    }
                },
                initSelection : function(element, callback) {
                    var data = [];
                    $(element.val().split(",")).each(function(i) {
                        var item = this.split(':');
                        data.push({
                                id: item[0],
                                text: item[1]
                            });
                    });
                    callback(data);
                }

            });
            });
        </script>
    {% endblock %}
{% endblock %}