{% extends 'client/base_catalog.html' %}
{% load static %}
{% load 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>
        <div class="set-sect-body">
            <form action="{% url 'account_save_announce_settings' %}" 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">
                                    {{ subscribe.get_announce }}
                                    {% trans 'Получать анонсы' %}</label>
                            </div>

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


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

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

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

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

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

                        <hr />

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

                        <div class="mf-line">
                            <label class="check">{{ subscribe.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>
    </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 %}