{% load utils_tags typogrify_tags statistics_tags %}

{% if not public %}
<div class="NB-module NB-module-activities NB-page-{{ page }} {% if not activities %}NB-hidden{% endif %}">
    <h5 class="NB-module-header">
        <div class="NB-module-header-right">
            <div class="NB-spinner NB-left"></div>
            <a href="#" class="NB-module-direction NB-module-next-page NB-javascript {% if not has_next_page %}NB-disabled{% endif %}"></a>
            <a href="#" class="NB-module-direction NB-module-previous-page {% if page <= 1 %}NB-disabled{% endif %}"></a>
        </div>

        Your Activity
    </h5>
    
{% endif %}

    <ul class="NB-interactions">
        {% for activity in activities %}
        <li class="NB-interaction NB-activity-{{ activity.category }} {% if activity.is_new %}NB-highlighted{% endif %} {% if activity.category == 'signup' %}NB-disabled{% endif %}"
            {% if activity.content_id %}data-content-id="{{ activity.content_id }}"{% endif %}
            {% if activity.feed_id %}data-feed-id="{{ activity.feed_id }}"{% endif %}
            {% if activity.with_user_id %}data-user-id="{{ activity.with_user_id }}"{% endif %}
            {% if activity.with_user %}data-username="{{ activity.with_user.username }}"{% endif %}>

            {% if activity.category == 'follow' %}
                <img class="NB-interaction-photo" src="{{ activity.photo_url }}"  data-user-id="{{ activity.with_user_id }}">
                <div class="NB-interaction-date">
                    {{ activity.time_since }} ago
                </div>
                <div class="NB-interaction-title">
                    {{ username }} followed
                    <span class="NB-interaction-username NB-splash-link" data-user-id="{{ activity.with_user_id }}">{{ activity.with_user.username }}</span>.
                </div>
            {% endif %}
            
            {% if activity.category == 'signup' %}
                <img class="NB-interaction-photo" src="{{ activity.photo_url }}"  data-user-id="{{ activity.with_user_id }}">
                <div class="NB-interaction-date">
                    {{ activity.time_since }} ago
                </div>
                <div class="NB-interaction-title">
                    {{ username }} signed up for NewsBlur.
                </div>
            {% endif %}

            {% if activity.category == 'comment_reply' %}
                <img class="NB-interaction-photo" src="{{ activity.photo_url }}" data-feed-id="{{ activity.feed_id }}">
                <div class="NB-interaction-date">
                    {{ activity.time_since }} ago
                </div>
                <div class="NB-interaction-title">
                    {{ username }} replied to <span class="NB-interaction-username NB-splash-link" data-user-id="{{ activity.with_user_id }}">{{ activity.with_user.username }}</span>:
                </div>
                <div class="NB-interaction-content">
                    "<span class="NB-interaction-reply-content NB-splash-link" data-story-id="{{ activity.content_id }}">{{ activity.content|safe|truncatewords:16 }}</span>"
                </div>
            {% endif %}

            {% if activity.category == 'comment_like' %}
                <img class="NB-interaction-photo" src="{{ activity.photo_url }}"  data-user-id="{{ activity.with_user_id }}">
                <div class="NB-interaction-date">
                    {{ activity.time_since }} ago
                </div>
                <div class="NB-interaction-title">
                    {{ username }} favorited <span class="NB-interaction-username NB-splash-link" data-user-id="{{ activity.with_user_id }}">{{ activity.with_user.username }}</span>'s comments on <span class="NB-interaction-sharedstory-title NB-splash-link">{{ activity.title|safe|truncatewords:6 }}</span>:
                </div>
                <div class="NB-interaction-content">
                    "<span class="NB-interaction-sharedstory-content NB-splash-link">{{ activity.content|truncatewords:16 }}</span>"
                </div>
            {% endif %}

            {% if activity.category == 'sharedstory' %}
                <img class="NB-interaction-photo" src="/rss_feeds/icon/{{ activity.story_feed_id }}" data-feed-id="{{ activity.story_feed_id }}">
                <div class="NB-interaction-date">
                    {{ activity.time_since }} ago
                </div>
                <div class="NB-interaction-title">
                    {{ username }} shared <span class="NB-interaction-sharedstory-title NB-splash-link">{{ activity.title|safe|truncatewords:6 }}</span>{% if activity.content %}:{% else %}.{% endif %}
                </div>
                {% if activity.content %}
                    <div class="NB-interaction-content">
                        "<span class="NB-interaction-sharedstory-content NB-splash-link">{{ activity.content|safe|truncatewords:16 }}</span>"
                    </div>
                {% endif %}
            {% endif %}
            
            {% if activity.category == 'star' %}
                <img class="NB-interaction-photo" src="{{ MEDIA_URL }}img/icons/silk/time.png">
                <div class="NB-interaction-date">
                    {{ activity.time_since }} ago
                </div>
                <div class="NB-interaction-title">
                    You saved "<span class="NB-interaction-starred-story-title NB-splash-link">{{ activity.content|safe|truncatewords:8 }}</span>".
                </div>
            {% endif %}

            {% if activity.category == 'feedsub' %}
                <img class="NB-interaction-photo" src="/rss_feeds/icon/{{ activity.feed_id }}">
                <div class="NB-interaction-date">
                    {{ activity.time_since }} ago
                </div>
                <div class="NB-interaction-title">
                    You subscribed to <span class="NB-interaction-feed-title NB-splash-link">{{ activity.content|truncatewords:8 }}</span>.
                </div>
            {% endif %}
            
        </li>
        {% endfor %}
    </ul>

{% if not public %}
</div>
{% endif %}