{% extends 'website/base.html' %}
{% load url from future %}
{% load fiber_tags thumbnail breadcrumb_tags %}

{% block breadcrumb %}
    {{ block.super }}

    {% add_crumb 'Tim IM' 'website:team' %}
    {% if is_preview %}
        {% add_crumb 'Member Detail' %}
    {% else %}
        {% add_crumb profile.get_full_name 'website:employees:detail' profile.slug %}
    {% endif %}
    
{% endblock %}

{% block title %}{{ profile.first_name }} {{ profile.last_name }}{% endblock %}
{% block bodyclass %}profile-detail{% endblock %}

{% block content %}

<div id = 'main-text'>
    <h1>{% show_content 'Team header' %}</h1>
    <h3>{% show_content 'Team header description' %}</h3>
</div>

<div class = 'main-content-wrapper'>
    
    <a class="prev browse left {% if not prev %}disabled{% endif %}" {% if prev %}href='{{ prev.get_absolute_url }}'{% endif %}></a>
    
    <div id = 'main-content'>

        <img src = '{% thumbnail extended_profile.photo 300x450 %}'>
        
        <h2>{{ profile.first_name }} {{ profile.middle_name }} {{ profile.last_name }} {% if profile.nick_name %}({{profile.nick_name}}){% endif %}</h2>
        <h5>{{ extended_profile.position }}</h5>
        {{ extended_profile.description|safe }}        
        <div class = 'connect column'>
            <h4>Connect</h4>
            <ul>
                {% if profile.twitter %}
                    <li class = 'twitter'><a target="_blank" href = '{{ profile.twitter }}'>Twitter</a></li>
                {% endif %}
                {% if profile.facebook %}
                    <li class = 'fb'><a target="_blank" href = '{{ profile.facebook }}'>Facebook</a></li>
                {% endif %}
                {% if profile.linked_in %}
                    <li class = 'linked-in'><a target="_blank" href = '{{ profile.linked_in }}'>LinkedIn</a></li>
                {% endif %}
                <li class = 'email'><a target="_blank" href = 'mailto:{{ user.email }}'>{{ user.email }}</a></li>
                {% if profile.website %}
                    <li class = 'web'><a target="_blank" href = '{{ profile.website }}'>{{ profile.website }}</a></li>
                {% endif %}
            </ul>
        </div>

        {% if posts %}
            <div class = 'blogs column'>
                <h4><a href = "{% url 'website:news:by_author_and_tag' profile.slug 'blog' %}">Blog</a></h4>
                <ul>
                    {% for post in posts %}
                        <li><a href = '{{ post.get_absolute_url }}'>{{ post }}</a></li>
                    {% endfor %}
                </ul>
            </div>
        {% endif %}
    
    </div>
    
    <a class = 'browse next right {% if not next %}disabled{% endif %}' {% if next %}href='{{ next.get_absolute_url }}'{% endif %}></a>
    
    
</div>
<hr/>

<div class = 'center-aligned'>
    <a href = '{% url "website:team" %}' class = 'big'>&laquo; Kembali ke Tim ODP</a>
</div>

{% endblock %}