{% macro display_actor_inline(follower, size=50) -%}
<a class="actor-box" href="{{follower.url | get_url }}" style="clear:both;">
<span style="float:left;padding-right:15px;">
{% if not follower.icon %}
<img class="actor-icon" src="/static/nopic.png" style="width:{{ size }}px">
{% else %}
<img class="actor-icon" src="{{ follower.icon.url | get_actor_icon_url(size) }}" style="width:{{ size }}px;">{% endif %}
</span>
<div class="actor-inline">
<div style="font-weight:bold">{{ follower.name or follower.preferredUsername }}</div>
<small class="lcolor">@{{ follower.preferredUsername }}@{{ follower.url | get_url | domain }}</small>
</div>
</a>
{%- endmacro %}



{% macro display_note(obj, perma=False, ui=False, likes=[], shares=[], meta={}, no_color=False) -%}
{% set actor = obj.attributedTo | get_actor  %}
<div class="note h-entry" id="activity-{{ obj.id | permalink_id }}">

<div class="h-card p-author">
<a class="u-url u-uid no-hover" href="{{ actor.url | get_url }}"><img class="u-photo" src="{% if not actor.icon %}/static/nopic.png{% else %}{{ actor.icon.url | get_actor_icon_url(50) }}{% endif %}">
</a>
<data class="p-name" value="{{ actor.name or actor.preferredUsername }}"></data>
</div>

<div class="note-wrapper">
	<a href="{{ actor.url | get_url }}" style="margin:0;text-decoration:none;" class="no-hover"><strong>{{ actor.name or actor.preferredUsername }}</strong>
        <span class="l">@{% if not no_color and obj.id | is_from_outbox %}<span class="pcolor">{{ actor.preferredUsername }}</span>{% else %}{{ actor.preferredUsername }}{% endif %}@{% if not no_color and obj.id | is_from_outbox %}<span class="pcolor">{{ actor.url | get_url | domain }}</span>{% else %}{{ actor.url | get_url | domain }}{% endif %}</span></a>

	{% if not perma %}
	<span style="float:right">
		<a rel="noopener" class="u-url u-uid note-permalink l" href="{{ obj.url }}">
			<time class="dt-published" title="{{ obj.published }}" datetime="{{ obj.published }}">{{ obj.published | format_timeago }}</time></a>
	</span>
	{% endif %}
	{% if obj.summary %}<p class="p-summary">{{ obj.summary | clean }}</p>{% endif %}
	<div class="note-container{% if perma %} perma{%endif%} p-name e-content">
	{{ obj.content | clean | safe }}
	</div>

	{% if obj.attachment %}
	<div style="padding:20px 0;">
	{% if obj.attachment | not_only_imgs %}
	<h3 class="l">Attachment</h3>
	<ul>
	{% endif %}
	{% for a in obj.attachment %}
	{% if a.url | is_img %}
    <a href="{{ a.url | get_attachment_url(None) }}"><img src="{{a.url | get_attachment_url(720) }}" class="img-attachment"></a>
	{% else %}
	<li><a href="{{a.url | get_attachment_url(None) }}" class="l">{% if a.filename %}{{ a.filename }}{% else %}{{ a.url }}{% endif %}</a></li>
	{% endif  %}
	{% endfor %}
	{% if obj.attachment | not_only_imgs %}
	</ul>
	{% endif %}
</div>
	{% endif %}

<div class="bottom-bar">
{% if perma %}<span class="perma-item">{{ obj.published | format_time }}</span>
{% else %}	
<a class ="bar-item" href="{{ obj.url }}">permalink</a> 

{% if session.logged_in %}
{% set perma_id = obj.id | permalink_id %}
{% set redir = request.path + "#activity-" + perma_id %}
{% set aid = obj.id | quote_plus %}
{% endif %}

{% if meta.count_reply and obj.id | is_from_outbox %}<a class ="bar-item" href="{{ obj.url }}"><strong>{{ meta.count_reply }}</strong> replies</a>
{% elif meta.count_reply and session.logged_in %}
<a class ="bar-item" href="/admin/thread?oid={{aid}}"><strong>{{ meta.count_reply }}</strong> replies</a>{% endif %}

{% if meta.count_boost and obj.id | is_from_outbox %}<a class ="bar-item" href="{{ obj.url }}"><strong>{{ meta.count_boost }}</strong> boosts</a>{% endif %}
{% if meta.count_like and obj.id | is_from_outbox %}<a class ="bar-item" href="{{ obj.url }}"><strong>{{ meta.count_like }}</strong> likes</a>{% endif %}

{% if session.logged_in %}
{% if ui%}

<a class="bar-item" href="/admin/new?reply={{ aid }}">reply</a>
{% if meta.boosted %}
<form action="/api/undo" class="action-form"  method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ meta.boosted }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item">unboost</button>
</form>
{% else %}
<form action="/api/boost" class="action-form"  method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item">boost</button>
</form>
{% endif %}

{% if meta.liked %}
<form action="/api/undo" class="action-form"  method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ meta.liked }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item">unlike</button>
</form>
{% else %}
<form action="/api/like" class="action-form"  method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item">like</button>
</form>
{% endif %}

{% endif %}

{% if obj.id | is_from_outbox %}
<form action="/api/note/delete" class="action-form"  method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item">delete</button>
</form>
{% else %}
<form action="/api/block" class="action-form"  method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="actor" value="{{ actor.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item">block</button>
</form>
{% endif %}
{% endif %}

{% endif %}

</div>

{% if likes or shares %}
<div style="padding-top:20px;" class="pure-g">
{% if likes %}
<div class="pure-u-1-2">
<h4 style="font-weight:normal"><strong>{{ meta.count_like }}</strong> likes</h4>{% for like in likes %}
{{ display_actor_inline(like) }}
{% endfor %}
</div>
{% endif %}
{% if shares %}
<div class="pure-u-1-2">
<h4 style="font-weight:normal"><strong>{{ meta.count_boost }}</strong> boosts</h4>{% for boost in shares %}
{{ display_actor_inline(boost) }}
{% endfor %}
</div>
{% endif %}
</div>
{% endif %}



</div>

</div>                       

{%- endmacro %}

{% macro display_thread(thread, likes=[], shares=[]) -%}
{% for reply in thread %}
{% if reply._requested %}
{{ display_note(reply.activity.object, perma=True, ui=False, likes=likes, shares=shares, meta=reply.meta) }}
{% else %}
{{ display_note(reply.activity.object, perma=False, ui=True, meta=reply.meta) }}
{% endif %}
{% endfor %}
{% endmacro -%}

{% macro display_pagination(older_than, newer_than) -%}
<div class="clear">
    {% if older_than %}
    <a href="{{ config.BASE_URL }}{{ request.path }}?older_than={{older_than}}" rel="next" class="older-link lcolor"><span class="pcolor">🡨</span> Older</a>
    {% endif %}
    {% if newer_than %}
    <a href="{{ config.BASE_URL }}{{ request.path }}?newer_than={{newer_than}}" rel="prev" class="newer-link lcolor">Newer <span class="pcolor">🡪</span></a>
    {% endif %}
</div>
{% endmacro -%}

{% macro display_pagination_links(older_than, newer_than) -%}
{% if older_than %}<link rel="next" href="{{ config.BASE_URL }}{{ request.path }}?older_than={{older_than}}">{% endif %}
{% if newer_than %}<link rel="prev" href="{{ config.BASE_URL }}{{ request.path }}?newer_than={{newer_than}}">{% endif %}
{% endmacro -%}