{% load static %}
{% load i18n %}
{% load template_filters %}
{% load thumbnail %}


<div class="m-article edit-profile">
    <div class="item-wrap clearfix">

        {# avatar #}
        <aside>
            <div class="form-item-wrap">

                <div class="i-pict p-editable editable-wrap">
                    {% if request.user.profile.avatar %}
                    <div id="pick-block" class="pic_block">
                        {% endif %}
                        {% thumbnail request.user.profile.avatar "100x100" crop="center" as im %}
                        <img class="user-avatar" src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}"/>
                        {% endthumbnail %}
                        {% if request.user.profile.avatar %}
                    </div>
                    {% endif %}
                    <div class="edit-wrap">
                        <a class="e-btn no-refresh" href="#">{% trans 'редактировать' %}</a>
                        <div class="e-form">
                            <form class="clearfix update-profile-form" enctype="multipart/form-data" id="avatar_form"action="/profile/update/avatar/" method="post">{% csrf_token %}
                                <div class="ef-body">

                                    <div class="epfl">
                                        <label>{{ avatar_form.avatar.label }}</label>
                                        <div class="epf-field">
                                            <div class="input-file clearfix">
                                                <div class="button icon-clip">{% trans 'выберите файл' %}</div>
                                                <div class="file-text placehlder">{% trans 'Файл не выбран' %}</div>
                                                <div class="if-field-wrap"><input id="id_avatar" type="file" name="avatar" /></div>
                                            </div>
                                        </div>
                                    </div>

                                </div>

                                <div class="ef-buttons">
                                    <button type="submit" class="lnk icon-save">{% trans 'Сохранить' %}</button>
                                </div>
                            </form>
                            <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="i-rating" title="Рейтинг: 551">551</div>
            <div class="reason_block">
                <p>Заполните свой<br>профиль, чтобы<br>повысить рейтинг</p>
                <p>Чем выше<br>рейтинг —<br>тем больше<br>преимуществ!</p>
            </div>
        </aside>
        {# END avatar #}
        <div class="i-info ">
            <header>
                {# country and city #}
                <div class="form-item-wrap">
                    <div class="i-descr add_link_text ">
                        <a class="e-btn" href="#" title="">{% trans 'Указать' %}</a>
                        <div class="add_link_text_text">{% trans 'Страну и город' %}<b>+10</b></div>
                    </div>
                    <div class="i-place p-editable editable-wrap hidden">

                    <span class="static-value">
                        <span id="static-home-country">{{ home_form.instance.country }}</span>
                        , <span id="static-home-city">{{ home_form.instance.city }}</span>

                    </span>


                        <div class="edit-wrap e-left">
                            <a class="e-btn" href="#">{% trans 'редактировать' %}</a>
                            <div class="e-form">
                                <form class="clearfix update-profile-form" id="home_form" action="/profile/update/home/"  method="post">{% csrf_token %}
                                    <div class="ef-body">

                                        <div class="epfl">
                                            <label>{{ home_form.country.label }}</label>
                                            <div class="epf-field">
                                                {{ home_form.country }}

                                            </div>
                                        </div>

                                        <div class="epfl">
                                            <label>{% trans 'Город' %}</label>
                                            <div class="epf-field">
                                                {{ home_form.city }}
                                            </div>
                                        </div>

                                    </div>

                                    <div class="ef-buttons">
                                        <button type="submit" class="lnk icon-save">{% trans 'Сохранить' %}</button>
                                    </div>
                                </form>
                                <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                            </div>
                        </div>
                    </div>
                </div>
                {# END country and city #}

                {# name #}
                <div class="form-item-wrap">
                    <div class="i-descr add_link_text ">
                        <a class="e-btn" href="#" title="">{% trans 'Указать' %}</a>
                        <div class="add_link_text_text">{% trans 'имя и фамилию' %}<b>+10</b></div>
                    </div>
                    <div class="i-title p-editable editable-wrap">
                    <span id="static-name-value" class="static-value">
                        {{ name_form.get_full_name }}
                    </span>
                        <div class="edit-wrap">
                            <a class="e-btn" href="#">{% trans 'редактировать' %}</a>
                            <div class="e-form">
                                <form class="clearfix update-profile-form" id="name_form"  action="/profile/update/name/"
                                      method="post"  method="post">{% csrf_token %}

                                    <div class="ef-body">

                                        <div class="epfl">
                                            <label>{{ name_form.first_name.label }}</label>
                                            <div class="epf-field">
                                                {{ name_form.first_name }}
                                            </div>
                                        </div>
                                        <div class="epfl">
                                            <label>{{ name_form.last_name.label }}</label>
                                            <div class="epf-field">
                                                {{ name_form.last_name }}
                                            </div>
                                        </div>

                                    </div>

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

                                <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                            </div>
                        </div>
                    </div>
                </div>

                {# END name #}
            </header>

            {# position #}
            <div class="form-item-wrap">

                <div class="i-descr add_link_text ">
                    <a class="e-btn" href="#" title="">{% trans 'Указать' %}</a>
                    <div class="add_link_text_text">{% trans 'свою должность и место работы' %}<b>+10</b></div>
                </div>
                <div class="i-position p-editable editable-wrap hidden">
                    <p id="static-work-value" class="static-value">
                        {{ work_form.position.value }}
                        {% if work_form.work.value %}
                        {% trans 'в' %} {{ work_form.work.value }}
                        {% endif %}
                    </p>

                    <div class="edit-wrap">
                        <a class="e-btn" href="#">{% trans 'редактировать' %}</a>
                        <div class="e-form">
                            <form class="clearfix update-profile-form" id="work_form" action="/profile/update/work/"  method="post">{% csrf_token %}

                                <div class="ef-body">

                                    <div class="epfl">
                                        <label>{{ work_form.position.label }}</label>
                                        <div class="epf-field">
                                            {{ work_form.position }}
                                        </div>
                                    </div>

                                    <div class="epfl">
                                        <label>{{ work_form.work.label }}</label>
                                        <div class="epf-field">
                                            {{ work_form.work }}
                                        </div>
                                    </div>

                                </div>

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

                            <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                        </div>
                    </div>
                </div>
            </div>
            {# END position #}
            <hr />

            <div class="i-contacts clearfix">
                <div class="ic-buttons dd_width_4">
                    <div class="form-item-wrap">
                        <div class="p-editable editable-wrap social">
                            <div class="i-descr add_link_text add_link_text_medium">
                                <a class="e-btn no-refresh social" href="#" title="">{% trans 'Добавить' %}</a>

                                <ul class="soc-media-buttons soc-media-buttons1">
                                <li>
                                    {% if social_form.facebook.value %}
                                    <a href="{{ social_form.facebook.value }}"  target="_blank">
                                        <img id="img-facebook" src="{% static 'client/img/soc-medias/sm-icon-fb.png' %}" title="Facebook" alt="Facebook" />
                                    </a>
                                    {% else %}
                                    <img id="img-facebook" src="{% static 'client/img/soc-medias/sm-icon-fb_hover.png' %}" title="Facebook" alt="Facebook" />
                                    {% endif %}
                                </li>
                                <li>
                                    {% if social_form.linkedin.value %}
                                    <a href="{{ social_form.linkedin.value }}"  target="_blank">
                                        <img id="img-linkedin" src="{% static 'client/img/soc-medias/sm-icon-lin.png' %}" title="LinkedIn" alt="LinkedIn" />
                                    </a>
                                    {% else %}
                                    <img id="img-linkedin" src="{% static 'client/img/soc-medias/sm-icon-lin_hover.png' %}" title="LinkedIn" alt="LinkedIn" />
                                    {% endif %}

                                <li>
                                    {% if social_form.vk.value %}
                                    <a href="{{ social_form.vk.value }}" target="_blank">
                                        <img id="img-vk" src="{% static 'client/img/soc-medias/sm-icon-vk.png' %}" title="В контакте" alt="В контакте" />
                                    </a>
                                    {% else %}
                                    <img id="img-vk" src="{% static 'client/img/soc-medias/sm-icon-vk_hover.png' %}" title="В контакте" alt="В контакте" />
                                    {% endif %}
                                </li>

                                <li>
                                    {% if social_form.twitter.value %}
                                    <a href="{{ social_form.twitter.value }}" target="_blank">
                                        <img id="img-twitter" src="{% static 'client/img/soc-medias/sm-icon-twit.png' %}" title="Twitter" alt="Twitter" />
                                    </a>
                                    {% else %}
                                    <img id="img-twitter" src="{% static 'client/img/soc-medias/sm-icon-twit_hover.png' %}" title="Twitter" alt="Twitter" />
                                    {% endif %}
                                </li></li>
                            </ul>

                                <div class="add_link_text_text"><b>{% trans '+5 за каждый' %}</b></div>
                            </div>


                            <div class="edit-wrap ">
                                <div class="e-form">
                                    <div class="edit-label"><span>&nbsp;</span></div>

                                    <form class="clearfix update-profile-form" id="social_form" action="/profile/update/social/" method="post">{% csrf_token %}

                                        <div class="ef-body">

                                            <div class="epfl">
                                                <label><img src="{% static 'client/img/soc-medias/sm-icon-fb-w.png' %}" title="Facebook" alt="Facebook" /> {{ social_form.facebook.label }}</label>
                                                <div class="epf-field">
                                                    {{ social_form.facebook }}
                                                </div>
                                            </div>

                                            <div class="epfl">
                                                <label><img src="{% static 'client/img/soc-medias/sm-icon-lin-w.png' %}" title="LinkedIn" alt="LinkedIn" /> {{ social_form.linkedin.label }}</label>
                                                <div class="epf-field">
                                                    {{ social_form.linkedin }}
                                                </div>
                                            </div>

                                            <div class="epfl">
                                                <label><img src="{% static 'client/img/soc-medias/sm-icon-vk-w.png' %}" title="В контакте" alt="В контакте" /> {{ social_form.vk.label }}</label>
                                                <div class="epf-field">
                                                    {{ social_form.vk }}
                                                </div>
                                            </div>

                                            <div class="epfl">
                                                <label><img src="{% static 'client/img/soc-medias/sm-icon-twit-w.png' %}" title="Twitter" alt="Twitter" /> {{ social_form.twitter.label }}</label>
                                                <div class="epf-field">
                                                    {{ social_form.twitter }}
                                                </div>
                                            </div>

                                        </div>

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

                                    <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                {# contacts #}
                <div class="ic-links dd_width_5">
                    <div class="form-item-wrap">
                        <div class="i-descr add_link_text add_link_text_medium">
                            <a class="e-btn" href="#" title="">{% trans 'Добавить' %}</a>
                            <div class="add_link_text_text">{% trans 'номер телефона' %} <b>+15</b></div>
                        </div>
                        <div class="ic-tel p-editable editable-wrap hidden">
                            {% if phone_form.phone.value %}
                            <span id="static-phone-value" class="static-value">{{ phone_form.phone.value|phone }}</span>
                            {% endif %}
                            <div class="edit-wrap">
                                <a class="e-btn" href="#">{% trans 'редактировать' %}</a>
                                <div class="e-form">
                                    <form class="clearfix update-profile-form" id="phone_form" action="/profile/update/phone/"  method="post">{% csrf_token %}

                                        <div class="ef-body">

                                            <div class="epfl">
                                                <label>{{ phone_form.phone.label }}</label>
                                                <div class="epf-field">
                                                    {{ phone_form.phone }}
                                                </div>
                                            </div>

                                        </div>

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

                                    <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    {% comment %}
                    <div class="ic-mail p-editable">
                        {% if email_form.email.value %}
                        <a class="icon-mail" href="mailto:{{ email_form.email.value }}">{{ email_form.email.value }}</a>
                        {% endif %}
                        <div class="edit-wrap">
                            <a class="e-btn" href="#">{% trans 'редактировать' %}</a>
                            <div class="e-form">
                                <form class="clearfix" action="/profile/update/email/"  method="post">{% csrf_token %}

                                    <div class="ef-body">

                                        <div class="epfl">
                                            <label>{{ email_form.email.label }}</label>
                                            <div class="epf-field">
                                                {{ email_form.email }}
                                            </div>
                                        </div>

                                    </div>

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

                                <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                            </div>
                        </div>
                    </div>
                    {% endcomment %}
                    <div class="form-item-wrap">
                        <div class=" i-descr ic-site p-editable add_link_text add_link_text_medium">
                            <a class="e-btn" href="#" title="">{% trans 'Добавить' %}</a>
                            <div class="add_link_text_text">{% trans 'сайт' %} <b>+5</b></div>
                        </div>
                        <div class="ic-site p-editable editable-wrap hidden">
                            {% if web_page_form.web_page.value %}
                            <a class="icon-ext-link static-value" id="static-web-page-value" href="{% if web_page_form.web_page.value %}{{ web_page_form.web_page.value }}{% else %}#{% endif %}" target="_blank">
                                {% if web_page_form.web_page.value %}
                                {{ web_page_form.web_page.value }}
                                {% endif %}
                            </a>
                            {% endif %}

                            <div class="edit-wrap">
                                <a class="e-btn" href="#">{% trans 'редактировать' %}</a>
                                <div class="e-form">
                                    <form class="clearfix update-profile-form" id="web_page_form" action="/profile/update/web-page/" method="post">{% csrf_token %}

                                        <div class="ef-body">

                                            <div class="epfl">
                                                <label>{{ web_page_form.web_page.label }}</label>
                                                <div class="epf-field">
                                                    {{ web_page_form.web_page }}
                                                </div>
                                            </div>

                                        </div>

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

                                    <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                                </div>
                            </div>
                        </div>
                    </div>

                {# END contacts #}
                </div>
            </div>

            <hr/>
            {# about #}
            <div class="i-additional">
                <div class="ia-title">{% trans 'О себе:' %}</div>
                <div class="form-item-wrap">
                    <div class="i-descr add_link_text">
                        <a class="e-btn" href="#" title="">{% trans 'Добавить' %}</a>
                        <div class="add_link_text_text">{% trans 'информацию о себе' %} <b>+10</b></div>
                    </div>
                    <div class="p-editable editable-wrap hidden">
                        <p id="static-about-value" class="static-value">{{ about_form.about.value }}</p>

                        <div class="edit-wrap">
                            <a class="e-btn" href="#">{% trans 'редактировать' %}</a>
                            <div class="e-form">
                                <form class="clearfix update-profile-form" id="about_form" action="/profile/update/about/" method="post">{% csrf_token %}

                                    <div class="ef-body">

                                        <div class="epfl">
                                            <label>{{ about_form.about.label }}</label>
                                            <div class="epf-field">
                                                {{ about_form.about }}
                                            </div>
                                        </div>

                                    </div>

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

                                <a class="ef-close" href="#">{% trans 'закрыть' %}</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            {# END about #}

            {# companies #}
            <div class="my-companies-block editable">
                <div class="ia-title">{% trans 'Мои компании:' %}</div>

                {% with companies=request.user.created_company.all %}
                    {% for company in companies %}
                        <div class="company">
                            <a href="{{ company.get_permanent_url }}">
                                <span class="logo">
                                   {% include 'client/includes/show_logo.html' with obj=company %}
                                </span>
                                <span class="title">
                                    {{ company.name }}
                                </span>
                            </a>
                        </div>
                    {% endfor %}
                {% endwith %}

            </div>
            <div class="add-company-block">
                <a class="button icon-add" href="#" id="add-new-company">{% trans 'Добавить компанию' %}</a>
            </div>

            {# END companies #}


        </div>
    </div>
</div>


{% block scripts %}
<!-- mask select scripts-->
<script src="{% static 'client/js/plugins/inputmask/jquery.inputmask.js' %}"></script>
<script src="{% static 'client/js/plugins/inputmask/jquery.bind-first-0.2.3.min.js' %}"></script>
<script src="{% static 'client/js/plugins/inputmask/jquery.inputmask-multi.js' %}"></script>
<!-- page module-->
<!--todo: вернуть минифицированную версию-->
<!--<script src="{% static 'client/js' %}{% if debug %}/{% else %}_min/{% endif %}_modules/page.profile{% if debug %}{% else %}.min{% endif %}.js"></script>-->
<script src="{% static 'client/js/_modules/page.profile.js' %}"></script>
<script>
    //js module initialization
    EXPO.profile.init({
        // class selector to identify required forms on page
        updateFormClass:'update-profile-form',
        // text part that is added to form id to designate its wrapper container
        formWrapperClass:'form-item-wrap',
        formCurrentClass:'pe-current',
        staticValueClass:'static-value',
        descriptionClass:'i-descr',
        editableClass:'editable-wrap',
        closeButtonClass:'ef-close',
        // text and paths for dynamically rendered selectboxes
        addCompanyButtonId:'add-new-company',
        selectBox:[
            {id:'id_country'},
            {id:'id_theme',
                placeHolder:'Выберите тематику компании'
            },
            {id:'id_city',
                placeholder:'Поиск города',
                path:'http://{{ request.get_host }}/city/get-city/'
            },
            {id:'id_company',
                placeholder:'Поиск компании',
                path:'http://{{ request.get_host }}/company/get-company/'
            }
        ],
        editButtonClass:'e-btn',
        // we need this id to enable mapping library
        phoneBox: 'id_phone',
        // some helper text in current language
        lang:{
            workIn:'в'// there must be 'at' in English
        },
        addCompany:{
            modalId:'pw-company',
            formId:'create_company_form'
        }

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