{% extends '@syndexAcademic/main_layout.html.twig' %}
{# {% set image_route =  user.getWebPath | imagine_filter('profile_pic')  %} #}
{% block title %}
    {{'userProfile.title'|trans({'%firstname%':user.firstName,'%lastname%':user.lastName},'Academia') }}
{% endblock  %}
{% block og_title %}
    {{'userProfile.og_title'|trans({'%firstname%':user.firstName,'%lastname%':user.lastName},'Academia') }}
{% endblock %}
{% block og_description %}
    {% if additional_info.bio is defined and additional_info.bio|length >0%}
        {{ user.firstName ~' ' ~ user.lastName~' : '~additional_info.bio }}
    {% else %}
        {{ 'profileDescription'|trans({}, 'Academia') }}
    {% endif %}
{% endblock%}
{% block og_url %}{{ url('shamra_academia_academic_profile',{'username': user.username }) }}{% endblock%}
{# {% block og_image %}{{ asset( image_route, absolute=true) }}{% endblock%} #}
{% block og_image_width %}300{% endblock%}
{% block og_image_height %}300{% endblock%}
{% block jqueryui %}{% endblock %}
{% block metaKeywords %}{{ 'profileKeywords'|trans({}, 'Academia') }}{% endblock %}
{% block css %}
    <link rel="stylesheet" href="{{ asset('bundles/syndexacademic/css/profile.css') }}" >
{% endblock %}
{% block body %}
    {{ parent() }}
    <div class="container">
        <div id="profile-container" class="row">
            <div class="col-xs-12 col-md-9 ">
                <div id="remove_result" class="alert " style="display: none">
                </div>
                {% for label,messages in app.session.flashbag.all %}
                    {% for message in messages %}
                        {% if label =='academia_notice' %}
                            <div id="message" class="alert alert-success" role="alert">
                                <div align="right" style="font-weight: bold;">{{ message|trans({},'Academia') }}</div>
                            </div>
                        {% elseif label=='academia_question_notice_success' %}
                            <div id="message" class="alert alert-success" role="alert">
                                <div align="right" style="font-weight: bold;">{{ message|trans({},'Academia') }}</div>
                            </div>
                        {% elseif label=='academia_question_notice_faild' %}
                            <div id="message" class="alert alert-danger" role="alert">
                                <div align="right" style="font-weight: bold;">{{ message|trans({},'Academia') }}</div>
                            </div>
                        {% endif %}
                    {% endfor %}
                {% endfor %}
                {% include '@syndexAcademic/Profile/personalInofmation.html.twig' %}
                {% include '@syndexAcademic/Profile/researches.html.twig' %}
            </div>
            <div class="col-xs-12 col-md-3 ">
                {% include '@syndexAcademic/Profile/statistics.html.twig' %}
                {% include '@syndexAcademic/Profile/followings.html.twig' %}
            </div>
        </div>
        <div id="editForm-container" style="display: none" class="row">
            <div class="col-xs-12 col-md-3"></div>
            <div class="col-xs-12 col-md-6">
                {% include '@syndexAcademic/Profile/editInformation.html.twig' %}
            </div>

        </div>
    </div>
    <p id="page" hidden>{{ 0 }}</p>
    <p id="username" hidden>{{ user.username }}</p>
    {% if app.user and app.user == user %}

        <div id="confirmModal" class="modal fade" role="dialog">
            <div class="modal-dialog">

                <div class="modal-content">

                    <div class="modal-header customModalTitle">
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                        <h4 class="modal-title ">{{ 'userProfile.confirmModal.label'|trans({},'Academia') }}</h4>
                    </div>
                    <div class="modal-body">
                        <p>{{ 'userProfile.confirmModal.message'|trans({},'Academia') }}</p>
                        <input type="hidden" id="deletionSlug">
                        <input type="hidden" id="deletionType">
                    </div>
                    <div class="modal-footer">
                        <a id="confirmButton" class="btn backButton" ><i class="fa fa-spinner fa-spin hidden" ></i>&nbsp;{{ 'userProfile.confirmModal.confirm'|trans({},'Academia') }}</a>
                        <a href="#" class="btn closeButton" data-dismiss="modal">{{ 'userProfile.confirmModal.dismiss'|trans({},'Academia')}}</a>
                    </div>
                </div>

            </div>
        </div>
    {% endif %}
{% endblock %}
{% block javascripts %}
    {{ parent() }}
    <script src="{{ asset('bundles/syndexacademic/js/library.js') }}?v=2"></script>
    <script>
        $(document).ready(function () {
            $(function () {
                $('#from,#to').datepicker({
                    dateFormat: 'yy-mm-dd',
                })
            })
            $('#education_select').select2({width:'100%',tags:true,allowClear:true,/*placeholder:"أدخل دراستك "*/})
            $('#education_place_select').select2({
                width:'100%',
                tags:true,
                allowClear:true,
                minimumInputLength: 3,
                ajax:{
                    url: Routing.generate('autoComplete_universities'),
                    dataType: 'json',
                    type: "GET",
                    quietMillis: 50,
                    processResults: function (data) {
                        return {
                            results: $.map(data, function (item) {
                                return {
                                    text: item.context,
                                    id: item.id
                                }
                            })
                        };
                    },
                    cache: true
                }
            })
            $('.tag_select').select2({
                tag: true,
                width: '100% ',
                minimumInputLength: 3,
                ajax: {
                    url: Routing.generate('shamra_academia_get_tag_suggestions'),
                    dataType: 'json',
                    type: "GET",
                    quietMillis: 50,
                    processResults: function (data) {
                        return {
                            results: $.map(data, function (item) {
                                return {
                                    text: item.context,
                                    id: item.context
                                }
                            })
                        };
                    },
                    cache: true
                },
                tags: true
            })
            $('time').each(function (index) {
                var eventDate=moment($(this).attr('datetime')).add(defTime1);
                eventDate.locale('ar')
                $(this).text(moment.min(eventDate,moment()).fromNow());
            });
        })
    </script>
{% endblock %}